@navinc/base-react-components/dist/story.js

Nav's Pattern Library

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import styled from 'styled-components';
import { storiesOf } from '@storybook/react';
import Copy from './copy';
import * as theme from './theme.js';
const Container = styled.div `
  display: flex;
  flex-wrap: wrap;
`;
const Row = styled.div `
  display: flex;
  width: 100%;

  & > ${Copy} {
    margin-top: 8px;
    margin-right: 8px;
  }
`;
const ColorItem = styled.div `
  flex: 1 1 160px;
  padding: 16px;
  & > * {
    text-align: center;
    margin: 0 auto;
  }
`;
const ColorDot = styled.div `
  height: 32px;
  width: 32px;
  background-color: ${({ color }) => color};
  border-radius: 50%;
`;
storiesOf('2. Misc | Theme', module).add('theme', () => (_jsx(Container, { children: Object.entries(theme).map(([key, value]) => {
        if (typeof value === 'string' && (value.startsWith('#') || value.startsWith('rgba')))
            return (_jsxs(ColorItem, { children: [_jsx(Copy, Object.assign({ bold: true }, { children: key }), void 0), _jsx(Copy, Object.assign({ light: true }, { children: value }), void 0), _jsx(ColorDot, { color: value }, void 0)] }, void 0));
        else
            return (_jsxs(Row, { children: [_jsx(Copy, Object.assign({ bold: true }, { children: key }), void 0), _jsx(Copy, { children: typeof value === 'function' ? 'is function, see theme.js for details.' : JSON.stringify(value) }, void 0)] }, void 0));
    }) }, void 0)), {
    info: { disable: true },
});
//# sourceMappingURL=story.js.map