@doist/reactist 10.0.0-beta.10 → 10.0.0-beta.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (157) hide show
  1. package/dist/reactist.cjs.development.js +141 -71
  2. package/dist/reactist.cjs.development.js.map +1 -1
  3. package/dist/reactist.cjs.production.min.js +1 -1
  4. package/dist/reactist.cjs.production.min.js.map +1 -1
  5. package/es/_virtual/_rollupPluginBabelHelpers.js +34 -20
  6. package/es/_virtual/_rollupPluginBabelHelpers.js.map +1 -1
  7. package/es/components/deprecated-button/deprecated-button.js +2 -1
  8. package/es/components/deprecated-button/deprecated-button.js.map +1 -1
  9. package/es/components/deprecated-modal/deprecated-modal.js +1 -1
  10. package/es/components/deprecated-modal/deprecated-modal.js.map +1 -1
  11. package/es/components/dropdown/dropdown.js +3 -1
  12. package/es/components/dropdown/dropdown.js.map +1 -1
  13. package/es/components/error-message/error-message.js +1 -1
  14. package/es/components/error-message/error-message.js.map +1 -1
  15. package/es/components/icon/icon.js.map +1 -1
  16. package/es/components/key-capturer/key-capturer.js.map +1 -1
  17. package/es/components/keyboard-shortcut/keyboard-shortcut.js +2 -1
  18. package/es/components/keyboard-shortcut/keyboard-shortcut.js.map +1 -1
  19. package/es/components/menu/menu.js +22 -11
  20. package/es/components/menu/menu.js.map +1 -1
  21. package/es/components/notification/notification.js +3 -1
  22. package/es/components/notification/notification.js.map +1 -1
  23. package/es/components/popover/popover.js.map +1 -1
  24. package/es/components/popover/positioning-utils.js.map +1 -1
  25. package/es/components/select/select.js +3 -1
  26. package/es/components/select/select.js.map +1 -1
  27. package/es/components/time/time-utils.js.map +1 -1
  28. package/es/components/time/time.js.map +1 -1
  29. package/es/components/tooltip/tooltip.js +3 -1
  30. package/es/components/tooltip/tooltip.js.map +1 -1
  31. package/es/new-components/base-button/base-button.js +3 -1
  32. package/es/new-components/base-button/base-button.js.map +1 -1
  33. package/es/new-components/box/box.js +2 -1
  34. package/es/new-components/box/box.js.map +1 -1
  35. package/es/new-components/button/button.js +2 -1
  36. package/es/new-components/button/button.js.map +1 -1
  37. package/es/new-components/button-link/button-link.js +2 -1
  38. package/es/new-components/button-link/button-link.js.map +1 -1
  39. package/es/new-components/checkbox-field/checkbox-field.js +2 -1
  40. package/es/new-components/checkbox-field/checkbox-field.js.map +1 -1
  41. package/es/new-components/checkbox-field/checkbox-icon.js +2 -1
  42. package/es/new-components/checkbox-field/checkbox-icon.js.map +1 -1
  43. package/es/new-components/columns/columns.js +4 -2
  44. package/es/new-components/columns/columns.js.map +1 -1
  45. package/es/new-components/divider/divider.js +3 -1
  46. package/es/new-components/divider/divider.js.map +1 -1
  47. package/es/new-components/heading/heading.js +2 -1
  48. package/es/new-components/heading/heading.js.map +1 -1
  49. package/es/new-components/hidden/hidden.js +2 -1
  50. package/es/new-components/hidden/hidden.js.map +1 -1
  51. package/es/new-components/icons/alert-icon.js +2 -1
  52. package/es/new-components/icons/alert-icon.js.map +1 -1
  53. package/es/new-components/inline/inline.js +2 -1
  54. package/es/new-components/inline/inline.js.map +1 -1
  55. package/es/new-components/loading/loading.js +2 -1
  56. package/es/new-components/loading/loading.js.map +1 -1
  57. package/es/new-components/modal/modal.js +10 -5
  58. package/es/new-components/modal/modal.js.map +1 -1
  59. package/es/new-components/modal/modal.module.css.js +1 -1
  60. package/es/new-components/password-field/password-field.js +2 -1
  61. package/es/new-components/password-field/password-field.js.map +1 -1
  62. package/es/new-components/select-field/select-field.js +2 -1
  63. package/es/new-components/select-field/select-field.js.map +1 -1
  64. package/es/new-components/stack/stack.js +2 -1
  65. package/es/new-components/stack/stack.js.map +1 -1
  66. package/es/new-components/switch-field/switch-field.js +2 -1
  67. package/es/new-components/switch-field/switch-field.js.map +1 -1
  68. package/es/new-components/tabs/tabs.js +10 -5
  69. package/es/new-components/tabs/tabs.js.map +1 -1
  70. package/es/new-components/text/text.js +2 -1
  71. package/es/new-components/text/text.js.map +1 -1
  72. package/es/new-components/text-area/text-area.js +3 -1
  73. package/es/new-components/text-area/text-area.js.map +1 -1
  74. package/es/new-components/text-field/text-field.js +2 -1
  75. package/es/new-components/text-field/text-field.js.map +1 -1
  76. package/es/new-components/text-link/text-link.js +2 -1
  77. package/es/new-components/text-link/text-link.js.map +1 -1
  78. package/lib/_virtual/_rollupPluginBabelHelpers.js +1 -1
  79. package/lib/components/deprecated-button/deprecated-button.js +1 -1
  80. package/lib/components/deprecated-button/deprecated-button.js.map +1 -1
  81. package/lib/components/deprecated-modal/deprecated-modal.js +1 -1
  82. package/lib/components/deprecated-modal/deprecated-modal.js.map +1 -1
  83. package/lib/components/dropdown/dropdown.js +1 -1
  84. package/lib/components/dropdown/dropdown.js.map +1 -1
  85. package/lib/components/error-message/error-message.js +1 -1
  86. package/lib/components/error-message/error-message.js.map +1 -1
  87. package/lib/components/keyboard-shortcut/keyboard-shortcut.js +1 -1
  88. package/lib/components/keyboard-shortcut/keyboard-shortcut.js.map +1 -1
  89. package/lib/components/menu/menu.js +1 -1
  90. package/lib/components/menu/menu.js.map +1 -1
  91. package/lib/components/notification/notification.js +1 -1
  92. package/lib/components/notification/notification.js.map +1 -1
  93. package/lib/components/select/select.js +1 -1
  94. package/lib/components/select/select.js.map +1 -1
  95. package/lib/components/tooltip/tooltip.js +1 -1
  96. package/lib/components/tooltip/tooltip.js.map +1 -1
  97. package/lib/new-components/base-button/base-button.js +1 -1
  98. package/lib/new-components/base-button/base-button.js.map +1 -1
  99. package/lib/new-components/box/box.js +1 -1
  100. package/lib/new-components/box/box.js.map +1 -1
  101. package/lib/new-components/button/button.js +1 -1
  102. package/lib/new-components/button/button.js.map +1 -1
  103. package/lib/new-components/button-link/button-link.js +1 -1
  104. package/lib/new-components/button-link/button-link.js.map +1 -1
  105. package/lib/new-components/checkbox-field/checkbox-field.js +1 -1
  106. package/lib/new-components/checkbox-field/checkbox-field.js.map +1 -1
  107. package/lib/new-components/checkbox-field/checkbox-icon.js +1 -1
  108. package/lib/new-components/checkbox-field/checkbox-icon.js.map +1 -1
  109. package/lib/new-components/columns/columns.js +1 -1
  110. package/lib/new-components/columns/columns.js.map +1 -1
  111. package/lib/new-components/divider/divider.js +1 -1
  112. package/lib/new-components/divider/divider.js.map +1 -1
  113. package/lib/new-components/heading/heading.js +1 -1
  114. package/lib/new-components/heading/heading.js.map +1 -1
  115. package/lib/new-components/hidden/hidden.js +1 -1
  116. package/lib/new-components/hidden/hidden.js.map +1 -1
  117. package/lib/new-components/icons/alert-icon.js +1 -1
  118. package/lib/new-components/icons/alert-icon.js.map +1 -1
  119. package/lib/new-components/inline/inline.js +1 -1
  120. package/lib/new-components/inline/inline.js.map +1 -1
  121. package/lib/new-components/loading/loading.js +1 -1
  122. package/lib/new-components/loading/loading.js.map +1 -1
  123. package/lib/new-components/modal/modal.d.ts +1 -1
  124. package/lib/new-components/modal/modal.js +1 -1
  125. package/lib/new-components/modal/modal.js.map +1 -1
  126. package/lib/new-components/modal/modal.module.css.js +1 -1
  127. package/lib/new-components/password-field/password-field.js +1 -1
  128. package/lib/new-components/password-field/password-field.js.map +1 -1
  129. package/lib/new-components/select-field/select-field.js +1 -1
  130. package/lib/new-components/select-field/select-field.js.map +1 -1
  131. package/lib/new-components/stack/stack.js +1 -1
  132. package/lib/new-components/stack/stack.js.map +1 -1
  133. package/lib/new-components/switch-field/switch-field.js +1 -1
  134. package/lib/new-components/switch-field/switch-field.js.map +1 -1
  135. package/lib/new-components/tabs/tabs.js +1 -1
  136. package/lib/new-components/tabs/tabs.js.map +1 -1
  137. package/lib/new-components/text/text.js +1 -1
  138. package/lib/new-components/text/text.js.map +1 -1
  139. package/lib/new-components/text-area/text-area.js +1 -1
  140. package/lib/new-components/text-area/text-area.js.map +1 -1
  141. package/lib/new-components/text-field/text-field.js +1 -1
  142. package/lib/new-components/text-field/text-field.js.map +1 -1
  143. package/lib/new-components/text-link/text-link.js +1 -1
  144. package/lib/new-components/text-link/text-link.js.map +1 -1
  145. package/package.json +9 -9
  146. package/styles/base-button.css +1 -1
  147. package/styles/color-picker.css +1 -1
  148. package/styles/deprecated-button.css +1 -1
  149. package/styles/deprecated-loading.css +1 -1
  150. package/styles/deprecated-modal.css +1 -1
  151. package/styles/dropdown.css +1 -1
  152. package/styles/loading.css +1 -1
  153. package/styles/modal.css +2 -2
  154. package/styles/modal.module.css.css +1 -1
  155. package/styles/reactist.css +5 -5
  156. package/styles/spinner.module.css.css +1 -1
  157. package/styles/tip.css +1 -1
@@ -1 +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 {\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'\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?: DividerWeight\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":";;;;;;;;;IAiFMA,GAAG,gBAAGC,oBAAoB,CAAmC,SAASD,GAAT,OAsC/DE,GAtC+D;;;qBAE3DC;MAAIC,iCAAY;2BAChBC;MAAAA,sCAAW;MACXC,eAAAA;gCACAC;MAAAA,gDAAgB;MAChBC,gBAAAA;MACAC,gBAAAA;MACAC,kBAAAA;MACAC,kBAAAA;MACAC,sBAAAA;MACAC,gBAAAA;MACAC,aAAAA;MACAC,cAAAA;MACAC,kBAAAA;MACAC,cAAAA;MACAC,oBAAAA;MACAC,gBAAAA;MACAC,gBAAAA;4BACAC;MAAAA,wCAAY;MACZC,eAAAA;MACAC,gBAAAA;MACAC,gBAAAA;MACAC,kBAAAA;MACAC,oBAAAA;MACAC,qBAAAA;MACAC,mBAAAA;MACAC,cAAAA;MACAC,eAAAA;MACAC,eAAAA;MACAC,iBAAAA;MACAC,mBAAAA;MACAC,oBAAAA;MACAC,kBAAAA;MACAC,iBAAAA;MACAC,gBAAAA;MACGC;;AAIP,MAAMC,kBAAkB,YAAGd,UAAH,aAAGA,UAAH,cAAGA,UAAH,GAAiBF,QAAjB,yCAA6BD,OAArD;AACA,MAAMkB,oBAAoB,YAAGd,YAAH,aAAGA,YAAH,cAAGA,YAAH,GAAmBF,QAAnB,yCAA+BF,OAAzD;AACA,MAAMmB,qBAAqB,YAAGd,aAAH,aAAGA,aAAH,cAAGA,aAAH,GAAoBJ,QAApB,yCAAgCD,OAA3D;AACA,MAAMoB,mBAAmB,YAAGd,WAAH,aAAGA,WAAH,cAAGA,WAAH,GAAkBJ,QAAlB,yCAA8BF,OAAvD;AAEA,MAAMqB,iBAAiB,YAAGX,SAAH,aAAGA,SAAH,cAAGA,SAAH,GAAgBF,OAAhB,yCAA2BD,MAAlD;AACA,MAAMe,mBAAmB,YAAGX,WAAH,aAAGA,WAAH,cAAGA,WAAH,GAAkBF,OAAlB,yCAA6BF,MAAtD;AACA,MAAMgB,oBAAoB,YAAGX,YAAH,aAAGA,YAAH,cAAGA,YAAH,GAAmBJ,OAAnB,yCAA8BD,MAAxD;AACA,MAAMiB,kBAAkB,YAAGX,UAAH,aAAGA,UAAH,cAAGA,UAAH,GAAiBJ,OAAjB,yCAA4BF,MAApD;AAEA,MAAMkB,QAAQ,GACV,CAACzC,OAAD,IAAa,OAAOA,OAAP,KAAmB,QAAnB,IAA+BA,OAAO,KAAK,MAA3C,IAAqDA,OAAO,KAAK,YADlF;AAGA,sBAAO0C,aAAA,CACH5C,SADG,oCAGIkC,KAHJ;AAICF,IAAAA,SAAS,EACLa,UAAU,CACNb,SADM,EAENc,MAAM,CAACC,GAFD,EAGN7C,OAAO,GAAG8C,aAAa,CAACF,MAAD,EAAS,SAAT,EAAoB5C,OAApB,CAAhB,GAA+C,IAHhD,EAIND,QAAQ,KAAK,QAAb,GAAwB+C,aAAa,CAACF,MAAD,EAAS,UAAT,EAAqB7C,QAArB,CAArC,GAAsE,IAJhE,EAKNc,QAAQ,IAAI,IAAZ,GAAmBiC,aAAa,CAACF,MAAD,EAAS,UAAT,EAAqBG,MAAM,CAAClC,QAAD,CAA3B,CAAhC,GAAyE,IALnE,EAMNiC,aAAa,CAACF,MAAD,EAAS,UAAT,EAAqB9B,QAArB,CANP,EAONC,SAAS,KAAK,OAAd,GAAwB+B,aAAa,CAACF,MAAD,EAAS,WAAT,EAAsB7B,SAAtB,CAArC,GAAwE,IAPlE;AASN+B,IAAAA,aAAa,CAACE,aAAD,EAAgB,YAAhB,EAA8Bf,kBAA9B,CATP,EAUNa,aAAa,CAACE,aAAD,EAAgB,cAAhB,EAAgCd,oBAAhC,CAVP,EAWNY,aAAa,CAACE,aAAD,EAAgB,eAAhB,EAAiCb,qBAAjC,CAXP,EAYNW,aAAa,CAACE,aAAD,EAAgB,aAAhB,EAA+BZ,mBAA/B,CAZP;AAcNU,IAAAA,aAAa,CAACG,YAAD,EAAe,WAAf,EAA4BZ,iBAA5B,CAdP,EAeNS,aAAa,CAACG,YAAD,EAAe,aAAf,EAA8BX,mBAA9B,CAfP,EAgBNQ,aAAa,CAACG,YAAD,EAAe,cAAf,EAA+BV,oBAA/B,CAhBP,EAiBNO,aAAa,CAACG,YAAD,EAAe,YAAf,EAA6BT,kBAA7B,CAjBP;AAmBNC,IAAAA,QAAQ,GAAG,IAAH,GAAUK,aAAa,CAACF,MAAD,EAAS,eAAT,EAA0B3C,aAA1B,CAnBzB,EAoBNwC,QAAQ,GAAG,IAAH,GAAUK,aAAa,CAACF,MAAD,EAAS,UAAT,EAAqB1C,QAArB,CApBzB,EAqBNuC,QAAQ,GAAG,IAAH,GAAUK,aAAa,CAACF,MAAD,EAAS,YAAT,EAAuBvC,UAAvB,CArBzB,EAsBNoC,QAAQ,GAAG,IAAH,GAAUK,aAAa,CAACF,MAAD,EAAS,gBAAT,EAA2BtC,cAA3B,CAtBzB,EAuBNF,UAAU,IAAI,IAAd,GACM0C,aAAa,CAACF,MAAD,EAAS,YAAT,EAAuBG,MAAM,CAAC3C,UAAD,CAA7B,CADnB,GAEM,IAzBA,EA0BND,QAAQ,IAAI,IAAZ,GAAmB2C,aAAa,CAACF,MAAD,EAAS,UAAT,EAAqBG,MAAM,CAAC5C,QAAD,CAA3B,CAAhC,GAAyE,IA1BnE;AA4BN2C,IAAAA,aAAa,CAACF,MAAD,EAAS,UAAT,EAAqBrC,QAArB,CA5BP,EA6BNuC,aAAa,CAACF,MAAD,EAAS,OAAT,EAAkBpC,KAAlB,CA7BP,EA8BNsC,aAAa,CAACF,MAAD,EAAS,QAAT,EAAmBnC,MAAnB,CA9BP,EA+BNqC,aAAa,CAACF,MAAD,EAAS,IAAT,EAAelC,UAAf,CA/BP,EAgCNE,YAAY,KAAK,MAAjB,GACMkC,aAAa,CAACF,MAAD,EAAS,cAAT,EAAyBhC,YAAzB,CADnB,GAEM,IAlCA,EAmCND,MAAM,KAAK,MAAX,GAAoBmC,aAAa,CAACF,MAAD,EAAS,QAAT,EAAmBjC,MAAnB,CAAjC,GAA8D,IAnCxD,CAAV,IAoCKuC,SAzCV;AA0CCtD,IAAAA,GAAG,EAAHA;AA1CD,MA4CHmC,QA5CG,CAAP;AA8CH,CAnG+B;;;;"}
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 {\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'\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?: DividerWeight\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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"}
@@ -2,6 +2,7 @@ import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '.
2
2
  import { forwardRef, createElement } from 'react';
3
3
  import { BaseButton } from '../base-button/base-button.js';
4
4
 
5
+ var _excluded = ["variant", "tone", "size", "type", "disabled", "exceptionallySetClassName"];
5
6
  /**
6
7
  * A semantic button that also looks like a button, and provides all the necessary visual variants.
7
8
  * 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) {
22
23
  _ref$disabled = _ref.disabled,
23
24
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
24
25
  exceptionallySetClassName = _ref.exceptionallySetClassName,
25
- props = _objectWithoutPropertiesLoose(_ref, ["variant", "tone", "size", "type", "disabled", "exceptionallySetClassName"]);
26
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
26
27
 
27
28
  return /*#__PURE__*/createElement(BaseButton, Object.assign({}, props, {
28
29
  as: "button",
@@ -1 +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;;;;"}
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;;;;"}
@@ -3,6 +3,7 @@ import { createElement } from 'react';
3
3
  import { polymorphicComponent } from '../../utils/polymorphism.js';
4
4
  import { BaseButton } from '../base-button/base-button.js';
5
5
 
6
+ var _excluded = ["as", "variant", "tone", "size", "exceptionallySetClassName", "openInNewTab"];
6
7
  /**
7
8
  * A semantic link that looks like a button, exactly matching the `Button` component in all visual
8
9
  * aspects.
@@ -23,7 +24,7 @@ var ButtonLink = /*#__PURE__*/polymorphicComponent(function ButtonLink(_ref, ref
23
24
  exceptionallySetClassName = _ref.exceptionallySetClassName,
24
25
  _ref$openInNewTab = _ref.openInNewTab,
25
26
  openInNewTab = _ref$openInNewTab === void 0 ? false : _ref$openInNewTab,
26
- props = _objectWithoutPropertiesLoose(_ref, ["as", "variant", "tone", "size", "exceptionallySetClassName", "openInNewTab"]);
27
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
27
28
 
28
29
  return /*#__PURE__*/createElement(BaseButton, Object.assign({}, props, {
29
30
  as: as,
@@ -1 +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;;;;"}
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;;;;"}
@@ -7,6 +7,7 @@ import { useForkRef } from 'reakit-utils';
7
7
  import { CheckboxIcon } from './checkbox-icon.js';
8
8
  import styles from './checkbox-field.module.css.js';
9
9
 
10
+ var _excluded = ["label", "disabled", "indeterminate", "defaultChecked", "onChange"];
10
11
  var CheckboxField = /*#__PURE__*/forwardRef(function CheckboxField(_ref, ref) {
11
12
  var _ref2, _props$checked, _props$checked2;
12
13
 
@@ -15,7 +16,7 @@ var CheckboxField = /*#__PURE__*/forwardRef(function CheckboxField(_ref, ref) {
15
16
  indeterminate = _ref.indeterminate,
16
17
  defaultChecked = _ref.defaultChecked,
17
18
  _onChange = _ref.onChange,
18
- props = _objectWithoutPropertiesLoose(_ref, ["label", "disabled", "indeterminate", "defaultChecked", "onChange"]);
19
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
19
20
 
20
21
  var isControlledComponent = typeof props.checked === 'boolean';
21
22
 
@@ -1 +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;;;;"}
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;;AAED,wBAAmCX,QAAA,4BAAeO,KAAK,CAACE,OAArB,2DAAgCJ,cAAhC,yCAAkD,KAAlD,CAAnC;AAAA,MAAOQ,YAAP;AAAA,MAAqBC,UAArB;;AACA,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;;;;"}
@@ -1,6 +1,7 @@
1
1
  import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
2
  import { createElement } from 'react';
3
3
 
4
+ var _excluded = ["checked", "indeterminate", "disabled"];
4
5
  var svgPath = {
5
6
  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',
6
7
  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) {
37
38
  var checked = _ref2.checked,
38
39
  indeterminate = _ref2.indeterminate,
39
40
  disabled = _ref2.disabled,
40
- props = _objectWithoutPropertiesLoose(_ref2, ["checked", "indeterminate", "disabled"]);
41
+ props = _objectWithoutPropertiesLoose(_ref2, _excluded);
41
42
 
42
43
  var pathKey = getPathKey({
43
44
  checked: checked,
@@ -1 +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;;;;"}
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;;;;"}
@@ -5,12 +5,14 @@ import { getClassNames, mapResponsiveProp } from '../responsive-props.js';
5
5
  import { Box } from '../box/box.js';
6
6
  import styles from './columns.module.css.js';
7
7
 
8
+ var _excluded = ["width", "children", "exceptionallySetClassName"],
9
+ _excluded2 = ["space", "align", "alignY", "collapseBelow", "children", "exceptionallySetClassName"];
8
10
  var Column = /*#__PURE__*/polymorphicComponent(function Column(_ref, ref) {
9
11
  var _ref$width = _ref.width,
10
12
  width = _ref$width === void 0 ? 'auto' : _ref$width,
11
13
  children = _ref.children,
12
14
  exceptionallySetClassName = _ref.exceptionallySetClassName,
13
- props = _objectWithoutPropertiesLoose(_ref, ["width", "children", "exceptionallySetClassName"]);
15
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
14
16
 
15
17
  return /*#__PURE__*/createElement(Box, Object.assign({}, props, {
16
18
  className: [exceptionallySetClassName, styles.column, width !== 'content' ? getClassNames(styles, 'columnWidth', width.replace('/', '-')) : null],
@@ -30,7 +32,7 @@ var Columns = /*#__PURE__*/polymorphicComponent(function Columns(_ref2, ref) {
30
32
  collapseBelow = _ref2.collapseBelow,
31
33
  children = _ref2.children,
32
34
  exceptionallySetClassName = _ref2.exceptionallySetClassName,
33
- props = _objectWithoutPropertiesLoose(_ref2, ["space", "align", "alignY", "collapseBelow", "children", "exceptionallySetClassName"]);
35
+ props = _objectWithoutPropertiesLoose(_ref2, _excluded2);
34
36
 
35
37
  return /*#__PURE__*/createElement(Box, Object.assign({}, props, {
36
38
  className: [exceptionallySetClassName, getClassNames(styles, 'space', space)],
@@ -1 +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;;;;"}
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;;;;"}
@@ -4,10 +4,12 @@ import { getClassNames } from '../responsive-props.js';
4
4
  import { Box } from '../box/box.js';
5
5
  import styles from './divider.module.css.js';
6
6
 
7
+ var _excluded = ["weight"];
8
+
7
9
  function Divider(_ref) {
8
10
  var _ref$weight = _ref.weight,
9
11
  weight = _ref$weight === void 0 ? 'tertiary' : _ref$weight,
10
- props = _objectWithoutPropertiesLoose(_ref, ["weight"]);
12
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
11
13
 
12
14
  return /*#__PURE__*/createElement(Box, Object.assign({
13
15
  as: "hr",
@@ -1 +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'\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;;;;"}
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'\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;;;;"}
@@ -4,6 +4,7 @@ import { getClassNames } from '../responsive-props.js';
4
4
  import { Box } from '../box/box.js';
5
5
  import styles from './heading.module.css.js';
6
6
 
7
+ var _excluded = ["level", "weight", "size", "tone", "children", "lineClamp", "align", "exceptionallySetClassName"];
7
8
  var Heading = /*#__PURE__*/forwardRef(function Heading(_ref, ref) {
8
9
  var level = _ref.level,
9
10
  _ref$weight = _ref.weight,
@@ -15,7 +16,7 @@ var Heading = /*#__PURE__*/forwardRef(function Heading(_ref, ref) {
15
16
  lineClamp = _ref.lineClamp,
16
17
  align = _ref.align,
17
18
  exceptionallySetClassName = _ref.exceptionallySetClassName,
18
- props = _objectWithoutPropertiesLoose(_ref, ["level", "weight", "size", "tone", "children", "lineClamp", "align", "exceptionallySetClassName"]);
19
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
19
20
 
20
21
  // In TypeScript v4.1, this would be properly recognized without needing the type assertion
21
22
  // https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/#template-literal-types
@@ -1 +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;;;;"}
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;;;;"}
@@ -4,6 +4,7 @@ import { polymorphicComponent } from '../../utils/polymorphism.js';
4
4
  import { Box } from '../box/box.js';
5
5
  import styles from './hidden.module.css.js';
6
6
 
7
+ var _excluded = ["display", "children", "exceptionallySetClassName"];
7
8
  /**
8
9
  * A component that allows to specify how to hide itself on certain responsive screen sizes, or on
9
10
  * print media.
@@ -18,7 +19,7 @@ var Hidden = /*#__PURE__*/polymorphicComponent(function Hidden(_ref, ref) {
18
19
  display = _ref$display === void 0 ? 'block' : _ref$display,
19
20
  children = _ref.children,
20
21
  exceptionallySetClassName = _ref.exceptionallySetClassName,
21
- props = _objectWithoutPropertiesLoose(_ref, ["display", "children", "exceptionallySetClassName"]);
22
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
22
23
 
23
24
  var hiddenOnPrint = 'print' in props && props.print;
24
25
  var hiddenOnDesktop = ('above' in props);
@@ -1 +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;;;;"}
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;;;;"}
@@ -1,6 +1,7 @@
1
1
  import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
2
2
  import { createElement } from 'react';
3
3
 
4
+ var _excluded = ["tone"];
4
5
  var alertIconForTone = {
5
6
  info: AlertInfoIcon,
6
7
  positive: AlertPositiveIcon,
@@ -10,7 +11,7 @@ var alertIconForTone = {
10
11
 
11
12
  function AlertIcon(_ref) {
12
13
  var tone = _ref.tone,
13
- props = _objectWithoutPropertiesLoose(_ref, ["tone"]);
14
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
14
15
 
15
16
  var Icon = alertIconForTone[tone];
16
17
  return Icon ? /*#__PURE__*/createElement(Icon, Object.assign({}, props)) : null;
@@ -1 +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;;;;"}
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;;;;"}
@@ -5,6 +5,7 @@ import { getClassNames, mapResponsiveProp } from '../responsive-props.js';
5
5
  import { Box } from '../box/box.js';
6
6
  import styles from './inline.module.css.js';
7
7
 
8
+ var _excluded = ["as", "space", "align", "alignY", "children", "exceptionallySetClassName"];
8
9
  var Inline = /*#__PURE__*/polymorphicComponent(function Inline(_ref, ref) {
9
10
  var as = _ref.as,
10
11
  space = _ref.space,
@@ -14,7 +15,7 @@ var Inline = /*#__PURE__*/polymorphicComponent(function Inline(_ref, ref) {
14
15
  alignY = _ref$alignY === void 0 ? 'center' : _ref$alignY,
15
16
  children = _ref.children,
16
17
  exceptionallySetClassName = _ref.exceptionallySetClassName,
17
- props = _objectWithoutPropertiesLoose(_ref, ["as", "space", "align", "alignY", "children", "exceptionallySetClassName"]);
18
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
18
19
 
19
20
  return /*#__PURE__*/createElement(Box, null, /*#__PURE__*/createElement(Box, Object.assign({}, props, {
20
21
  as: as,
@@ -1 +1 @@
1
- {"version":3,"file":"inline.js","sources":["../../../src/new-components/inline/inline.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 } from '../responsive-props'\nimport type { Space } from '../common-types'\nimport type { ReusableBoxProps } from '../box'\n\nimport styles from './inline.module.css'\n\ntype InlineAlign = 'left' | 'center' | 'right'\n\ninterface InlineProps extends ReusableBoxProps {\n space?: ResponsiveProp<Space>\n align?: ResponsiveProp<InlineAlign>\n alignY?: ResponsiveProp<'top' | 'center' | 'bottom'>\n}\n\nconst Inline = polymorphicComponent<'div', InlineProps>(function Inline(\n { as, space, align = 'left', alignY = 'center', children, exceptionallySetClassName, ...props },\n ref,\n) {\n return (\n <Box>\n <Box\n {...props}\n as={as}\n display=\"flex\"\n flexWrap=\"wrap\"\n className={[exceptionallySetClassName, getClassNames(styles, 'space', space)]}\n ref={ref}\n alignItems={mapResponsiveProp(alignY, (alignY) =>\n alignY === 'top' ? 'flexStart' : alignY === 'bottom' ? 'flexEnd' : 'center',\n )}\n justifyContent={mapResponsiveProp(align, (align) =>\n align === 'left' ? 'flexStart' : align === 'right' ? 'flexEnd' : 'center',\n )}\n >\n {children}\n </Box>\n </Box>\n )\n})\n\nexport type { InlineProps, InlineAlign }\nexport { Inline }\n"],"names":["Inline","polymorphicComponent","ref","as","space","align","alignY","children","exceptionallySetClassName","props","React","Box","display","flexWrap","className","getClassNames","styles","alignItems","mapResponsiveProp","justifyContent"],"mappings":";;;;;;;IAmBMA,MAAM,gBAAGC,oBAAoB,CAAqB,SAASD,MAAT,OAEpDE,GAFoD;MAClDC,UAAAA;MAAIC,aAAAA;wBAAOC;MAAAA,gCAAQ;yBAAQC;MAAAA,kCAAS;MAAUC,gBAAAA;MAAUC,iCAAAA;MAA8BC;;AAGxF,sBACIC,aAAA,CAACC,GAAD,MAAA,eACID,aAAA,CAACC,GAAD,oBACQF;AACJN,IAAAA,EAAE,EAAEA;AACJS,IAAAA,OAAO,EAAC;AACRC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,SAAS,EAAE,CAACN,yBAAD,EAA4BO,aAAa,CAACC,MAAD,EAAS,OAAT,EAAkBZ,KAAlB,CAAzC;AACXF,IAAAA,GAAG,EAAEA;AACLe,IAAAA,UAAU,EAAEC,iBAAiB,CAACZ,MAAD,EAAS,UAACA,MAAD;AAAA,aAClCA,MAAM,KAAK,KAAX,GAAmB,WAAnB,GAAiCA,MAAM,KAAK,QAAX,GAAsB,SAAtB,GAAkC,QADjC;AAAA,KAAT;AAG7Ba,IAAAA,cAAc,EAAED,iBAAiB,CAACb,KAAD,EAAQ,UAACA,KAAD;AAAA,aACrCA,KAAK,KAAK,MAAV,GAAmB,WAAnB,GAAiCA,KAAK,KAAK,OAAV,GAAoB,SAApB,GAAgC,QAD5B;AAAA,KAAR;IAVrC,EAcKE,QAdL,CADJ,CADJ;AAoBH,CAxBkC;;;;"}
1
+ {"version":3,"file":"inline.js","sources":["../../../src/new-components/inline/inline.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 } from '../responsive-props'\nimport type { Space } from '../common-types'\nimport type { ReusableBoxProps } from '../box'\n\nimport styles from './inline.module.css'\n\ntype InlineAlign = 'left' | 'center' | 'right'\n\ninterface InlineProps extends ReusableBoxProps {\n space?: ResponsiveProp<Space>\n align?: ResponsiveProp<InlineAlign>\n alignY?: ResponsiveProp<'top' | 'center' | 'bottom'>\n}\n\nconst Inline = polymorphicComponent<'div', InlineProps>(function Inline(\n { as, space, align = 'left', alignY = 'center', children, exceptionallySetClassName, ...props },\n ref,\n) {\n return (\n <Box>\n <Box\n {...props}\n as={as}\n display=\"flex\"\n flexWrap=\"wrap\"\n className={[exceptionallySetClassName, getClassNames(styles, 'space', space)]}\n ref={ref}\n alignItems={mapResponsiveProp(alignY, (alignY) =>\n alignY === 'top' ? 'flexStart' : alignY === 'bottom' ? 'flexEnd' : 'center',\n )}\n justifyContent={mapResponsiveProp(align, (align) =>\n align === 'left' ? 'flexStart' : align === 'right' ? 'flexEnd' : 'center',\n )}\n >\n {children}\n </Box>\n </Box>\n )\n})\n\nexport type { InlineProps, InlineAlign }\nexport { Inline }\n"],"names":["Inline","polymorphicComponent","ref","as","space","align","alignY","children","exceptionallySetClassName","props","React","Box","display","flexWrap","className","getClassNames","styles","alignItems","mapResponsiveProp","justifyContent"],"mappings":";;;;;;;;IAmBMA,MAAM,gBAAGC,oBAAoB,CAAqB,SAASD,MAAT,OAEpDE,GAFoD;MAClDC,UAAAA;MAAIC,aAAAA;wBAAOC;MAAAA,gCAAQ;yBAAQC;MAAAA,kCAAS;MAAUC,gBAAAA;MAAUC,iCAAAA;MAA8BC;;AAGxF,sBACIC,aAAA,CAACC,GAAD,MAAA,eACID,aAAA,CAACC,GAAD,oBACQF;AACJN,IAAAA,EAAE,EAAEA;AACJS,IAAAA,OAAO,EAAC;AACRC,IAAAA,QAAQ,EAAC;AACTC,IAAAA,SAAS,EAAE,CAACN,yBAAD,EAA4BO,aAAa,CAACC,MAAD,EAAS,OAAT,EAAkBZ,KAAlB,CAAzC;AACXF,IAAAA,GAAG,EAAEA;AACLe,IAAAA,UAAU,EAAEC,iBAAiB,CAACZ,MAAD,EAAS,UAACA,MAAD;AAAA,aAClCA,MAAM,KAAK,KAAX,GAAmB,WAAnB,GAAiCA,MAAM,KAAK,QAAX,GAAsB,SAAtB,GAAkC,QADjC;AAAA,KAAT;AAG7Ba,IAAAA,cAAc,EAAED,iBAAiB,CAACb,KAAD,EAAQ,UAACA,KAAD;AAAA,aACrCA,KAAK,KAAK,MAAV,GAAmB,WAAnB,GAAiCA,KAAK,KAAK,OAAV,GAAoB,SAApB,GAAgC,QAD5B;AAAA,KAAR;IAVrC,EAcKE,QAdL,CADJ,CADJ;AAoBH,CAxBkC;;;;"}
@@ -3,6 +3,7 @@ import React__default from 'react';
3
3
  import { Box } from '../box/box.js';
4
4
  import { Spinner } from '../spinner/spinner.js';
5
5
 
6
+ var _excluded = ["size", "exceptionallySetClassName"];
6
7
  var sizeMapping = {
7
8
  small: 24,
8
9
  medium: 36,
@@ -15,7 +16,7 @@ function Loading(_ref) {
15
16
  var _ref$size = _ref.size,
16
17
  size = _ref$size === void 0 ? 'small' : _ref$size,
17
18
  exceptionallySetClassName = _ref.exceptionallySetClassName,
18
- props = _objectWithoutPropertiesLoose(_ref, ["size", "exceptionallySetClassName"]);
19
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
19
20
 
20
21
  var numericSize = (_sizeMapping$size = sizeMapping[size]) !== null && _sizeMapping$size !== void 0 ? _sizeMapping$size : sizeMapping.small;
21
22
  return /*#__PURE__*/React__default.createElement(Box, Object.assign({}, props, {
@@ -1 +1 @@
1
- {"version":3,"file":"loading.js","sources":["../../../src/new-components/loading/loading.tsx"],"sourcesContent":["import React from 'react'\nimport { Box } from '../box'\nimport { Spinner } from '../spinner'\n\ntype Size = 'small' | 'medium' | 'large'\n\ntype NativeProps = Omit<\n JSX.IntrinsicElements['div'],\n 'className' | 'aria-label' | 'aria-labelledby' | 'role' | 'size'\n>\n\ntype LoadingProps = NativeProps & {\n /**\n * The size of the loading spinner.\n * @default 'small'\n */\n size?: Size\n exceptionallySetClassName?: string\n} & (\n | {\n /**\n * The non-visual label used for assistive technologies.\n */\n 'aria-label': string\n 'aria-labelledby'?: never\n }\n | {\n /**\n * The non-visual label used for assistive technologies.\n */\n 'aria-labelledby': string\n 'aria-label'?: never\n }\n )\n\nconst sizeMapping: Record<Size, number> = {\n small: 24,\n medium: 36,\n large: 48,\n}\n\nfunction Loading({ size = 'small', exceptionallySetClassName, ...props }: LoadingProps) {\n const numericSize = sizeMapping[size] ?? sizeMapping.small\n return (\n <Box\n {...props}\n className={exceptionallySetClassName}\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n role=\"progressbar\"\n >\n <Spinner size={numericSize} />\n </Box>\n )\n}\n\nexport { Loading }\nexport type { LoadingProps }\n"],"names":["sizeMapping","small","medium","large","Loading","size","exceptionallySetClassName","props","numericSize","React","Box","className","display","alignItems","justifyContent","role","Spinner"],"mappings":";;;;;AAmCA,IAAMA,WAAW,GAAyB;AACtCC,EAAAA,KAAK,EAAE,EAD+B;AAEtCC,EAAAA,MAAM,EAAE,EAF8B;AAGtCC,EAAAA,KAAK,EAAE;AAH+B,CAA1C;;AAMA,SAASC,OAAT;;;uBAAmBC;MAAAA,8BAAO;MAASC,iCAAAA;MAA8BC;;AAC7D,MAAMC,WAAW,wBAAGR,WAAW,CAACK,IAAD,CAAd,iEAAwBL,WAAW,CAACC,KAArD;AACA,sBACIQ,4BAAA,CAACC,GAAD,oBACQH;AACJI,IAAAA,SAAS,EAAEL;AACXM,IAAAA,OAAO,EAAC;AACRC,IAAAA,UAAU,EAAC;AACXC,IAAAA,cAAc,EAAC;AACfC,IAAAA,IAAI,EAAC;IANT,eAQIN,4BAAA,CAACO,OAAD;AAASX,IAAAA,IAAI,EAAEG;GAAf,CARJ,CADJ;AAYH;;;;"}
1
+ {"version":3,"file":"loading.js","sources":["../../../src/new-components/loading/loading.tsx"],"sourcesContent":["import React from 'react'\nimport { Box } from '../box'\nimport { Spinner } from '../spinner'\n\ntype Size = 'small' | 'medium' | 'large'\n\ntype NativeProps = Omit<\n JSX.IntrinsicElements['div'],\n 'className' | 'aria-label' | 'aria-labelledby' | 'role' | 'size'\n>\n\ntype LoadingProps = NativeProps & {\n /**\n * The size of the loading spinner.\n * @default 'small'\n */\n size?: Size\n exceptionallySetClassName?: string\n} & (\n | {\n /**\n * The non-visual label used for assistive technologies.\n */\n 'aria-label': string\n 'aria-labelledby'?: never\n }\n | {\n /**\n * The non-visual label used for assistive technologies.\n */\n 'aria-labelledby': string\n 'aria-label'?: never\n }\n )\n\nconst sizeMapping: Record<Size, number> = {\n small: 24,\n medium: 36,\n large: 48,\n}\n\nfunction Loading({ size = 'small', exceptionallySetClassName, ...props }: LoadingProps) {\n const numericSize = sizeMapping[size] ?? sizeMapping.small\n return (\n <Box\n {...props}\n className={exceptionallySetClassName}\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n role=\"progressbar\"\n >\n <Spinner size={numericSize} />\n </Box>\n )\n}\n\nexport { Loading }\nexport type { LoadingProps }\n"],"names":["sizeMapping","small","medium","large","Loading","size","exceptionallySetClassName","props","numericSize","React","Box","className","display","alignItems","justifyContent","role","Spinner"],"mappings":";;;;;;AAmCA,IAAMA,WAAW,GAAyB;AACtCC,EAAAA,KAAK,EAAE,EAD+B;AAEtCC,EAAAA,MAAM,EAAE,EAF8B;AAGtCC,EAAAA,KAAK,EAAE;AAH+B,CAA1C;;AAMA,SAASC,OAAT;;;uBAAmBC;MAAAA,8BAAO;MAASC,iCAAAA;MAA8BC;;AAC7D,MAAMC,WAAW,wBAAGR,WAAW,CAACK,IAAD,CAAd,iEAAwBL,WAAW,CAACC,KAArD;AACA,sBACIQ,4BAAA,CAACC,GAAD,oBACQH;AACJI,IAAAA,SAAS,EAAEL;AACXM,IAAAA,OAAO,EAAC;AACRC,IAAAA,UAAU,EAAC;AACXC,IAAAA,cAAc,EAAC;AACfC,IAAAA,IAAI,EAAC;IANT,eAQIN,4BAAA,CAACO,OAAD;AAASX,IAAAA,IAAI,EAAEG;GAAf,CARJ,CADJ;AAYH;;;;"}
@@ -11,6 +11,11 @@ import { DialogOverlay, DialogContent } from '@reach/dialog';
11
11
  import FocusLock from 'react-focus-lock';
12
12
  import styles from './modal.module.css.js';
13
13
 
14
+ var _excluded = ["isOpen", "onDismiss", "height", "width", "exceptionallySetClassName", "autoFocus", "children"],
15
+ _excluded2 = ["children", "button", "withDivider", "exceptionallySetClassName"],
16
+ _excluded3 = ["exceptionallySetClassName", "children"],
17
+ _excluded4 = ["exceptionallySetClassName", "withDivider"],
18
+ _excluded5 = ["children"];
14
19
  var ModalContext = /*#__PURE__*/createContext({
15
20
  onDismiss: undefined,
16
21
  height: 'fitContent'
@@ -41,7 +46,7 @@ function Modal(_ref) {
41
46
  _ref$autoFocus = _ref.autoFocus,
42
47
  autoFocus = _ref$autoFocus === void 0 ? true : _ref$autoFocus,
43
48
  children = _ref.children,
44
- props = _objectWithoutPropertiesLoose(_ref, ["isOpen", "onDismiss", "height", "width", "exceptionallySetClassName", "autoFocus", "children"]);
49
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
45
50
 
46
51
  var contextValue = useMemo(function () {
47
52
  return {
@@ -105,7 +110,7 @@ function ModalHeader(_ref2) {
105
110
  _ref2$withDivider = _ref2.withDivider,
106
111
  withDivider = _ref2$withDivider === void 0 ? false : _ref2$withDivider,
107
112
  exceptionallySetClassName = _ref2.exceptionallySetClassName,
108
- props = _objectWithoutPropertiesLoose(_ref2, ["children", "button", "withDivider", "exceptionallySetClassName"]);
113
+ props = _objectWithoutPropertiesLoose(_ref2, _excluded2);
109
114
 
110
115
  return /*#__PURE__*/createElement(Fragment, null, /*#__PURE__*/createElement(Box, Object.assign({}, props, {
111
116
  as: "header",
@@ -141,7 +146,7 @@ function ModalHeader(_ref2) {
141
146
  function ModalBody(_ref3) {
142
147
  var exceptionallySetClassName = _ref3.exceptionallySetClassName,
143
148
  children = _ref3.children,
144
- props = _objectWithoutPropertiesLoose(_ref3, ["exceptionallySetClassName", "children"]);
149
+ props = _objectWithoutPropertiesLoose(_ref3, _excluded3);
145
150
 
146
151
  var _React$useContext2 = useContext(ModalContext),
147
152
  height = _React$useContext2.height;
@@ -168,7 +173,7 @@ function ModalFooter(_ref4) {
168
173
  var exceptionallySetClassName = _ref4.exceptionallySetClassName,
169
174
  _ref4$withDivider = _ref4.withDivider,
170
175
  withDivider = _ref4$withDivider === void 0 ? false : _ref4$withDivider,
171
- props = _objectWithoutPropertiesLoose(_ref4, ["exceptionallySetClassName", "withDivider"]);
176
+ props = _objectWithoutPropertiesLoose(_ref4, _excluded4);
172
177
 
173
178
  return /*#__PURE__*/createElement(Fragment, null, withDivider ? /*#__PURE__*/createElement(Divider, null) : null, /*#__PURE__*/createElement(Box, Object.assign({
174
179
  as: "footer"
@@ -187,7 +192,7 @@ function ModalFooter(_ref4) {
187
192
 
188
193
  function ModalActions(_ref5) {
189
194
  var children = _ref5.children,
190
- props = _objectWithoutPropertiesLoose(_ref5, ["children"]);
195
+ props = _objectWithoutPropertiesLoose(_ref5, _excluded5);
191
196
 
192
197
  return /*#__PURE__*/createElement(ModalFooter, Object.assign({}, props), /*#__PURE__*/createElement(Inline, {
193
198
  align: "right",