@audius/harmony 0.0.25

package/dist/components/layout/Box/types.d.ts

@@ -0,0 +1,67 @@
+import type { CSSProperties, ComponentPropsWithoutRef } from 'react';
+import type { BackgroundColors, BorderColors } from '../../../foundations/color';
+import type { CornerRadiusOptions } from '../../../foundations/corner-radius';
+import type { ShadowOptions } from '../../../foundations/shadows';
+import type { SpacingOptions } from '../../../foundations/spacing';
+export type BaseBoxProps = {
+    /** Height */
+    h?: SpacingOptions | CSSProperties['height'];
+    /** Width */
+    w?: SpacingOptions | CSSProperties['width'];
+    /** Padding */
+    p?: SpacingOptions;
+    /** Padding Horizontal */
+    ph?: SpacingOptions;
+    /** Padding Vertical */
+    pv?: SpacingOptions;
+    /** Padding Top */
+    pt?: SpacingOptions;
+    /** Padding Left */
+    pl?: SpacingOptions;
+    /** Padding Right */
+    pr?: SpacingOptions;
+    /** Padding Bottom */
+    pb?: SpacingOptions;
+    /** Margin */
+    m?: SpacingOptions;
+    /** Margin Horizontal */
+    mh?: SpacingOptions;
+    /** Margin Vertical */
+    mv?: SpacingOptions;
+    /** Margin Top */
+    mt?: SpacingOptions;
+    /** Margin Left */
+    ml?: SpacingOptions;
+    /** Margin Right */
+    mr?: SpacingOptions;
+    /** Margin Bottom */
+    mb?: SpacingOptions;
+    /** Background Color */
+    backgroundColor?: BackgroundColors;
+    /** Border */
+    border?: BorderColors;
+    /** Border Top */
+    borderTop?: BorderColors;
+    /** Border Right */
+    borderRight?: BorderColors;
+    /** Border Bottom */
+    borderBottom?: BorderColors;
+    /** Border Left */
+    borderLeft?: BorderColors;
+    /** Border Radius */
+    borderRadius?: CornerRadiusOptions;
+    /** Border Top Right Radius */
+    borderTopRightRadius?: CornerRadiusOptions;
+    /** Border Bottom Right Radius */
+    borderBottomRightRadius?: CornerRadiusOptions;
+    /** Border Bottom Left Radius */
+    borderBottomLeftRadius?: CornerRadiusOptions;
+    /** Border Top Left Radius */
+    borderTopLeftRadius?: CornerRadiusOptions;
+    /** Elevation Shadow */
+    shadow?: ShadowOptions;
+    flex?: CSSProperties['flex'];
+    alignSelf?: CSSProperties['alignSelf'];
+};
+export type BoxProps = BaseBoxProps & ComponentPropsWithoutRef<'div'>;
+//# sourceMappingURL=types.d.ts.map

package/dist/components/layout/Box/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Box/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAEpE,OAAO,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAA;AAChF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAA;AAC7E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AACjE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAA;AAGlE,MAAM,MAAM,YAAY,GAAG;IACzB,aAAa;IACb,CAAC,CAAC,EAAE,cAAc,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAA;IAC5C,YAAY;IACZ,CAAC,CAAC,EAAE,cAAc,GAAG,aAAa,CAAC,OAAO,CAAC,CAAA;IAE3C,cAAc;IACd,CAAC,CAAC,EAAE,cAAc,CAAA;IAClB,yBAAyB;IACzB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,uBAAuB;IACvB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,kBAAkB;IAClB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,mBAAmB;IACnB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,oBAAoB;IACpB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,qBAAqB;IACrB,EAAE,CAAC,EAAE,cAAc,CAAA;IAEnB,aAAa;IACb,CAAC,CAAC,EAAE,cAAc,CAAA;IAClB,wBAAwB;IACxB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,sBAAsB;IACtB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,iBAAiB;IACjB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,kBAAkB;IAClB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,mBAAmB;IACnB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,oBAAoB;IACpB,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,uBAAuB;IACvB,eAAe,CAAC,EAAE,gBAAgB,CAAA;IAClC,aAAa;IACb,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,iBAAiB;IACjB,SAAS,CAAC,EAAE,YAAY,CAAA;IACxB,mBAAmB;IACnB,WAAW,CAAC,EAAE,YAAY,CAAA;IAC1B,oBAAoB;IACpB,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B,kBAAkB;IAClB,UAAU,CAAC,EAAE,YAAY,CAAA;IACzB,oBAAoB;IACpB,YAAY,CAAC,EAAE,mBAAmB,CAAA;IAClC,8BAA8B;IAC9B,oBAAoB,CAAC,EAAE,mBAAmB,CAAA;IAC1C,iCAAiC;IACjC,uBAAuB,CAAC,EAAE,mBAAmB,CAAA;IAC7C,gCAAgC;IAChC,sBAAsB,CAAC,EAAE,mBAAmB,CAAA;IAC5C,6BAA6B;IAC7B,mBAAmB,CAAC,EAAE,mBAAmB,CAAA;IAEzC,uBAAuB;IACvB,MAAM,CAAC,EAAE,aAAa,CAAA;IAEtB,IAAI,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;IAC5B,SAAS,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,wBAAwB,CAAC,KAAK,CAAC,CAAA"}

package/dist/components/layout/Divider/Divider.d.ts

@@ -0,0 +1,6 @@
+import { DividerProps } from './types';
+/**
+ * A separator between two elements, usually consisting of a horizontal or vertical line.
+ */
+export declare const Divider: (props: DividerProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Divider.d.ts.map

package/dist/components/layout/Divider/Divider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Divider/Divider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAEtC;;GAEG;AACH,eAAO,MAAM,OAAO,UAAW,YAAY,qDA0C1C,CAAA"}

package/dist/components/layout/Divider/Divider.js

@@ -0,0 +1,40 @@
+import { __assign } from '../../../_virtual/_tslib.js';
+import { jsx } from '@emotion/react/jsx-runtime';
+import { useTheme } from '@emotion/react';
+
+/**
+ * A separator between two elements, usually consisting of a horizontal or vertical line.
+ */
+var Divider = function (props) {
+    var _a = props.orientation, orientation = _a === void 0 ? 'horizontal' : _a, children = props.children, className = props.className;
+    var _b = useTheme(), color = _b.color, spacing = _b.spacing;
+    var border = "1px solid ".concat(color.border.strong);
+    var css = __assign(__assign(__assign({ border: 'none', margin: 0 }, (children &&
+        orientation === 'horizontal' && {
+        display: 'flex',
+        gap: spacing.s,
+        whiteSpace: 'nowrap',
+        textAlign: 'center',
+        border: 0,
+        '&::before, &::after': {
+            content: '""',
+            alignSelf: 'center',
+            width: '100%',
+            borderTop: border
+        }
+    })), (!children &&
+        orientation === 'vertical' && {
+        borderRight: border,
+        alignSelf: 'stretch',
+        height: 'auto'
+    })), (!children &&
+        orientation === 'horizontal' && {
+        borderBottom: border
+    }));
+    var Root = children ? 'div' : 'hr';
+    var role = children ? 'separator' : undefined;
+    return (jsx(Root, __assign({ role: role, css: css, className: className }, { children: children })));
+};
+
+export { Divider };
+//# sourceMappingURL=Divider.js.map

package/dist/components/layout/Divider/Divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.js","sources":["../../../../src/components/layout/Divider/Divider.tsx"],"sourcesContent":["import { CSSObject, useTheme } from '@emotion/react'\n\nimport { DividerProps } from './types'\n\n/**\n * A separator between two elements, usually consisting of a horizontal or vertical line.\n */\nexport const Divider = (props: DividerProps) => {\n  const { orientation = 'horizontal', children, className } = props\n  const { color, spacing } = useTheme()\n  const border = `1px solid ${color.border.strong}`\n\n  const css: CSSObject = {\n    border: 'none',\n    margin: 0,\n    ...(children &&\n      orientation === 'horizontal' && {\n        display: 'flex',\n        gap: spacing.s,\n        whiteSpace: 'nowrap',\n        textAlign: 'center',\n        border: 0,\n        '&::before, &::after': {\n          content: '\"\"',\n          alignSelf: 'center',\n          width: '100%',\n          borderTop: border\n        }\n      }),\n    ...(!children &&\n      orientation === 'vertical' && {\n        borderRight: border,\n        alignSelf: 'stretch',\n        height: 'auto'\n      }),\n    ...(!children &&\n      orientation === 'horizontal' && {\n        borderBottom: border\n      })\n  }\n\n  const Root = children ? 'div' : 'hr'\n  const role = children ? 'separator' : undefined\n\n  return (\n    <Root role={role} css={css} className={className}>\n      {children}\n    </Root>\n  )\n}\n"],"names":["_jsx"],"mappings":";;;;AAIA;;AAEG;AACI,IAAM,OAAO,GAAG,UAAC,KAAmB,EAAA;AACjC,IAAA,IAAA,KAAoD,KAAK,CAAA,WAA/B,EAA1B,WAAW,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,YAAY,GAAA,EAAA,EAAE,QAAQ,GAAgB,KAAK,CAArB,QAAA,EAAE,SAAS,GAAK,KAAK,UAAV,CAAU;IAC3D,IAAA,EAAA,GAAqB,QAAQ,EAAE,EAA7B,KAAK,GAAA,EAAA,CAAA,KAAA,EAAE,OAAO,GAAA,EAAA,CAAA,OAAe,CAAA;IACrC,IAAM,MAAM,GAAG,YAAa,CAAA,MAAA,CAAA,KAAK,CAAC,MAAM,CAAC,MAAM,CAAE,CAAA;IAEjD,IAAM,GAAG,GACP,QAAA,CAAA,QAAA,CAAA,QAAA,CAAA,EAAA,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,CAAC,EACN,GAAC,QAAQ;QACV,WAAW,KAAK,YAAY,IAAI;AAC9B,QAAA,OAAO,EAAE,MAAM;QACf,GAAG,EAAE,OAAO,CAAC,CAAC;AACd,QAAA,UAAU,EAAE,QAAQ;AACpB,QAAA,SAAS,EAAE,QAAQ;AACnB,QAAA,MAAM,EAAE,CAAC;AACT,QAAA,qBAAqB,EAAE;AACrB,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,SAAS,EAAE,QAAQ;AACnB,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,SAAS,EAAE,MAAM;AAClB,SAAA;KACF,EAAC,GACA,CAAC,QAAQ;QACX,WAAW,KAAK,UAAU,IAAI;AAC5B,QAAA,WAAW,EAAE,MAAM;AACnB,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,MAAM,EAAE,MAAM;KACf,EAAC,GACA,CAAC,QAAQ;QACX,WAAW,KAAK,YAAY,IAAI;AAC9B,QAAA,YAAY,EAAE,MAAM;AACrB,KAAA,EACJ,CAAA;IAED,IAAM,IAAI,GAAG,QAAQ,GAAG,KAAK,GAAG,IAAI,CAAA;IACpC,IAAM,IAAI,GAAG,QAAQ,GAAG,WAAW,GAAG,SAAS,CAAA;AAE/C,IAAA,QACEA,GAAC,CAAA,IAAI,aAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,gBAC7C,QAAQ,EAAA,CAAA,CACJ,EACR;AACH;;;;"}

package/dist/components/layout/Divider/Divider.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { Divider } from './Divider';
+declare const meta: Meta<typeof Divider>;
+export default meta;
+type Story = StoryObj<typeof Divider>;
+export declare const Default: Story;
+export declare const Vertical: Story;
+export declare const Horizontal: Story;
+export declare const WithText: Story;
+//# sourceMappingURL=Divider.stories.d.ts.map

package/dist/components/layout/Divider/Divider.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Divider/Divider.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAKtD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAEnC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAc9B,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,OAAO,CAAC,CAAA;AAErC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAA;AAEhC,eAAO,MAAM,QAAQ,EAAE,KAkBtB,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAYxB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAA"}

package/dist/components/layout/Divider/index.d.ts

@@ -0,0 +1,2 @@
+export { Divider } from './Divider';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/layout/Divider/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Divider/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA"}

package/dist/components/layout/Divider/types.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from 'react';
+export type DividerProps = {
+    orientation?: 'horizontal' | 'vertical';
+    children?: ReactNode;
+    className?: string;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/layout/Divider/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Divider/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,MAAM,MAAM,YAAY,GAAG;IACzB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA"}

package/dist/components/layout/Flex/Flex.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+/** Layout component used to group child elements in one-deminsional arrangements. */
+export declare const Flex: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("../Box").BaseBoxProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & import("./types").BaseFlexProps, {}, {}>;
+//# sourceMappingURL=Flex.d.ts.map

package/dist/components/layout/Flex/Flex.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Flex/Flex.tsx"],"names":[],"mappings":";AASA,qFAAqF;AACrF,eAAO,MAAM,IAAI;;;;;4CA0Bf,CAAA"}

package/dist/components/layout/Flex/Flex.js

@@ -0,0 +1,25 @@
+import isPropValid from '@emotion/is-prop-valid';
+import styled from '@emotion/styled';
+import { Box } from '../Box/Box.js';
+
+var invalidProps = ['alignItems', 'direction', 'wrap'];
+/** Layout component used to group child elements in one-deminsional arrangements. */
+var Flex = styled(Box, {
+    shouldForwardProp: function (prop) { return isPropValid(prop) && !invalidProps.includes(prop); }
+})(function (props) {
+    var theme = props.theme, direction = props.direction, wrap = props.wrap, alignItems = props.alignItems, justifyContent = props.justifyContent, gap = props.gap, rowGap = props.rowGap, columnGap = props.columnGap, inline = props.inline;
+    var spacing = theme.spacing;
+    return {
+        display: inline ? 'inline-flex' : 'flex',
+        alignItems: alignItems,
+        justifyContent: justifyContent,
+        flexDirection: direction,
+        flexWrap: wrap,
+        gap: gap && spacing[gap],
+        rowGap: rowGap && spacing[rowGap],
+        columnGap: columnGap && spacing[columnGap]
+    };
+});
+
+export { Flex };
+//# sourceMappingURL=Flex.js.map

package/dist/components/layout/Flex/Flex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex.js","sources":["../../../../src/components/layout/Flex/Flex.tsx"],"sourcesContent":["import isPropValid from '@emotion/is-prop-valid'\nimport styled from '@emotion/styled'\n\nimport { Box } from '../Box'\n\nimport type { FlexProps } from './types'\n\nconst invalidProps = ['alignItems', 'direction', 'wrap']\n\n/** Layout component used to group child elements in one-deminsional arrangements. */\nexport const Flex = styled(Box, {\n  shouldForwardProp: (prop) => isPropValid(prop) && !invalidProps.includes(prop)\n})<FlexProps>((props) => {\n  const {\n    theme,\n    direction,\n    wrap,\n    alignItems,\n    justifyContent,\n    gap,\n    rowGap,\n    columnGap,\n    inline\n  } = props\n  const { spacing } = theme\n\n  return {\n    display: inline ? 'inline-flex' : 'flex',\n    alignItems,\n    justifyContent,\n    flexDirection: direction,\n    flexWrap: wrap,\n    gap: gap && spacing[gap],\n    rowGap: rowGap && spacing[rowGap],\n    columnGap: columnGap && spacing[columnGap]\n  }\n})\n"],"names":[],"mappings":";;;;AAOA,IAAM,YAAY,GAAG,CAAC,YAAY,EAAE,WAAW,EAAE,MAAM,CAAC,CAAA;AAExD;AACa,IAAA,IAAI,GAAG,MAAM,CAAC,GAAG,EAAE;AAC9B,IAAA,iBAAiB,EAAE,UAAC,IAAI,IAAK,OAAA,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAA;CAC/E,CAAC,CAAY,UAAC,KAAK,EAAA;IAEhB,IAAA,KAAK,GASH,KAAK,CAAA,KATF,EACL,SAAS,GAQP,KAAK,CARE,SAAA,EACT,IAAI,GAOF,KAAK,KAPH,EACJ,UAAU,GAMR,KAAK,CAAA,UANG,EACV,cAAc,GAKZ,KAAK,CALO,cAAA,EACd,GAAG,GAID,KAAK,IAJJ,EACH,MAAM,GAGJ,KAAK,CAAA,MAHD,EACN,SAAS,GAEP,KAAK,CAFE,SAAA,EACT,MAAM,GACJ,KAAK,OADD,CACC;AACD,IAAA,IAAA,OAAO,GAAK,KAAK,CAAA,OAAV,CAAU;IAEzB,OAAO;QACL,OAAO,EAAE,MAAM,GAAG,aAAa,GAAG,MAAM;AACxC,QAAA,UAAU,EAAA,UAAA;AACV,QAAA,cAAc,EAAA,cAAA;AACd,QAAA,aAAa,EAAE,SAAS;AACxB,QAAA,QAAQ,EAAE,IAAI;AACd,QAAA,GAAG,EAAE,GAAG,IAAI,OAAO,CAAC,GAAG,CAAC;AACxB,QAAA,MAAM,EAAE,MAAM,IAAI,OAAO,CAAC,MAAM,CAAC;AACjC,QAAA,SAAS,EAAE,SAAS,IAAI,OAAO,CAAC,SAAS,CAAC;KAC3C,CAAA;AACH,CAAC;;;;"}

package/dist/components/layout/Flex/Flex.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { Flex } from './Flex';
+declare const meta: Meta<typeof Flex>;
+export default meta;
+type Story = StoryObj<typeof Flex>;
+export declare const Default: Story;
+export declare const Centered: Story;
+export declare const SpacedEvenly: Story;
+export declare const Column: Story;
+//# sourceMappingURL=Flex.stories.d.ts.map

package/dist/components/layout/Flex/Flex.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Flex/Flex.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAKtD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAE7B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CA8D3B,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAA;AAEhC,eAAO,MAAM,QAAQ,EAAE,KAItB,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAI1B,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAIpB,CAAA"}

package/dist/components/layout/Flex/index.d.ts

@@ -0,0 +1,3 @@
+export { Flex } from './Flex';
+export type { FlexProps, BaseFlexProps } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/layout/Flex/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Flex/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/layout/Flex/types.d.ts

@@ -0,0 +1,15 @@
+import type { CSSProperties } from 'react';
+import type { SpacingOptions } from '../../../foundations/spacing';
+import type { BoxProps } from '../Box';
+export type BaseFlexProps = {
+    alignItems?: CSSProperties['alignItems'];
+    direction?: CSSProperties['flexDirection'];
+    gap?: SpacingOptions;
+    rowGap?: SpacingOptions;
+    columnGap?: SpacingOptions;
+    justifyContent?: CSSProperties['justifyContent'];
+    wrap?: CSSProperties['flexWrap'];
+    inline?: boolean;
+};
+export type FlexProps = BaseFlexProps & BoxProps;
+//# sourceMappingURL=types.d.ts.map

package/dist/components/layout/Flex/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Flex/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAA;AAClE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAEtC,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,CAAC,EAAE,aAAa,CAAC,YAAY,CAAC,CAAA;IACxC,SAAS,CAAC,EAAE,aAAa,CAAC,eAAe,CAAC,CAAA;IAC1C,GAAG,CAAC,EAAE,cAAc,CAAA;IACpB,MAAM,CAAC,EAAE,cAAc,CAAA;IACvB,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,cAAc,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAA;IAChD,IAAI,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAA;IAChC,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,SAAS,GAAG,aAAa,GAAG,QAAQ,CAAA"}

package/dist/components/layout/Paper/Paper.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+/**
+ * Base layout component used as a building block for creating pages
+ * and other components.
+ * */
+export declare const Paper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("..").BaseBoxProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & import("../Flex").BaseFlexProps & import("./types").BasePaperProps, {}, {}>;
+//# sourceMappingURL=Paper.d.ts.map

package/dist/components/layout/Paper/Paper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Paper.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Paper/Paper.tsx"],"names":[],"mappings":";AAMA;;;KAGK;AACL,eAAO,MAAM,KAAK;;;;;+EAgBhB,CAAA"}

package/dist/components/layout/Paper/Paper.js

@@ -0,0 +1,20 @@
+import styled from '@emotion/styled';
+import { Flex } from '../Flex/Flex.js';
+
+/**
+ * Base layout component used as a building block for creating pages
+ * and other components.
+ * */
+var Paper = styled(Flex)(function (props) {
+    var theme = props.theme, _a = props.backgroundColor, backgroundColor = _a === void 0 ? 'white' : _a, border = props.border, _b = props.borderRadius, borderRadius = _b === void 0 ? 'm' : _b, _c = props.shadow, shadow = _c === void 0 ? 'mid' : _c;
+    return {
+        boxShadow: theme.shadows[shadow],
+        border: border && "1px solid ".concat(theme.color.border[border]),
+        borderRadius: theme.cornerRadius[borderRadius],
+        backgroundColor: theme.color.background[backgroundColor],
+        overflow: 'hidden'
+    };
+});
+
+export { Paper };
+//# sourceMappingURL=Paper.js.map

package/dist/components/layout/Paper/Paper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Paper.js","sources":["../../../../src/components/layout/Paper/Paper.tsx"],"sourcesContent":["import styled from '@emotion/styled'\n\nimport { Flex } from '../Flex'\n\nimport type { PaperProps } from './types'\n\n/**\n * Base layout component used as a building block for creating pages\n * and other components.\n * */\nexport const Paper = styled(Flex)<PaperProps>((props) => {\n  const {\n    theme,\n    backgroundColor = 'white',\n    border,\n    borderRadius = 'm',\n    shadow = 'mid'\n  } = props\n\n  return {\n    boxShadow: theme.shadows[shadow],\n    border: border && `1px solid ${theme.color.border[border]}`,\n    borderRadius: theme.cornerRadius[borderRadius],\n    backgroundColor: theme.color.background[backgroundColor],\n    overflow: 'hidden'\n  }\n})\n"],"names":[],"mappings":";;;AAMA;;;AAGK;AACQ,IAAA,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,CAAa,UAAC,KAAK,EAAA;AAEhD,IAAA,IAAA,KAAK,GAKH,KAAK,CALF,KAAA,EACL,KAIE,KAAK,CAAA,eAJkB,EAAzB,eAAe,mBAAG,OAAO,GAAA,EAAA,EACzB,MAAM,GAGJ,KAAK,CAAA,MAHD,EACN,EAAA,GAEE,KAAK,CAFW,YAAA,EAAlB,YAAY,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,GAAG,GAAA,EAAA,EAClB,EACE,GAAA,KAAK,OADO,EAAd,MAAM,GAAG,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,KAAA,CACP;IAET,OAAO;AACL,QAAA,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC;AAChC,QAAA,MAAM,EAAE,MAAM,IAAI,YAAA,CAAA,MAAA,CAAa,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAE;AAC3D,QAAA,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC,YAAY,CAAC;QAC9C,eAAe,EAAE,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,eAAe,CAAC;AACxD,QAAA,QAAQ,EAAE,QAAQ;KACnB,CAAA;AACH,CAAC;;;;"}

package/dist/components/layout/Paper/Paper.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { Paper } from './Paper';
+declare const meta: Meta<typeof Paper>;
+export default meta;
+type Story = StoryObj<typeof Paper>;
+export declare const Default: Story;
+//# sourceMappingURL=Paper.stories.d.ts.map

package/dist/components/layout/Paper/Paper.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Paper.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Paper/Paper.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,CAQ5B,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,KAAK,CAAC,CAAA;AAEnC,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAA"}

package/dist/components/layout/Paper/index.d.ts

@@ -0,0 +1,3 @@
+export { Paper } from './Paper';
+export { type PaperProps, type BasePaperProps } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/layout/Paper/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Paper/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/layout/Paper/types.d.ts

@@ -0,0 +1,26 @@
+import type { BorderColors } from '../../../foundations/color/semantic';
+import type { CornerRadiusOptions } from '../../../foundations/corner-radius';
+import type { ShadowOptions } from '../../../foundations/shadows';
+import type { FlexProps } from '../Flex';
+/**
+ * An elevated container which stands out from the background.
+ */
+export type BasePaperProps = {
+    /**
+     * Border type. If not provided, no border will be used.
+     * @default default
+     */
+    border?: BorderColors;
+    /**
+     * Border Radius
+     * @default m
+     */
+    borderRadius?: CornerRadiusOptions;
+    /**
+     * Elevation Shadow
+     * @default mid
+     */
+    shadow?: Exclude<ShadowOptions, 'drop'>;
+};
+export type PaperProps = BasePaperProps & FlexProps;
+//# sourceMappingURL=types.d.ts.map

package/dist/components/layout/Paper/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Paper/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAA;AACvE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAA;AAC7E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AACjE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAExC;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,CAAA;IAErB;;;OAGG;IACH,YAAY,CAAC,EAAE,mBAAmB,CAAA;IAElC;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,aAAa,EAAE,MAAM,CAAC,CAAA;CACxC,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,cAAc,GAAG,SAAS,CAAA"}

package/dist/components/layout/Popup/Popup.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { PopupProps } from './types';
+/**
+ * A popup is an in-place container that shows on top of the UI. A popup does
+ * not impact the rest of the UI (e.g. dimming background or shifting elements).
+ * It differs from modals, which do take over the whole UI and are usually
+ * center-screened.
+ */
+export declare const Popup: (props: PopupProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
+//# sourceMappingURL=Popup.d.ts.map

package/dist/components/layout/Popup/Popup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/Popup/Popup.tsx"],"names":[],"mappings":";AAsBA,OAAO,KAAK,EAAE,UAAU,EAAU,MAAM,SAAS,CAAA;AA+JjD;;;;;GAKG;AACH,eAAO,MAAM,KAAK,sKAwOhB,CAAA"}