@doist/reactist 10.0.0-beta.7 → 11.0.0

package/es/new-components/box/box.js.map

@@ -1 +1 @@
-{"version":3,"file":"box.js","sources":["../../../src/new-components/box/box.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { getClassNames } from '../responsive-props'\n\nimport type { ResponsiveProp } from '../responsive-props'\nimport type { Space, SpaceWithNegatives, WithEnhancedClassName } from '../common-types'\n\nimport styles from './box.module.css'\nimport paddingStyles from './padding.module.css'\nimport marginStyles from './margin.module.css'\n\ninterface BoxPaddingProps {\n    padding?: ResponsiveProp<Space>\n    paddingX?: ResponsiveProp<Space>\n    paddingY?: ResponsiveProp<Space>\n    paddingTop?: ResponsiveProp<Space>\n    paddingRight?: ResponsiveProp<Space>\n    paddingBottom?: ResponsiveProp<Space>\n    paddingLeft?: ResponsiveProp<Space>\n}\n\ninterface BoxMarginProps {\n    margin?: ResponsiveProp<SpaceWithNegatives>\n    marginX?: ResponsiveProp<SpaceWithNegatives>\n    marginY?: ResponsiveProp<SpaceWithNegatives>\n    marginTop?: ResponsiveProp<SpaceWithNegatives>\n    marginRight?: ResponsiveProp<SpaceWithNegatives>\n    marginBottom?: ResponsiveProp<SpaceWithNegatives>\n    marginLeft?: ResponsiveProp<SpaceWithNegatives>\n}\n\ntype BoxMaxMinWidth = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge'\ntype BoxDisplay = 'block' | 'flex' | 'inline' | 'inlineBlock' | 'inlineFlex' | 'none'\ntype BoxFlexDirection = 'column' | 'row'\ntype BoxFlexWrap = 'nowrap' | 'wrap'\ntype BoxAlignItems = 'center' | 'flexEnd' | 'flexStart' | 'baseline'\ntype BoxJustifyContent =\n    | 'center'\n    | 'flexEnd'\n    | 'flexStart'\n    | 'spaceAround'\n    | 'spaceBetween'\n    | 'spaceEvenly'\ntype BoxOverflow = 'hidden' | 'auto' | 'visible' | 'scroll'\n\ninterface BorderProps {\n    borderRadius?: 'standard' | 'none' | 'full'\n    border?: 'standard' | 'none' // to be extended with more options\n}\n\ninterface ReusableBoxProps extends BorderProps, BoxPaddingProps {\n    minWidth?: 0 | BoxMaxMinWidth\n    maxWidth?: BoxMaxMinWidth | 'full'\n    background?: 'default' | 'aside' | 'highlight' | 'selected'\n    flexGrow?: 0 | 1\n    flexShrink?: 0\n    width?: 'full'\n    height?: 'full'\n}\n\ntype BoxPosition = 'absolute' | 'fixed' | 'relative' | 'static' | 'sticky'\n\ninterface BoxProps extends WithEnhancedClassName, ReusableBoxProps, BoxMarginProps {\n    position?: ResponsiveProp<BoxPosition>\n    display?: ResponsiveProp<BoxDisplay>\n    flexDirection?: ResponsiveProp<BoxFlexDirection>\n    flexWrap?: BoxFlexWrap\n    alignItems?: ResponsiveProp<BoxAlignItems>\n    justifyContent?: ResponsiveProp<BoxJustifyContent>\n    overflow?: BoxOverflow\n    width?: 'full'\n    height?: 'full'\n    textAlign?: ResponsiveProp<'start' | 'center' | 'end' | 'justify'>\n}\n\nconst Box = polymorphicComponent<'div', BoxProps, 'keepClassName'>(function Box(\n    {\n        as: component = 'div',\n        position = 'static',\n        display,\n        flexDirection = 'row',\n        flexWrap,\n        flexGrow,\n        flexShrink,\n        alignItems,\n        justifyContent,\n        overflow,\n        width,\n        height,\n        background,\n        border,\n        borderRadius,\n        minWidth,\n        maxWidth,\n        textAlign = 'start',\n        padding,\n        paddingY,\n        paddingX,\n        paddingTop,\n        paddingRight,\n        paddingBottom,\n        paddingLeft,\n        margin,\n        marginY,\n        marginX,\n        marginTop,\n        marginRight,\n        marginBottom,\n        marginLeft,\n        className,\n        children,\n        ...props\n    },\n    ref,\n) {\n    const resolvedPaddingTop = paddingTop ?? paddingY ?? padding\n    const resolvedPaddingRight = paddingRight ?? paddingX ?? padding\n    const resolvedPaddingBottom = paddingBottom ?? paddingY ?? padding\n    const resolvedPaddingLeft = paddingLeft ?? paddingX ?? padding\n\n    const resolvedMarginTop = marginTop ?? marginY ?? margin\n    const resolvedMarginRight = marginRight ?? marginX ?? margin\n    const resolvedMarginBottom = marginBottom ?? marginY ?? margin\n    const resolvedMarginLeft = marginLeft ?? marginX ?? margin\n\n    const omitFlex =\n        !display || (typeof display === 'string' && display !== 'flex' && display !== 'inlineFlex')\n\n    return React.createElement(\n        component,\n        {\n            ...props,\n            className:\n                classNames(\n                    className,\n                    styles.box,\n                    display ? getClassNames(styles, 'display', display) : null,\n                    position !== 'static' ? getClassNames(styles, 'position', position) : null,\n                    minWidth != null ? getClassNames(styles, 'minWidth', String(minWidth)) : null,\n                    getClassNames(styles, 'maxWidth', maxWidth),\n                    textAlign !== 'start' ? getClassNames(styles, 'textAlign', textAlign) : null,\n                    // padding\n                    getClassNames(paddingStyles, 'paddingTop', resolvedPaddingTop),\n                    getClassNames(paddingStyles, 'paddingRight', resolvedPaddingRight),\n                    getClassNames(paddingStyles, 'paddingBottom', resolvedPaddingBottom),\n                    getClassNames(paddingStyles, 'paddingLeft', resolvedPaddingLeft),\n                    // margin\n                    getClassNames(marginStyles, 'marginTop', resolvedMarginTop),\n                    getClassNames(marginStyles, 'marginRight', resolvedMarginRight),\n                    getClassNames(marginStyles, 'marginBottom', resolvedMarginBottom),\n                    getClassNames(marginStyles, 'marginLeft', resolvedMarginLeft),\n                    // flex props\n                    omitFlex ? null : getClassNames(styles, 'flexDirection', flexDirection),\n                    omitFlex ? null : getClassNames(styles, 'flexWrap', flexWrap),\n                    omitFlex ? null : getClassNames(styles, 'alignItems', alignItems),\n                    omitFlex ? null : getClassNames(styles, 'justifyContent', justifyContent),\n                    flexShrink != null\n                        ? getClassNames(styles, 'flexShrink', String(flexShrink))\n                        : null,\n                    flexGrow != null ? getClassNames(styles, 'flexGrow', String(flexGrow)) : null,\n                    // other props\n                    getClassNames(styles, 'overflow', overflow),\n                    getClassNames(styles, 'width', width),\n                    getClassNames(styles, 'height', height),\n                    getClassNames(styles, 'bg', background),\n                    borderRadius !== 'none'\n                        ? getClassNames(styles, 'borderRadius', borderRadius)\n                        : null,\n                    border !== 'none' ? getClassNames(styles, 'border', border) : null,\n                ) || undefined,\n            ref,\n        },\n        children,\n    )\n})\n\nexport type {\n    BoxProps,\n    BoxPaddingProps,\n    BoxMarginProps,\n    ReusableBoxProps,\n    BoxMaxMinWidth,\n    BoxDisplay,\n    BoxPosition,\n    BoxFlexDirection,\n    BoxFlexWrap,\n    BoxAlignItems,\n    BoxJustifyContent,\n    BoxOverflow,\n}\n\nexport { Box }\n"],"names":["Box","polymorphicComponent","ref","as","component","position","display","flexDirection","flexWrap","flexGrow","flexShrink","alignItems","justifyContent","overflow","width","height","background","border","borderRadius","minWidth","maxWidth","textAlign","padding","paddingY","paddingX","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginY","marginX","marginTop","marginRight","marginBottom","marginLeft","className","children","props","resolvedPaddingTop","resolvedPaddingRight","resolvedPaddingBottom","resolvedPaddingLeft","resolvedMarginTop","resolvedMarginRight","resolvedMarginBottom","resolvedMarginLeft","omitFlex","React","classNames","styles","box","getClassNames","String","paddingStyles","marginStyles","undefined"],"mappings":"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"}
+{"version":3,"file":"box.js","sources":["../../../src/new-components/box/box.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { getClassNames } from '../responsive-props'\n\nimport type { ResponsiveProp } from '../responsive-props'\nimport type {\n    DividerWeight,\n    Space,\n    SpaceWithNegatives,\n    WithEnhancedClassName,\n} from '../common-types'\n\nimport styles from './box.module.css'\nimport paddingStyles from './padding.module.css'\nimport marginStyles from './margin.module.css'\nimport widthStyles from './width.module.css'\n\ninterface BoxPaddingProps {\n    padding?: ResponsiveProp<Space>\n    paddingX?: ResponsiveProp<Space>\n    paddingY?: ResponsiveProp<Space>\n    paddingTop?: ResponsiveProp<Space>\n    paddingRight?: ResponsiveProp<Space>\n    paddingBottom?: ResponsiveProp<Space>\n    paddingLeft?: ResponsiveProp<Space>\n}\n\ninterface BoxMarginProps {\n    margin?: ResponsiveProp<SpaceWithNegatives>\n    marginX?: ResponsiveProp<SpaceWithNegatives>\n    marginY?: ResponsiveProp<SpaceWithNegatives>\n    marginTop?: ResponsiveProp<SpaceWithNegatives>\n    marginRight?: ResponsiveProp<SpaceWithNegatives>\n    marginBottom?: ResponsiveProp<SpaceWithNegatives>\n    marginLeft?: ResponsiveProp<SpaceWithNegatives>\n}\n\ntype BoxDisplay = 'block' | 'flex' | 'inline' | 'inlineBlock' | 'inlineFlex' | 'none'\ntype BoxFlexDirection = 'column' | 'row'\ntype BoxFlexWrap = 'nowrap' | 'wrap'\ntype BoxAlignItems = 'center' | 'flexEnd' | 'flexStart' | 'baseline'\ntype BoxJustifyContent =\n    | 'center'\n    | 'flexEnd'\n    | 'flexStart'\n    | 'spaceAround'\n    | 'spaceBetween'\n    | 'spaceEvenly'\ntype BoxOverflow = 'hidden' | 'auto' | 'visible' | 'scroll'\n\ntype BoxMaxMinWidth = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge'\ntype BoxMinWidth = 0 | BoxMaxMinWidth\ntype BoxMaxWidth = BoxMaxMinWidth | 'full'\ntype BoxWidth = 0 | BoxMaxMinWidth | 'full' | 'auto' | 'maxContent' | 'minContent' | 'fitContent'\n\ninterface BorderProps {\n    borderRadius?: 'standard' | 'none' | 'full'\n    border?: DividerWeight\n}\n\ninterface ReusableBoxProps extends BorderProps, BoxPaddingProps {\n    minWidth?: BoxMinWidth\n    maxWidth?: BoxMaxWidth\n    width?: BoxWidth\n    background?: 'default' | 'aside' | 'highlight' | 'selected'\n    flexGrow?: 0 | 1\n    flexShrink?: 0\n}\n\ntype BoxPosition = 'absolute' | 'fixed' | 'relative' | 'static' | 'sticky'\n\ninterface BoxProps extends WithEnhancedClassName, ReusableBoxProps, BoxMarginProps {\n    position?: ResponsiveProp<BoxPosition>\n    display?: ResponsiveProp<BoxDisplay>\n    flexDirection?: ResponsiveProp<BoxFlexDirection>\n    flexWrap?: BoxFlexWrap\n    alignItems?: ResponsiveProp<BoxAlignItems>\n    justifyContent?: ResponsiveProp<BoxJustifyContent>\n    overflow?: BoxOverflow\n    height?: 'full'\n    textAlign?: ResponsiveProp<'start' | 'center' | 'end' | 'justify'>\n}\n\nconst Box = polymorphicComponent<'div', BoxProps, 'keepClassName'>(function Box(\n    {\n        as: component = 'div',\n        position = 'static',\n        display,\n        flexDirection = 'row',\n        flexWrap,\n        flexGrow,\n        flexShrink,\n        alignItems,\n        justifyContent,\n        overflow,\n        width,\n        height,\n        background,\n        border,\n        borderRadius,\n        minWidth,\n        maxWidth,\n        textAlign = 'start',\n        padding,\n        paddingY,\n        paddingX,\n        paddingTop,\n        paddingRight,\n        paddingBottom,\n        paddingLeft,\n        margin,\n        marginY,\n        marginX,\n        marginTop,\n        marginRight,\n        marginBottom,\n        marginLeft,\n        className,\n        children,\n        ...props\n    },\n    ref,\n) {\n    const resolvedPaddingTop = paddingTop ?? paddingY ?? padding\n    const resolvedPaddingRight = paddingRight ?? paddingX ?? padding\n    const resolvedPaddingBottom = paddingBottom ?? paddingY ?? padding\n    const resolvedPaddingLeft = paddingLeft ?? paddingX ?? padding\n\n    const resolvedMarginTop = marginTop ?? marginY ?? margin\n    const resolvedMarginRight = marginRight ?? marginX ?? margin\n    const resolvedMarginBottom = marginBottom ?? marginY ?? margin\n    const resolvedMarginLeft = marginLeft ?? marginX ?? margin\n\n    const omitFlex =\n        !display || (typeof display === 'string' && display !== 'flex' && display !== 'inlineFlex')\n\n    return React.createElement(\n        component,\n        {\n            ...props,\n            className:\n                classNames(\n                    className,\n                    styles.box,\n                    display ? getClassNames(styles, 'display', display) : null,\n                    position !== 'static' ? getClassNames(styles, 'position', position) : null,\n                    minWidth != null\n                        ? getClassNames(widthStyles, 'minWidth', String(minWidth))\n                        : null,\n                    getClassNames(widthStyles, 'maxWidth', maxWidth),\n                    textAlign !== 'start' ? getClassNames(styles, 'textAlign', textAlign) : null,\n                    // padding\n                    getClassNames(paddingStyles, 'paddingTop', resolvedPaddingTop),\n                    getClassNames(paddingStyles, 'paddingRight', resolvedPaddingRight),\n                    getClassNames(paddingStyles, 'paddingBottom', resolvedPaddingBottom),\n                    getClassNames(paddingStyles, 'paddingLeft', resolvedPaddingLeft),\n                    // margin\n                    getClassNames(marginStyles, 'marginTop', resolvedMarginTop),\n                    getClassNames(marginStyles, 'marginRight', resolvedMarginRight),\n                    getClassNames(marginStyles, 'marginBottom', resolvedMarginBottom),\n                    getClassNames(marginStyles, 'marginLeft', resolvedMarginLeft),\n                    // flex props\n                    omitFlex ? null : getClassNames(styles, 'flexDirection', flexDirection),\n                    omitFlex ? null : getClassNames(styles, 'flexWrap', flexWrap),\n                    omitFlex ? null : getClassNames(styles, 'alignItems', alignItems),\n                    omitFlex ? null : getClassNames(styles, 'justifyContent', justifyContent),\n                    flexShrink != null\n                        ? getClassNames(styles, 'flexShrink', String(flexShrink))\n                        : null,\n                    flexGrow != null ? getClassNames(styles, 'flexGrow', String(flexGrow)) : null,\n                    // other props\n                    getClassNames(styles, 'overflow', overflow),\n                    width != null ? getClassNames(widthStyles, 'width', String(width)) : null,\n                    getClassNames(styles, 'height', height),\n                    getClassNames(styles, 'bg', background),\n                    borderRadius !== 'none'\n                        ? getClassNames(styles, 'borderRadius', borderRadius)\n                        : null,\n                    border !== 'none' ? getClassNames(styles, 'border', border) : null,\n                ) || undefined,\n            ref,\n        },\n        children,\n    )\n})\n\nexport type {\n    BoxProps,\n    BoxPaddingProps,\n    BoxMarginProps,\n    ReusableBoxProps,\n    BoxMinWidth,\n    BoxMaxWidth,\n    BoxDisplay,\n    BoxPosition,\n    BoxFlexDirection,\n    BoxFlexWrap,\n    BoxAlignItems,\n    BoxJustifyContent,\n    BoxOverflow,\n}\n\nexport { Box }\n"],"names":["Box","polymorphicComponent","ref","as","component","position","display","flexDirection","flexWrap","flexGrow","flexShrink","alignItems","justifyContent","overflow","width","height","background","border","borderRadius","minWidth","maxWidth","textAlign","padding","paddingY","paddingX","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginY","marginX","marginTop","marginRight","marginBottom","marginLeft","className","children","props","resolvedPaddingTop","resolvedPaddingRight","resolvedPaddingBottom","resolvedPaddingLeft","resolvedMarginTop","resolvedMarginRight","resolvedMarginBottom","resolvedMarginLeft","omitFlex","React","classNames","styles","box","getClassNames","widthStyles","String","paddingStyles","marginStyles","undefined"],"mappings":"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"}

package/es/new-components/box/box.module.css.js

@@ -1,4 +1,4 @@
-var modules_54d944f2 = {"box":"_3aac345d","position-absolute":"_5f5fbe05","position-fixed":"_2e1dcb18","position-relative":"_6b073eae","position-sticky":"ed69c0f9","tablet-position-absolute":"b895daa3","tablet-position-fixed":"_81f67db7","tablet-position-relative":"bf7d2da5","tablet-position-sticky":"e0ab99ed","desktop-position-absolute":"_5dade286","desktop-position-fixed":"_584d7ee7","desktop-position-relative":"c7f56545","desktop-position-sticky":"_70b5ef21","display-block":"_5bca176b","display-flex":"_32670f8f","display-inline":"_3f9cb619","display-inlineBlock":"a42dded2","display-inlineFlex":"_7a45d80c","display-none":"a469c553","tablet-display-block":"_8e5cf5df","tablet-display-flex":"_640f3795","tablet-display-inline":"f1a1c131","tablet-display-inlineBlock":"e9f55809","tablet-display-inlineFlex":"_9fd7bd31","tablet-display-none":"_389a387a","desktop-display-block":"_3e730e39","desktop-display-flex":"_8407ca0e","desktop-display-inline":"_596653e1","desktop-display-inlineBlock":"eb198bac","desktop-display-inlineFlex":"c89ef13b","desktop-display-none":"_868c554e","minWidth-0":"a6e042e3","minWidth-xsmall":"_9ce11446","minWidth-small":"_2db5e251","minWidth-medium":"ef281ffc","minWidth-large":"f938efbe","minWidth-xlarge":"f87c0f55","maxWidth-xsmall":"_873d4d51","maxWidth-small":"_400d4800","maxWidth-medium":"_94ecdffd","maxWidth-large":"f9eeefb5","maxWidth-xlarge":"_2253ed9a","maxWidth-full":"bde40dfb","flexDirection-column":"c45f6767","flexDirection-row":"c167e8da","tablet-flexDirection-column":"c0ca97a9","tablet-flexDirection-row":"_45ebc391","desktop-flexDirection-column":"dfd69d4d","desktop-flexDirection-row":"f3d06da6","flexWrap-wrap":"_7fb6a141","flexWrap-nowrap":"_30a701b3","flexShrink-0":"_24cf9746","flexGrow-0":"d2a4825d","flexGrow-1":"a2a05bbf","alignItems-flexStart":"_4ada17a4","alignItems-center":"c2c1d3b2","alignItems-flexEnd":"_259506f5","alignItems-baseline":"_3cb51936","tablet-alignItems-flexStart":"_86497cb0","tablet-alignItems-center":"_5a281eb4","tablet-alignItems-flexEnd":"d7c8f9b0","tablet-alignItems-baseline":"_9b92f4b7","desktop-alignItems-flexStart":"_4d2b7f03","desktop-alignItems-center":"_521b4677","desktop-alignItems-flexEnd":"_239714b3","desktop-alignItems-baseline":"_49fa952b","justifyContent-flexStart":"_84c5c8b7","justifyContent-center":"_84df2447","justifyContent-flexEnd":"_96a7db47","justifyContent-spaceAround":"e7ad8d72","justifyContent-spaceBetween":"e5a5ea05","justifyContent-spaceEvenly":"_08952f29","tablet-justifyContent-flexStart":"_69d750a7","tablet-justifyContent-center":"be616f82","tablet-justifyContent-flexEnd":"_4e22f886","tablet-justifyContent-spaceAround":"_9b848fa4","tablet-justifyContent-spaceBetween":"_346ba50f","tablet-justifyContent-spaceEvenly":"_8e101549","desktop-justifyContent-flexStart":"_3e1b3f62","desktop-justifyContent-center":"a285086c","desktop-justifyContent-flexEnd":"_32759d54","desktop-justifyContent-spaceBetween":"_543f6141","overflow-hidden":"d91c9bdf","overflow-auto":"_438cafe6","overflow-visible":"_9527349d","overflow-scroll":"a086ce42","width-full":"d32e2047","height-full":"_2d523b97","bg-default":"_581ad1ab","bg-aside":"a554f678","bg-highlight":"_2d74468c","bg-selected":"eb3848be","borderRadius-standard":"_14fe8bc8","borderRadius-full":"c1bf716d","border-standard":"f605be96","textAlign-start":"_083a10ea","textAlign-center":"_8c05b9dc","textAlign-end":"e9c0981c","textAlign-justify":"a21c651d","tablet-textAlign-start":"_62b208d9","tablet-textAlign-center":"_7198bfc5","tablet-textAlign-end":"_4156cdf8","tablet-textAlign-justify":"_5dce5b3b","desktop-textAlign-start":"_526ba24a","desktop-textAlign-center":"f98d87d4","desktop-textAlign-end":"_9679b54a","desktop-textAlign-justify":"_4b25a07f"};
+var modules_54d944f2 = {"box":"_2a8ae321","position-absolute":"_29e047b9","position-fixed":"fe54fea9","position-relative":"_6a95a38d","position-sticky":"ccc689fe","tablet-position-absolute":"aad88ae1","tablet-position-fixed":"_2044ccd3","tablet-position-relative":"a0904035","tablet-position-sticky":"_770506a5","desktop-position-absolute":"_5a954855","desktop-position-fixed":"_2dc73359","desktop-position-relative":"_6ab005ed","desktop-position-sticky":"fa60c726","display-block":"_221ad6a3","display-flex":"_6764f5bc","display-inline":"_50c37dba","display-inlineBlock":"_16546fe0","display-inlineFlex":"_2782a687","display-none":"b70b4fb7","tablet-display-block":"_5b3547cc","tablet-display-flex":"_099432e6","tablet-display-inline":"d99fcd80","tablet-display-inlineBlock":"_8f160568","tablet-display-inlineFlex":"_5b7b4be4","tablet-display-none":"_553721f8","desktop-display-block":"_6b86b317","desktop-display-flex":"eb20eda4","desktop-display-inline":"be19d1e9","desktop-display-inlineBlock":"dcf7c80a","desktop-display-inlineFlex":"e4f02b1f","desktop-display-none":"_3974e6d8","flexDirection-column":"daf5e366","flexDirection-row":"_47f2ddb7","tablet-flexDirection-column":"_27490d54","tablet-flexDirection-row":"_0317f51b","desktop-flexDirection-column":"_97590faa","desktop-flexDirection-row":"bf5d416e","flexWrap-wrap":"_210c1f9e","flexWrap-nowrap":"_2c775d07","flexShrink-0":"_25cae61d","flexGrow-0":"_6068a9cf","flexGrow-1":"c63f682c","alignItems-flexStart":"_0e774dfc","alignItems-center":"_5695a5d5","alignItems-flexEnd":"_139515d8","alignItems-baseline":"cea92f0a","tablet-alignItems-flexStart":"_3dc7ec16","tablet-alignItems-center":"_7993a7fa","tablet-alignItems-flexEnd":"b90d7edc","tablet-alignItems-baseline":"_7bd633f1","desktop-alignItems-flexStart":"_260d232b","desktop-alignItems-center":"_9e2e0a07","desktop-alignItems-flexEnd":"fc97448b","desktop-alignItems-baseline":"_0f76a529","justifyContent-flexStart":"_21d759bf","justifyContent-center":"ff70e049","justifyContent-flexEnd":"ae15d5ad","justifyContent-spaceAround":"_84374266","justifyContent-spaceBetween":"e72a8ca2","justifyContent-spaceEvenly":"_86224cb5","tablet-justifyContent-flexStart":"dceedee0","tablet-justifyContent-center":"_34ab3dab","tablet-justifyContent-flexEnd":"d5da2eb9","tablet-justifyContent-spaceAround":"_1677560d","tablet-justifyContent-spaceBetween":"ef77b2e7","tablet-justifyContent-spaceEvenly":"_685ef848","desktop-justifyContent-flexStart":"_695667f2","desktop-justifyContent-center":"ebb180cc","desktop-justifyContent-flexEnd":"bd5bb675","desktop-justifyContent-spaceBetween":"ae08a70c","overflow-hidden":"_4afa6fac","overflow-auto":"d8d342e4","overflow-visible":"c104da68","overflow-scroll":"_2d6bc0d0","height-full":"_99458759","bg-default":"aadb417c","bg-aside":"_36dca662","bg-highlight":"a1054115","bg-selected":"d17b4e9a","borderRadius-standard":"e3a3ee05","borderRadius-full":"be0cb60b","border-primary":"b9999f44","border-secondary":"_91063996","border-tertiary":"_0902977e","textAlign-start":"a7c58898","textAlign-center":"_2c9a262a","textAlign-end":"_46f07e93","textAlign-justify":"e526003e","tablet-textAlign-start":"_26864fce","tablet-textAlign-center":"e8f51d21","tablet-textAlign-end":"c1dc8b90","tablet-textAlign-justify":"_36bb3fa9","desktop-textAlign-start":"_942e35b0","desktop-textAlign-center":"_92da5c98","desktop-textAlign-end":"_2b0ecaf6","desktop-textAlign-justify":"_3dd24641"};
 
 export default modules_54d944f2;
 //# sourceMappingURL=box.module.css.js.map

package/es/new-components/box/width.module.css.js

@@ -0,0 +1,4 @@
+var modules_89b7671c = {"minWidth-0":"_68ab48ca","minWidth-xsmall":"_6fa2b565","minWidth-small":"dd50fabd","minWidth-medium":"e7e2c808","minWidth-large":"_6abbe25e","minWidth-xlarge":"_54f479ac","maxWidth-xsmall":"_148492bc","maxWidth-small":"bd023b96","maxWidth-medium":"e102903f","maxWidth-large":"_0e8d76d7","maxWidth-xlarge":"_47a031d0","maxWidth-full":"cd4c8183","width-0":"_5f5959e8","width-full":"_8c75067a","width-auto":"_56a651f6","width-maxContent":"_26f87bb8","width-minContent":"_07a6ab44","width-fitContent":"a87016fa","width-xsmall":"_1a972e50","width-small":"c96d8261","width-medium":"f3829d42","width-large":"_2caef228","width-xlarge":"_069e1491"};
+
+export default modules_89b7671c;
+//# sourceMappingURL=width.module.css.js.map

package/es/new-components/box/width.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"width.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/es/new-components/button/button.js

@@ -2,6 +2,7 @@ import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '.
 import { forwardRef, createElement } from 'react';
 import { BaseButton } from '../base-button/base-button.js';
 
+var _excluded = ["variant", "tone", "size", "type", "disabled", "exceptionallySetClassName"];
 /**
  * A semantic button that also looks like a button, and provides all the necessary visual variants.
  * It follows the [WAI-ARIA Button Pattern](https://www.w3.org/TR/wai-aria-practices/#button).
@@ -22,7 +23,7 @@ var Button = /*#__PURE__*/forwardRef(function Button(_ref, ref) {
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       exceptionallySetClassName = _ref.exceptionallySetClassName,
-      props = _objectWithoutPropertiesLoose(_ref, ["variant", "tone", "size", "type", "disabled", "exceptionallySetClassName"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/createElement(BaseButton, Object.assign({}, props, {
     as: "button",

package/es/new-components/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":["../../../src/new-components/button/button.tsx"],"sourcesContent":["import * as React from 'react'\nimport { BaseButton } from '../base-button'\nimport type { BaseButtonProps } from '../base-button'\n\ntype NativeButtonProps = Omit<\n    React.AllHTMLAttributes<HTMLButtonElement>,\n    'aria-disabled' | 'className' | keyof BaseButtonProps\n>\n\nexport type ButtonProps = NativeButtonProps &\n    BaseButtonProps & {\n        type?: 'button' | 'submit' | 'reset'\n        exceptionallySetClassName?: string\n    }\n\n/**\n * A semantic button that also looks like a button, and provides all the necessary visual variants.\n * It follows the [WAI-ARIA Button Pattern](https://www.w3.org/TR/wai-aria-practices/#button).\n *\n * 🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see ButtonLink\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n    {\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        type = 'button',\n        disabled = false,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <BaseButton\n            {...props}\n            as=\"button\"\n            ref={ref}\n            variant={variant}\n            tone={tone}\n            size={size}\n            type={type}\n            disabled={disabled}\n            exceptionallySetClassName={exceptionallySetClassName}\n        />\n    )\n})\n"],"names":["Button","React","ref","variant","tone","size","type","disabled","exceptionallySetClassName","props","BaseButton","as"],"mappings":";;;;AAeA;;;;;;;;;IAQaA,MAAM,gBAAGC,UAAA,CAAiD,SAASD,MAAT,OAUnEE,GAVmE;MAE/DC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;2BACPC;MAAAA,sCAAW;MACXC,iCAAAA;MACGC;;AAIP,sBACIR,aAAA,CAACS,UAAD,oBACQD;AACJE,IAAAA,EAAE,EAAC;AACHT,IAAAA,GAAG,EAAEA;AACLC,IAAAA,OAAO,EAAEA;AACTC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,QAAQ,EAAEA;AACVC,IAAAA,yBAAyB,EAAEA;IAT/B,CADJ;AAaH,CAzBqB;;;;"}
+{"version":3,"file":"button.js","sources":["../../../src/new-components/button/button.tsx"],"sourcesContent":["import * as React from 'react'\nimport { BaseButton } from '../base-button'\nimport type { BaseButtonProps } from '../base-button'\n\ntype NativeButtonProps = Omit<\n    React.AllHTMLAttributes<HTMLButtonElement>,\n    'aria-disabled' | 'className' | keyof BaseButtonProps\n>\n\nexport type ButtonProps = NativeButtonProps &\n    BaseButtonProps & {\n        type?: 'button' | 'submit' | 'reset'\n        exceptionallySetClassName?: string\n    }\n\n/**\n * A semantic button that also looks like a button, and provides all the necessary visual variants.\n * It follows the [WAI-ARIA Button Pattern](https://www.w3.org/TR/wai-aria-practices/#button).\n *\n * 🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see ButtonLink\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n    {\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        type = 'button',\n        disabled = false,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <BaseButton\n            {...props}\n            as=\"button\"\n            ref={ref}\n            variant={variant}\n            tone={tone}\n            size={size}\n            type={type}\n            disabled={disabled}\n            exceptionallySetClassName={exceptionallySetClassName}\n        />\n    )\n})\n"],"names":["Button","React","ref","variant","tone","size","type","disabled","exceptionallySetClassName","props","BaseButton","as"],"mappings":";;;;;AAeA;;;;;;;;;IAQaA,MAAM,gBAAGC,UAAA,CAAiD,SAASD,MAAT,OAUnEE,GAVmE;MAE/DC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;2BACPC;MAAAA,sCAAW;MACXC,iCAAAA;MACGC;;AAIP,sBACIR,aAAA,CAACS,UAAD,oBACQD;AACJE,IAAAA,EAAE,EAAC;AACHT,IAAAA,GAAG,EAAEA;AACLC,IAAAA,OAAO,EAAEA;AACTC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,QAAQ,EAAEA;AACVC,IAAAA,yBAAyB,EAAEA;IAT/B,CADJ;AAaH,CAzBqB;;;;"}

package/es/new-components/button-link/button-link.js

@@ -3,6 +3,7 @@ import { createElement } from 'react';
 import { polymorphicComponent } from '../../utils/polymorphism.js';
 import { BaseButton } from '../base-button/base-button.js';
 
+var _excluded = ["as", "variant", "tone", "size", "exceptionallySetClassName", "openInNewTab"];
 /**
  * A semantic link that looks like a button, exactly matching the `Button` component in all visual
  * aspects.
@@ -23,7 +24,7 @@ var ButtonLink = /*#__PURE__*/polymorphicComponent(function ButtonLink(_ref, ref
       exceptionallySetClassName = _ref.exceptionallySetClassName,
       _ref$openInNewTab = _ref.openInNewTab,
       openInNewTab = _ref$openInNewTab === void 0 ? false : _ref$openInNewTab,
-      props = _objectWithoutPropertiesLoose(_ref, ["as", "variant", "tone", "size", "exceptionallySetClassName", "openInNewTab"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/createElement(BaseButton, Object.assign({}, props, {
     as: as,

package/es/new-components/button-link/button-link.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-link.js","sources":["../../../src/new-components/button-link/button-link.tsx"],"sourcesContent":["import * as React from 'react'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { BaseButton } from '../base-button'\nimport type { BaseButtonProps } from '../base-button'\nimport type { OpenInNewTab } from '../common-types'\n\ntype NativeLinkProps = Omit<\n    JSX.IntrinsicElements['a'],\n    'aria-disabled' | 'target' | 'rel' | 'className'\n>\n\nexport type ButtonLinkProps = NativeLinkProps & BaseButtonProps & OpenInNewTab\n\n/**\n * A semantic link that looks like a button, exactly matching the `Button` component in all visual\n * aspects.\n *\n *🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see Button\n */\nexport const ButtonLink = polymorphicComponent<'a', ButtonLinkProps>(function ButtonLink(\n    {\n        as = 'a',\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        exceptionallySetClassName,\n        openInNewTab = false,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <BaseButton\n            {...props}\n            as={as}\n            ref={ref}\n            variant={variant}\n            tone={tone}\n            size={size}\n            exceptionallySetClassName={exceptionallySetClassName}\n            target={openInNewTab ? '_blank' : undefined}\n            rel={openInNewTab ? 'noopener noreferrer' : undefined}\n        />\n    )\n})\n"],"names":["ButtonLink","polymorphicComponent","ref","as","variant","tone","size","exceptionallySetClassName","openInNewTab","props","React","BaseButton","target","undefined","rel"],"mappings":";;;;;AAaA;;;;;;;;;IAQaA,UAAU,gBAAGC,oBAAoB,CAAuB,SAASD,UAAT,OAUjEE,GAViE;qBAE7DC;MAAAA,0BAAK;MACLC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;MACPC,iCAAAA;+BACAC;MAAAA,8CAAe;MACZC;;AAIP,sBACIC,aAAA,CAACC,UAAD,oBACQF;AACJN,IAAAA,EAAE,EAAEA;AACJD,IAAAA,GAAG,EAAEA;AACLE,IAAAA,OAAO,EAAEA;AACTC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,yBAAyB,EAAEA;AAC3BK,IAAAA,MAAM,EAAEJ,YAAY,GAAG,QAAH,GAAcK;AAClCC,IAAAA,GAAG,EAAEN,YAAY,GAAG,qBAAH,GAA2BK;IAThD,CADJ;AAaH,CAzB6C;;;;"}
+{"version":3,"file":"button-link.js","sources":["../../../src/new-components/button-link/button-link.tsx"],"sourcesContent":["import * as React from 'react'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { BaseButton } from '../base-button'\nimport type { BaseButtonProps } from '../base-button'\nimport type { OpenInNewTab } from '../common-types'\n\ntype NativeLinkProps = Omit<\n    JSX.IntrinsicElements['a'],\n    'aria-disabled' | 'target' | 'rel' | 'className'\n>\n\nexport type ButtonLinkProps = NativeLinkProps & BaseButtonProps & OpenInNewTab\n\n/**\n * A semantic link that looks like a button, exactly matching the `Button` component in all visual\n * aspects.\n *\n *🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see Button\n */\nexport const ButtonLink = polymorphicComponent<'a', ButtonLinkProps>(function ButtonLink(\n    {\n        as = 'a',\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        exceptionallySetClassName,\n        openInNewTab = false,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <BaseButton\n            {...props}\n            as={as}\n            ref={ref}\n            variant={variant}\n            tone={tone}\n            size={size}\n            exceptionallySetClassName={exceptionallySetClassName}\n            target={openInNewTab ? '_blank' : undefined}\n            rel={openInNewTab ? 'noopener noreferrer' : undefined}\n        />\n    )\n})\n"],"names":["ButtonLink","polymorphicComponent","ref","as","variant","tone","size","exceptionallySetClassName","openInNewTab","props","React","BaseButton","target","undefined","rel"],"mappings":";;;;;;AAaA;;;;;;;;;IAQaA,UAAU,gBAAGC,oBAAoB,CAAuB,SAASD,UAAT,OAUjEE,GAViE;qBAE7DC;MAAAA,0BAAK;MACLC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;MACPC,iCAAAA;+BACAC;MAAAA,8CAAe;MACZC;;AAIP,sBACIC,aAAA,CAACC,UAAD,oBACQF;AACJN,IAAAA,EAAE,EAAEA;AACJD,IAAAA,GAAG,EAAEA;AACLE,IAAAA,OAAO,EAAEA;AACTC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,yBAAyB,EAAEA;AAC3BK,IAAAA,MAAM,EAAEJ,YAAY,GAAG,QAAH,GAAcK;AAClCC,IAAAA,GAAG,EAAEN,YAAY,GAAG,qBAAH,GAA2BK;IAThD,CADJ;AAaH,CAzB6C;;;;"}

package/es/new-components/checkbox-field/checkbox-field.js

@@ -1,12 +1,12 @@
 import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { forwardRef, useState, useRef, useEffect, createElement } from 'react';
 import { Box } from '../box/box.js';
-import { HiddenVisually } from '../hidden-visually/hidden-visually.js';
 import { Text } from '../text/text.js';
 import { useForkRef } from 'reakit-utils';
 import { CheckboxIcon } from './checkbox-icon.js';
 import styles from './checkbox-field.module.css.js';
 
+var _excluded = ["label", "disabled", "indeterminate", "defaultChecked", "onChange"];
 var CheckboxField = /*#__PURE__*/forwardRef(function CheckboxField(_ref, ref) {
   var _ref2, _props$checked, _props$checked2;
 
@@ -15,7 +15,7 @@ var CheckboxField = /*#__PURE__*/forwardRef(function CheckboxField(_ref, ref) {
       indeterminate = _ref.indeterminate,
       defaultChecked = _ref.defaultChecked,
       _onChange = _ref.onChange,
-      props = _objectWithoutPropertiesLoose(_ref, ["label", "disabled", "indeterminate", "defaultChecked", "onChange"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var isControlledComponent = typeof props.checked === 'boolean';
 
@@ -30,9 +30,13 @@ var CheckboxField = /*#__PURE__*/forwardRef(function CheckboxField(_ref, ref) {
     console.warn('A Checkbox needs a label');
   }
 
-  var _React$useState = useState((_ref2 = (_props$checked = props.checked) !== null && _props$checked !== void 0 ? _props$checked : defaultChecked) !== null && _ref2 !== void 0 ? _ref2 : false),
-      checkedState = _React$useState[0],
-      setChecked = _React$useState[1];
+  var _React$useState = useState(false),
+      keyFocused = _React$useState[0],
+      setKeyFocused = _React$useState[1];
+
+  var _React$useState2 = useState((_ref2 = (_props$checked = props.checked) !== null && _props$checked !== void 0 ? _props$checked : defaultChecked) !== null && _ref2 !== void 0 ? _ref2 : false),
+      checkedState = _React$useState2[0],
+      setChecked = _React$useState2[1];
 
   var isChecked = (_props$checked2 = props.checked) !== null && _props$checked2 !== void 0 ? _props$checked2 : checkedState;
   var internalRef = useRef(null);
@@ -46,10 +50,11 @@ var CheckboxField = /*#__PURE__*/forwardRef(function CheckboxField(_ref, ref) {
     as: "label",
     display: "flex",
     alignItems: "center",
-    className: [styles.container, disabled ? styles.disabled : null, isChecked ? styles.checked : null, 'focus-marker-enabled-within']
-  }, /*#__PURE__*/createElement(HiddenVisually, null, /*#__PURE__*/createElement("input", Object.assign({}, props, {
+    className: [styles.container, disabled ? styles.disabled : null, isChecked ? styles.checked : null, keyFocused ? styles.keyFocused : null]
+  }, /*#__PURE__*/createElement("input", Object.assign({}, props, {
     ref: combinedRef,
     type: "checkbox",
+    "aria-checked": indeterminate ? 'mixed' : isChecked,
     checked: isChecked,
     disabled: disabled,
     onChange: function onChange(event) {
@@ -58,12 +63,24 @@ var CheckboxField = /*#__PURE__*/forwardRef(function CheckboxField(_ref, ref) {
       if (!event.defaultPrevented) {
         setChecked(event.currentTarget.checked);
       }
+    },
+    onBlur: function onBlur(event) {
+      var _props$onBlur;
+
+      setKeyFocused(false);
+      props === null || props === void 0 ? void 0 : (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 ? void 0 : _props$onBlur.call(props, event);
+    },
+    onKeyUp: function onKeyUp(event) {
+      var _props$onKeyUp;
+
+      setKeyFocused(true);
+      props === null || props === void 0 ? void 0 : (_props$onKeyUp = props.onKeyUp) === null || _props$onKeyUp === void 0 ? void 0 : _props$onKeyUp.call(props, event);
     }
-  }))), /*#__PURE__*/createElement(CheckboxIcon, {
-    "aria-hidden": true,
+  })), /*#__PURE__*/createElement(CheckboxIcon, {
     checked: isChecked,
+    disabled: disabled,
     indeterminate: indeterminate,
-    disabled: disabled
+    "aria-hidden": true
   }), label ? /*#__PURE__*/createElement(Text, null, label) : null);
 });
 

package/es/new-components/checkbox-field/checkbox-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-field.js","sources":["../../../src/new-components/checkbox-field/checkbox-field.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useForkRef } from 'reakit-utils'\nimport { HiddenVisually } from '../hidden-visually'\nimport { Box } from '../box'\nimport { Text } from '../text'\nimport { CheckboxIcon } from './checkbox-icon'\n\nimport styles from './checkbox-field.module.css'\n\ntype CheckboxFieldProps = Omit<JSX.IntrinsicElements['input'], 'type' | 'className'> & {\n    label?: string\n    indeterminate?: boolean\n}\n\nconst CheckboxField = React.forwardRef<HTMLInputElement, CheckboxFieldProps>(function CheckboxField(\n    { label, disabled, indeterminate, defaultChecked, onChange, ...props },\n    ref,\n) {\n    const isControlledComponent = typeof props.checked === 'boolean'\n    if (typeof indeterminate === 'boolean' && !isControlledComponent) {\n        // eslint-disable-next-line no-console\n        console.warn('Cannot use indeterminate on an uncontrolled checkbox')\n        indeterminate = undefined\n    }\n\n    if (!label && !props['aria-label'] && !props['aria-labelledby']) {\n        // eslint-disable-next-line no-console\n        console.warn('A Checkbox needs a label')\n    }\n\n    const [checkedState, setChecked] = React.useState(props.checked ?? defaultChecked ?? false)\n    const isChecked = props.checked ?? checkedState\n\n    const internalRef = React.useRef<HTMLInputElement>(null)\n    const combinedRef = useForkRef(internalRef, ref)\n    React.useEffect(\n        function setIndeterminate() {\n            if (internalRef.current && typeof indeterminate === 'boolean') {\n                internalRef.current.indeterminate = indeterminate\n            }\n        },\n        [indeterminate],\n    )\n\n    return (\n        <Box\n            as=\"label\"\n            display=\"flex\"\n            alignItems=\"center\"\n            className={[\n                styles.container,\n                disabled ? styles.disabled : null,\n                isChecked ? styles.checked : null,\n                'focus-marker-enabled-within',\n            ]}\n        >\n            <HiddenVisually>\n                <input\n                    {...props}\n                    ref={combinedRef}\n                    type=\"checkbox\"\n                    checked={isChecked}\n                    disabled={disabled}\n                    onChange={(event) => {\n                        onChange?.(event)\n                        if (!event.defaultPrevented) {\n                            setChecked(event.currentTarget.checked)\n                        }\n                    }}\n                />\n            </HiddenVisually>\n            <CheckboxIcon\n                aria-hidden\n                checked={isChecked}\n                indeterminate={indeterminate}\n                disabled={disabled}\n            />\n            {label ? <Text>{label}</Text> : null}\n        </Box>\n    )\n})\n\nexport { CheckboxField }\nexport type { CheckboxFieldProps }\n"],"names":["CheckboxField","React","ref","label","disabled","indeterminate","defaultChecked","onChange","props","isControlledComponent","checked","console","warn","undefined","checkedState","setChecked","isChecked","internalRef","combinedRef","useForkRef","setIndeterminate","current","Box","as","display","alignItems","className","styles","container","HiddenVisually","type","event","defaultPrevented","currentTarget","CheckboxIcon","Text"],"mappings":";;;;;;;;;IAcMA,aAAa,gBAAGC,UAAA,CAAuD,SAASD,aAAT,OAEzEE,GAFyE;;;MACvEC,aAAAA;MAAOC,gBAAAA;MAAUC,qBAAAA;MAAeC,sBAAAA;MAAgBC,iBAAAA;MAAaC;;AAG/D,MAAMC,qBAAqB,GAAG,OAAOD,KAAK,CAACE,OAAb,KAAyB,SAAvD;;AACA,MAAI,OAAOL,aAAP,KAAyB,SAAzB,IAAsC,CAACI,qBAA3C,EAAkE;AAC9D;AACAE,IAAAA,OAAO,CAACC,IAAR,CAAa,sDAAb;AACAP,IAAAA,aAAa,GAAGQ,SAAhB;AACH;;AAED,MAAI,CAACV,KAAD,IAAU,CAACK,KAAK,CAAC,YAAD,CAAhB,IAAkC,CAACA,KAAK,CAAC,iBAAD,CAA5C,EAAiE;AAC7D;AACAG,IAAAA,OAAO,CAACC,IAAR,CAAa,0BAAb;AACH;;wBAEkCX,QAAA,4BAAeO,KAAK,CAACE,OAArB,2DAAgCJ,cAAhC,yCAAkD,KAAlD;MAA5BQ;MAAcC;;AACrB,MAAMC,SAAS,sBAAGR,KAAK,CAACE,OAAT,6DAAoBI,YAAnC;AAEA,MAAMG,WAAW,GAAGhB,MAAA,CAA+B,IAA/B,CAApB;AACA,MAAMiB,WAAW,GAAGC,UAAU,CAACF,WAAD,EAAcf,GAAd,CAA9B;AACAD,EAAAA,SAAA,CACI,SAASmB,gBAAT;AACI,QAAIH,WAAW,CAACI,OAAZ,IAAuB,OAAOhB,aAAP,KAAyB,SAApD,EAA+D;AAC3DY,MAAAA,WAAW,CAACI,OAAZ,CAAoBhB,aAApB,GAAoCA,aAApC;AACH;AACJ,GALL,EAMI,CAACA,aAAD,CANJ;AASA,sBACIJ,aAAA,CAACqB,GAAD;AACIC,IAAAA,EAAE,EAAC;AACHC,IAAAA,OAAO,EAAC;AACRC,IAAAA,UAAU,EAAC;AACXC,IAAAA,SAAS,EAAE,CACPC,MAAM,CAACC,SADA,EAEPxB,QAAQ,GAAGuB,MAAM,CAACvB,QAAV,GAAqB,IAFtB,EAGPY,SAAS,GAAGW,MAAM,CAACjB,OAAV,GAAoB,IAHtB,EAIP,6BAJO;GAJf,eAWIT,aAAA,CAAC4B,cAAD,MAAA,eACI5B,aAAA,QAAA,oBACQO;AACJN,IAAAA,GAAG,EAAEgB;AACLY,IAAAA,IAAI,EAAC;AACLpB,IAAAA,OAAO,EAAEM;AACTZ,IAAAA,QAAQ,EAAEA;AACVG,IAAAA,QAAQ,EAAE,kBAACwB,KAAD;AACNxB,MAAAA,SAAQ,SAAR,IAAAA,SAAQ,WAAR,YAAAA,SAAQ,CAAGwB,KAAH,CAAR;;AACA,UAAI,CAACA,KAAK,CAACC,gBAAX,EAA6B;AACzBjB,QAAAA,UAAU,CAACgB,KAAK,CAACE,aAAN,CAAoBvB,OAArB,CAAV;AACH;AACJ;IAXL,CADJ,CAXJ,eA0BIT,aAAA,CAACiC,YAAD;;AAEIxB,IAAAA,OAAO,EAAEM;AACTX,IAAAA,aAAa,EAAEA;AACfD,IAAAA,QAAQ,EAAEA;GAJd,CA1BJ,EAgCKD,KAAK,gBAAGF,aAAA,CAACkC,IAAD,MAAA,EAAOhC,KAAP,CAAH,GAA0B,IAhCpC,CADJ;AAoCH,CAlEqB;;;;"}
+{"version":3,"file":"checkbox-field.js","sources":["../../../src/new-components/checkbox-field/checkbox-field.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useForkRef } from 'reakit-utils'\nimport { Box } from '../box'\nimport { Text } from '../text'\nimport { CheckboxIcon } from './checkbox-icon'\n\nimport styles from './checkbox-field.module.css'\n\ntype CheckboxFieldProps = Omit<\n    JSX.IntrinsicElements['input'],\n    | 'type'\n    | 'className'\n    | 'disabled'\n    | 'aria-controls'\n    | 'aria-describedby'\n    | 'aria-label'\n    | 'aria-labelledby'\n> & {\n    'aria-checked'?: never\n    /** Identifies the set of checkboxes controlled by the mixed checkbox for assistive technologies. */\n    'aria-controls'?: string\n    /** Identifies the element (or elements) that describes the checkbox for assistive technologies. */\n    'aria-describedby'?: string\n    /** Defines a string value that labels the current checkbox for assistive technologies. */\n    'aria-label'?: string\n    /** Identifies the element (or elements) that labels the current checkbox for assistive technologies. */\n    'aria-labelledby'?: string\n    /** Defines whether or not the checkbox is disabled. */\n    disabled?: boolean\n    /** The label for the checkbox element. */\n    label?: string\n    /** Defines whether or not the checkbox can be of a `mixed` state. */\n    indeterminate?: boolean\n}\n\nconst CheckboxField = React.forwardRef<HTMLInputElement, CheckboxFieldProps>(function CheckboxField(\n    { label, disabled, indeterminate, defaultChecked, onChange, ...props },\n    ref,\n) {\n    const isControlledComponent = typeof props.checked === 'boolean'\n    if (typeof indeterminate === 'boolean' && !isControlledComponent) {\n        // eslint-disable-next-line no-console\n        console.warn('Cannot use indeterminate on an uncontrolled checkbox')\n        indeterminate = undefined\n    }\n\n    if (!label && !props['aria-label'] && !props['aria-labelledby']) {\n        // eslint-disable-next-line no-console\n        console.warn('A Checkbox needs a label')\n    }\n\n    const [keyFocused, setKeyFocused] = React.useState(false)\n    const [checkedState, setChecked] = React.useState(props.checked ?? defaultChecked ?? false)\n    const isChecked = props.checked ?? checkedState\n\n    const internalRef = React.useRef<HTMLInputElement>(null)\n    const combinedRef = useForkRef(internalRef, ref)\n    React.useEffect(\n        function setIndeterminate() {\n            if (internalRef.current && typeof indeterminate === 'boolean') {\n                internalRef.current.indeterminate = indeterminate\n            }\n        },\n        [indeterminate],\n    )\n\n    return (\n        <Box\n            as=\"label\"\n            display=\"flex\"\n            alignItems=\"center\"\n            className={[\n                styles.container,\n                disabled ? styles.disabled : null,\n                isChecked ? styles.checked : null,\n                keyFocused ? styles.keyFocused : null,\n            ]}\n        >\n            <input\n                {...props}\n                ref={combinedRef}\n                type=\"checkbox\"\n                aria-checked={indeterminate ? 'mixed' : isChecked}\n                checked={isChecked}\n                disabled={disabled}\n                onChange={(event) => {\n                    onChange?.(event)\n                    if (!event.defaultPrevented) {\n                        setChecked(event.currentTarget.checked)\n                    }\n                }}\n                onBlur={(event) => {\n                    setKeyFocused(false)\n                    props?.onBlur?.(event)\n                }}\n                onKeyUp={(event) => {\n                    setKeyFocused(true)\n                    props?.onKeyUp?.(event)\n                }}\n            />\n            <CheckboxIcon\n                checked={isChecked}\n                disabled={disabled}\n                indeterminate={indeterminate}\n                aria-hidden\n            />\n            {label ? <Text>{label}</Text> : null}\n        </Box>\n    )\n})\n\nexport { CheckboxField }\nexport type { CheckboxFieldProps }\n"],"names":["CheckboxField","React","ref","label","disabled","indeterminate","defaultChecked","onChange","props","isControlledComponent","checked","console","warn","undefined","keyFocused","setKeyFocused","checkedState","setChecked","isChecked","internalRef","combinedRef","useForkRef","setIndeterminate","current","Box","as","display","alignItems","className","styles","container","type","event","defaultPrevented","currentTarget","onBlur","onKeyUp","CheckboxIcon","Text"],"mappings":"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"}

package/es/new-components/checkbox-field/checkbox-field.module.css.js

@@ -1,4 +1,4 @@
-var modules_664a6a80 = {"container":"f9e0a1b8","disabled":"_01411889","checked":"ffdfd8fb"};
+var modules_664a6a80 = {"container":"_96c4d12f","disabled":"_5048e2a5","checked":"_42187b48","keyFocused":"_3510166f"};
 
 export default modules_664a6a80;
 //# sourceMappingURL=checkbox-field.module.css.js.map

package/es/new-components/checkbox-field/checkbox-icon.js

@@ -1,6 +1,7 @@
 import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { createElement } from 'react';
 
+var _excluded = ["checked", "indeterminate", "disabled"];
 var svgPath = {
   checked: 'M18 4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h12zm-2.457 4.293l-5.293 5.293-1.793-1.793a1 1 0 1 0-1.414 1.414l2.5 2.5a1 1 0 0 0 1.414 0l6-6a1 1 0 1 0-1.414-1.414z',
   unchecked: 'M18 4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h12zm0 1H6a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1z',
@@ -37,7 +38,7 @@ function CheckboxIcon(_ref2) {
   var checked = _ref2.checked,
       indeterminate = _ref2.indeterminate,
       disabled = _ref2.disabled,
-      props = _objectWithoutPropertiesLoose(_ref2, ["checked", "indeterminate", "disabled"]);
+      props = _objectWithoutPropertiesLoose(_ref2, _excluded);
 
   var pathKey = getPathKey({
     checked: checked,

package/es/new-components/checkbox-field/checkbox-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-icon.js","sources":["../../../src/new-components/checkbox-field/checkbox-icon.tsx"],"sourcesContent":["import * as React from 'react'\n\nconst svgPath = {\n    checked:\n        'M18 4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h12zm-2.457 4.293l-5.293 5.293-1.793-1.793a1 1 0 1 0-1.414 1.414l2.5 2.5a1 1 0 0 0 1.414 0l6-6a1 1 0 1 0-1.414-1.414z',\n    unchecked:\n        'M18 4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h12zm0 1H6a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1z',\n    mixed:\n        'M18 4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h12zm-2 7H8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2z',\n    filled:\n        'M6 4H18C19.1046 4 20 4.89543 20 6V18C20 19.1046 19.1046 20 18 20H6C4.89543 20 4 19.1046 4 18V6C4 4.89543 4.89543 4 6 4Z',\n} as const\n\ntype Props = React.SVGProps<SVGSVGElement> & {\n    checked?: boolean\n    indeterminate?: boolean\n    disabled?: boolean\n}\n\nfunction getPathKey({ checked, indeterminate, disabled }: Props): keyof typeof svgPath {\n    if (indeterminate) {\n        return 'mixed' // indeterminate, when true, overrides the checked state\n    }\n\n    if (checked) {\n        return 'checked'\n    }\n\n    // We only used 'filled' when unchecked AND disabled, because the default unchecked icon\n    // is not enough to convey the disabled state with opacity alone. For all other cases\n    // above, when disabled, we use the same icon the corresponds to that state, and the\n    // opacity conveys the fact that the checkbox is disabled.\n    // See https://twist.com/a/1585/ch/414345/t/2257308/c/65201390\n    if (disabled) {\n        return 'filled'\n    }\n\n    return 'unchecked'\n}\n\nfunction CheckboxIcon({ checked, indeterminate, disabled, ...props }: Props) {\n    const pathKey = getPathKey({ checked, indeterminate, disabled })\n    return (\n        <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            width=\"24\"\n            height=\"24\"\n            viewBox=\"0 0 24 24\"\n            {...props}\n        >\n            <path fill=\"currentColor\" fillRule=\"nonzero\" d={svgPath[pathKey]} />\n        </svg>\n    )\n}\n\nexport { CheckboxIcon }\n"],"names":["svgPath","checked","unchecked","mixed","filled","getPathKey","indeterminate","disabled","CheckboxIcon","props","pathKey","React","xmlns","width","height","viewBox","fill","fillRule","d"],"mappings":";;;AAEA,IAAMA,OAAO,GAAG;AACZC,EAAAA,OAAO,EACH,2LAFQ;AAGZC,EAAAA,SAAS,EACL,iJAJQ;AAKZC,EAAAA,KAAK,EACD,gHANQ;AAOZC,EAAAA,MAAM,EACF;AARQ,CAAhB;;AAiBA,SAASC,UAAT;MAAsBJ,eAAAA;MAASK,qBAAAA;MAAeC,gBAAAA;;AAC1C,MAAID,aAAJ,EAAmB;AACf,WAAO,OAAP,CADe;AAElB;;AAED,MAAIL,OAAJ,EAAa;AACT,WAAO,SAAP;AACH;AAGD;AACA;AACA;AACA;;;AACA,MAAIM,QAAJ,EAAc;AACV,WAAO,QAAP;AACH;;AAED,SAAO,WAAP;AACH;;AAED,SAASC,YAAT;MAAwBP,gBAAAA;MAASK,sBAAAA;MAAeC,iBAAAA;MAAaE;;AACzD,MAAMC,OAAO,GAAGL,UAAU,CAAC;AAAEJ,IAAAA,OAAO,EAAPA,OAAF;AAAWK,IAAAA,aAAa,EAAbA,aAAX;AAA0BC,IAAAA,QAAQ,EAARA;AAA1B,GAAD,CAA1B;AACA,sBACII,aAAA,MAAA;AACIC,IAAAA,KAAK,EAAC;AACNC,IAAAA,KAAK,EAAC;AACNC,IAAAA,MAAM,EAAC;AACPC,IAAAA,OAAO,EAAC;KACJN,MALR,eAOIE,aAAA,OAAA;AAAMK,IAAAA,IAAI,EAAC;AAAeC,IAAAA,QAAQ,EAAC;AAAUC,IAAAA,CAAC,EAAElB,OAAO,CAACU,OAAD;GAAvD,CAPJ,CADJ;AAWH;;;;"}
+{"version":3,"file":"checkbox-icon.js","sources":["../../../src/new-components/checkbox-field/checkbox-icon.tsx"],"sourcesContent":["import * as React from 'react'\n\nconst svgPath = {\n    checked:\n        'M18 4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h12zm-2.457 4.293l-5.293 5.293-1.793-1.793a1 1 0 1 0-1.414 1.414l2.5 2.5a1 1 0 0 0 1.414 0l6-6a1 1 0 1 0-1.414-1.414z',\n    unchecked:\n        'M18 4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h12zm0 1H6a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1z',\n    mixed:\n        'M18 4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h12zm-2 7H8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2z',\n    filled:\n        'M6 4H18C19.1046 4 20 4.89543 20 6V18C20 19.1046 19.1046 20 18 20H6C4.89543 20 4 19.1046 4 18V6C4 4.89543 4.89543 4 6 4Z',\n} as const\n\ntype Props = React.SVGProps<SVGSVGElement> & {\n    checked?: boolean\n    indeterminate?: boolean\n    disabled?: boolean\n}\n\nfunction getPathKey({ checked, indeterminate, disabled }: Props): keyof typeof svgPath {\n    if (indeterminate) {\n        return 'mixed' // indeterminate, when true, overrides the checked state\n    }\n\n    if (checked) {\n        return 'checked'\n    }\n\n    // We only used 'filled' when unchecked AND disabled, because the default unchecked icon\n    // is not enough to convey the disabled state with opacity alone. For all other cases\n    // above, when disabled, we use the same icon the corresponds to that state, and the\n    // opacity conveys the fact that the checkbox is disabled.\n    // See https://twist.com/a/1585/ch/414345/t/2257308/c/65201390\n    if (disabled) {\n        return 'filled'\n    }\n\n    return 'unchecked'\n}\n\nfunction CheckboxIcon({ checked, indeterminate, disabled, ...props }: Props) {\n    const pathKey = getPathKey({ checked, indeterminate, disabled })\n    return (\n        <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            width=\"24\"\n            height=\"24\"\n            viewBox=\"0 0 24 24\"\n            {...props}\n        >\n            <path fill=\"currentColor\" fillRule=\"nonzero\" d={svgPath[pathKey]} />\n        </svg>\n    )\n}\n\nexport { CheckboxIcon }\n"],"names":["svgPath","checked","unchecked","mixed","filled","getPathKey","indeterminate","disabled","CheckboxIcon","props","pathKey","React","xmlns","width","height","viewBox","fill","fillRule","d"],"mappings":";;;;AAEA,IAAMA,OAAO,GAAG;AACZC,EAAAA,OAAO,EACH,2LAFQ;AAGZC,EAAAA,SAAS,EACL,iJAJQ;AAKZC,EAAAA,KAAK,EACD,gHANQ;AAOZC,EAAAA,MAAM,EACF;AARQ,CAAhB;;AAiBA,SAASC,UAAT;MAAsBJ,eAAAA;MAASK,qBAAAA;MAAeC,gBAAAA;;AAC1C,MAAID,aAAJ,EAAmB;AACf,WAAO,OAAP,CADe;AAElB;;AAED,MAAIL,OAAJ,EAAa;AACT,WAAO,SAAP;AACH;AAGD;AACA;AACA;AACA;;;AACA,MAAIM,QAAJ,EAAc;AACV,WAAO,QAAP;AACH;;AAED,SAAO,WAAP;AACH;;AAED,SAASC,YAAT;MAAwBP,gBAAAA;MAASK,sBAAAA;MAAeC,iBAAAA;MAAaE;;AACzD,MAAMC,OAAO,GAAGL,UAAU,CAAC;AAAEJ,IAAAA,OAAO,EAAPA,OAAF;AAAWK,IAAAA,aAAa,EAAbA,aAAX;AAA0BC,IAAAA,QAAQ,EAARA;AAA1B,GAAD,CAA1B;AACA,sBACII,aAAA,MAAA;AACIC,IAAAA,KAAK,EAAC;AACNC,IAAAA,KAAK,EAAC;AACNC,IAAAA,MAAM,EAAC;AACPC,IAAAA,OAAO,EAAC;KACJN,MALR,eAOIE,aAAA,OAAA;AAAMK,IAAAA,IAAI,EAAC;AAAeC,IAAAA,QAAQ,EAAC;AAAUC,IAAAA,CAAC,EAAElB,OAAO,CAACU,OAAD;GAAvD,CAPJ,CADJ;AAWH;;;;"}

package/es/new-components/columns/columns.js

@@ -5,12 +5,14 @@ import { getClassNames, mapResponsiveProp } from '../responsive-props.js';
 import { Box } from '../box/box.js';
 import styles from './columns.module.css.js';
 
+var _excluded = ["width", "children", "exceptionallySetClassName"],
+    _excluded2 = ["space", "align", "alignY", "collapseBelow", "children", "exceptionallySetClassName"];
 var Column = /*#__PURE__*/polymorphicComponent(function Column(_ref, ref) {
   var _ref$width = _ref.width,
       width = _ref$width === void 0 ? 'auto' : _ref$width,
       children = _ref.children,
       exceptionallySetClassName = _ref.exceptionallySetClassName,
-      props = _objectWithoutPropertiesLoose(_ref, ["width", "children", "exceptionallySetClassName"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/createElement(Box, Object.assign({}, props, {
     className: [exceptionallySetClassName, styles.column, width !== 'content' ? getClassNames(styles, 'columnWidth', width.replace('/', '-')) : null],
@@ -30,7 +32,7 @@ var Columns = /*#__PURE__*/polymorphicComponent(function Columns(_ref2, ref) {
       collapseBelow = _ref2.collapseBelow,
       children = _ref2.children,
       exceptionallySetClassName = _ref2.exceptionallySetClassName,
-      props = _objectWithoutPropertiesLoose(_ref2, ["space", "align", "alignY", "collapseBelow", "children", "exceptionallySetClassName"]);
+      props = _objectWithoutPropertiesLoose(_ref2, _excluded2);
 
   return /*#__PURE__*/createElement(Box, Object.assign({}, props, {
     className: [exceptionallySetClassName, getClassNames(styles, 'space', space)],

package/es/new-components/columns/columns.js.map

@@ -1 +1 @@
-{"version":3,"file":"columns.js","sources":["../../../src/new-components/columns/columns.tsx"],"sourcesContent":["import * as React from 'react'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { getClassNames, mapResponsiveProp } from '../responsive-props'\nimport { Box } from '../box'\n\nimport type { ResponsiveProp, ResponsiveBreakpoints } from '../responsive-props'\nimport type { Space } from '../common-types'\nimport type { ReusableBoxProps } from '../box'\n\nimport styles from './columns.module.css'\n\ntype ColumnWidth =\n    | 'auto'\n    | 'content'\n    | '1/2'\n    | '1/3'\n    | '2/3'\n    | '1/4'\n    | '3/4'\n    | '1/5'\n    | '2/5'\n    | '3/5'\n    | '4/5'\n\ninterface ColumnProps {\n    width?: ColumnWidth\n}\n\nconst Column = polymorphicComponent<'div', ColumnProps>(function Column(\n    { width = 'auto', children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    return (\n        <Box\n            {...props}\n            className={[\n                exceptionallySetClassName,\n                styles.column,\n                width !== 'content'\n                    ? getClassNames(styles, 'columnWidth', width.replace('/', '-'))\n                    : null,\n            ]}\n            minWidth={0}\n            width={width !== 'content' ? 'full' : undefined}\n            height=\"full\"\n            flexShrink={width === 'content' ? 0 : undefined}\n            ref={ref}\n        >\n            {children}\n        </Box>\n    )\n})\n\ntype ColumnsHorizontalAlignment = 'left' | 'center' | 'right'\ntype ColumnsVerticalAlignment = 'top' | 'center' | 'bottom' | 'baseline'\ntype ColumnsCollapseBelow = Exclude<ResponsiveBreakpoints, 'mobile'>\n\ninterface ColumnsProps extends ReusableBoxProps {\n    space?: ResponsiveProp<Space>\n    align?: ResponsiveProp<ColumnsHorizontalAlignment>\n    alignY?: ResponsiveProp<ColumnsVerticalAlignment>\n    collapseBelow?: ResponsiveBreakpoints\n}\n\nconst Columns = polymorphicComponent<'div', ColumnsProps>(function Columns(\n    {\n        space,\n        align = 'left',\n        alignY = 'top',\n        collapseBelow,\n        children,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <Box\n            {...props}\n            className={[exceptionallySetClassName, getClassNames(styles, 'space', space)]}\n            display=\"flex\"\n            flexDirection={\n                collapseBelow === 'desktop'\n                    ? { mobile: 'column', tablet: 'column', desktop: 'row' }\n                    : collapseBelow === 'tablet'\n                    ? { mobile: 'column', tablet: 'row' }\n                    : 'row'\n            }\n            alignItems={mapResponsiveProp(alignY, (alignY) =>\n                alignY === 'top' ? 'flexStart' : alignY === 'bottom' ? 'flexEnd' : alignY,\n            )}\n            justifyContent={mapResponsiveProp(align, (align) =>\n                align === 'left' ? 'flexStart' : align === 'right' ? 'flexEnd' : align,\n            )}\n            ref={ref}\n        >\n            {children}\n        </Box>\n    )\n})\n\nexport type {\n    ColumnProps,\n    ColumnsProps,\n    ColumnWidth,\n    ColumnsCollapseBelow,\n    ColumnsHorizontalAlignment,\n    ColumnsVerticalAlignment,\n}\n\nexport { Column, Columns }\n"],"names":["Column","polymorphicComponent","ref","width","children","exceptionallySetClassName","props","React","Box","className","styles","column","getClassNames","replace","minWidth","undefined","height","flexShrink","Columns","space","align","alignY","collapseBelow","display","flexDirection","mobile","tablet","desktop","alignItems","mapResponsiveProp","justifyContent"],"mappings":";;;;;;;IA4BMA,MAAM,gBAAGC,oBAAoB,CAAqB,SAASD,MAAT,OAEpDE,GAFoD;wBAClDC;MAAAA,gCAAQ;MAAQC,gBAAAA;MAAUC,iCAAAA;MAA8BC;;AAG1D,sBACIC,aAAA,CAACC,GAAD,oBACQF;AACJG,IAAAA,SAAS,EAAE,CACPJ,yBADO,EAEPK,MAAM,CAACC,MAFA,EAGPR,KAAK,KAAK,SAAV,GACMS,aAAa,CAACF,MAAD,EAAS,aAAT,EAAwBP,KAAK,CAACU,OAAN,CAAc,GAAd,EAAmB,GAAnB,CAAxB,CADnB,GAEM,IALC;AAOXC,IAAAA,QAAQ,EAAE;AACVX,IAAAA,KAAK,EAAEA,KAAK,KAAK,SAAV,GAAsB,MAAtB,GAA+BY;AACtCC,IAAAA,MAAM,EAAC;AACPC,IAAAA,UAAU,EAAEd,KAAK,KAAK,SAAV,GAAsB,CAAtB,GAA0BY;AACtCb,IAAAA,GAAG,EAAEA;IAbT,EAeKE,QAfL,CADJ;AAmBH,CAvBkC;IAoC7Bc,OAAO,gBAAGjB,oBAAoB,CAAsB,SAASiB,OAAT,QAUtDhB,GAVsD;MAElDiB,cAAAA;0BACAC;MAAAA,iCAAQ;2BACRC;MAAAA,mCAAS;MACTC,sBAAAA;MACAlB,iBAAAA;MACAC,kCAAAA;MACGC;;AAIP,sBACIC,aAAA,CAACC,GAAD,oBACQF;AACJG,IAAAA,SAAS,EAAE,CAACJ,yBAAD,EAA4BO,aAAa,CAACF,MAAD,EAAS,OAAT,EAAkBS,KAAlB,CAAzC;AACXI,IAAAA,OAAO,EAAC;AACRC,IAAAA,aAAa,EACTF,aAAa,KAAK,SAAlB,GACM;AAAEG,MAAAA,MAAM,EAAE,QAAV;AAAoBC,MAAAA,MAAM,EAAE,QAA5B;AAAsCC,MAAAA,OAAO,EAAE;AAA/C,KADN,GAEML,aAAa,KAAK,QAAlB,GACA;AAAEG,MAAAA,MAAM,EAAE,QAAV;AAAoBC,MAAAA,MAAM,EAAE;AAA5B,KADA,GAEA;AAEVE,IAAAA,UAAU,EAAEC,iBAAiB,CAACR,MAAD,EAAS,UAACA,MAAD;AAAA,aAClCA,MAAM,KAAK,KAAX,GAAmB,WAAnB,GAAiCA,MAAM,KAAK,QAAX,GAAsB,SAAtB,GAAkCA,MADjC;AAAA,KAAT;AAG7BS,IAAAA,cAAc,EAAED,iBAAiB,CAACT,KAAD,EAAQ,UAACA,KAAD;AAAA,aACrCA,KAAK,KAAK,MAAV,GAAmB,WAAnB,GAAiCA,KAAK,KAAK,OAAV,GAAoB,SAApB,GAAgCA,KAD5B;AAAA,KAAR;AAGjClB,IAAAA,GAAG,EAAEA;IAjBT,EAmBKE,QAnBL,CADJ;AAuBH,CAnCmC;;;;"}
+{"version":3,"file":"columns.js","sources":["../../../src/new-components/columns/columns.tsx"],"sourcesContent":["import * as React from 'react'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { getClassNames, mapResponsiveProp } from '../responsive-props'\nimport { Box } from '../box'\n\nimport type { ResponsiveProp, ResponsiveBreakpoints } from '../responsive-props'\nimport type { Space } from '../common-types'\nimport type { ReusableBoxProps } from '../box'\n\nimport styles from './columns.module.css'\n\ntype ColumnWidth =\n    | 'auto'\n    | 'content'\n    | '1/2'\n    | '1/3'\n    | '2/3'\n    | '1/4'\n    | '3/4'\n    | '1/5'\n    | '2/5'\n    | '3/5'\n    | '4/5'\n\ninterface ColumnProps {\n    width?: ColumnWidth\n}\n\nconst Column = polymorphicComponent<'div', ColumnProps>(function Column(\n    { width = 'auto', children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    return (\n        <Box\n            {...props}\n            className={[\n                exceptionallySetClassName,\n                styles.column,\n                width !== 'content'\n                    ? getClassNames(styles, 'columnWidth', width.replace('/', '-'))\n                    : null,\n            ]}\n            minWidth={0}\n            width={width !== 'content' ? 'full' : undefined}\n            height=\"full\"\n            flexShrink={width === 'content' ? 0 : undefined}\n            ref={ref}\n        >\n            {children}\n        </Box>\n    )\n})\n\ntype ColumnsHorizontalAlignment = 'left' | 'center' | 'right'\ntype ColumnsVerticalAlignment = 'top' | 'center' | 'bottom' | 'baseline'\ntype ColumnsCollapseBelow = Exclude<ResponsiveBreakpoints, 'mobile'>\n\ninterface ColumnsProps extends ReusableBoxProps {\n    space?: ResponsiveProp<Space>\n    align?: ResponsiveProp<ColumnsHorizontalAlignment>\n    alignY?: ResponsiveProp<ColumnsVerticalAlignment>\n    collapseBelow?: ResponsiveBreakpoints\n}\n\nconst Columns = polymorphicComponent<'div', ColumnsProps>(function Columns(\n    {\n        space,\n        align = 'left',\n        alignY = 'top',\n        collapseBelow,\n        children,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <Box\n            {...props}\n            className={[exceptionallySetClassName, getClassNames(styles, 'space', space)]}\n            display=\"flex\"\n            flexDirection={\n                collapseBelow === 'desktop'\n                    ? { mobile: 'column', tablet: 'column', desktop: 'row' }\n                    : collapseBelow === 'tablet'\n                    ? { mobile: 'column', tablet: 'row' }\n                    : 'row'\n            }\n            alignItems={mapResponsiveProp(alignY, (alignY) =>\n                alignY === 'top' ? 'flexStart' : alignY === 'bottom' ? 'flexEnd' : alignY,\n            )}\n            justifyContent={mapResponsiveProp(align, (align) =>\n                align === 'left' ? 'flexStart' : align === 'right' ? 'flexEnd' : align,\n            )}\n            ref={ref}\n        >\n            {children}\n        </Box>\n    )\n})\n\nexport type {\n    ColumnProps,\n    ColumnsProps,\n    ColumnWidth,\n    ColumnsCollapseBelow,\n    ColumnsHorizontalAlignment,\n    ColumnsVerticalAlignment,\n}\n\nexport { Column, Columns }\n"],"names":["Column","polymorphicComponent","ref","width","children","exceptionallySetClassName","props","React","Box","className","styles","column","getClassNames","replace","minWidth","undefined","height","flexShrink","Columns","space","align","alignY","collapseBelow","display","flexDirection","mobile","tablet","desktop","alignItems","mapResponsiveProp","justifyContent"],"mappings":";;;;;;;;;IA4BMA,MAAM,gBAAGC,oBAAoB,CAAqB,SAASD,MAAT,OAEpDE,GAFoD;wBAClDC;MAAAA,gCAAQ;MAAQC,gBAAAA;MAAUC,iCAAAA;MAA8BC;;AAG1D,sBACIC,aAAA,CAACC,GAAD,oBACQF;AACJG,IAAAA,SAAS,EAAE,CACPJ,yBADO,EAEPK,MAAM,CAACC,MAFA,EAGPR,KAAK,KAAK,SAAV,GACMS,aAAa,CAACF,MAAD,EAAS,aAAT,EAAwBP,KAAK,CAACU,OAAN,CAAc,GAAd,EAAmB,GAAnB,CAAxB,CADnB,GAEM,IALC;AAOXC,IAAAA,QAAQ,EAAE;AACVX,IAAAA,KAAK,EAAEA,KAAK,KAAK,SAAV,GAAsB,MAAtB,GAA+BY;AACtCC,IAAAA,MAAM,EAAC;AACPC,IAAAA,UAAU,EAAEd,KAAK,KAAK,SAAV,GAAsB,CAAtB,GAA0BY;AACtCb,IAAAA,GAAG,EAAEA;IAbT,EAeKE,QAfL,CADJ;AAmBH,CAvBkC;IAoC7Bc,OAAO,gBAAGjB,oBAAoB,CAAsB,SAASiB,OAAT,QAUtDhB,GAVsD;MAElDiB,cAAAA;0BACAC;MAAAA,iCAAQ;2BACRC;MAAAA,mCAAS;MACTC,sBAAAA;MACAlB,iBAAAA;MACAC,kCAAAA;MACGC;;AAIP,sBACIC,aAAA,CAACC,GAAD,oBACQF;AACJG,IAAAA,SAAS,EAAE,CAACJ,yBAAD,EAA4BO,aAAa,CAACF,MAAD,EAAS,OAAT,EAAkBS,KAAlB,CAAzC;AACXI,IAAAA,OAAO,EAAC;AACRC,IAAAA,aAAa,EACTF,aAAa,KAAK,SAAlB,GACM;AAAEG,MAAAA,MAAM,EAAE,QAAV;AAAoBC,MAAAA,MAAM,EAAE,QAA5B;AAAsCC,MAAAA,OAAO,EAAE;AAA/C,KADN,GAEML,aAAa,KAAK,QAAlB,GACA;AAAEG,MAAAA,MAAM,EAAE,QAAV;AAAoBC,MAAAA,MAAM,EAAE;AAA5B,KADA,GAEA;AAEVE,IAAAA,UAAU,EAAEC,iBAAiB,CAACR,MAAD,EAAS,UAACA,MAAD;AAAA,aAClCA,MAAM,KAAK,KAAX,GAAmB,WAAnB,GAAiCA,MAAM,KAAK,QAAX,GAAsB,SAAtB,GAAkCA,MADjC;AAAA,KAAT;AAG7BS,IAAAA,cAAc,EAAED,iBAAiB,CAACT,KAAD,EAAQ,UAACA,KAAD;AAAA,aACrCA,KAAK,KAAK,MAAV,GAAmB,WAAnB,GAAiCA,KAAK,KAAK,OAAV,GAAoB,SAApB,GAAgCA,KAD5B;AAAA,KAAR;AAGjClB,IAAAA,GAAG,EAAEA;IAjBT,EAmBKE,QAnBL,CADJ;AAuBH,CAnCmC;;;;"}

package/es/new-components/divider/divider.js

@@ -4,14 +4,16 @@ import { getClassNames } from '../responsive-props.js';
 import { Box } from '../box/box.js';
 import styles from './divider.module.css.js';
 
+var _excluded = ["weight"];
+
 function Divider(_ref) {
   var _ref$weight = _ref.weight,
-      weight = _ref$weight === void 0 ? 'regular' : _ref$weight,
-      props = _objectWithoutPropertiesLoose(_ref, ["weight"]);
+      weight = _ref$weight === void 0 ? 'tertiary' : _ref$weight,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/createElement(Box, Object.assign({
     as: "hr",
-    className: [styles.divider, weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null]
+    className: getClassNames(styles, 'weight', weight)
   }, props));
 }
 

package/es/new-components/divider/divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"divider.js","sources":["../../../src/new-components/divider/divider.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../responsive-props'\nimport { Box } from '../box'\n\nimport styles from './divider.module.css'\n\ntype DividerWeight = 'regular' | 'strong'\n\ninterface DividerProps {\n    weight?: DividerWeight\n}\n\nfunction Divider({ weight = 'regular', ...props }: DividerProps) {\n    return (\n        <Box\n            as=\"hr\"\n            className={[\n                styles.divider,\n                weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null,\n            ]}\n            {...props}\n        />\n    )\n}\n\nexport type { DividerProps, DividerWeight }\nexport { Divider }\n"],"names":["Divider","weight","props","React","Box","as","className","styles","divider","getClassNames"],"mappings":";;;;;;AAYA,SAASA,OAAT;yBAAmBC;MAAAA,kCAAS;MAAcC;;AACtC,sBACIC,aAAA,CAACC,GAAD;AACIC,IAAAA,EAAE,EAAC;AACHC,IAAAA,SAAS,EAAE,CACPC,MAAM,CAACC,OADA,EAEPP,MAAM,KAAK,SAAX,GAAuBQ,aAAa,CAACF,MAAD,EAAS,QAAT,EAAmBN,MAAnB,CAApC,GAAiE,IAF1D;KAIPC,MANR,CADJ;AAUH;;;;"}
+{"version":3,"file":"divider.js","sources":["../../../src/new-components/divider/divider.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../responsive-props'\nimport { Box } from '../box'\nimport type { DividerWeight } from '../common-types'\n\nimport styles from './divider.module.css'\n\ninterface DividerProps {\n    weight?: Exclude<DividerWeight, 'none'>\n}\n\nfunction Divider({ weight = 'tertiary', ...props }: DividerProps) {\n    return <Box as=\"hr\" className={getClassNames(styles, 'weight', weight)} {...props} />\n}\n\nexport type { DividerProps, DividerWeight }\nexport { Divider }\n"],"names":["Divider","weight","props","React","Box","as","className","getClassNames","styles"],"mappings":";;;;;;;;AAWA,SAASA,OAAT;yBAAmBC;MAAAA,kCAAS;MAAeC;;AACvC,sBAAOC,aAAA,CAACC,GAAD;AAAKC,IAAAA,EAAE,EAAC;AAAKC,IAAAA,SAAS,EAAEC,aAAa,CAACC,MAAD,EAAS,QAAT,EAAmBP,MAAnB;KAAgCC,MAArE,CAAP;AACH;;;;"}

package/es/new-components/divider/divider.module.css.js

@@ -1,4 +1,4 @@
-var modules_c742c4d7 = {"divider":"_9b6c04bf","weight-strong":"_6354eb7c"};
+var modules_c742c4d7 = {"weight-primary":"_3f3a401c","weight-secondary":"_03b05b70","weight-tertiary":"b6f67ff8"};
 
 export default modules_c742c4d7;
 //# sourceMappingURL=divider.module.css.js.map

package/es/new-components/heading/heading.js

@@ -4,6 +4,7 @@ import { getClassNames } from '../responsive-props.js';
 import { Box } from '../box/box.js';
 import styles from './heading.module.css.js';
 
+var _excluded = ["level", "weight", "size", "tone", "children", "lineClamp", "align", "exceptionallySetClassName"];
 var Heading = /*#__PURE__*/forwardRef(function Heading(_ref, ref) {
   var level = _ref.level,
       _ref$weight = _ref.weight,
@@ -15,7 +16,7 @@ var Heading = /*#__PURE__*/forwardRef(function Heading(_ref, ref) {
       lineClamp = _ref.lineClamp,
       align = _ref.align,
       exceptionallySetClassName = _ref.exceptionallySetClassName,
-      props = _objectWithoutPropertiesLoose(_ref, ["level", "weight", "size", "tone", "children", "lineClamp", "align", "exceptionallySetClassName"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   // In TypeScript v4.1, this would be properly recognized without needing the type assertion
   // https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/#template-literal-types

package/es/new-components/heading/heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"heading.js","sources":["../../../src/new-components/heading/heading.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../responsive-props'\nimport { Box } from '../box'\nimport styles from './heading.module.css'\nimport type { ObfuscatedClassName } from '../../utils/polymorphism'\nimport type { Tone } from '../common-types'\nimport type { BoxProps } from '../box'\n\ntype HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6 | '1' | '2' | '3' | '4' | '5' | '6'\ntype HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n\ntype SupportedHeadingElementProps = Omit<\n    JSX.IntrinsicElements[HeadingElement],\n    'className' | 'children'\n>\n\ntype HeadingProps = SupportedHeadingElementProps & {\n    children: React.ReactNode\n    /**\n     * The semantic level of the heading.\n     */\n    level: HeadingLevel\n    /**\n     * The weight of the heading. Used to de-emphasize the heading visually when using 'light'.\n     *\n     * @default 'regular'\n     */\n    weight?: 'regular' | 'light'\n    /**\n     * Shifts the default heading visual text size up or down, depending on the original size\n     * imposed by the `level`. The heading continues to be semantically at the given level.\n     *\n     * By default, no value is applied, and the default size from the level is applied. The values\n     * have the following effect:\n     *\n     * - 'smaller' shifts the default level size down in the font-size scale (it tends to make the\n     * level look visually as if it were of the immediately lower level).\n     * - 'larger' has the opposite effect than 'smaller' shifting the visual font size up in the\n     * scale.\n     * - 'largest' can be thought of as applying 'larger' twice.\n     *\n     * @see level\n     * @default undefined\n     */\n    size?: 'smaller' | 'larger' | 'largest'\n    /**\n     * The tone (semantic color) of the heading.\n     *\n     * @default 'normal'\n     */\n    tone?: Tone\n    /**\n     * Used to truncate the heading to a given number of lines.\n     *\n     * It will add an ellipsis (`…`) to the text at the end of the last line, only if the text was\n     * truncated. If the text fits without it being truncated, no ellipsis is added.\n     *\n     * By default, the text is not truncated at all, no matter how many lines it takes to render it.\n     *\n     * @default undefined\n     */\n    lineClamp?: 1 | 2 | 3 | 4 | 5 | '1' | '2' | '3' | '4' | '5'\n    /**\n     * How to align the heading text horizontally.\n     *\n     * @default 'start'\n     */\n    align?: BoxProps['textAlign']\n}\n\nconst Heading = React.forwardRef<HTMLHeadingElement, HeadingProps & ObfuscatedClassName>(\n    function Heading(\n        {\n            level,\n            weight = 'regular',\n            size,\n            tone = 'normal',\n            children,\n            lineClamp,\n            align,\n            exceptionallySetClassName,\n            ...props\n        },\n        ref,\n    ) {\n        // In TypeScript v4.1, this would be properly recognized without needing the type assertion\n        // https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/#template-literal-types\n        const headingElementName = `h${level}` as HeadingElement\n        const lineClampMultipleLines =\n            typeof lineClamp === 'string' ? parseInt(lineClamp, 10) > 1 : (lineClamp || 0) > 1\n\n        return (\n            <Box\n                {...props}\n                className={[\n                    exceptionallySetClassName,\n                    styles.heading,\n                    weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null,\n                    tone !== 'normal' ? getClassNames(styles, 'tone', tone) : null,\n                    getClassNames(styles, 'size', size),\n                    lineClampMultipleLines ? styles.lineClampMultipleLines : null,\n                    lineClamp ? getClassNames(styles, 'lineClamp', lineClamp.toString()) : null,\n                ]}\n                textAlign={align}\n                // Prevents emojis from being cut-off\n                // See https://github.com/Doist/reactist/pull/528\n                paddingRight={lineClamp ? 'xsmall' : undefined}\n                as={headingElementName}\n                ref={ref}\n            >\n                {children}\n            </Box>\n        )\n    },\n)\n\nexport type { HeadingProps, HeadingLevel }\nexport { Heading }\n"],"names":["Heading","React","ref","level","weight","size","tone","children","lineClamp","align","exceptionallySetClassName","props","headingElementName","lineClampMultipleLines","parseInt","Box","className","styles","heading","getClassNames","toString","textAlign","paddingRight","undefined","as"],"mappings":";;;;;;IAsEMA,OAAO,gBAAGC,UAAA,CACZ,SAASD,OAAT,OAYIE,GAZJ;MAEQC,aAAAA;yBACAC;MAAAA,kCAAS;MACTC,YAAAA;uBACAC;MAAAA,8BAAO;MACPC,gBAAAA;MACAC,iBAAAA;MACAC,aAAAA;MACAC,iCAAAA;MACGC;;AAIP;AACA;AACA,MAAMC,kBAAkB,SAAOT,KAA/B;AACA,MAAMU,sBAAsB,GACxB,OAAOL,SAAP,KAAqB,QAArB,GAAgCM,QAAQ,CAACN,SAAD,EAAY,EAAZ,CAAR,GAA0B,CAA1D,GAA8D,CAACA,SAAS,IAAI,CAAd,IAAmB,CADrF;AAGA,sBACIP,aAAA,CAACc,GAAD,oBACQJ;AACJK,IAAAA,SAAS,EAAE,CACPN,yBADO,EAEPO,MAAM,CAACC,OAFA,EAGPd,MAAM,KAAK,SAAX,GAAuBe,aAAa,CAACF,MAAD,EAAS,QAAT,EAAmBb,MAAnB,CAApC,GAAiE,IAH1D,EAIPE,IAAI,KAAK,QAAT,GAAoBa,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBX,IAAjB,CAAjC,GAA0D,IAJnD,EAKPa,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBZ,IAAjB,CALN,EAMPQ,sBAAsB,GAAGI,MAAM,CAACJ,sBAAV,GAAmC,IANlD,EAOPL,SAAS,GAAGW,aAAa,CAACF,MAAD,EAAS,WAAT,EAAsBT,SAAS,CAACY,QAAV,EAAtB,CAAhB,GAA8D,IAPhE;AASXC,IAAAA,SAAS,EAAEZ;AACX;AACA;AACAa,IAAAA,YAAY,EAAEd,SAAS,GAAG,QAAH,GAAce;AACrCC,IAAAA,EAAE,EAAEZ;AACJV,IAAAA,GAAG,EAAEA;IAhBT,EAkBKK,QAlBL,CADJ;AAsBH,CA3CW;;;;"}
+{"version":3,"file":"heading.js","sources":["../../../src/new-components/heading/heading.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../responsive-props'\nimport { Box } from '../box'\nimport styles from './heading.module.css'\nimport type { ObfuscatedClassName } from '../../utils/polymorphism'\nimport type { Tone } from '../common-types'\nimport type { BoxProps } from '../box'\n\ntype HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6 | '1' | '2' | '3' | '4' | '5' | '6'\ntype HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n\ntype SupportedHeadingElementProps = Omit<\n    JSX.IntrinsicElements[HeadingElement],\n    'className' | 'children'\n>\n\ntype HeadingProps = SupportedHeadingElementProps & {\n    children: React.ReactNode\n    /**\n     * The semantic level of the heading.\n     */\n    level: HeadingLevel\n    /**\n     * The weight of the heading. Used to de-emphasize the heading visually when using 'light'.\n     *\n     * @default 'regular'\n     */\n    weight?: 'regular' | 'light'\n    /**\n     * Shifts the default heading visual text size up or down, depending on the original size\n     * imposed by the `level`. The heading continues to be semantically at the given level.\n     *\n     * By default, no value is applied, and the default size from the level is applied. The values\n     * have the following effect:\n     *\n     * - 'smaller' shifts the default level size down in the font-size scale (it tends to make the\n     * level look visually as if it were of the immediately lower level).\n     * - 'larger' has the opposite effect than 'smaller' shifting the visual font size up in the\n     * scale.\n     * - 'largest' can be thought of as applying 'larger' twice.\n     *\n     * @see level\n     * @default undefined\n     */\n    size?: 'smaller' | 'larger' | 'largest'\n    /**\n     * The tone (semantic color) of the heading.\n     *\n     * @default 'normal'\n     */\n    tone?: Tone\n    /**\n     * Used to truncate the heading to a given number of lines.\n     *\n     * It will add an ellipsis (`…`) to the text at the end of the last line, only if the text was\n     * truncated. If the text fits without it being truncated, no ellipsis is added.\n     *\n     * By default, the text is not truncated at all, no matter how many lines it takes to render it.\n     *\n     * @default undefined\n     */\n    lineClamp?: 1 | 2 | 3 | 4 | 5 | '1' | '2' | '3' | '4' | '5'\n    /**\n     * How to align the heading text horizontally.\n     *\n     * @default 'start'\n     */\n    align?: BoxProps['textAlign']\n}\n\nconst Heading = React.forwardRef<HTMLHeadingElement, HeadingProps & ObfuscatedClassName>(\n    function Heading(\n        {\n            level,\n            weight = 'regular',\n            size,\n            tone = 'normal',\n            children,\n            lineClamp,\n            align,\n            exceptionallySetClassName,\n            ...props\n        },\n        ref,\n    ) {\n        // In TypeScript v4.1, this would be properly recognized without needing the type assertion\n        // https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/#template-literal-types\n        const headingElementName = `h${level}` as HeadingElement\n        const lineClampMultipleLines =\n            typeof lineClamp === 'string' ? parseInt(lineClamp, 10) > 1 : (lineClamp || 0) > 1\n\n        return (\n            <Box\n                {...props}\n                className={[\n                    exceptionallySetClassName,\n                    styles.heading,\n                    weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null,\n                    tone !== 'normal' ? getClassNames(styles, 'tone', tone) : null,\n                    getClassNames(styles, 'size', size),\n                    lineClampMultipleLines ? styles.lineClampMultipleLines : null,\n                    lineClamp ? getClassNames(styles, 'lineClamp', lineClamp.toString()) : null,\n                ]}\n                textAlign={align}\n                // Prevents emojis from being cut-off\n                // See https://github.com/Doist/reactist/pull/528\n                paddingRight={lineClamp ? 'xsmall' : undefined}\n                as={headingElementName}\n                ref={ref}\n            >\n                {children}\n            </Box>\n        )\n    },\n)\n\nexport type { HeadingProps, HeadingLevel }\nexport { Heading }\n"],"names":["Heading","React","ref","level","weight","size","tone","children","lineClamp","align","exceptionallySetClassName","props","headingElementName","lineClampMultipleLines","parseInt","Box","className","styles","heading","getClassNames","toString","textAlign","paddingRight","undefined","as"],"mappings":";;;;;;;IAsEMA,OAAO,gBAAGC,UAAA,CACZ,SAASD,OAAT,OAYIE,GAZJ;MAEQC,aAAAA;yBACAC;MAAAA,kCAAS;MACTC,YAAAA;uBACAC;MAAAA,8BAAO;MACPC,gBAAAA;MACAC,iBAAAA;MACAC,aAAAA;MACAC,iCAAAA;MACGC;;AAIP;AACA;AACA,MAAMC,kBAAkB,SAAOT,KAA/B;AACA,MAAMU,sBAAsB,GACxB,OAAOL,SAAP,KAAqB,QAArB,GAAgCM,QAAQ,CAACN,SAAD,EAAY,EAAZ,CAAR,GAA0B,CAA1D,GAA8D,CAACA,SAAS,IAAI,CAAd,IAAmB,CADrF;AAGA,sBACIP,aAAA,CAACc,GAAD,oBACQJ;AACJK,IAAAA,SAAS,EAAE,CACPN,yBADO,EAEPO,MAAM,CAACC,OAFA,EAGPd,MAAM,KAAK,SAAX,GAAuBe,aAAa,CAACF,MAAD,EAAS,QAAT,EAAmBb,MAAnB,CAApC,GAAiE,IAH1D,EAIPE,IAAI,KAAK,QAAT,GAAoBa,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBX,IAAjB,CAAjC,GAA0D,IAJnD,EAKPa,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBZ,IAAjB,CALN,EAMPQ,sBAAsB,GAAGI,MAAM,CAACJ,sBAAV,GAAmC,IANlD,EAOPL,SAAS,GAAGW,aAAa,CAACF,MAAD,EAAS,WAAT,EAAsBT,SAAS,CAACY,QAAV,EAAtB,CAAhB,GAA8D,IAPhE;AASXC,IAAAA,SAAS,EAAEZ;AACX;AACA;AACAa,IAAAA,YAAY,EAAEd,SAAS,GAAG,QAAH,GAAce;AACrCC,IAAAA,EAAE,EAAEZ;AACJV,IAAAA,GAAG,EAAEA;IAhBT,EAkBKK,QAlBL,CADJ;AAsBH,CA3CW;;;;"}

package/es/new-components/hidden/hidden.js

@@ -4,6 +4,7 @@ import { polymorphicComponent } from '../../utils/polymorphism.js';
 import { Box } from '../box/box.js';
 import styles from './hidden.module.css.js';
 
+var _excluded = ["display", "children", "exceptionallySetClassName"];
 /**
  * A component that allows to specify how to hide itself on certain responsive screen sizes, or on
  * print media.
@@ -18,7 +19,7 @@ var Hidden = /*#__PURE__*/polymorphicComponent(function Hidden(_ref, ref) {
       display = _ref$display === void 0 ? 'block' : _ref$display,
       children = _ref.children,
       exceptionallySetClassName = _ref.exceptionallySetClassName,
-      props = _objectWithoutPropertiesLoose(_ref, ["display", "children", "exceptionallySetClassName"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var hiddenOnPrint = 'print' in props && props.print;
   var hiddenOnDesktop = ('above' in props);

package/es/new-components/hidden/hidden.js.map

@@ -1 +1 @@
-{"version":3,"file":"hidden.js","sources":["../../../src/new-components/hidden/hidden.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Box } from '../box'\nimport styles from './hidden.module.css'\nimport type { ResponsiveBreakpoints } from '../responsive-props'\nimport { polymorphicComponent } from '../../utils/polymorphism'\n\ntype AboveProp = {\n    /**\n     * Hides the element on viewport sizes equal or larger to the one given.\n     *\n     * It is not supported to pass it alongside `below`, and the resulting behavior is undefined\n     * (most likely itʼll hide the element all the time to make it apparent that there's a problem).\n     *\n     * @see below\n     */\n    above: Exclude<ResponsiveBreakpoints, 'desktop'>\n    below?: never\n}\n\ntype BelowProp = {\n    /**\n     * Hides the element on viewport sizes equal or smaller to the one given.\n     *\n     * It is not supported to pass it alongside `above`, and the resulting behavior is undefined\n     * (most likely itʼll hide the element all the time to make it apparent that there's a problem).\n     *\n     * @see above\n     */\n    below: Exclude<ResponsiveBreakpoints, 'mobile'>\n    above?: never\n}\n\ntype CommonProps = {\n    children: React.ReactNode\n    /**\n     * hides the element when on print media.\n     */\n    print?: boolean\n    /**\n     * Useful if you want the element to be an inline element when it is visible.\n     */\n    display?: 'inline' | 'block'\n}\n\ntype HiddenProps = CommonProps & (AboveProp | BelowProp | Required<Pick<CommonProps, 'print'>>)\n\n/**\n * A component that allows to specify how to hide itself on certain responsive screen sizes, or on\n * print media.\n *\n * @see HiddenProps\n * @see HiddenVisually for hiding content only visually, while keeping it available for assistive\n *   technologies.\n */\nconst Hidden = polymorphicComponent<'div', HiddenProps>(function Hidden(\n    { display = 'block', children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    const hiddenOnPrint = 'print' in props && props.print\n\n    const hiddenOnDesktop = 'above' in props\n    const hiddenOnMobile = 'below' in props\n    const hiddenOnTablet =\n        ('below' in props && props.below === 'desktop') ||\n        ('above' in props && props.above === 'mobile')\n\n    if (hiddenOnDesktop && hiddenOnMobile) {\n        // eslint-disable-next-line no-console\n        console.warn('<Hidden /> should receive either above=\"…\" or below=\"…\" but not both')\n    }\n\n    if (!hiddenOnDesktop && !hiddenOnMobile && !hiddenOnPrint) {\n        // eslint-disable-next-line no-console\n        console.warn('<Hidden /> did not receive any criteria to hide itself')\n    }\n\n    // We need to delete these so they do not get forwarded to the Box\n    if ('above' in props) delete props['above']\n    if ('below' in props) delete props['below']\n    if ('print' in props) delete props['print']\n\n    return (\n        <Box\n            {...props}\n            ref={ref}\n            className={[exceptionallySetClassName, hiddenOnPrint ? styles.hiddenOnPrint : null]}\n            display={\n                hiddenOnDesktop && hiddenOnMobile\n                    ? 'none'\n                    : {\n                          mobile: hiddenOnMobile ? 'none' : display,\n                          tablet: hiddenOnTablet ? 'none' : display,\n                          desktop: hiddenOnDesktop ? 'none' : display,\n                      }\n            }\n        >\n            {children}\n        </Box>\n    )\n})\n\nexport { Hidden }\nexport type { HiddenProps }\n"],"names":["Hidden","polymorphicComponent","ref","display","children","exceptionallySetClassName","props","hiddenOnPrint","print","hiddenOnDesktop","hiddenOnMobile","hiddenOnTablet","below","above","console","warn","React","Box","className","styles","mobile","tablet","desktop"],"mappings":";;;;;;AA8CA;;;;;;;;;IAQMA,MAAM,gBAAGC,oBAAoB,CAAqB,SAASD,MAAT,OAEpDE,GAFoD;0BAClDC;MAAAA,oCAAU;MAASC,gBAAAA;MAAUC,iCAAAA;MAA8BC;;AAG7D,MAAMC,aAAa,GAAG,WAAWD,KAAX,IAAoBA,KAAK,CAACE,KAAhD;AAEA,MAAMC,eAAe,IAAG,WAAWH,KAAd,CAArB;AACA,MAAMI,cAAc,IAAG,WAAWJ,KAAd,CAApB;AACA,MAAMK,cAAc,GACf,WAAWL,KAAX,IAAoBA,KAAK,CAACM,KAAN,KAAgB,SAArC,IACC,WAAWN,KAAX,IAAoBA,KAAK,CAACO,KAAN,KAAgB,QAFzC;;AAIA,MAAIJ,eAAe,IAAIC,cAAvB,EAAuC;AACnC;AACAI,IAAAA,OAAO,CAACC,IAAR,CAAa,sEAAb;AACH;;AAED,MAAI,CAACN,eAAD,IAAoB,CAACC,cAArB,IAAuC,CAACH,aAA5C,EAA2D;AACvD;AACAO,IAAAA,OAAO,CAACC,IAAR,CAAa,wDAAb;AACH;;;AAGD,MAAI,WAAWT,KAAf,EAAsB,OAAOA,KAAK,CAAC,OAAD,CAAZ;AACtB,MAAI,WAAWA,KAAf,EAAsB,OAAOA,KAAK,CAAC,OAAD,CAAZ;AACtB,MAAI,WAAWA,KAAf,EAAsB,OAAOA,KAAK,CAAC,OAAD,CAAZ;AAEtB,sBACIU,aAAA,CAACC,GAAD,oBACQX;AACJJ,IAAAA,GAAG,EAAEA;AACLgB,IAAAA,SAAS,EAAE,CAACb,yBAAD,EAA4BE,aAAa,GAAGY,MAAM,CAACZ,aAAV,GAA0B,IAAnE;AACXJ,IAAAA,OAAO,EACHM,eAAe,IAAIC,cAAnB,GACM,MADN,GAEM;AACIU,MAAAA,MAAM,EAAEV,cAAc,GAAG,MAAH,GAAYP,OADtC;AAEIkB,MAAAA,MAAM,EAAEV,cAAc,GAAG,MAAH,GAAYR,OAFtC;AAGImB,MAAAA,OAAO,EAAEb,eAAe,GAAG,MAAH,GAAYN;AAHxC;IAPd,EAcKC,QAdL,CADJ;AAkBH,CA7CkC;;;;"}
+{"version":3,"file":"hidden.js","sources":["../../../src/new-components/hidden/hidden.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Box } from '../box'\nimport styles from './hidden.module.css'\nimport type { ResponsiveBreakpoints } from '../responsive-props'\nimport { polymorphicComponent } from '../../utils/polymorphism'\n\ntype AboveProp = {\n    /**\n     * Hides the element on viewport sizes equal or larger to the one given.\n     *\n     * It is not supported to pass it alongside `below`, and the resulting behavior is undefined\n     * (most likely itʼll hide the element all the time to make it apparent that there's a problem).\n     *\n     * @see below\n     */\n    above: Exclude<ResponsiveBreakpoints, 'desktop'>\n    below?: never\n}\n\ntype BelowProp = {\n    /**\n     * Hides the element on viewport sizes equal or smaller to the one given.\n     *\n     * It is not supported to pass it alongside `above`, and the resulting behavior is undefined\n     * (most likely itʼll hide the element all the time to make it apparent that there's a problem).\n     *\n     * @see above\n     */\n    below: Exclude<ResponsiveBreakpoints, 'mobile'>\n    above?: never\n}\n\ntype CommonProps = {\n    children: React.ReactNode\n    /**\n     * hides the element when on print media.\n     */\n    print?: boolean\n    /**\n     * Useful if you want the element to be an inline element when it is visible.\n     */\n    display?: 'inline' | 'block'\n}\n\ntype HiddenProps = CommonProps & (AboveProp | BelowProp | Required<Pick<CommonProps, 'print'>>)\n\n/**\n * A component that allows to specify how to hide itself on certain responsive screen sizes, or on\n * print media.\n *\n * @see HiddenProps\n * @see HiddenVisually for hiding content only visually, while keeping it available for assistive\n *   technologies.\n */\nconst Hidden = polymorphicComponent<'div', HiddenProps>(function Hidden(\n    { display = 'block', children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    const hiddenOnPrint = 'print' in props && props.print\n\n    const hiddenOnDesktop = 'above' in props\n    const hiddenOnMobile = 'below' in props\n    const hiddenOnTablet =\n        ('below' in props && props.below === 'desktop') ||\n        ('above' in props && props.above === 'mobile')\n\n    if (hiddenOnDesktop && hiddenOnMobile) {\n        // eslint-disable-next-line no-console\n        console.warn('<Hidden /> should receive either above=\"…\" or below=\"…\" but not both')\n    }\n\n    if (!hiddenOnDesktop && !hiddenOnMobile && !hiddenOnPrint) {\n        // eslint-disable-next-line no-console\n        console.warn('<Hidden /> did not receive any criteria to hide itself')\n    }\n\n    // We need to delete these so they do not get forwarded to the Box\n    if ('above' in props) delete props['above']\n    if ('below' in props) delete props['below']\n    if ('print' in props) delete props['print']\n\n    return (\n        <Box\n            {...props}\n            ref={ref}\n            className={[exceptionallySetClassName, hiddenOnPrint ? styles.hiddenOnPrint : null]}\n            display={\n                hiddenOnDesktop && hiddenOnMobile\n                    ? 'none'\n                    : {\n                          mobile: hiddenOnMobile ? 'none' : display,\n                          tablet: hiddenOnTablet ? 'none' : display,\n                          desktop: hiddenOnDesktop ? 'none' : display,\n                      }\n            }\n        >\n            {children}\n        </Box>\n    )\n})\n\nexport { Hidden }\nexport type { HiddenProps }\n"],"names":["Hidden","polymorphicComponent","ref","display","children","exceptionallySetClassName","props","hiddenOnPrint","print","hiddenOnDesktop","hiddenOnMobile","hiddenOnTablet","below","above","console","warn","React","Box","className","styles","mobile","tablet","desktop"],"mappings":";;;;;;;AA8CA;;;;;;;;;IAQMA,MAAM,gBAAGC,oBAAoB,CAAqB,SAASD,MAAT,OAEpDE,GAFoD;0BAClDC;MAAAA,oCAAU;MAASC,gBAAAA;MAAUC,iCAAAA;MAA8BC;;AAG7D,MAAMC,aAAa,GAAG,WAAWD,KAAX,IAAoBA,KAAK,CAACE,KAAhD;AAEA,MAAMC,eAAe,IAAG,WAAWH,KAAd,CAArB;AACA,MAAMI,cAAc,IAAG,WAAWJ,KAAd,CAApB;AACA,MAAMK,cAAc,GACf,WAAWL,KAAX,IAAoBA,KAAK,CAACM,KAAN,KAAgB,SAArC,IACC,WAAWN,KAAX,IAAoBA,KAAK,CAACO,KAAN,KAAgB,QAFzC;;AAIA,MAAIJ,eAAe,IAAIC,cAAvB,EAAuC;AACnC;AACAI,IAAAA,OAAO,CAACC,IAAR,CAAa,sEAAb;AACH;;AAED,MAAI,CAACN,eAAD,IAAoB,CAACC,cAArB,IAAuC,CAACH,aAA5C,EAA2D;AACvD;AACAO,IAAAA,OAAO,CAACC,IAAR,CAAa,wDAAb;AACH;;;AAGD,MAAI,WAAWT,KAAf,EAAsB,OAAOA,KAAK,CAAC,OAAD,CAAZ;AACtB,MAAI,WAAWA,KAAf,EAAsB,OAAOA,KAAK,CAAC,OAAD,CAAZ;AACtB,MAAI,WAAWA,KAAf,EAAsB,OAAOA,KAAK,CAAC,OAAD,CAAZ;AAEtB,sBACIU,aAAA,CAACC,GAAD,oBACQX;AACJJ,IAAAA,GAAG,EAAEA;AACLgB,IAAAA,SAAS,EAAE,CAACb,yBAAD,EAA4BE,aAAa,GAAGY,MAAM,CAACZ,aAAV,GAA0B,IAAnE;AACXJ,IAAAA,OAAO,EACHM,eAAe,IAAIC,cAAnB,GACM,MADN,GAEM;AACIU,MAAAA,MAAM,EAAEV,cAAc,GAAG,MAAH,GAAYP,OADtC;AAEIkB,MAAAA,MAAM,EAAEV,cAAc,GAAG,MAAH,GAAYR,OAFtC;AAGImB,MAAAA,OAAO,EAAEb,eAAe,GAAG,MAAH,GAAYN;AAHxC;IAPd,EAcKC,QAdL,CADJ;AAkBH,CA7CkC;;;;"}

package/es/new-components/icons/alert-icon.js

@@ -1,6 +1,7 @@
 import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { createElement } from 'react';
 
+var _excluded = ["tone"];
 var alertIconForTone = {
   info: AlertInfoIcon,
   positive: AlertPositiveIcon,
@@ -10,7 +11,7 @@ var alertIconForTone = {
 
 function AlertIcon(_ref) {
   var tone = _ref.tone,
-      props = _objectWithoutPropertiesLoose(_ref, ["tone"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var Icon = alertIconForTone[tone];
   return Icon ? /*#__PURE__*/createElement(Icon, Object.assign({}, props)) : null;

package/es/new-components/icons/alert-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-icon.js","sources":["../../../src/new-components/icons/alert-icon.tsx"],"sourcesContent":["import * as React from 'react'\nimport { AlertTone } from '../common-types'\n\nconst alertIconForTone: Record<AlertTone, typeof AlertInfoIcon> = {\n    info: AlertInfoIcon,\n    positive: AlertPositiveIcon,\n    caution: AlertCautionIcon,\n    critical: AlertCriticalIcon,\n}\n\nfunction AlertIcon({ tone, ...props }: JSX.IntrinsicElements['svg'] & { tone: AlertTone }) {\n    const Icon = alertIconForTone[tone]\n    return Icon ? <Icon {...props} /> : null\n}\n\nfunction AlertInfoIcon(props: JSX.IntrinsicElements['svg']) {\n    return (\n        <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n            <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm1.18-11.84a.84.84 0 1 1-1.68 0 .84.84 0 0 1 1.68 0zM12.5 10a.5.5 0 0 1 .5.5V15h1a.5.5 0 0 1 0 1h-3a.5.5 0 0 1 0-1h1v-4h-1a.5.5 0 0 1 0-1h1.5z\"\n                fill=\"currentColor\"\n            />\n        </svg>\n    )\n}\n\nfunction AlertPositiveIcon(props: JSX.IntrinsicElements['svg']) {\n    return (\n        <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n            <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm-4.354-8.104a.5.5 0 0 1 .708 0l2.146 2.147 5.146-5.147a.5.5 0 0 1 .708.708l-5.5 5.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 0 1 0-.708z\"\n                fill=\"currentColor\"\n            />\n        </svg>\n    )\n}\n\nfunction AlertCautionIcon(props: JSX.IntrinsicElements['svg']) {\n    return (\n        <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n            <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"m3.254 16.992 7.018-12.03a2 2 0 0 1 3.455 0l7.018 12.03A2 2 0 0 1 19.018 20H4.982a2 2 0 0 1-1.728-3.008zm8.242-11.887a1 1 0 0 0-.36.36l-7.018 12.03A1 1 0 0 0 4.982 19h14.036a1 1 0 0 0 .864-1.504l-7.018-12.03a1 1 0 0 0-1.368-.36zM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014a.987.987 0 1 0-1.971.055l.236 4.25c.053.945 1.445.945 1.498 0l.236-4.25.001-.027v-.028z\"\n                fill=\"currentColor\"\n            />\n        </svg>\n    )\n}\n\nfunction AlertCriticalIcon(props: JSX.IntrinsicElements['svg']) {\n    return (\n        <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n            <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M12 3.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17zM2.5 12a9.5 9.5 0 1 1 19 0 9.5 9.5 0 0 1-19 0zM13 15.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014A.987.987 0 0 0 12 7.5h-.027l-.028.002a.987.987 0 0 0-.93 1.04l.236 4.25c.053.944 1.445.944 1.498 0l.236-4.25.001-.028v-.027z\"\n                fill=\"currentColor\"\n            />\n        </svg>\n    )\n}\n\nexport { AlertIcon }\n"],"names":["alertIconForTone","info","AlertInfoIcon","positive","AlertPositiveIcon","caution","AlertCautionIcon","critical","AlertCriticalIcon","AlertIcon","tone","props","Icon","React","width","height","fill","xmlns","fillRule","clipRule","d"],"mappings":";;;AAGA,IAAMA,gBAAgB,GAA4C;AAC9DC,EAAAA,IAAI,EAAEC,aADwD;AAE9DC,EAAAA,QAAQ,EAAEC,iBAFoD;AAG9DC,EAAAA,OAAO,EAAEC,gBAHqD;AAI9DC,EAAAA,QAAQ,EAAEC;AAJoD,CAAlE;;AAOA,SAASC,SAAT;MAAqBC,YAAAA;MAASC;;AAC1B,MAAMC,IAAI,GAAGZ,gBAAgB,CAACU,IAAD,CAA7B;AACA,SAAOE,IAAI,gBAAGC,aAAA,CAACD,IAAD,oBAAUD,MAAV,CAAH,GAAyB,IAApC;AACH;;AAED,SAAST,aAAT,CAAuBS,KAAvB;AACI,sBACIE,aAAA,MAAA;AAAKC,IAAAA,KAAK,EAAC;AAAKC,IAAAA,MAAM,EAAC;AAAKC,IAAAA,IAAI,EAAC;AAAOC,IAAAA,KAAK,EAAC;KAAiCN,MAA/E,eACIE,aAAA,OAAA;AACIK,IAAAA,QAAQ,EAAC;AACTC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,CAAC,EAAC;AACFJ,IAAAA,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;AAED,SAASZ,iBAAT,CAA2BO,KAA3B;AACI,sBACIE,aAAA,MAAA;AAAKC,IAAAA,KAAK,EAAC;AAAKC,IAAAA,MAAM,EAAC;AAAKC,IAAAA,IAAI,EAAC;AAAOC,IAAAA,KAAK,EAAC;KAAiCN,MAA/E,eACIE,aAAA,OAAA;AACIK,IAAAA,QAAQ,EAAC;AACTC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,CAAC,EAAC;AACFJ,IAAAA,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;AAED,SAASV,gBAAT,CAA0BK,KAA1B;AACI,sBACIE,aAAA,MAAA;AAAKC,IAAAA,KAAK,EAAC;AAAKC,IAAAA,MAAM,EAAC;AAAKC,IAAAA,IAAI,EAAC;AAAOC,IAAAA,KAAK,EAAC;KAAiCN,MAA/E,eACIE,aAAA,OAAA;AACIK,IAAAA,QAAQ,EAAC;AACTC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,CAAC,EAAC;AACFJ,IAAAA,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;AAED,SAASR,iBAAT,CAA2BG,KAA3B;AACI,sBACIE,aAAA,MAAA;AAAKC,IAAAA,KAAK,EAAC;AAAKC,IAAAA,MAAM,EAAC;AAAKC,IAAAA,IAAI,EAAC;AAAOC,IAAAA,KAAK,EAAC;KAAiCN,MAA/E,eACIE,aAAA,OAAA;AACIK,IAAAA,QAAQ,EAAC;AACTC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,CAAC,EAAC;AACFJ,IAAAA,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;;;"}
+{"version":3,"file":"alert-icon.js","sources":["../../../src/new-components/icons/alert-icon.tsx"],"sourcesContent":["import * as React from 'react'\nimport { AlertTone } from '../common-types'\n\nconst alertIconForTone: Record<AlertTone, typeof AlertInfoIcon> = {\n    info: AlertInfoIcon,\n    positive: AlertPositiveIcon,\n    caution: AlertCautionIcon,\n    critical: AlertCriticalIcon,\n}\n\nfunction AlertIcon({ tone, ...props }: JSX.IntrinsicElements['svg'] & { tone: AlertTone }) {\n    const Icon = alertIconForTone[tone]\n    return Icon ? <Icon {...props} /> : null\n}\n\nfunction AlertInfoIcon(props: JSX.IntrinsicElements['svg']) {\n    return (\n        <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n            <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm1.18-11.84a.84.84 0 1 1-1.68 0 .84.84 0 0 1 1.68 0zM12.5 10a.5.5 0 0 1 .5.5V15h1a.5.5 0 0 1 0 1h-3a.5.5 0 0 1 0-1h1v-4h-1a.5.5 0 0 1 0-1h1.5z\"\n                fill=\"currentColor\"\n            />\n        </svg>\n    )\n}\n\nfunction AlertPositiveIcon(props: JSX.IntrinsicElements['svg']) {\n    return (\n        <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n            <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm-4.354-8.104a.5.5 0 0 1 .708 0l2.146 2.147 5.146-5.147a.5.5 0 0 1 .708.708l-5.5 5.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 0 1 0-.708z\"\n                fill=\"currentColor\"\n            />\n        </svg>\n    )\n}\n\nfunction AlertCautionIcon(props: JSX.IntrinsicElements['svg']) {\n    return (\n        <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n            <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"m3.254 16.992 7.018-12.03a2 2 0 0 1 3.455 0l7.018 12.03A2 2 0 0 1 19.018 20H4.982a2 2 0 0 1-1.728-3.008zm8.242-11.887a1 1 0 0 0-.36.36l-7.018 12.03A1 1 0 0 0 4.982 19h14.036a1 1 0 0 0 .864-1.504l-7.018-12.03a1 1 0 0 0-1.368-.36zM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014a.987.987 0 1 0-1.971.055l.236 4.25c.053.945 1.445.945 1.498 0l.236-4.25.001-.027v-.028z\"\n                fill=\"currentColor\"\n            />\n        </svg>\n    )\n}\n\nfunction AlertCriticalIcon(props: JSX.IntrinsicElements['svg']) {\n    return (\n        <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n            <path\n                fillRule=\"evenodd\"\n                clipRule=\"evenodd\"\n                d=\"M12 3.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17zM2.5 12a9.5 9.5 0 1 1 19 0 9.5 9.5 0 0 1-19 0zM13 15.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014A.987.987 0 0 0 12 7.5h-.027l-.028.002a.987.987 0 0 0-.93 1.04l.236 4.25c.053.944 1.445.944 1.498 0l.236-4.25.001-.028v-.027z\"\n                fill=\"currentColor\"\n            />\n        </svg>\n    )\n}\n\nexport { AlertIcon }\n"],"names":["alertIconForTone","info","AlertInfoIcon","positive","AlertPositiveIcon","caution","AlertCautionIcon","critical","AlertCriticalIcon","AlertIcon","tone","props","Icon","React","width","height","fill","xmlns","fillRule","clipRule","d"],"mappings":";;;;AAGA,IAAMA,gBAAgB,GAA4C;AAC9DC,EAAAA,IAAI,EAAEC,aADwD;AAE9DC,EAAAA,QAAQ,EAAEC,iBAFoD;AAG9DC,EAAAA,OAAO,EAAEC,gBAHqD;AAI9DC,EAAAA,QAAQ,EAAEC;AAJoD,CAAlE;;AAOA,SAASC,SAAT;MAAqBC,YAAAA;MAASC;;AAC1B,MAAMC,IAAI,GAAGZ,gBAAgB,CAACU,IAAD,CAA7B;AACA,SAAOE,IAAI,gBAAGC,aAAA,CAACD,IAAD,oBAAUD,MAAV,CAAH,GAAyB,IAApC;AACH;;AAED,SAAST,aAAT,CAAuBS,KAAvB;AACI,sBACIE,aAAA,MAAA;AAAKC,IAAAA,KAAK,EAAC;AAAKC,IAAAA,MAAM,EAAC;AAAKC,IAAAA,IAAI,EAAC;AAAOC,IAAAA,KAAK,EAAC;KAAiCN,MAA/E,eACIE,aAAA,OAAA;AACIK,IAAAA,QAAQ,EAAC;AACTC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,CAAC,EAAC;AACFJ,IAAAA,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;AAED,SAASZ,iBAAT,CAA2BO,KAA3B;AACI,sBACIE,aAAA,MAAA;AAAKC,IAAAA,KAAK,EAAC;AAAKC,IAAAA,MAAM,EAAC;AAAKC,IAAAA,IAAI,EAAC;AAAOC,IAAAA,KAAK,EAAC;KAAiCN,MAA/E,eACIE,aAAA,OAAA;AACIK,IAAAA,QAAQ,EAAC;AACTC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,CAAC,EAAC;AACFJ,IAAAA,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;AAED,SAASV,gBAAT,CAA0BK,KAA1B;AACI,sBACIE,aAAA,MAAA;AAAKC,IAAAA,KAAK,EAAC;AAAKC,IAAAA,MAAM,EAAC;AAAKC,IAAAA,IAAI,EAAC;AAAOC,IAAAA,KAAK,EAAC;KAAiCN,MAA/E,eACIE,aAAA,OAAA;AACIK,IAAAA,QAAQ,EAAC;AACTC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,CAAC,EAAC;AACFJ,IAAAA,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;AAED,SAASR,iBAAT,CAA2BG,KAA3B;AACI,sBACIE,aAAA,MAAA;AAAKC,IAAAA,KAAK,EAAC;AAAKC,IAAAA,MAAM,EAAC;AAAKC,IAAAA,IAAI,EAAC;AAAOC,IAAAA,KAAK,EAAC;KAAiCN,MAA/E,eACIE,aAAA,OAAA;AACIK,IAAAA,QAAQ,EAAC;AACTC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,CAAC,EAAC;AACFJ,IAAAA,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;;;"}