@atom-learning/components 2.61.2 → 2.62.0

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 (101) hide show
  1. package/CHANGELOG.md +5 -3
  2. package/dist/components/accordion/AccordionTrigger.js +1 -1
  3. package/dist/components/action-icon/ActionIcon.js +1 -1
  4. package/dist/components/avatar/AvatarInitial.js +1 -1
  5. package/dist/components/banner/BannerContext.js +1 -1
  6. package/dist/components/banner/banner-regular/BannerRegularActions.js +1 -1
  7. package/dist/components/banner/banner-regular/BannerRegularButton.js +1 -1
  8. package/dist/components/banner/banner-regular/BannerRegularContent.js +1 -1
  9. package/dist/components/button/Button.js +1 -1
  10. package/dist/components/calendar/Calendar.js +1 -1
  11. package/dist/components/carousel/CarouselSlide.js +1 -1
  12. package/dist/components/checkbox/Checkbox.js +1 -1
  13. package/dist/components/chip/Chip.js +1 -1
  14. package/dist/components/chip/ChipGroup.js +1 -1
  15. package/dist/components/chip-dismissible-group/ChipDismissibleGroupRoot.js +1 -1
  16. package/dist/components/chip-toggle-group/ChipToggleGroupItem.js +1 -1
  17. package/dist/components/combobox/Combobox.js +1 -1
  18. package/dist/components/combobox/ComboboxInput.d.ts +5 -1
  19. package/dist/components/combobox/ComboboxInput.js +1 -1
  20. package/dist/components/combobox/ComboboxInput.js.map +1 -1
  21. package/dist/components/create-password-field/CreatePasswordField.d.ts +1 -1
  22. package/dist/components/create-password-field/CreatePasswordField.js +1 -1
  23. package/dist/components/create-password-field/CreatePasswordField.js.map +1 -1
  24. package/dist/components/data-table/DataTableBody.js +1 -1
  25. package/dist/components/data-table/DataTableGlobalFilter.js +1 -1
  26. package/dist/components/data-table/DataTableLoading.js +1 -1
  27. package/dist/components/data-table/DataTableRowSelectionCheckbox.js +1 -1
  28. package/dist/components/data-table/DataTableSelectAllRowsCheckbox.js +1 -1
  29. package/dist/components/data-table/drag-and-drop/DragAndDropTableBody.js +1 -1
  30. package/dist/components/data-table/useSorting.js +1 -1
  31. package/dist/components/date-input/DateInput.d.ts +2 -2
  32. package/dist/components/date-input/DateInput.js +1 -1
  33. package/dist/components/date-input/DateInput.js.map +1 -1
  34. package/dist/components/dismissible/DismissibleRoot.js +1 -1
  35. package/dist/components/dismissible/DismissibleTrigger.js +1 -1
  36. package/dist/components/divider/Divider.js +1 -1
  37. package/dist/components/field-wrapper/FieldDescription.js +1 -1
  38. package/dist/components/field-wrapper/InlineFieldWrapper.js +1 -1
  39. package/dist/components/grid/Grid.js +1 -1
  40. package/dist/components/icon/Icon.js +1 -1
  41. package/dist/components/inline-message/InlineMessage.js +1 -1
  42. package/dist/components/input/Input.d.ts +1 -1
  43. package/dist/components/input/Input.js +1 -1
  44. package/dist/components/input/Input.js.map +1 -1
  45. package/dist/components/label/Label.js +1 -1
  46. package/dist/components/link/Link.js +1 -1
  47. package/dist/components/list/List.js +1 -1
  48. package/dist/components/markdown-content/MarkdownContent.js +1 -1
  49. package/dist/components/markdown-content/components/MarkdownCode.js +1 -1
  50. package/dist/components/markdown-content/components/MarkdownEmphasis.js +1 -1
  51. package/dist/components/markdown-content/components/MarkdownImage.js +1 -1
  52. package/dist/components/markdown-content/components/MarkdownInlineCode.js +1 -1
  53. package/dist/components/markdown-content/components/MarkdownListItem.js +1 -1
  54. package/dist/components/markdown-content/components/MarkdownParagraph.js +1 -1
  55. package/dist/components/markdown-content/components/MarkdownStrong.js +1 -1
  56. package/dist/components/markdown-content/components/MarkdownThematicBreak.js +1 -1
  57. package/dist/components/number-input/NumberInput.d.ts +1 -1
  58. package/dist/components/number-input/NumberInput.js +1 -1
  59. package/dist/components/number-input/NumberInput.js.map +1 -1
  60. package/dist/components/number-input/NumberInputStepper.js +1 -1
  61. package/dist/components/number-input/NumberInputStepper.js.map +1 -1
  62. package/dist/components/number-input-field/NumberInputField.js +1 -1
  63. package/dist/components/pagination/PaginationItem.js +1 -1
  64. package/dist/components/password-field/PasswordField.js +1 -1
  65. package/dist/components/password-input/PasswordInput.js +1 -1
  66. package/dist/components/password-input/PasswordInput.js.map +1 -1
  67. package/dist/components/popover/PopoverContent.js +1 -1
  68. package/dist/components/radio-button-field/RadioButtonField.js +1 -1
  69. package/dist/components/radio-button-field/RadioField.js +1 -1
  70. package/dist/components/radio-card/RadioCardGroup.js +1 -1
  71. package/dist/components/search-input/SearchInput.d.ts +1 -1
  72. package/dist/components/search-input/SearchInput.js +1 -1
  73. package/dist/components/search-input/SearchInput.js.map +1 -1
  74. package/dist/components/section-message/SectionMessageDescription.js +1 -1
  75. package/dist/components/section-message/SectionMessageIcon.js +1 -1
  76. package/dist/components/select/Select.d.ts +1 -1
  77. package/dist/components/select/Select.js +1 -1
  78. package/dist/components/select/Select.js.map +1 -1
  79. package/dist/components/select-field/SelectField.js +1 -1
  80. package/dist/components/sortable/SortableHandle.js +1 -1
  81. package/dist/components/stepper/StepperStepBack.js +1 -1
  82. package/dist/components/stepper/StepperStepForward.js +1 -1
  83. package/dist/components/table/TableHeader.js +1 -1
  84. package/dist/components/table/TableRow.js +1 -1
  85. package/dist/components/tabs/Tabs.js +1 -1
  86. package/dist/components/tabs/TabsTrigger.js +1 -1
  87. package/dist/components/text/Text.js +1 -1
  88. package/dist/components/tile-toggle-group/TileToggleGroupItem.js +1 -1
  89. package/dist/components/toast/Toast.js +1 -1
  90. package/dist/components/toast/ToastProvider.js +1 -1
  91. package/dist/components/toggle-group/ToggleGroupButton.js +1 -1
  92. package/dist/components/video/Video.js +1 -1
  93. package/dist/docgen.json +1 -1
  94. package/dist/index.cjs.js +1 -1
  95. package/dist/index.cjs.js.map +1 -1
  96. package/dist/utilities/hooks/useCallbackRef.js +1 -1
  97. package/dist/utilities/style/get-icon-size.d.ts +1 -0
  98. package/dist/utilities/style/get-icon-size.js +2 -0
  99. package/dist/utilities/style/get-icon-size.js.map +1 -0
  100. package/dist/utilities/style/index.d.ts +1 -0
  101. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,9 +1,11 @@
1
- ## [2.61.2](https://github.com/Atom-Learning/components/compare/v2.61.1...v2.61.2) (2023-07-18)
1
+ # [2.62.0](https://github.com/Atom-Learning/components/compare/v2.61.2...v2.62.0) (2023-07-25)
2
2
 
3
3
 
4
- ### Bug Fixes
4
+ ### Features
5
5
 
6
- * override name prop to be optional ([5731da6](https://github.com/Atom-Learning/components/commit/5731da65ab5bc7d93abb7426de827a2ae5582e9f))
6
+ * added lg size for input fields ([00a58a3](https://github.com/Atom-Learning/components/commit/00a58a3414354c5f46e307e6582e4961f32775d8))
7
+ * updated docs, addressed review comments ([9e9a2b4](https://github.com/Atom-Learning/components/commit/9e9a2b46a847b316d5f07056d458c0ff43f4fd32))
8
+ * updated snapshot ([383271b](https://github.com/Atom-Learning/components/commit/383271bc00745ba77893fa1e043e500fc5e3ad24))
7
9
 
8
10
  # [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.4.0) (2022-04-11)
9
11
 
@@ -1,2 +1,2 @@
1
- import{ChevronDown as a}from"@atom-learning/icons";import{Trigger as s}from"@radix-ui/react-accordion";import t from"react";import{ColorScheme as n}from"../../experiments/color-scheme/ColorScheme.js";import{styled as e}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as c}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";import{Icon as m}from"../icon/Icon.js";const d=e(m,{transition:"transform 300ms",'[data-state="open"] > &':{transform:"rotate(180deg)"},'[data-state="closed"] > &':{transform:"rotate(0deg)"}}),l=e(s,{border:0,py:"$3",px:"$4",width:"100%",display:"flex",justifyContent:"space-between",alignItems:"center",cursor:"pointer",bg:"$interactive2",color:"$interactiveForeground","&[data-disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([data-disabled])":{"&:active, &:hover, &:focus-visible":{bg:"$interactive3"},"&:focus-visible":{...c()}},'&[data-state="open"]':{borderRadius:"$0 $0 0 0"},'&[data-state="closed"]':{borderRadius:"$0"}}),p=({children:o,colorScheme:r={},...i})=>t.createElement(n,{asChild:!0,accent:"grey1",interactive:"loContrast",...r},t.createElement(l,{...i},o,t.createElement(d,{is:a})));export{p as AccordionTrigger};
1
+ import{ChevronDown as a}from"@atom-learning/icons";import{Trigger as s}from"@radix-ui/react-accordion";import e from"react";import{ColorScheme as n}from"../../experiments/color-scheme/ColorScheme.js";import{styled as t}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as c}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";import{Icon as m}from"../icon/Icon.js";const d=t(m,{transition:"transform 300ms",'[data-state="open"] > &':{transform:"rotate(180deg)"},'[data-state="closed"] > &':{transform:"rotate(0deg)"}}),l=t(s,{border:0,py:"$3",px:"$4",width:"100%",display:"flex",justifyContent:"space-between",alignItems:"center",cursor:"pointer",bg:"$interactive2",color:"$interactiveForeground","&[data-disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([data-disabled])":{"&:active, &:hover, &:focus-visible":{bg:"$interactive3"},"&:focus-visible":{...c()}},'&[data-state="open"]':{borderRadius:"$0 $0 0 0"},'&[data-state="closed"]':{borderRadius:"$0"}}),p=({children:o,colorScheme:r={},...i})=>e.createElement(n,{asChild:!0,accent:"grey1",interactive:"loContrast",...r},e.createElement(l,{...i},o,e.createElement(d,{is:a})));export{p as AccordionTrigger};
2
2
  //# sourceMappingURL=AccordionTrigger.js.map
@@ -1,2 +1,2 @@
1
- import{darken as o}from"color2k";import b from"invariant";import*as e from"react";import{styled as v,theme as n}from"../../stitches.js";import{Icon as u}from"../icon/Icon.js";import{Tooltip as $}from"../tooltip/Tooltip.js";import{ActionIconSizeMap as M}from"./ActionIcon.constants.js";const l=(r,a,s)=>({bg:"transparent",color:r,"&:not(:disabled):hover, &:not(:disabled):focus":{color:a},"&:not(:disabled):active":{color:s},"&[disabled]":{color:"$tonal400",cursor:"not-allowed"}}),c=(r,a,s)=>({bg:r,color:"white","&:not(:disabled):hover, &:not(:disabled):focus":{bg:a,color:"white"},"&:not(:disabled):active":{bg:s},"&[disabled]":{bg:"$tonal100",color:"$tonal400",cursor:"not-allowed"}}),p=(r,a,s)=>({border:"1px solid",borderColor:"currentColor",color:r,"&:not(:disabled):hover, &:not(:disabled):focus":{color:a},"&:not(:disabled):active":{color:s},"&[disabled]":{borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"}}),C=v("button",{alignItems:"center",appearance:"none",bg:"white",border:"unset",borderRadius:"$0",boxSizing:"border-box",cursor:"pointer",display:"flex",justifyContent:"center",p:"unset",transition:"all 100ms ease-out",variants:{theme:{neutral:{},primary:{},success:{},warning:{},danger:{}},appearance:{simple:{},outline:{},solid:{}},size:{xs:{size:"$2"},sm:{size:"$3"},md:{size:"$4"},lg:{size:"$5"}},isRounded:{true:{borderRadius:"$round"}}},compoundVariants:[{theme:"neutral",appearance:"simple",css:l("$tonal300","$primaryMid","$primaryDark")},{theme:"primary",appearance:"simple",css:l("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"simple",css:l("$primaryDark",o(n.colors.primaryDark.value,.1),o(n.colors.primaryDark.value,.15))},{theme:"success",appearance:"simple",css:l("$success","$successMid","$successDark")},{theme:"warning",appearance:"simple",css:l("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"simple",css:l("$danger","$dangerMid","$dangerDark")},{theme:"primary",appearance:"solid",css:c("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"solid",css:c("$primaryDark",o(n.colors.primaryDark.value,.1),o(n.colors.primaryDark.value,.15))},{theme:"success",appearance:"solid",css:c("$success","$successMid","$successDark")},{theme:"warning",appearance:"solid",css:c("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"solid",css:c("$danger","$dangerMid","$dangerDark")},{theme:"primary",appearance:"outline",css:p("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"outline",css:p("$primaryDark",o(n.colors.primaryDark.value,.1),o(n.colors.primaryDark.value,.15))},{theme:"success",appearance:"outline",css:p("$success","$successMid","$successDark")},{theme:"warning",appearance:"outline",css:p("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"outline",css:p("$danger","$dangerMid","$dangerDark")}]}),z=({hasTooltip:r,label:a,tooltipSide:s,children:t})=>r?e.createElement($,null,e.createElement($.Trigger,{asChild:!0},t),e.createElement($.Content,{side:s},a)):e.createElement(e.Fragment,null,t),d=e.forwardRef(({children:r,theme:a="primary",appearance:s="simple",size:t="sm",label:y,href:h,disabled:m,hasTooltip:k=!0,tooltipSide:D,...w},f)=>{const g=`A single ${u.displayName} component is permitted as a child of ${d.displayName}`;return b(e.Children.count(r)===1,g),e.createElement(z,{hasTooltip:k,label:y,tooltipSide:D},e.createElement(C,{...h?{as:"a",href:m?null:h,onClick:void 0,"aria-disabled":!!m}:{type:"button"},...w,"aria-label":y,theme:a,appearance:s,size:t,ref:f,disabled:m},e.Children.map(r,i=>{if(!e.isValidElement(i))throw new Error(g);return b(i.type===u,`Children of type ${i==null?void 0:i.type} aren't permitted. Only an ${u.displayName} component is allowed in ${d.displayName}`),e.cloneElement(i,{size:M[t],css:{...i.props.css?i.props.css:{}}})})))});d.displayName="ActionIcon";export{d as ActionIcon};
1
+ import{darken as o}from"color2k";import b from"invariant";import*as e from"react";import{styled as v,theme as n}from"../../stitches.js";import{Icon as $}from"../icon/Icon.js";import{Tooltip as u}from"../tooltip/Tooltip.js";import{ActionIconSizeMap as M}from"./ActionIcon.constants.js";const l=(r,a,s)=>({bg:"transparent",color:r,"&:not(:disabled):hover, &:not(:disabled):focus":{color:a},"&:not(:disabled):active":{color:s},"&[disabled]":{color:"$tonal400",cursor:"not-allowed"}}),c=(r,a,s)=>({bg:r,color:"white","&:not(:disabled):hover, &:not(:disabled):focus":{bg:a,color:"white"},"&:not(:disabled):active":{bg:s},"&[disabled]":{bg:"$tonal100",color:"$tonal400",cursor:"not-allowed"}}),p=(r,a,s)=>({border:"1px solid",borderColor:"currentColor",color:r,"&:not(:disabled):hover, &:not(:disabled):focus":{color:a},"&:not(:disabled):active":{color:s},"&[disabled]":{borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"}}),C=v("button",{alignItems:"center",appearance:"none",bg:"white",border:"unset",borderRadius:"$0",boxSizing:"border-box",cursor:"pointer",display:"flex",justifyContent:"center",p:"unset",transition:"all 100ms ease-out",variants:{theme:{neutral:{},primary:{},success:{},warning:{},danger:{}},appearance:{simple:{},outline:{},solid:{}},size:{xs:{size:"$2"},sm:{size:"$3"},md:{size:"$4"},lg:{size:"$5"}},isRounded:{true:{borderRadius:"$round"}}},compoundVariants:[{theme:"neutral",appearance:"simple",css:l("$tonal300","$primaryMid","$primaryDark")},{theme:"primary",appearance:"simple",css:l("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"simple",css:l("$primaryDark",o(n.colors.primaryDark.value,.1),o(n.colors.primaryDark.value,.15))},{theme:"success",appearance:"simple",css:l("$success","$successMid","$successDark")},{theme:"warning",appearance:"simple",css:l("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"simple",css:l("$danger","$dangerMid","$dangerDark")},{theme:"primary",appearance:"solid",css:c("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"solid",css:c("$primaryDark",o(n.colors.primaryDark.value,.1),o(n.colors.primaryDark.value,.15))},{theme:"success",appearance:"solid",css:c("$success","$successMid","$successDark")},{theme:"warning",appearance:"solid",css:c("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"solid",css:c("$danger","$dangerMid","$dangerDark")},{theme:"primary",appearance:"outline",css:p("$primary","$primaryMid","$primaryDark")},{theme:"primaryDark",appearance:"outline",css:p("$primaryDark",o(n.colors.primaryDark.value,.1),o(n.colors.primaryDark.value,.15))},{theme:"success",appearance:"outline",css:p("$success","$successMid","$successDark")},{theme:"warning",appearance:"outline",css:p("$warning","$warningMid","$warningDark")},{theme:"danger",appearance:"outline",css:p("$danger","$dangerMid","$dangerDark")}]}),z=({hasTooltip:r,label:a,tooltipSide:s,children:t})=>r?e.createElement(u,null,e.createElement(u.Trigger,{asChild:!0},t),e.createElement(u.Content,{side:s},a)):e.createElement(e.Fragment,null,t),d=e.forwardRef(({children:r,theme:a="primary",appearance:s="simple",size:t="sm",label:y,href:h,disabled:m,hasTooltip:k=!0,tooltipSide:D,...w},f)=>{const g=`A single ${$.displayName} component is permitted as a child of ${d.displayName}`;return b(e.Children.count(r)===1,g),e.createElement(z,{hasTooltip:k,label:y,tooltipSide:D},e.createElement(C,{...h?{as:"a",href:m?null:h,onClick:void 0,"aria-disabled":!!m}:{type:"button"},...w,"aria-label":y,theme:a,appearance:s,size:t,ref:f,disabled:m},e.Children.map(r,i=>{if(!e.isValidElement(i))throw new Error(g);return b(i.type===$,`Children of type ${i==null?void 0:i.type} aren't permitted. Only an ${$.displayName} component is allowed in ${d.displayName}`),e.cloneElement(i,{size:M[t],css:{...i.props.css?i.props.css:{}}})})))});d.displayName="ActionIcon";export{d as ActionIcon};
2
2
  //# sourceMappingURL=ActionIcon.js.map
@@ -1,2 +1,2 @@
1
- import*as t from"react";import{overrideStitchesVariantValue as a}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Text as l}from"../text/Text.js";import{AvatarRootContext as n}from"./Avatar.js";import{AvatarPlaceholder as i}from"./AvatarPlaceholder.js";const c={xs:"xs",sm:"sm",md:"sm",lg:"md",xl:"md",xxl:"lg"},x=()=>{const r=t.useContext(n),{name:e,size:o}=r,m=t.useMemo(()=>a(o,s=>c[s]),[o]);return e?t.createElement(l,{size:m,css:{color:"$tonal400"}},e[0].toUpperCase()):t.createElement(i,null)};export{x as AvatarInitial};
1
+ import*as e from"react";import{overrideStitchesVariantValue as a}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Text as l}from"../text/Text.js";import{AvatarRootContext as n}from"./Avatar.js";import{AvatarPlaceholder as i}from"./AvatarPlaceholder.js";const c={xs:"xs",sm:"sm",md:"sm",lg:"md",xl:"md",xxl:"lg"},x=()=>{const r=e.useContext(n),{name:t,size:o}=r,m=e.useMemo(()=>a(o,s=>c[s]),[o]);return t?e.createElement(l,{size:m,css:{color:"$tonal400"}},t[0].toUpperCase()):e.createElement(i,null)};export{x as AvatarInitial};
2
2
  //# sourceMappingURL=AvatarInitial.js.map
@@ -1,2 +1,2 @@
1
- import*as s from"react";const t=s.createContext({hasDismiss:!1,setHasDismiss:()=>null}),m=()=>{const e=s.useContext(t);if(e===void 0)throw new Error("useBannerContext must be used within a BannerProvider");return e},u=({emphasis:e,size:r,children:a})=>{const[n,i]=s.useState(!1),o=s.useMemo(()=>({emphasis:e,size:r,hasDismiss:n,setHasDismiss:i}),[e,r,n,i]);return s.createElement(t.Provider,{value:o},a)};export{t as BannerContext,u as BannerProvider,m as useBannerContext};
1
+ import*as s from"react";const r=s.createContext({hasDismiss:!1,setHasDismiss:()=>null}),m=()=>{const e=s.useContext(r);if(e===void 0)throw new Error("useBannerContext must be used within a BannerProvider");return e},u=({emphasis:e,size:t,children:a})=>{const[n,i]=s.useState(!1),o=s.useMemo(()=>({emphasis:e,size:t,hasDismiss:n,setHasDismiss:i}),[e,t,n,i]);return s.createElement(r.Provider,{value:o},a)};export{r as BannerContext,u as BannerProvider,m as useBannerContext};
2
2
  //# sourceMappingURL=BannerContext.js.map
@@ -1,2 +1,2 @@
1
- import i from"invariant";import*as t from"react";import{overrideStitchesVariantValue as c}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Stack as u}from"../../stack/Stack.js";import{useBannerContext as f}from"../BannerContext.js";import{BannerRegularButton as r}from"./BannerRegularButton.js";const m=2,y={sm:2,md:4},n=({children:o,...l})=>{const{size:a}=f(),p=t.useMemo(()=>c(a,e=>y[e]),[a]);return i(t.Children.count(o)<=m,`A maximum of ${m} ${r.displayName} component(s) are permitted as children of ${n.displayName}`),t.createElement(u,{gap:p,...l},t.Children.map(o,(e,s)=>{if(!t.isValidElement(e))throw new Error(`Child passed to ${n.displayName} is not a valid element`);i(e.type===r,`Children of type ${e==null?void 0:e.type} aren't permitted. Only an ${r.displayName} component is allowed in ${n.displayName}`);const d={appearance:s>0?"outline":void 0};return t.cloneElement(e,d)}))};n.displayName="BannerRegularActions";export{n as BannerRegularActions};
1
+ import i from"invariant";import*as n from"react";import{overrideStitchesVariantValue as c}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Stack as u}from"../../stack/Stack.js";import{useBannerContext as f}from"../BannerContext.js";import{BannerRegularButton as r}from"./BannerRegularButton.js";const m=2,y={sm:2,md:4},t=({children:o,...l})=>{const{size:a}=f(),p=n.useMemo(()=>c(a,e=>y[e]),[a]);return i(n.Children.count(o)<=m,`A maximum of ${m} ${r.displayName} component(s) are permitted as children of ${t.displayName}`),n.createElement(u,{gap:p,...l},n.Children.map(o,(e,s)=>{if(!n.isValidElement(e))throw new Error(`Child passed to ${t.displayName} is not a valid element`);i(e.type===r,`Children of type ${e==null?void 0:e.type} aren't permitted. Only an ${r.displayName} component is allowed in ${t.displayName}`);const d={appearance:s>0?"outline":void 0};return n.cloneElement(e,d)}))};t.displayName="BannerRegularActions";export{t as BannerRegularActions};
2
2
  //# sourceMappingURL=BannerRegularActions.js.map
@@ -1,2 +1,2 @@
1
- import*as e from"react";import{overrideStitchesVariantValue as i}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Button as s}from"../../button/Button.js";import{useBannerContext as u}from"../BannerContext.js";const r=n=>{const{emphasis:o,size:t}=u(),a=e.useMemo(()=>i(t,m=>m==="sm"),[t]);return e.createElement(s,{size:t,fullWidth:a,theme:o==="highContrast"?"neutral":"primary",...n})};r.displayName="BannerRegularButton";export{r as BannerRegularButton};
1
+ import*as t from"react";import{overrideStitchesVariantValue as i}from"../../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Button as s}from"../../button/Button.js";import{useBannerContext as u}from"../BannerContext.js";const r=n=>{const{emphasis:o,size:e}=u(),a=t.useMemo(()=>i(e,m=>m==="sm"),[e]);return t.createElement(s,{size:e,fullWidth:a,theme:o==="highContrast"?"neutral":"primary",...n})};r.displayName="BannerRegularButton";export{r as BannerRegularButton};
2
2
  //# sourceMappingURL=BannerRegularButton.js.map
@@ -1,2 +1,2 @@
1
- import*as n from"react";import{styled as o}from"../../../stitches.js";import{Box as s}from"../../box/Box.js";import{useBannerContext as m}from"../BannerContext.js";const a=o(s,{width:"62%",flexGrow:1,variants:{size:{sm:{p:"$4"},md:{p:"$24",pr:"$5"}}}}),e=t=>{const{size:r}=m();return n.createElement(a,{size:r,...t})};e.displayName="BannerRegularContent";export{e as BannerRegularContent};
1
+ import*as n from"react";import{styled as o}from"../../../stitches.js";import{Box as s}from"../../box/Box.js";import{useBannerContext as m}from"../BannerContext.js";const a=o(s,{width:"62%",flexGrow:1,variants:{size:{sm:{p:"$4"},md:{p:"$24",pr:"$5"}}}}),e=r=>{const{size:t}=m();return n.createElement(a,{size:t,...r})};e.displayName="BannerRegularContent";export{e as BannerRegularContent};
2
2
  //# sourceMappingURL=BannerRegularContent.js.map
@@ -1,2 +1,2 @@
1
- import{darken as i,opacify as s}from"color2k";import*as o from"react";import{Box as b}from"../box/Box.js";import{Icon as w}from"../icon/Icon.js";import{Loader as k}from"../loader/Loader.js";import{styled as v,theme as l}from"../../stitches.js";const d=(e,r,a)=>({border:"1px solid",borderColor:"currentColor",color:e,"&[disabled]":{borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"},"&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:r},"&:not([disabled]):active":{color:a}}),n=(e,r,a,t="white")=>({bg:e,color:t,"&[disabled]":{bg:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&:not([disabled]):hover, &:not([disabled]):focus":{bg:r,color:t},"&:not([disabled]):active":{bg:a}}),p=v("button",{alignItems:"center",bg:"unset",border:"unset",borderRadius:"$0",cursor:"pointer",display:"flex",fontFamily:"$body",fontWeight:600,justifyContent:"center",p:"unset",textDecoration:"none",transition:"all 100ms ease-out",whiteSpace:"nowrap",width:"max-content",variants:{theme:{primary:{},secondary:{},success:{},warning:{},danger:{},neutral:{}},appearance:{solid:{},outline:{}},size:{sm:{fontSize:"$sm",lineHeight:1.53,height:"$3",px:"$4"},md:{fontSize:"$md",lineHeight:1.5,height:"$4",px:"$5"},lg:{fontSize:"$lg",lineHeight:1.5,height:"$5",px:"$5"}},isLoading:{true:{cursor:"not-allowed",opacity:.6,pointerEvents:"none"}},fullWidth:{false:{width:"max-content"},true:{width:"100%"}}},compoundVariants:[{theme:"primary",appearance:"solid",css:n("$primary","$primaryMid","$primaryDark")},{theme:"secondary",appearance:"solid",css:n("$primaryDark",i(l.colors.primaryDark.value,.1),i(l.colors.primaryDark.value,.15))},{theme:"success",appearance:"solid",css:n("$success","$successMid","$successDark")},{theme:"warning",appearance:"solid",css:n("$warning","$warningMid","$warningDark","$tonal500")},{theme:"danger",appearance:"solid",css:n("$danger","$dangerMid","$dangerDark")},{theme:"neutral",appearance:"solid",css:n("white",s("white",-.1),s("white",-.25),"$primary")},{theme:"primary",appearance:"outline",css:d("$primary","$primaryMid","$primaryDark")},{theme:"neutral",appearance:"outline",css:d("white",s("white",-.2),s("white",-.35))},{theme:"secondary",appearance:"outline",css:d("$primaryDark",i(l.colors.primaryDark.value,.1),i(l.colors.primaryDark.value,.15))}]}),D=({isLoading:e,children:r})=>o.createElement(o.Fragment,null,o.createElement(k,{css:{opacity:e?1:0,position:"absolute",transition:"opacity 150ms"}}),o.createElement(b,{as:"span",css:e?{opacity:0,transition:"opacity 150ms"}:{}},r)),x=e=>{switch(e){case"lg":return 22;case"md":return 20;case"sm":default:return 16}},m=(e,r)=>o.Children.map(e,(a,t)=>(a==null?void 0:a.type)===w?o.cloneElement(a,{css:{[t===0?"mr":"ml"]:r==="sm"?"$2":"$3",size:x(r),...a.props.css?a.props.css:{}}}):a),u=o.forwardRef(({children:e,isLoading:r,onClick:a,href:t,appearance:h="solid",size:c="md",theme:y="primary",type:g="button",...$},f)=>o.createElement(p,{isLoading:r||!1,onClick:r?void 0:a,appearance:h,size:c,theme:y,...$,...t?{as:"a",href:t,onClick:void 0}:{},...t?{}:{type:g},ref:f},typeof r=="boolean"?o.createElement(D,{isLoading:r},m(e,c)):m(e,c)));u.displayName="Button";export{u as Button,p as StyledButton};
1
+ import{darken as i,opacify as s}from"color2k";import*as o from"react";import{Box as b}from"../box/Box.js";import{Icon as w}from"../icon/Icon.js";import{Loader as k}from"../loader/Loader.js";import{styled as v,theme as l}from"../../stitches.js";const d=(e,r,a)=>({border:"1px solid",borderColor:"currentColor",color:e,"&[disabled]":{borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"},"&:not([disabled]):hover, &:not([disabled]):focus":{textDecoration:"none",color:r},"&:not([disabled]):active":{color:a}}),n=(e,r,a,t="white")=>({bg:e,color:t,"&[disabled]":{bg:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&:not([disabled]):hover, &:not([disabled]):focus":{bg:r,color:t},"&:not([disabled]):active":{bg:a}}),p=v("button",{alignItems:"center",bg:"unset",border:"unset",borderRadius:"$0",cursor:"pointer",display:"flex",fontFamily:"$body",fontWeight:600,justifyContent:"center",p:"unset",textDecoration:"none",transition:"all 100ms ease-out",whiteSpace:"nowrap",width:"max-content",variants:{theme:{primary:{},secondary:{},success:{},warning:{},danger:{},neutral:{}},appearance:{solid:{},outline:{}},size:{sm:{fontSize:"$sm",lineHeight:1.53,height:"$3",px:"$4"},md:{fontSize:"$md",lineHeight:1.5,height:"$4",px:"$5"},lg:{fontSize:"$lg",lineHeight:1.5,height:"$5",px:"$5"}},isLoading:{true:{cursor:"not-allowed",opacity:.6,pointerEvents:"none"}},fullWidth:{false:{width:"max-content"},true:{width:"100%"}}},compoundVariants:[{theme:"primary",appearance:"solid",css:n("$primary","$primaryMid","$primaryDark")},{theme:"secondary",appearance:"solid",css:n("$primaryDark",i(l.colors.primaryDark.value,.1),i(l.colors.primaryDark.value,.15))},{theme:"success",appearance:"solid",css:n("$success","$successMid","$successDark")},{theme:"warning",appearance:"solid",css:n("$warning","$warningMid","$warningDark","$tonal500")},{theme:"danger",appearance:"solid",css:n("$danger","$dangerMid","$dangerDark")},{theme:"neutral",appearance:"solid",css:n("white",s("white",-.1),s("white",-.25),"$primary")},{theme:"primary",appearance:"outline",css:d("$primary","$primaryMid","$primaryDark")},{theme:"neutral",appearance:"outline",css:d("white",s("white",-.2),s("white",-.35))},{theme:"secondary",appearance:"outline",css:d("$primaryDark",i(l.colors.primaryDark.value,.1),i(l.colors.primaryDark.value,.15))}]}),D=({isLoading:e,children:r})=>o.createElement(o.Fragment,null,o.createElement(k,{css:{opacity:e?1:0,position:"absolute",transition:"opacity 150ms"}}),o.createElement(b,{as:"span",css:e?{opacity:0,transition:"opacity 150ms"}:{}},r)),x=e=>{switch(e){case"lg":return 22;case"md":return 20;case"sm":default:return 16}},m=(e,r)=>o.Children.map(e,(a,t)=>(a==null?void 0:a.type)===w?o.cloneElement(a,{css:{[t===0?"mr":"ml"]:r==="sm"?"$2":"$3",size:x(r),...a.props.css?a.props.css:{}}}):a),u=o.forwardRef(({children:e,isLoading:r,onClick:a,href:t,appearance:h="solid",size:c="md",theme:y="primary",type:$="button",...g},f)=>o.createElement(p,{isLoading:r||!1,onClick:r?void 0:a,appearance:h,size:c,theme:y,...g,...t?{as:"a",href:t,onClick:void 0}:{},...t?{}:{type:$},ref:f},typeof r=="boolean"?o.createElement(D,{isLoading:r},m(e,c)):m(e,c)));u.displayName="Button";export{u as Button,p as StyledButton};
2
2
  //# sourceMappingURL=Button.js.map
@@ -1,2 +1,2 @@
1
- import{ChevronLeft as q,ChevronRight as H}from"@atom-learning/icons";import{useDayzed as J}from"dayzed";import*as e from"react";import{ActionIcon as x}from"../action-icon/ActionIcon.js";import{Box as g}from"../box/Box.js";import{Button as C}from"../button/Button.js";import{Flex as Y}from"../flex/Flex.js";import{Icon as w}from"../icon/Icon.js";import{Text as K}from"../text/Text.js";import{styled as F}from"../../stitches.js";import{monthNamesShort as Q,weekdayNamesShort as V,DEFAULT_LABELS as X}from"./constants.js";import{Day as Z}from"./Day.js";const f=F("div",{display:"grid",gridTemplateColumns:"repeat(7, 1fr)",gridGap:"$1 $2"}),ee=F(C,{color:"$tonal600",p:"$3",width:"$6",variants:{selected:{false:{color:"$tonal600 !important",fontWeight:"400","&:hover":{bg:"$tonal100 !important",color:"$tonal600 !important"},"&[disabled]":{bg:"white !important"}}}}}),te=(i,c)=>{const u=i.slice(0,c);return i.slice(c).concat(u)},S=({css:i,refDateSelected:c,refDateToday:u,firstDayOfWeek:$=0,monthNames:N=Q,weekdayNames:T=V,labels:y=X,date:o=new Date,minDate:l,maxDate:m,setYear:A,...L})=>{const[a,E]=e.useState(!1),[s,k]=e.useState(o==null?void 0:o.getFullYear()),O=t=>{const r=o;r.setFullYear(t),A(r),E(!1)},W=l&&s-16<=l.getFullYear(),z=m&&s>=m.getFullYear(),B=Array.from({length:16},(t,r)=>{const n=s-r;return m&&n>m.getFullYear()||l&&n<l.getFullYear()?0:n}),{calendars:d,getBackProps:I,getForwardProps:M,getDateProps:G}=J({firstDayOfWeek:$,showOutsideDays:!0,date:o,minDate:l,maxDate:m,...L});return d.length?e.createElement(g,{css:{position:"relative",width:"min-content",mt:"-$1",...i}},e.createElement(Y,{css:{position:"absolute",top:0,right:"-$1"}},e.createElement(x,{label:y[a?"previousYear":"previous"],theme:"neutral",size:"md",...!a&&I({calendars:d}),...a&&{onClick:()=>k(s-16)},disabled:a&&W},e.createElement(w,{is:q})),e.createElement(x,{label:y[a?"nextYear":"next"],theme:"neutral",size:"md",...!a&&M({calendars:d}),...a&&{onClick:()=>k(s+16)},disabled:a&&z},e.createElement(w,{is:H}))),a&&e.createElement(f,{css:{gridTemplateColumns:"repeat(4, 1fr)",pt:"$7",direction:"rtl",gridGap:"$3 $1"}},B.map((t,r)=>{const n=t===o.getFullYear();return t?e.createElement(ee,{key:`${t}${r}`,theme:n?"primary":"neutral",onClick:()=>O(t),selected:n},t):e.createElement(g,{key:r,css:{width:"$6",height:"$4"}})})),!a&&d.map(({month:t,year:r,weeks:n})=>e.createElement(g,{key:`${t}${r}`},e.createElement(Y,{css:{height:"$4",alignItems:"center",mb:"$4"}},e.createElement(C,{theme:"neutral",css:{px:"0",color:"$tonal600"},onClick:()=>E(!0)},N[t]," ",r)),e.createElement(f,{css:{mb:"$3"}},te(T,$).map(p=>e.createElement(K,{as:"span",size:"sm",key:`${t}${r}${p}`,css:{fontWeight:600,textAlign:"center"}},p))),e.createElement(f,null,n.map((p,P)=>p.map((h,j)=>{const D=`${t}${r}${P}${j}`;if(!h)return e.createElement("div",{key:D});const{date:R,selected:b,today:v,prevMonth:U,nextMonth:_}=h;return e.createElement(Z,{isOutsideMonth:U||_,isSelected:b,isToday:v,key:D,ref:b?c:v?u:null,...G({dateObj:h}),type:"button"},R.getDate())})))))):null};S.displayName="Calendar";export{S as Calendar};
1
+ import{ChevronLeft as q,ChevronRight as H}from"@atom-learning/icons";import{useDayzed as J}from"dayzed";import*as e from"react";import{ActionIcon as x}from"../action-icon/ActionIcon.js";import{Box as h}from"../box/Box.js";import{Button as C}from"../button/Button.js";import{Flex as Y}from"../flex/Flex.js";import{Icon as w}from"../icon/Icon.js";import{Text as K}from"../text/Text.js";import{styled as F}from"../../stitches.js";import{monthNamesShort as Q,weekdayNamesShort as V,DEFAULT_LABELS as X}from"./constants.js";import{Day as Z}from"./Day.js";const g=F("div",{display:"grid",gridTemplateColumns:"repeat(7, 1fr)",gridGap:"$1 $2"}),ee=F(C,{color:"$tonal600",p:"$3",width:"$6",variants:{selected:{false:{color:"$tonal600 !important",fontWeight:"400","&:hover":{bg:"$tonal100 !important",color:"$tonal600 !important"},"&[disabled]":{bg:"white !important"}}}}}),te=(i,c)=>{const u=i.slice(0,c);return i.slice(c).concat(u)},S=({css:i,refDateSelected:c,refDateToday:u,firstDayOfWeek:f=0,monthNames:N=Q,weekdayNames:T=V,labels:y=X,date:o=new Date,minDate:l,maxDate:m,setYear:A,...L})=>{const[a,E]=e.useState(!1),[s,k]=e.useState(o==null?void 0:o.getFullYear()),O=t=>{const r=o;r.setFullYear(t),A(r),E(!1)},W=l&&s-16<=l.getFullYear(),z=m&&s>=m.getFullYear(),B=Array.from({length:16},(t,r)=>{const n=s-r;return m&&n>m.getFullYear()||l&&n<l.getFullYear()?0:n}),{calendars:d,getBackProps:I,getForwardProps:M,getDateProps:G}=J({firstDayOfWeek:f,showOutsideDays:!0,date:o,minDate:l,maxDate:m,...L});return d.length?e.createElement(h,{css:{position:"relative",width:"min-content",mt:"-$1",...i}},e.createElement(Y,{css:{position:"absolute",top:0,right:"-$1"}},e.createElement(x,{label:y[a?"previousYear":"previous"],theme:"neutral",size:"md",...!a&&I({calendars:d}),...a&&{onClick:()=>k(s-16)},disabled:a&&W},e.createElement(w,{is:q})),e.createElement(x,{label:y[a?"nextYear":"next"],theme:"neutral",size:"md",...!a&&M({calendars:d}),...a&&{onClick:()=>k(s+16)},disabled:a&&z},e.createElement(w,{is:H}))),a&&e.createElement(g,{css:{gridTemplateColumns:"repeat(4, 1fr)",pt:"$7",direction:"rtl",gridGap:"$3 $1"}},B.map((t,r)=>{const n=t===o.getFullYear();return t?e.createElement(ee,{key:`${t}${r}`,theme:n?"primary":"neutral",onClick:()=>O(t),selected:n},t):e.createElement(h,{key:r,css:{width:"$6",height:"$4"}})})),!a&&d.map(({month:t,year:r,weeks:n})=>e.createElement(h,{key:`${t}${r}`},e.createElement(Y,{css:{height:"$4",alignItems:"center",mb:"$4"}},e.createElement(C,{theme:"neutral",css:{px:"0",color:"$tonal600"},onClick:()=>E(!0)},N[t]," ",r)),e.createElement(g,{css:{mb:"$3"}},te(T,f).map(p=>e.createElement(K,{as:"span",size:"sm",key:`${t}${r}${p}`,css:{fontWeight:600,textAlign:"center"}},p))),e.createElement(g,null,n.map((p,P)=>p.map(($,j)=>{const D=`${t}${r}${P}${j}`;if(!$)return e.createElement("div",{key:D});const{date:R,selected:b,today:v,prevMonth:U,nextMonth:_}=$;return e.createElement(Z,{isOutsideMonth:U||_,isSelected:b,isToday:v,key:D,ref:b?c:v?u:null,...G({dateObj:$}),type:"button"},R.getDate())})))))):null};S.displayName="Calendar";export{S as Calendar};
2
2
  //# sourceMappingURL=Calendar.js.map
@@ -1,2 +1,2 @@
1
- import{Slide as r}from"pure-react-carousel";import*as e from"react";import{Box as m}from"../box/Box.js";import{styled as i}from"../../stitches.js";const l=i(r,{}),s=({children:t,...o})=>e.createElement(l,{...o,tag:"div"},e.createElement(m,{css:{px:"$3"}},t));export{s as CarouselSlide};
1
+ import{Slide as t}from"pure-react-carousel";import*as e from"react";import{Box as m}from"../box/Box.js";import{styled as i}from"../../stitches.js";const l=i(t,{}),s=({children:o,...r})=>e.createElement(l,{...r,tag:"div"},e.createElement(m,{css:{px:"$3"}},o));export{s as CarouselSlide};
2
2
  //# sourceMappingURL=CarouselSlide.js.map
@@ -1,2 +1,2 @@
1
- import{Minus as d,Ok as m}from"@atom-learning/icons";import*as t from"@radix-ui/react-checkbox";import*as o from"react";import{styled as a}from"../../stitches.js";import{overrideStitchesVariantValue as c}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Icon as p}from"../icon/Icon.js";const u=a(t.Indicator,{position:"absolute",top:"50%",left:"50%",transform:"translateX(-50%) translateY(-50%)"}),f=a(t.Root,{appearance:"none",position:"relative",backgroundColor:"transparent",border:"1px solid $colors$tonal400",borderRadius:"3px",color:"white",cursor:"pointer",size:"$1",p:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"all 50ms ease-out",'&[data-state="checked"]':{backgroundColor:"$primary",borderColor:"$primary"},'&[data-state="indeterminate"]':{backgroundColor:"$primary",borderColor:"$primary"},"&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},"&[disabled]":{backgroundColor:"$tonal100",borderColor:"$tonal400",cursor:"not-allowed",color:"$tonal400"},variants:{state:{error:{borderColor:"$danger"}},size:{md:{size:"$1"},lg:{size:"$2",mt:"-$1"}}}}),$={md:"sm",lg:"md"},i=o.forwardRef(({size:r="md",...e},s)=>{const n=o.useMemo(()=>c(r,l=>$[l]),[r]);return o.createElement(f,{...e,size:r,ref:s},o.createElement(u,{asChild:!0},o.createElement(p,{is:e.checked==="indeterminate"?d:m,css:{strokeWidth:"3"},size:n})))});i.displayName="Checkbox";export{i as Checkbox};
1
+ import{Minus as d,Ok as m}from"@atom-learning/icons";import*as t from"@radix-ui/react-checkbox";import*as o from"react";import{styled as a}from"../../stitches.js";import{overrideStitchesVariantValue as c}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";import{Icon as p}from"../icon/Icon.js";const u=a(t.Indicator,{position:"absolute",top:"50%",left:"50%",transform:"translateX(-50%) translateY(-50%)"}),f=a(t.Root,{appearance:"none",position:"relative",backgroundColor:"transparent",border:"1px solid $colors$tonal400",borderRadius:"3px",color:"white",cursor:"pointer",size:"$1",p:0,display:"flex",alignItems:"center",justifyContent:"center",transition:"all 50ms ease-out",'&[data-state="checked"]':{backgroundColor:"$primary",borderColor:"$primary"},'&[data-state="indeterminate"]':{backgroundColor:"$primary",borderColor:"$primary"},"&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},"&[disabled]":{backgroundColor:"$tonal100",borderColor:"$tonal400",cursor:"not-allowed",color:"$tonal400"},variants:{state:{error:{borderColor:"$danger"}},size:{md:{size:"$1"},lg:{size:"$2",mt:"-$1"}}}}),b={md:"sm",lg:"md"},i=o.forwardRef(({size:r="md",...e},s)=>{const n=o.useMemo(()=>c(r,l=>b[l]),[r]);return o.createElement(f,{...e,size:r,ref:s},o.createElement(u,{asChild:!0},o.createElement(p,{is:e.checked==="indeterminate"?d:m,css:{strokeWidth:"3"},size:n})))});i.displayName="Checkbox";export{i as Checkbox};
2
2
  //# sourceMappingURL=Checkbox.js.map
@@ -1,2 +1,2 @@
1
- import*as e from"react";import{Box as C}from"../box/Box.js";import{Flex as g}from"../flex/Flex.js";import{Icon as p}from"../icon/Icon.js";import{getTextVariant as a}from"../text/Text.js";import{styled as m}from"../../stitches.js";import{overrideStitchesVariantValue as z}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";const d={overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},h=m("span",{display:"inline-flex",alignItems:"center",px:"$1",flexGrow:1,...d,"& > *:not(:last-child)":{mr:"$1"}}),u={sm:"sm",md:"sm",lg:"md"},y=m(p,{flexShrink:0}),l=({...r})=>{const i=e.useContext(c),{size:t}=i,n=e.useMemo(()=>z(t,o=>u[o]),[t]);return e.createElement(y,{...r,size:n})},E=({children:r,...i})=>{const t=e.Children.toArray(r),n=t.length<=1;return e.createElement(h,{...i},t.map((o,$)=>!n&&typeof o=="string"?e.createElement(C,{as:"span",css:d,key:o},o):e.isValidElement(o)&&o.type===p?e.createElement(l,{key:`icon-${$}`,...o.props}):o))},f=m(g,{px:"$2",border:"1px solid",borderRadius:"$0",alignItems:"center",fontFamily:"$body",maxWidth:"100%",borderColor:"$primary",color:"$primaryMid",bg:"$primaryLight","&[data-disabled]":{opacity:"0.3",pointerEvents:"none"},variants:{size:{sm:{height:"$2",...a({size:"sm"})},md:{height:"$3",...a({size:"sm"})},lg:{height:"$4",...a({size:"md"})}}}}),c=e.createContext({}),x=({size:r,children:i})=>{const t=e.useMemo(()=>({size:r}),[r]);return e.createElement(c.Provider,{value:t},i)},v=e.forwardRef(({asWorkaround:r,size:i="md",...t},n)=>e.createElement(x,{size:i},e.createElement(f,{ref:n,as:r,size:i,...t}))),s=v;s.Content=E,s.Icon=l,s.displayName="Chip";export{s as Chip,l as ChipIcon,c as ChipRootContext,x as ChipRootProvider,h as StyledChipContent,y as StyledChipIcon,f as StyledRoot};
1
+ import*as e from"react";import{Box as g}from"../box/Box.js";import{Flex as z}from"../flex/Flex.js";import{Icon as p}from"../icon/Icon.js";import{getTextVariant as a}from"../text/Text.js";import{styled as m}from"../../stitches.js";import{overrideStitchesVariantValue as u}from"../../utilities/override-stitches-variant-value/overrideStitchesVariantValue.js";const d={overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},h=m("span",{display:"inline-flex",alignItems:"center",px:"$1",flexGrow:1,...d,"& > *:not(:last-child)":{mr:"$1"}}),E={sm:"sm",md:"sm",lg:"md"},y=m(p,{flexShrink:0}),l=({...r})=>{const i=e.useContext(c),{size:t}=i,n=e.useMemo(()=>u(t,o=>E[o]),[t]);return e.createElement(y,{...r,size:n})},v=({children:r,...i})=>{const t=e.Children.toArray(r),n=t.length<=1;return e.createElement(h,{...i},t.map((o,C)=>!n&&typeof o=="string"?e.createElement(g,{as:"span",css:d,key:o},o):e.isValidElement(o)&&o.type===p?e.createElement(l,{key:`icon-${C}`,...o.props}):o))},f=m(z,{px:"$2",border:"1px solid",borderRadius:"$0",alignItems:"center",fontFamily:"$body",maxWidth:"100%",borderColor:"$primary",color:"$primaryMid",bg:"$primaryLight","&[data-disabled]":{opacity:"0.3",pointerEvents:"none"},variants:{size:{sm:{height:"$2",...a({size:"sm"})},md:{height:"$3",...a({size:"sm"})},lg:{height:"$4",...a({size:"md"})}}}}),c=e.createContext({}),x=({size:r,children:i})=>{const t=e.useMemo(()=>({size:r}),[r]);return e.createElement(c.Provider,{value:t},i)},b=e.forwardRef(({asWorkaround:r,size:i="md",...t},n)=>e.createElement(x,{size:i},e.createElement(f,{ref:n,as:r,size:i,...t}))),s=b;s.Content=v,s.Icon=l,s.displayName="Chip";export{s as Chip,l as ChipIcon,c as ChipRootContext,x as ChipRootProvider,h as StyledChipContent,y as StyledChipIcon,f as StyledRoot};
2
2
  //# sourceMappingURL=Chip.js.map
@@ -1,2 +1,2 @@
1
- import*as r from"react";import{Stack as a}from"../stack/Stack.js";const p=r.forwardRef(({gap:o=2,...t},e)=>r.createElement(a,{ref:e,direction:"row",gap:o,align:!1,...t}));export{p as ChipGroup};
1
+ import*as r from"react";import{Stack as a}from"../stack/Stack.js";const p=r.forwardRef(({gap:o=2,...e},t)=>r.createElement(a,{ref:t,direction:"row",gap:o,align:!1,...e}));export{p as ChipGroup};
2
2
  //# sourceMappingURL=ChipGroup.js.map
@@ -1,2 +1,2 @@
1
- import*as o from"react";import"../chip/Chip.js";import{ChipGroup as m}from"../chip/ChipGroup.js";import{DismissibleGroup as p}from"../dismissible-group/index.js";const t=o.forwardRef((r,i)=>o.createElement(m,{as:p,ref:i,...r}));export{t as ChipDismissibleGroupRoot};
1
+ import*as o from"react";import"../chip/Chip.js";import{ChipGroup as e}from"../chip/ChipGroup.js";import{DismissibleGroup as m}from"../dismissible-group/index.js";const p=o.forwardRef((r,i)=>o.createElement(e,{as:m,ref:i,...r}));export{p as ChipDismissibleGroupRoot};
2
2
  //# sourceMappingURL=ChipDismissibleGroupRoot.js.map
@@ -1,2 +1,2 @@
1
- import{Ok as a}from"@atom-learning/icons";import*as n from"@radix-ui/react-toggle-group";import*as o from"react";import{Chip as t}from"../chip/Chip.js";import"../chip/ChipGroup.js";import{Icon as s}from"../icon/Icon.js";import{styled as r}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as p}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";const e=r(s,{display:"none"}),c=r(t,{"&:not([disabled])":{cursor:"pointer","&:hover":{bg:"$tonal100",color:"$tonal600",borderColor:"currentColor"},"&:focus-visible":{...p()},'&[data-state="on"]':{"&:hover":{bg:"$white",color:"$primaryDark"}}},'&[data-state="off"]':{color:"$tonal400",bg:"$tonal50",borderColor:"$tonal200"},'&[data-state="on"]':{[`& ${e}`]:{display:"block"}}}),d=({size:l="md",children:i,...m})=>o.createElement(n.Item,{...m,asChild:!0},o.createElement(c,{asWorkaround:"button"},o.createElement(e,{is:a,size:l==="lg"?"md":"sm"}),o.createElement(t.Content,null,i)));export{d as ChipToggleGroupItem};
1
+ import{Ok as a}from"@atom-learning/icons";import*as n from"@radix-ui/react-toggle-group";import*as o from"react";import{Chip as r}from"../chip/Chip.js";import"../chip/ChipGroup.js";import{Icon as s}from"../icon/Icon.js";import{styled as t}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as p}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";const e=t(s,{display:"none"}),c=t(r,{"&:not([disabled])":{cursor:"pointer","&:hover":{bg:"$tonal100",color:"$tonal600",borderColor:"currentColor"},"&:focus-visible":{...p()},'&[data-state="on"]':{"&:hover":{bg:"$white",color:"$primaryDark"}}},'&[data-state="off"]':{color:"$tonal400",bg:"$tonal50",borderColor:"$tonal200"},'&[data-state="on"]':{[`& ${e}`]:{display:"block"}}}),d=({size:l="md",children:i,...m})=>o.createElement(n.Item,{...m,asChild:!0},o.createElement(c,{asWorkaround:"button"},o.createElement(e,{is:a,size:l==="lg"?"md":"sm"}),o.createElement(r.Content,null,i)));export{d as ChipToggleGroupItem};
2
2
  //# sourceMappingURL=ChipToggleGroupItem.js.map
@@ -1,2 +1,2 @@
1
- import{Combobox as t,ComboboxOptionText as b}from"@reach/combobox";import*as r from"react";import{globalCss as p,styled as i}from"../../stitches.js";import{ComboboxInput as x}from"./ComboboxInput.js";import{ComboboxList as e}from"./ComboboxList.js";import{ComboboxOption as n}from"./ComboboxOption.js";import{ComboboxPopover as s}from"./ComboboxPopover.js";p({":root":{"--reach-combobox":1}})();const C=i(t,{}),o=m=>r.createElement(C,{...m});o.displayName="Combobox",o.Option=n,o.Input=x,o.Popover=s,o.List=e,o.OptionText=b;export{o as Combobox};
1
+ import{Combobox as t,ComboboxOptionText as b}from"@reach/combobox";import*as r from"react";import{globalCss as p,styled as i}from"../../stitches.js";import{ComboboxInput as e}from"./ComboboxInput.js";import{ComboboxList as x}from"./ComboboxList.js";import{ComboboxOption as n}from"./ComboboxOption.js";import{ComboboxPopover as s}from"./ComboboxPopover.js";p({":root":{"--reach-combobox":1}})();const C=i(t,{}),o=m=>r.createElement(C,{...m});o.displayName="Combobox",o.Option=n,o.Input=e,o.Popover=s,o.List=x,o.OptionText=b;export{o as Combobox};
2
2
  //# sourceMappingURL=Combobox.js.map
@@ -1,4 +1,6 @@
1
- export declare const ComboboxInput: import("@stitches/react/types/styled-component").StyledComponent<import("@reach/utils/dist/declarations/src/polymorphic").ForwardRefComponent<"input", import("@reach/combobox").ComboboxInputProps>, {
1
+ import * as React from 'react';
2
+ export declare const StyledComboboxInput: import("@stitches/react/types/styled-component").StyledComponent<import("@reach/utils/dist/declarations/src/polymorphic").ForwardRefComponent<"input", import("@reach/combobox").ComboboxInputProps>, {
3
+ size?: "sm" | "md" | "lg" | undefined;
2
4
  state?: "error" | undefined;
3
5
  }, {
4
6
  sm: string;
@@ -220,3 +222,5 @@ export declare const ComboboxInput: import("@stitches/react/types/styled-compone
220
222
  marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
221
223
  };
222
224
  }>>;
225
+ export declare type ComboboxInputProps = React.ComponentProps<typeof StyledComboboxInput>;
226
+ export declare const ComboboxInput: React.FC<ComboboxInputProps>;
@@ -1,2 +1,2 @@
1
- import{ComboboxInput as o}from"@reach/combobox";import{styled as r,theme as t}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import{encodeBackgroundIcon as e}from"../../utilities/style/encode-background-icon.js";import"../../utilities/style/keyframe-animations.js";const a=r(o,{boxShadow:"none",fontSize:"$md",appearance:"none",backgroundImage:e(t.colors.tonal300.value,"chevron"),backgroundPosition:"right $space$3 top 50%, 0 0",backgroundRepeat:"no-repeat, repeat",backgroundSize:"20px auto, 100%",border:"1px solid $tonal300",borderRadius:"$0",boxSizing:"border-box",color:"$tonal600",cursor:"text",display:"block",fontFamily:"$body",height:"$4",pl:"$3",pr:"$6",transition:"all 100ms ease-out",width:"100%","&::placeholder":{color:"$tonal300",opacity:1},"&:focus-within":{borderColor:"$primary",outline:"none"},"&[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},variants:{state:{error:{border:"1px solid $danger"}}}});export{a as ComboboxInput};
1
+ import*as o from"react";import{ComboboxInput as i}from"@reach/combobox";import{styled as a,theme as l}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import{encodeBackgroundIcon as d}from"../../utilities/style/encode-background-icon.js";import"../../utilities/style/keyframe-animations.js";const e=a(i,{boxShadow:"none",appearance:"none",backgroundImage:d(l.colors.tonal300.value,"chevron"),backgroundPosition:"right $space$3 top 50%, 0 0",backgroundRepeat:"no-repeat, repeat",backgroundSize:"20px auto, 100%",border:"1px solid $tonal300",borderRadius:"$0",boxSizing:"border-box",color:"$tonal600",cursor:"text",display:"block",fontFamily:"$body",height:"$4",pl:"$3",pr:"$6",transition:"all 100ms ease-out",width:"100%","&::placeholder":{color:"$tonal300",opacity:1},"&:focus-within":{borderColor:"$primary",outline:"none"},"&[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},variants:{size:{sm:{height:"$3",fontSize:"$sm",lineHeight:1.7},md:{height:"$4",fontSize:"$md",lineHeight:2},lg:{height:"$5",fontSize:"$md",lineHeight:2}},state:{error:{border:"1px solid $danger"}}}}),p=o.forwardRef(({size:r="md",...t},n)=>o.createElement(e,{size:r,...t,ref:n}));export{p as ComboboxInput,e as StyledComboboxInput};
2
2
  //# sourceMappingURL=ComboboxInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ComboboxInput.js","sources":["../../../src/components/combobox/ComboboxInput.tsx"],"sourcesContent":["import { ComboboxInput as BaseComboboxInput } from '@reach/combobox'\n\nimport { styled, theme } from '~/stitches'\nimport { encodeBackgroundIcon } from '~/utilities'\n\nexport const ComboboxInput = styled(BaseComboboxInput, {\n boxShadow: 'none', // prevent default iOS default styling\n fontSize: '$md', // prevent iOS zooming on focus\n appearance: 'none',\n backgroundImage: encodeBackgroundIcon(theme.colors.tonal300.value, 'chevron'),\n backgroundPosition: 'right $space$3 top 50%, 0 0',\n backgroundRepeat: 'no-repeat, repeat',\n backgroundSize: '20px auto, 100%',\n border: '1px solid $tonal300',\n borderRadius: '$0',\n boxSizing: 'border-box',\n color: '$tonal600',\n cursor: 'text',\n display: 'block',\n fontFamily: '$body',\n height: '$4',\n pl: '$3',\n pr: '$6',\n transition: 'all 100ms ease-out',\n width: '100%',\n '&::placeholder': {\n color: '$tonal300',\n opacity: 1\n },\n '&:focus-within': {\n borderColor: '$primary',\n outline: 'none'\n },\n '&[disabled]': {\n backgroundColor: '$tonal100',\n color: '$tonal400',\n cursor: 'not-allowed'\n },\n variants: {\n state: {\n error: {\n border: '1px solid $danger'\n }\n }\n }\n})\n"],"names":["ComboboxInput","styled","BaseComboboxInput","encodeBackgroundIcon","theme"],"mappings":"2WAKaA,EAAgBC,EAAOC,EAAmB,CACrD,UAAW,OACX,SAAU,MACV,WAAY,OACZ,gBAAiBC,EAAqBC,EAAM,OAAO,SAAS,MAAO,SAAS,EAC5E,mBAAoB,8BACpB,iBAAkB,oBAClB,eAAgB,kBAChB,OAAQ,sBACR,aAAc,KACd,UAAW,aACX,MAAO,YACP,OAAQ,OACR,QAAS,QACT,WAAY,QACZ,OAAQ,KACR,GAAI,KACJ,GAAI,KACJ,WAAY,qBACZ,MAAO,OACP,iBAAkB,CAChB,MAAO,YACP,QAAS,CACX,EACA,iBAAkB,CAChB,YAAa,WACb,QAAS,MACX,EACA,cAAe,CACb,gBAAiB,YACjB,MAAO,YACP,OAAQ,aACV,EACA,SAAU,CACR,MAAO,CACL,MAAO,CACL,OAAQ,mBACV,CACF,CACF,CACF,CAAC"}
1
+ {"version":3,"file":"ComboboxInput.js","sources":["../../../src/components/combobox/ComboboxInput.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { ComboboxInput as BaseComboboxInput } from '@reach/combobox'\n\nimport { styled, theme } from '~/stitches'\nimport { Override } from '~/utilities/types'\nimport { encodeBackgroundIcon } from '~/utilities'\n\nexport const StyledComboboxInput = styled(BaseComboboxInput, {\n boxShadow: 'none', // prevent default iOS default styling\n appearance: 'none',\n backgroundImage: encodeBackgroundIcon(theme.colors.tonal300.value, 'chevron'),\n backgroundPosition: 'right $space$3 top 50%, 0 0',\n backgroundRepeat: 'no-repeat, repeat',\n backgroundSize: '20px auto, 100%',\n border: '1px solid $tonal300',\n borderRadius: '$0',\n boxSizing: 'border-box',\n color: '$tonal600',\n cursor: 'text',\n display: 'block',\n fontFamily: '$body',\n height: '$4',\n pl: '$3',\n pr: '$6',\n transition: 'all 100ms ease-out',\n width: '100%',\n '&::placeholder': {\n color: '$tonal300',\n opacity: 1\n },\n '&:focus-within': {\n borderColor: '$primary',\n outline: 'none'\n },\n '&[disabled]': {\n backgroundColor: '$tonal100',\n color: '$tonal400',\n cursor: 'not-allowed'\n },\n variants: {\n size: {\n sm: {\n height: '$3',\n fontSize: '$sm',\n lineHeight: 1.7\n },\n md: {\n height: '$4',\n fontSize: '$md',\n lineHeight: 2\n },\n lg: {\n height: '$5',\n fontSize: '$md',\n lineHeight: 2\n }\n },\n state: {\n error: {\n border: '1px solid $danger'\n }\n }\n }\n})\n\nexport type ComboboxInputProps = React.ComponentProps<\n typeof StyledComboboxInput\n>\n\nexport const ComboboxInput: React.FC<ComboboxInputProps> = React.forwardRef(\n ({ size = 'md', ...rest }, ref) => {\n return <StyledComboboxInput size={size} {...rest} ref={ref} />\n }\n)\n"],"names":["StyledComboboxInput","styled","BaseComboboxInput","encodeBackgroundIcon","theme","ComboboxInput","React","size","rest","ref"],"mappings":"6XAQO,MAAMA,EAAsBC,EAAOC,EAAmB,CAC3D,UAAW,OACX,WAAY,OACZ,gBAAiBC,EAAqBC,EAAM,OAAO,SAAS,MAAO,SAAS,EAC5E,mBAAoB,8BACpB,iBAAkB,oBAClB,eAAgB,kBAChB,OAAQ,sBACR,aAAc,KACd,UAAW,aACX,MAAO,YACP,OAAQ,OACR,QAAS,QACT,WAAY,QACZ,OAAQ,KACR,GAAI,KACJ,GAAI,KACJ,WAAY,qBACZ,MAAO,OACP,iBAAkB,CAChB,MAAO,YACP,QAAS,CACX,EACA,iBAAkB,CAChB,YAAa,WACb,QAAS,MACX,EACA,cAAe,CACb,gBAAiB,YACjB,MAAO,YACP,OAAQ,aACV,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,GACd,EACA,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,CACd,EACA,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,CACd,CACF,EACA,MAAO,CACL,MAAO,CACL,OAAQ,mBACV,CACF,CACF,CACF,CAAC,EAMYC,EAA8CC,EAAM,WAC/D,CAAC,CAAE,KAAAC,EAAO,QAASC,CAAK,EAAGC,IAClBH,EAAA,cAACN,EAAA,CAAoB,KAAMO,EAAO,GAAGC,EAAM,IAAKC,EAAK,CAEhE"}
@@ -1,8 +1,8 @@
1
1
  import * as React from 'react';
2
2
  import type { CSS } from '../../stitches';
3
+ import { Override } from '../../utilities';
3
4
  import { FieldElementWrapperProps } from '../field-wrapper';
4
5
  import { PasswordInput } from '../password-input';
5
- import { Override } from '../../utilities';
6
6
  declare type ValidationResult = Record<string, boolean>;
7
7
  declare type CreatePasswordFieldProps = Override<React.ComponentProps<typeof PasswordInput> & FieldElementWrapperProps, {
8
8
  label?: string;
@@ -1,2 +1,2 @@
1
- import j from"invariant";import*as a from"react";import{useFormContext as E}from"react-hook-form";import{throttle as k}from"throttle-debounce";import{Box as P}from"../box/Box.js";import{Flex as S}from"../flex/Flex.js";import{InlineMessage as $}from"../inline-message/InlineMessage.js";import{PasswordField as B}from"../password-field/PasswordField.js";const c=({validate:d,defaultValidation:u,messageDirection:p="row",label:f="Create a password",name:r="password",css:v,validation:b,...w})=>{var s;const{formState:l}=E(),[i,n]=a.useState(!1),[C,m]=a.useState(u),F=l.touched[r],g=((s=l.errors[r])==null?void 0:s.type)==="validate",o=a.useCallback(async e=>{const t=await d(e);return t?(j(typeof t=="object","The validate function must return an object"),m(t),Object.values(t).every(h=>h)):!1},[m]),x=a.useCallback(k(500,o),[o]),y=(e,t)=>e?"success":t?"neutral":"error";return a.createElement(P,{css:v},a.createElement(B,{label:f,name:r,onChange:e=>x(e.target.value),onBlur:()=>n(!1),onFocus:()=>n(!0),validation:{...b,validate:o},...w}),(F||i||g)&&a.createElement(S,{css:{mt:"$2",gap:"$2",flexWrap:"wrap",flexDirection:p}},Object.entries(C).map(([e,t])=>a.createElement($,{key:e,theme:y(t,i)},e))))};c.displayName="CreatePasswordField";export{c as CreatePasswordField};
1
+ import j from"invariant";import*as a from"react";import{useFormContext as E}from"react-hook-form";import{throttle as k}from"throttle-debounce";import{Box as P}from"../box/Box.js";import{Flex as S}from"../flex/Flex.js";import{InlineMessage as B}from"../inline-message/InlineMessage.js";import{PasswordField as D}from"../password-field/PasswordField.js";const c=({validate:d,defaultValidation:u,messageDirection:p="row",label:f="Create a password",name:r="password",css:v,validation:b,...w})=>{var s;const{formState:l}=E(),[i,n]=a.useState(!1),[C,m]=a.useState(u),F=l.touched[r],g=((s=l.errors[r])==null?void 0:s.type)==="validate",o=a.useCallback(async e=>{const t=await d(e);return t?(j(typeof t=="object","The validate function must return an object"),m(t),Object.values(t).every(h=>h)):!1},[m]),x=a.useCallback(k(500,o),[o]),y=(e,t)=>e?"success":t?"neutral":"error";return a.createElement(P,{css:v},a.createElement(D,{label:f,name:r,onChange:e=>x(e.target.value),onBlur:()=>n(!1),onFocus:()=>n(!0),validation:{...b,validate:o},...w}),(F||i||g)&&a.createElement(S,{css:{mt:"$2",gap:"$2",flexWrap:"wrap",flexDirection:p}},Object.entries(C).map(([e,t])=>a.createElement(B,{key:e,theme:y(t,i)},e))))};c.displayName="CreatePasswordField";export{c as CreatePasswordField};
2
2
  //# sourceMappingURL=CreatePasswordField.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CreatePasswordField.js","sources":["../../../src/components/create-password-field/CreatePasswordField.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { throttle } from 'throttle-debounce'\n\nimport type { CSS } from '~/stitches'\n\nimport { Box } from '../box'\nimport { FieldElementWrapperProps } from '../field-wrapper'\nimport { Flex } from '../flex'\nimport { InlineMessage } from '../inline-message'\nimport { PasswordField } from '../password-field'\nimport { PasswordInput } from '../password-input'\nimport { Override } from '~/utilities'\n\ntype ValidationResult = Record<string, boolean>\n\ntype CreatePasswordFieldProps = Override<\n React.ComponentProps<typeof PasswordInput> & FieldElementWrapperProps,\n {\n label?: string\n name?: string\n validate: (\n password: string\n ) => Promise<ValidationResult | undefined> | ValidationResult\n defaultValidation: ValidationResult\n messageDirection?: CSS['flexDirection']\n }\n>\n\nexport const CreatePasswordField = ({\n validate,\n defaultValidation,\n messageDirection = 'row',\n label = 'Create a password',\n name = 'password',\n css,\n validation,\n ...remainingProps\n}: CreatePasswordFieldProps) => {\n const { formState } = useFormContext()\n const [isFocused, setIsFocused] = React.useState<boolean>(false)\n const [validationResult, setValidationResult] =\n React.useState<ValidationResult>(defaultValidation)\n\n const touched = formState.touched[name]\n const error = formState.errors[name]?.type === 'validate'\n\n const validatePassword = React.useCallback(\n async (password: string) => {\n const result = await validate(password)\n\n if (result) {\n invariant(\n typeof result === 'object',\n 'The validate function must return an object'\n )\n\n setValidationResult(result)\n return Object.values(result).every((isValid) => isValid)\n }\n\n return false\n },\n [setValidationResult]\n )\n\n const handleChange = React.useCallback(throttle(500, validatePassword), [\n validatePassword\n ])\n\n const getMessageTheme = (result: boolean, isFocused: boolean) => {\n if (result) return 'success'\n\n return isFocused ? 'neutral' : 'error'\n }\n\n return (\n <Box css={css}>\n <PasswordField\n label={label}\n name={name}\n onChange={(e) => handleChange(e.target.value)}\n onBlur={() => setIsFocused(false)}\n onFocus={() => setIsFocused(true)}\n validation={{ ...validation, validate: validatePassword }}\n {...remainingProps}\n />\n {(touched || isFocused || error) && (\n <Flex\n css={{\n mt: '$2',\n gap: '$2',\n flexWrap: 'wrap',\n flexDirection: messageDirection\n }}\n >\n {Object.entries(validationResult).map(([message, result]) => (\n <InlineMessage\n key={message}\n theme={getMessageTheme(result, isFocused)}\n >\n {message}\n </InlineMessage>\n ))}\n </Flex>\n )}\n </Box>\n )\n}\n\nCreatePasswordField.displayName = 'CreatePasswordField'\n"],"names":["CreatePasswordField","validate","defaultValidation","messageDirection","label","name","css","validation","remainingProps","_a","formState","useFormContext","isFocused","setIsFocused","React","validationResult","setValidationResult","touched","error","validatePassword","password","result","invariant","isValid","handleChange","throttle","getMessageTheme","Box","PasswordField","Flex","message","InlineMessage"],"mappings":"gWA8Ba,MAAAA,EAAsB,CAAC,CAClC,SAAAC,EACA,kBAAAC,EACA,iBAAAC,EAAmB,MACnB,MAAAC,EAAQ,oBACR,KAAAC,EAAO,WACP,IAAAC,EACA,WAAAC,KACGC,CACL,IAAgC,CAvChC,IAAAC,EAwCE,KAAM,CAAE,UAAAC,CAAU,EAAIC,EAAAA,EAChB,CAACC,EAAWC,CAAY,EAAIC,EAAM,SAAkB,EAAK,EACzD,CAACC,EAAkBC,CAAmB,EAC1CF,EAAM,SAA2BZ,CAAiB,EAE9Ce,EAAUP,EAAU,QAAQL,GAC5Ba,IAAQT,EAAAC,EAAU,OAAOL,KAAjB,KAAA,OAAAI,EAAwB,QAAS,WAEzCU,EAAmBL,EAAM,YAC7B,MAAOM,GAAqB,CAC1B,MAAMC,EAAS,MAAMpB,EAASmB,CAAQ,EAEtC,OAAIC,GACFC,EACE,OAAOD,GAAW,SAClB,6CACF,EAEAL,EAAoBK,CAAM,EACnB,OAAO,OAAOA,CAAM,EAAE,MAAOE,GAAYA,CAAO,GAGlD,EACT,EACA,CAACP,CAAmB,CACtB,EAEMQ,EAAeV,EAAM,YAAYW,EAAS,IAAKN,CAAgB,EAAG,CACtEA,CACF,CAAC,EAEKO,EAAkB,CAACL,EAAiBT,IACpCS,EAAe,UAEZT,EAAY,UAAY,QAGjC,OACEE,EAAA,cAACa,EAAA,CAAI,IAAKrB,CAAAA,EACRQ,EAAA,cAACc,EAAA,CACC,MAAOxB,EACP,KAAMC,EACN,SAAW,GAAMmB,EAAa,EAAE,OAAO,KAAK,EAC5C,OAAQ,IAAMX,EAAa,EAAK,EAChC,QAAS,IAAMA,EAAa,EAAI,EAChC,WAAY,CAAE,GAAGN,EAAY,SAAUY,CAAiB,EACvD,GAAGX,CAAAA,CACN,GACES,GAAWL,GAAaM,IACxBJ,EAAA,cAACe,EAAA,CACC,IAAK,CACH,GAAI,KACJ,IAAK,KACL,SAAU,OACV,cAAe1B,CACjB,CAAA,EAEC,OAAO,QAAQY,CAAgB,EAAE,IAAI,CAAC,CAACe,EAAST,CAAM,IACrDP,EAAA,cAACiB,EAAA,CACC,IAAKD,EACL,MAAOJ,EAAgBL,EAAQT,CAAS,CAEvCkB,EAAAA,CACH,CACD,CACH,CAEJ,CAEJ,EAEA9B,EAAoB,YAAc"}
1
+ {"version":3,"file":"CreatePasswordField.js","sources":["../../../src/components/create-password-field/CreatePasswordField.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { throttle } from 'throttle-debounce'\n\nimport type { CSS } from '~/stitches'\nimport { Override } from '~/utilities'\n\nimport { Box } from '../box'\nimport { FieldElementWrapperProps } from '../field-wrapper'\nimport { Flex } from '../flex'\nimport { InlineMessage } from '../inline-message'\nimport { PasswordField } from '../password-field'\nimport { PasswordInput } from '../password-input'\n\ntype ValidationResult = Record<string, boolean>\n\ntype CreatePasswordFieldProps = Override<\n React.ComponentProps<typeof PasswordInput> & FieldElementWrapperProps,\n {\n label?: string\n name?: string\n validate: (\n password: string\n ) => Promise<ValidationResult | undefined> | ValidationResult\n defaultValidation: ValidationResult\n messageDirection?: CSS['flexDirection']\n }\n>\n\nexport const CreatePasswordField = ({\n validate,\n defaultValidation,\n messageDirection = 'row',\n label = 'Create a password',\n name = 'password',\n css,\n validation,\n ...remainingProps\n}: CreatePasswordFieldProps) => {\n const { formState } = useFormContext()\n const [isFocused, setIsFocused] = React.useState<boolean>(false)\n const [validationResult, setValidationResult] =\n React.useState<ValidationResult>(defaultValidation)\n\n const touched = formState.touched[name]\n const error = formState.errors[name]?.type === 'validate'\n\n const validatePassword = React.useCallback(\n async (password: string) => {\n const result = await validate(password)\n\n if (result) {\n invariant(\n typeof result === 'object',\n 'The validate function must return an object'\n )\n\n setValidationResult(result)\n return Object.values(result).every((isValid) => isValid)\n }\n\n return false\n },\n [setValidationResult]\n )\n\n const handleChange = React.useCallback(throttle(500, validatePassword), [\n validatePassword\n ])\n\n const getMessageTheme = (result: boolean, isFocused: boolean) => {\n if (result) return 'success'\n\n return isFocused ? 'neutral' : 'error'\n }\n\n return (\n <Box css={css}>\n <PasswordField\n label={label}\n name={name}\n onChange={(e) => handleChange(e.target.value)}\n onBlur={() => setIsFocused(false)}\n onFocus={() => setIsFocused(true)}\n validation={{ ...validation, validate: validatePassword }}\n {...remainingProps}\n />\n {(touched || isFocused || error) && (\n <Flex\n css={{\n mt: '$2',\n gap: '$2',\n flexWrap: 'wrap',\n flexDirection: messageDirection\n }}\n >\n {Object.entries(validationResult).map(([message, result]) => (\n <InlineMessage\n key={message}\n theme={getMessageTheme(result, isFocused)}\n >\n {message}\n </InlineMessage>\n ))}\n </Flex>\n )}\n </Box>\n )\n}\n\nCreatePasswordField.displayName = 'CreatePasswordField'\n"],"names":["CreatePasswordField","validate","defaultValidation","messageDirection","label","name","css","validation","remainingProps","_a","formState","useFormContext","isFocused","setIsFocused","React","validationResult","setValidationResult","touched","error","validatePassword","password","result","invariant","isValid","handleChange","throttle","getMessageTheme","Box","PasswordField","Flex","message","InlineMessage"],"mappings":"gWA8Ba,MAAAA,EAAsB,CAAC,CAClC,SAAAC,EACA,kBAAAC,EACA,iBAAAC,EAAmB,MACnB,MAAAC,EAAQ,oBACR,KAAAC,EAAO,WACP,IAAAC,EACA,WAAAC,KACGC,CACL,IAAgC,CAvChC,IAAAC,EAwCE,KAAM,CAAE,UAAAC,CAAU,EAAIC,EAAAA,EAChB,CAACC,EAAWC,CAAY,EAAIC,EAAM,SAAkB,EAAK,EACzD,CAACC,EAAkBC,CAAmB,EAC1CF,EAAM,SAA2BZ,CAAiB,EAE9Ce,EAAUP,EAAU,QAAQL,GAC5Ba,IAAQT,EAAAC,EAAU,OAAOL,KAAjB,KAAA,OAAAI,EAAwB,QAAS,WAEzCU,EAAmBL,EAAM,YAC7B,MAAOM,GAAqB,CAC1B,MAAMC,EAAS,MAAMpB,EAASmB,CAAQ,EAEtC,OAAIC,GACFC,EACE,OAAOD,GAAW,SAClB,6CACF,EAEAL,EAAoBK,CAAM,EACnB,OAAO,OAAOA,CAAM,EAAE,MAAOE,GAAYA,CAAO,GAGlD,EACT,EACA,CAACP,CAAmB,CACtB,EAEMQ,EAAeV,EAAM,YAAYW,EAAS,IAAKN,CAAgB,EAAG,CACtEA,CACF,CAAC,EAEKO,EAAkB,CAACL,EAAiBT,IACpCS,EAAe,UAEZT,EAAY,UAAY,QAGjC,OACEE,EAAA,cAACa,EAAA,CAAI,IAAKrB,CAAAA,EACRQ,EAAA,cAACc,EAAA,CACC,MAAOxB,EACP,KAAMC,EACN,SAAW,GAAMmB,EAAa,EAAE,OAAO,KAAK,EAC5C,OAAQ,IAAMX,EAAa,EAAK,EAChC,QAAS,IAAMA,EAAa,EAAI,EAChC,WAAY,CAAE,GAAGN,EAAY,SAAUY,CAAiB,EACvD,GAAGX,CAAAA,CACN,GACES,GAAWL,GAAaM,IACxBJ,EAAA,cAACe,EAAA,CACC,IAAK,CACH,GAAI,KACJ,IAAK,KACL,SAAU,OACV,cAAe1B,CACjB,CAAA,EAEC,OAAO,QAAQY,CAAgB,EAAE,IAAI,CAAC,CAACe,EAAST,CAAM,IACrDP,EAAA,cAACiB,EAAA,CACC,IAAKD,EACL,MAAOJ,EAAgBL,EAAQT,CAAS,CAEvCkB,EAAAA,CACH,CACD,CACH,CAEJ,CAEJ,EAEA9B,EAAoB,YAAc"}
@@ -1,2 +1,2 @@
1
- import*as t from"react";import{Table as m}from"../table/Table.js";import{useDataTable as p}from"./DataTableContext.js";import{DataTable as i}from"./DataTable.js";const l=({striped:r=!1,...o})=>{const{getRowModel:a}=p();return t.createElement(m.Body,{...o,striped:r},a().rows.map(e=>t.createElement(i.Row,{row:e,key:e.id})))};export{l as DataTableBody};
1
+ import*as r from"react";import{Table as m}from"../table/Table.js";import{useDataTable as p}from"./DataTableContext.js";import{DataTable as i}from"./DataTable.js";const l=({striped:t=!1,...o})=>{const{getRowModel:a}=p();return r.createElement(m.Body,{...o,striped:t},a().rows.map(e=>r.createElement(i.Row,{row:e,key:e.id})))};export{l as DataTableBody};
2
2
  //# sourceMappingURL=DataTableBody.js.map
@@ -1,2 +1,2 @@
1
- import*as t from"react";import{debounce as f}from"throttle-debounce";import{OptionallyVisuallyHiddenContainer as d}from"../../utilities/optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.js";import{Label as g}from"../label/Label.js";import{SearchInput as h}from"../search-input/SearchInput.js";import{AsyncDataState as D}from"./DataTable.types.js";import{useDataTable as E}from"./DataTableContext.js";const F=({onChange:a,label:e,hideLabel:r=!1,...n})=>{const{setGlobalFilter:o,getState:m,resetPagination:i,getTotalRows:s,asyncDataState:c}=E(),{globalFilter:u}=m();if(c!==D.PENDING&&s()===0)return null;const b=f(250,l=>{const{target:{value:p}}=l;a==null||a(l),i(),o(p)});return t.createElement(t.Fragment,null,t.createElement(d,{hidden:r},t.createElement(g,{css:{mb:"$3"},htmlFor:e},e)),t.createElement(h,{...n,defaultValue:u,onChange:b,name:e}))};export{F as DataTableGlobalFilter};
1
+ import*as e from"react";import{debounce as f}from"throttle-debounce";import{OptionallyVisuallyHiddenContainer as d}from"../../utilities/optionally-visually-hidden-container/OptionallyVisuallyHiddenContainer.js";import{Label as g}from"../label/Label.js";import{SearchInput as h}from"../search-input/SearchInput.js";import{AsyncDataState as D}from"./DataTable.types.js";import{useDataTable as E}from"./DataTableContext.js";const F=({onChange:a,label:t,hideLabel:r=!1,...n})=>{const{setGlobalFilter:o,getState:m,resetPagination:i,getTotalRows:s,asyncDataState:c}=E(),{globalFilter:u}=m();if(c!==D.PENDING&&s()===0)return null;const b=f(250,l=>{const{target:{value:p}}=l;a==null||a(l),i(),o(p)});return e.createElement(e.Fragment,null,e.createElement(d,{hidden:r},e.createElement(g,{css:{mb:"$3"},htmlFor:t},t)),e.createElement(h,{...n,defaultValue:u,onChange:b,name:t}))};export{F as DataTableGlobalFilter};
2
2
  //# sourceMappingURL=DataTableGlobalFilter.js.map
@@ -1,2 +1,2 @@
1
- import*as a from"react";import{styled as r}from"../../stitches.js";import{Loader as e}from"../loader/Loader.js";import{AsyncDataState as m}from"./DataTable.types.js";import{useDataTable as n}from"./DataTableContext.js";const s=r(e,{position:"absolute",left:"50%",top:"50%",transform:"translate(-50%, -50%)",zIndex:1}),l=t=>{const{asyncDataState:o}=n();return o!==m.PENDING?null:a.createElement(s,{...t})};export{l as DataTableLoading};
1
+ import*as a from"react";import{styled as e}from"../../stitches.js";import{Loader as r}from"../loader/Loader.js";import{AsyncDataState as m}from"./DataTable.types.js";import{useDataTable as n}from"./DataTableContext.js";const s=e(r,{position:"absolute",left:"50%",top:"50%",transform:"translate(-50%, -50%)",zIndex:1}),l=t=>{const{asyncDataState:o}=n();return o!==m.PENDING?null:a.createElement(s,{...t})};export{l as DataTableLoading};
2
2
  //# sourceMappingURL=DataTableLoading.js.map
@@ -1,2 +1,2 @@
1
- import*as n from"@radix-ui/react-visually-hidden";import*as e from"react";import{Checkbox as c}from"../checkbox/Checkbox.js";import{Label as m}from"../label/Label.js";import{useDataTable as h}from"./DataTableContext.js";const i=({rowId:t,checked:r,onCheckedChange:a,label:l=`Row ${t} selection`})=>{const{tableId:o}=h();return e.createElement(e.Fragment,null,e.createElement(n.Root,null,e.createElement(m,{htmlFor:`${o}_row_${t}_selection`},l)),e.createElement(c,{checked:r,onCheckedChange:a,name:`${o}_row_${t}_selection`}))};export{i as DataTableRowSelectionCheckbox};
1
+ import*as n from"@radix-ui/react-visually-hidden";import*as e from"react";import{Checkbox as c}from"../checkbox/Checkbox.js";import{Label as m}from"../label/Label.js";import{useDataTable as h}from"./DataTableContext.js";const i=({rowId:o,checked:r,onCheckedChange:a,label:l=`Row ${o} selection`})=>{const{tableId:t}=h();return e.createElement(e.Fragment,null,e.createElement(n.Root,null,e.createElement(m,{htmlFor:`${t}_row_${o}_selection`},l)),e.createElement(c,{checked:r,onCheckedChange:a,name:`${t}_row_${o}_selection`}))};export{i as DataTableRowSelectionCheckbox};
2
2
  //# sourceMappingURL=DataTableRowSelectionCheckbox.js.map
@@ -1,2 +1,2 @@
1
- import*as c from"@radix-ui/react-visually-hidden";import*as e from"react";import{Checkbox as s}from"../checkbox/Checkbox.js";import{Label as i}from"../label/Label.js";import{useDataTable as g}from"./DataTableContext.js";const b=({label:r="All rows selection"})=>{const{getIsAllPageRowsSelected:t,getIsSomePageRowsSelected:l,toggleAllPageRowsSelected:o,tableId:a}=g(),m=()=>l()?"indeterminate":!!t(),n=()=>l()?o(!1):o(!t());return e.createElement(e.Fragment,null,e.createElement(c.Root,null,e.createElement(i,{htmlFor:`${a}_all_rows_selection`},r)),e.createElement(s,{checked:m(),onCheckedChange:n,name:`${a}_allRowsSelection`}))};export{b as DataTableSelectAllRowsCheckbox};
1
+ import*as c from"@radix-ui/react-visually-hidden";import*as e from"react";import{Checkbox as s}from"../checkbox/Checkbox.js";import{Label as i}from"../label/Label.js";import{useDataTable as g}from"./DataTableContext.js";const b=({label:r="All rows selection"})=>{const{getIsAllPageRowsSelected:l,getIsSomePageRowsSelected:t,toggleAllPageRowsSelected:o,tableId:a}=g(),m=()=>t()?"indeterminate":!!l(),n=()=>t()?o(!1):o(!l());return e.createElement(e.Fragment,null,e.createElement(c.Root,null,e.createElement(i,{htmlFor:`${a}_all_rows_selection`},r)),e.createElement(s,{checked:m(),onCheckedChange:n,name:`${a}_allRowsSelection`}))};export{b as DataTableSelectAllRowsCheckbox};
2
2
  //# sourceMappingURL=DataTableSelectAllRowsCheckbox.js.map
@@ -1,2 +1,2 @@
1
- import*as r from"react";import{Table as d}from"../../table/Table.js";import{useDataTable as i}from"../DataTableContext.js";import{DragAndDropTableRow as p}from"./DragAndDropTableRow.js";const l=({striped:e=!1,idColumn:t="id",...m})=>{const{getRowModel:a}=i();return r.createElement(d.Body,{...m,striped:e},a().rows.map(o=>r.createElement(p,{row:o,key:o.id,idColumn:t})))};export{l as DragAndDropTableBody};
1
+ import*as o from"react";import{Table as d}from"../../table/Table.js";import{useDataTable as i}from"../DataTableContext.js";import{DragAndDropTableRow as p}from"./DragAndDropTableRow.js";const l=({striped:r=!1,idColumn:t="id",...m})=>{const{getRowModel:a}=i();return o.createElement(d.Body,{...m,striped:r},a().rows.map(e=>o.createElement(p,{row:e,key:e.id,idColumn:t})))};export{l as DragAndDropTableBody};
2
2
  //# sourceMappingURL=DragAndDropTableBody.js.map
@@ -1,2 +1,2 @@
1
- import e from"react";const i=t=>{const[o,s]=e.useState(!1),[r,n]=e.useState(t?[{id:t.column,desc:t.direction==="desc"}]:[]);return{isSortable:o,setIsSortable:s,sorting:r,setSorting:n}};export{i as useSortByColumn};
1
+ import t from"react";const i=e=>{const[o,s]=t.useState(!1),[r,n]=t.useState(e?[{id:e.column,desc:e.direction==="desc"}]:[]);return{isSortable:o,setIsSortable:s,sorting:r,setSorting:n}};export{i as useSortByColumn};
2
2
  //# sourceMappingURL=useSorting.js.map
@@ -5,7 +5,7 @@ export declare type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> & C
5
5
  initialDate?: Date;
6
6
  dateFormat?: string;
7
7
  disabled?: boolean;
8
- size?: 'sm' | 'md';
8
+ size?: 'sm' | 'md' | 'lg';
9
9
  revalidate?: () => Promise<boolean>;
10
10
  onChange?: (value?: Date) => void;
11
11
  };
@@ -13,7 +13,7 @@ export declare const DateInput: React.ForwardRefExoticComponent<Omit<DayzedInter
13
13
  initialDate?: Date | undefined;
14
14
  dateFormat?: string | undefined;
15
15
  disabled?: boolean | undefined;
16
- size?: "sm" | "md" | undefined;
16
+ size?: "sm" | "md" | "lg" | undefined;
17
17
  revalidate?: (() => Promise<boolean>) | undefined;
18
18
  onChange?: ((value?: Date | undefined) => void) | undefined;
19
19
  } & React.RefAttributes<HTMLInputElement>>;
@@ -1,2 +1,2 @@
1
- import{CalendarEvent as N}from"@atom-learning/icons";import*as e from"react";import{DIALOG_Z_INDEX as x}from"../../constants/zIndices.js";import{ActionIcon as z}from"../action-icon/ActionIcon.js";import{Box as F}from"../box/Box.js";import{Calendar as L}from"../calendar/Calendar.js";import{DEFAULT_LABELS as S}from"../calendar/constants.js";import{Icon as _}from"../icon/Icon.js";import{Input as k}from"../input/Input.js";import{Popover as r}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as R}from"./constants.js";import{useDate as B}from"./use-date.js";const D=e.forwardRef(({initialDate:E,dateFormat:g=R,firstDayOfWeek:h=1,disabled:s,monthNames:b,weekdayNames:v,size:l="md",labels:y,revalidate:o,onChange:n,minDate:A,maxDate:C,...I},w)=>{const{date:a,dateString:O,setDate:m}=B(E,g),i={...S,...y},[T,d]=e.useState(!1),f=e.useRef(null),p=e.useRef(null);return e.useEffect(()=>{n==null||n(a)},[a,n]),e.createElement(F,{css:{position:"relative"}},e.createElement(k,{name:"date",disabled:s,size:l,...I,onChange:t=>m(t.target.value,!0),value:O,ref:w}),e.createElement(r,{modal:!0,open:T,onOpenChange:d},e.createElement(r.Trigger,{asChild:!0},e.createElement(z,{css:{position:"absolute",top:"0",right:"0"},disabled:s,label:i.open,size:l,theme:"neutral",hasTooltip:!1},e.createElement(_,{is:N}))),e.createElement(r.Portal,null,e.createElement(r.Content,{css:{pr:"$sizes$2",zIndex:x},side:"bottom",align:"end",showCloseButton:!1,onOpenAutoFocus:t=>{var c,u;t.preventDefault(),a?(c=p.current)==null||c.focus():(u=f.current)==null||u.focus()}},e.createElement(L,{date:a||new Date,selected:a,onDateSelected:async t=>{d(!1),await m(t.date,!1),o&&o()},setYear:async t=>{await m(t,!1),o&&o()},minDate:A,maxDate:C,refDateToday:f,refDateSelected:p,firstDayOfWeek:h,monthNames:b,weekdayNames:v,labels:i})))))});D.displayName="DateInput";export{D as DateInput};
1
+ import{CalendarEvent as x}from"@atom-learning/icons";import*as e from"react";import{DIALOG_Z_INDEX as F}from"../../constants/zIndices.js";import{ActionIcon as L}from"../action-icon/ActionIcon.js";import{Box as N}from"../box/Box.js";import{Calendar as O}from"../calendar/Calendar.js";import{DEFAULT_LABELS as _}from"../calendar/constants.js";import{Icon as k}from"../icon/Icon.js";import{Input as R}from"../input/Input.js";import{Popover as r}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as B}from"./constants.js";import{useDate as M}from"./use-date.js";import"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{getFieldIconSize as P}from"../../utilities/style/get-icon-size.js";const D=e.forwardRef(({initialDate:E,dateFormat:h=B,firstDayOfWeek:g=1,disabled:l,monthNames:I,weekdayNames:b,size:n="md",labels:v,revalidate:o,onChange:m,minDate:y,maxDate:A,...C},w)=>{const{date:a,dateString:z,setDate:i}=M(E,h),s={..._,...v},[S,p]=e.useState(!1),d=e.useRef(null),f=e.useRef(null),T=e.useMemo(()=>P(n),[n]);return e.useEffect(()=>{m==null||m(a)},[a,m]),e.createElement(N,{css:{position:"relative",height:"max-content"}},e.createElement(R,{name:"date",disabled:l,size:n,...C,onChange:t=>i(t.target.value,!0),value:z,ref:w}),e.createElement(r,{modal:!0,open:S,onOpenChange:p},e.createElement(r.Trigger,{asChild:!0},e.createElement(L,{css:{position:"absolute",top:"50%",transform:"translateY(-50%)",right:"0"},disabled:l,label:s.open,size:T,theme:"neutral",hasTooltip:!1},e.createElement(k,{is:x}))),e.createElement(r.Portal,null,e.createElement(r.Content,{css:{pr:"$sizes$2",zIndex:F},side:"bottom",align:"end",showCloseButton:!1,onOpenAutoFocus:t=>{var c,u;t.preventDefault(),a?(c=f.current)==null||c.focus():(u=d.current)==null||u.focus()}},e.createElement(O,{date:a||new Date,selected:a,onDateSelected:async t=>{p(!1),await i(t.date,!1),o&&o()},setYear:async t=>{await i(t,!1),o&&o()},minDate:y,maxDate:A,refDateToday:d,refDateSelected:f,firstDayOfWeek:g,monthNames:I,weekdayNames:b,labels:s})))))});D.displayName="DateInput";export{D as DateInput};
2
2
  //# sourceMappingURL=DateInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DateInput.js","sources":["../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import { CalendarEvent } from '@atom-learning/icons'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport * as React from 'react'\n\nimport { DIALOG_Z_INDEX } from '~/constants/zIndices'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Box } from '../box/Box'\nimport { Calendar, CalendarTranslationProps } from '../calendar/Calendar'\nimport { DEFAULT_LABELS } from '../calendar/constants'\nimport { Icon } from '../icon/Icon'\nimport { Input } from '../input/Input'\nimport { Popover } from '../popover/Popover'\nimport { DEFAULT_DATE_FORMAT } from './constants'\nimport { useDate } from './use-date'\n\nexport type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> &\n CalendarTranslationProps & {\n initialDate?: Date\n dateFormat?: string\n disabled?: boolean\n size?: 'sm' | 'md'\n revalidate?: () => Promise<boolean>\n onChange?: (value?: Date) => void\n }\n\nexport const DateInput = React.forwardRef<HTMLInputElement, DateInputProps>(\n (\n {\n initialDate,\n dateFormat = DEFAULT_DATE_FORMAT,\n firstDayOfWeek = 1,\n disabled,\n monthNames,\n weekdayNames,\n size = 'md',\n labels,\n revalidate,\n onChange,\n minDate,\n maxDate,\n ...remainingProps\n },\n ref\n ) => {\n const { date, dateString, setDate } = useDate(initialDate, dateFormat)\n const updatedLabels = {\n ...DEFAULT_LABELS,\n ...labels\n }\n\n const [calendarOpen, setCalendarOpen] = React.useState(false)\n\n const refDateToday = React.useRef<HTMLButtonElement>(null)\n const refDateSelected = React.useRef<HTMLButtonElement>(null)\n\n React.useEffect(() => {\n onChange?.(date)\n }, [date, onChange])\n\n return (\n <Box css={{ position: 'relative' }}>\n <Input\n name=\"date\"\n disabled={disabled}\n size={size}\n {...remainingProps}\n onChange={(event) => setDate(event.target.value, true)}\n value={dateString}\n ref={ref}\n />\n <Popover modal open={calendarOpen} onOpenChange={setCalendarOpen}>\n <Popover.Trigger asChild>\n <ActionIcon\n css={{ position: 'absolute', top: '0', right: '0' }}\n disabled={disabled}\n label={updatedLabels.open}\n size={size}\n theme=\"neutral\"\n hasTooltip={false}\n >\n <Icon is={CalendarEvent} />\n </ActionIcon>\n </Popover.Trigger>\n <Popover.Portal>\n <Popover.Content\n css={{ pr: '$sizes$2', zIndex: DIALOG_Z_INDEX }}\n side=\"bottom\"\n align=\"end\"\n showCloseButton={false}\n onOpenAutoFocus={(e) => {\n e.preventDefault()\n if (date) {\n refDateSelected.current?.focus()\n } else {\n refDateToday.current?.focus()\n }\n }}\n >\n <Calendar\n date={date || new Date()}\n selected={date}\n onDateSelected={async (date) => {\n setCalendarOpen(false)\n await setDate(date.date, false)\n if (revalidate) revalidate()\n }}\n setYear={async (date) => {\n await setDate(date, false)\n if (revalidate) revalidate()\n }}\n minDate={minDate}\n maxDate={maxDate}\n refDateToday={refDateToday}\n refDateSelected={refDateSelected}\n firstDayOfWeek={firstDayOfWeek}\n monthNames={monthNames}\n weekdayNames={weekdayNames}\n labels={updatedLabels}\n />\n </Popover.Content>\n </Popover.Portal>\n </Popover>\n </Box>\n )\n }\n)\n\nDateInput.displayName = 'DateInput'\n"],"names":["DateInput","React","initialDate","dateFormat","DEFAULT_DATE_FORMAT","firstDayOfWeek","disabled","monthNames","weekdayNames","size","labels","revalidate","onChange","minDate","maxDate","remainingProps","ref","date","dateString","setDate","useDate","updatedLabels","DEFAULT_LABELS","calendarOpen","setCalendarOpen","refDateToday","refDateSelected","Box","Input","event","Popover","ActionIcon","Icon","CalendarEvent","DIALOG_Z_INDEX","e","_a","_b","Calendar"],"mappings":"yjBA0BaA,EAAYC,EAAM,WAC7B,CACE,CACE,YAAAC,EACA,WAAAC,EAAaC,EACb,eAAAC,EAAiB,EACjB,SAAAC,EACA,WAAAC,EACA,aAAAC,EACA,KAAAC,EAAO,KACP,OAAAC,EACA,WAAAC,EACA,SAAAC,EACA,QAAAC,EACA,QAAAC,KACGC,CACL,EACAC,IACG,CACH,KAAM,CAAE,KAAAC,EAAM,WAAAC,EAAY,QAAAC,CAAQ,EAAIC,EAAQlB,EAAaC,CAAU,EAC/DkB,EAAgB,CACpB,GAAGC,EACH,GAAGZ,CACL,EAEM,CAACa,EAAcC,CAAe,EAAIvB,EAAM,SAAS,EAAK,EAEtDwB,EAAexB,EAAM,OAA0B,IAAI,EACnDyB,EAAkBzB,EAAM,OAA0B,IAAI,EAE5D,OAAAA,EAAM,UAAU,IAAM,CACpBW,GAAA,MAAAA,EAAWK,CAAAA,CACb,EAAG,CAACA,EAAML,CAAQ,CAAC,EAGjBX,EAAA,cAAC0B,EAAA,CAAI,IAAK,CAAE,SAAU,UAAW,CAC/B1B,EAAAA,EAAA,cAAC2B,EAAA,CACC,KAAK,OACL,SAAUtB,EACV,KAAMG,EACL,GAAGM,EACJ,SAAWc,GAAUV,EAAQU,EAAM,OAAO,MAAO,EAAI,EACrD,MAAOX,EACP,IAAKF,CACP,CAAA,EACAf,EAAA,cAAC6B,EAAA,CAAQ,MAAK,GAAC,KAAMP,EAAc,aAAcC,CAAAA,EAC/CvB,EAAA,cAAC6B,EAAQ,QAAR,CAAgB,QAAO,EAAA,EACtB7B,EAAA,cAAC8B,EAAA,CACC,IAAK,CAAE,SAAU,WAAY,IAAK,IAAK,MAAO,GAAI,EAClD,SAAUzB,EACV,MAAOe,EAAc,KACrB,KAAMZ,EACN,MAAM,UACN,WAAY,EAAA,EAEZR,EAAA,cAAC+B,EAAA,CAAK,GAAIC,CAAe,CAAA,CAC3B,CACF,EACAhC,EAAA,cAAC6B,EAAQ,OAAR,KACC7B,EAAA,cAAC6B,EAAQ,QAAR,CACC,IAAK,CAAE,GAAI,WAAY,OAAQI,CAAe,EAC9C,KAAK,SACL,MAAM,MACN,gBAAiB,GACjB,gBAAkBC,GAAM,CA1FtC,IAAAC,EAAAC,EA2FgBF,EAAE,eACElB,EAAAA,GACFmB,EAAAV,EAAgB,UAAhB,MAAAU,EAAyB,MAEzBC,GAAAA,EAAAZ,EAAa,UAAb,MAAAY,EAAsB,MAE1B,CAAA,CAAA,EAEApC,EAAA,cAACqC,EAAA,CACC,KAAMrB,GAAQ,IAAI,KAClB,SAAUA,EACV,eAAgB,MAAOA,GAAS,CAC9BO,EAAgB,EAAK,EACrB,MAAML,EAAQF,EAAK,KAAM,EAAK,EAC1BN,GAAYA,GAClB,EACA,QAAS,MAAOM,GAAS,CACvB,MAAME,EAAQF,EAAM,EAAK,EACrBN,GAAYA,EAClB,CAAA,EACA,QAASE,EACT,QAASC,EACT,aAAcW,EACd,gBAAiBC,EACjB,eAAgBrB,EAChB,WAAYE,EACZ,aAAcC,EACd,OAAQa,CACV,CAAA,CACF,CACF,CACF,CACF,CAEJ,CACF,EAEArB,EAAU,YAAc"}
1
+ {"version":3,"file":"DateInput.js","sources":["../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import { CalendarEvent } from '@atom-learning/icons'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport * as React from 'react'\n\nimport { DIALOG_Z_INDEX } from '~/constants/zIndices'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Box } from '../box/Box'\nimport { Calendar, CalendarTranslationProps } from '../calendar/Calendar'\nimport { DEFAULT_LABELS } from '../calendar/constants'\nimport { Icon } from '../icon/Icon'\nimport { Input } from '../input/Input'\nimport { Popover } from '../popover/Popover'\nimport { DEFAULT_DATE_FORMAT } from './constants'\nimport { useDate } from './use-date'\nimport { getFieldIconSize } from '~/utilities'\n\nexport type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> &\n CalendarTranslationProps & {\n initialDate?: Date\n dateFormat?: string\n disabled?: boolean\n size?: 'sm' | 'md' | 'lg'\n revalidate?: () => Promise<boolean>\n onChange?: (value?: Date) => void\n }\n\nexport const DateInput = React.forwardRef<HTMLInputElement, DateInputProps>(\n (\n {\n initialDate,\n dateFormat = DEFAULT_DATE_FORMAT,\n firstDayOfWeek = 1,\n disabled,\n monthNames,\n weekdayNames,\n size = 'md',\n labels,\n revalidate,\n onChange,\n minDate,\n maxDate,\n ...remainingProps\n },\n ref\n ) => {\n const { date, dateString, setDate } = useDate(initialDate, dateFormat)\n const updatedLabels = {\n ...DEFAULT_LABELS,\n ...labels\n }\n\n const [calendarOpen, setCalendarOpen] = React.useState(false)\n\n const refDateToday = React.useRef<HTMLButtonElement>(null)\n const refDateSelected = React.useRef<HTMLButtonElement>(null)\n\n const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n React.useEffect(() => {\n onChange?.(date)\n }, [date, onChange])\n\n return (\n <Box css={{ position: 'relative', height: 'max-content' }}>\n <Input\n name=\"date\"\n disabled={disabled}\n size={size}\n {...remainingProps}\n onChange={(event) => setDate(event.target.value, true)}\n value={dateString}\n ref={ref}\n />\n <Popover modal open={calendarOpen} onOpenChange={setCalendarOpen}>\n <Popover.Trigger asChild>\n <ActionIcon\n css={{\n position: 'absolute',\n top: '50%',\n transform: 'translateY(-50%)',\n right: '0'\n }}\n disabled={disabled}\n label={updatedLabels.open}\n size={iconSize}\n theme=\"neutral\"\n hasTooltip={false}\n >\n <Icon is={CalendarEvent} />\n </ActionIcon>\n </Popover.Trigger>\n <Popover.Portal>\n <Popover.Content\n css={{ pr: '$sizes$2', zIndex: DIALOG_Z_INDEX }}\n side=\"bottom\"\n align=\"end\"\n showCloseButton={false}\n onOpenAutoFocus={(e) => {\n e.preventDefault()\n if (date) {\n refDateSelected.current?.focus()\n } else {\n refDateToday.current?.focus()\n }\n }}\n >\n <Calendar\n date={date || new Date()}\n selected={date}\n onDateSelected={async (date) => {\n setCalendarOpen(false)\n await setDate(date.date, false)\n if (revalidate) revalidate()\n }}\n setYear={async (date) => {\n await setDate(date, false)\n if (revalidate) revalidate()\n }}\n minDate={minDate}\n maxDate={maxDate}\n refDateToday={refDateToday}\n refDateSelected={refDateSelected}\n firstDayOfWeek={firstDayOfWeek}\n monthNames={monthNames}\n weekdayNames={weekdayNames}\n labels={updatedLabels}\n />\n </Popover.Content>\n </Popover.Portal>\n </Popover>\n </Box>\n )\n }\n)\n\nDateInput.displayName = 'DateInput'\n"],"names":["DateInput","React","initialDate","dateFormat","DEFAULT_DATE_FORMAT","firstDayOfWeek","disabled","monthNames","weekdayNames","size","labels","revalidate","onChange","minDate","maxDate","remainingProps","ref","date","dateString","setDate","useDate","updatedLabels","DEFAULT_LABELS","calendarOpen","setCalendarOpen","refDateToday","refDateSelected","iconSize","getFieldIconSize","Box","Input","event","Popover","ActionIcon","Icon","CalendarEvent","DIALOG_Z_INDEX","e","_a","_b","Calendar"],"mappings":"q1BA2BaA,EAAYC,EAAM,WAC7B,CACE,CACE,YAAAC,EACA,WAAAC,EAAaC,EACb,eAAAC,EAAiB,EACjB,SAAAC,EACA,WAAAC,EACA,aAAAC,EACA,KAAAC,EAAO,KACP,OAAAC,EACA,WAAAC,EACA,SAAAC,EACA,QAAAC,EACA,QAAAC,KACGC,CACL,EACAC,IACG,CACH,KAAM,CAAE,KAAAC,EAAM,WAAAC,EAAY,QAAAC,CAAQ,EAAIC,EAAQlB,EAAaC,CAAU,EAC/DkB,EAAgB,CACpB,GAAGC,EACH,GAAGZ,CACL,EAEM,CAACa,EAAcC,CAAe,EAAIvB,EAAM,SAAS,EAAK,EAEtDwB,EAAexB,EAAM,OAA0B,IAAI,EACnDyB,EAAkBzB,EAAM,OAA0B,IAAI,EAEtD0B,EAAW1B,EAAM,QAAQ,IAAM2B,EAAiBnB,CAAI,EAAG,CAACA,CAAI,CAAC,EAEnE,OAAAR,EAAM,UAAU,IAAM,CACpBW,GAAA,MAAAA,EAAWK,CACb,CAAA,EAAG,CAACA,EAAML,CAAQ,CAAC,EAGjBX,EAAA,cAAC4B,EAAA,CAAI,IAAK,CAAE,SAAU,WAAY,OAAQ,aAAc,CACtD5B,EAAAA,EAAA,cAAC6B,EAAA,CACC,KAAK,OACL,SAAUxB,EACV,KAAMG,EACL,GAAGM,EACJ,SAAWgB,GAAUZ,EAAQY,EAAM,OAAO,MAAO,EAAI,EACrD,MAAOb,EACP,IAAKF,CACP,CAAA,EACAf,EAAA,cAAC+B,EAAA,CAAQ,MAAK,GAAC,KAAMT,EAAc,aAAcC,CAC/CvB,EAAAA,EAAA,cAAC+B,EAAQ,QAAR,CAAgB,QAAO,EAAA,EACtB/B,EAAA,cAACgC,EAAA,CACC,IAAK,CACH,SAAU,WACV,IAAK,MACL,UAAW,mBACX,MAAO,GACT,EACA,SAAU3B,EACV,MAAOe,EAAc,KACrB,KAAMM,EACN,MAAM,UACN,WAAY,EAEZ1B,EAAAA,EAAA,cAACiC,EAAA,CAAK,GAAIC,CAAe,CAAA,CAC3B,CACF,EACAlC,EAAA,cAAC+B,EAAQ,OAAR,KACC/B,EAAA,cAAC+B,EAAQ,QAAR,CACC,IAAK,CAAE,GAAI,WAAY,OAAQI,CAAe,EAC9C,KAAK,SACL,MAAM,MACN,gBAAiB,GACjB,gBAAkBC,GAAM,CAlGtC,IAAAC,EAAAC,EAmGgBF,EAAE,iBACEpB,GACFqB,EAAAZ,EAAgB,UAAhB,MAAAY,EAAyB,MAAA,GAEzBC,EAAAd,EAAa,UAAb,MAAAc,EAAsB,MAE1B,CAAA,CAEAtC,EAAAA,EAAA,cAACuC,EAAA,CACC,KAAMvB,GAAQ,IAAI,KAClB,SAAUA,EACV,eAAgB,MAAOA,GAAS,CAC9BO,EAAgB,EAAK,EACrB,MAAML,EAAQF,EAAK,KAAM,EAAK,EAC1BN,GAAYA,EAClB,CAAA,EACA,QAAS,MAAOM,GAAS,CACvB,MAAME,EAAQF,EAAM,EAAK,EACrBN,GAAYA,EAClB,CAAA,EACA,QAASE,EACT,QAASC,EACT,aAAcW,EACd,gBAAiBC,EACjB,eAAgBrB,EAChB,WAAYE,EACZ,aAAcC,EACd,OAAQa,CACV,CAAA,CACF,CACF,CACF,CACF,CAEJ,CACF,EAEArB,EAAU,YAAc"}
@@ -1,2 +1,2 @@
1
- import{Slot as c}from"@radix-ui/react-slot";import*as e from"react";const r=e.createContext({isDismissed:!1,setIsDismissed:()=>null}),n=({children:t,disabled:s})=>{const[i,l]=e.useState(!1),o=e.useMemo(()=>({disabled:s,isDismissed:i,setIsDismissed:l}),[s,i]);return e.createElement(r.Provider,{value:o},t)},u=({asChild:t=!1,value:s,onDismiss:i,...l})=>{const o=e.useContext(r),{isDismissed:d,disabled:a}=o;if(e.useEffect(()=>{d&&(i==null||i(s))},[d]),d)return null;const m={...a&&{["data-disabled"]:""},...l};return e.createElement(t?c:"div",{...m})},b=({disabled:t=!1,...s})=>e.createElement(n,{disabled:t},e.createElement(u,{...s}));export{b as DismissibleRoot,r as DismissibleRootContext,n as DismissibleRootProvider};
1
+ import{Slot as c}from"@radix-ui/react-slot";import*as e from"react";const r=e.createContext({isDismissed:!1,setIsDismissed:()=>null}),n=({children:i,disabled:s})=>{const[t,l]=e.useState(!1),o=e.useMemo(()=>({disabled:s,isDismissed:t,setIsDismissed:l}),[s,t]);return e.createElement(r.Provider,{value:o},i)},u=({asChild:i=!1,value:s,onDismiss:t,...l})=>{const o=e.useContext(r),{isDismissed:d,disabled:a}=o;if(e.useEffect(()=>{d&&(t==null||t(s))},[d]),d)return null;const m={...a&&{["data-disabled"]:""},...l};return e.createElement(i?c:"div",{...m})},b=({disabled:i=!1,...s})=>e.createElement(n,{disabled:i},e.createElement(u,{...s}));export{b as DismissibleRoot,r as DismissibleRootContext,n as DismissibleRootProvider};
2
2
  //# sourceMappingURL=DismissibleRoot.js.map
@@ -1,2 +1,2 @@
1
- import{Slot as m}from"@radix-ui/react-slot";import*as t from"react";import{DismissibleRootContext as l}from"./DismissibleRoot.js";const b=s=>t.createElement("button",{type:"button",...s},"Dismiss"),a=({asChild:s=!1,...i})=>{const e=t.useContext(l);if(e===void 0)throw new Error("Dismissible.Trigger can only be used within a Dismissible.Item");const{setIsDismissed:o,disabled:r}=e,n={disabled:r,onClick:()=>{o(!0)},...i};return t.createElement(s?m:b,{...n})};export{a as DismissibleTrigger};
1
+ import{Slot as m}from"@radix-ui/react-slot";import*as s from"react";import{DismissibleRootContext as l}from"./DismissibleRoot.js";const b=e=>s.createElement("button",{type:"button",...e},"Dismiss"),a=({asChild:e=!1,...t})=>{const i=s.useContext(l);if(i===void 0)throw new Error("Dismissible.Trigger can only be used within a Dismissible.Item");const{setIsDismissed:o,disabled:r}=i,n={disabled:r,onClick:()=>{o(!0)},...t};return s.createElement(e?m:b,{...n})};export{a as DismissibleTrigger};
2
2
  //# sourceMappingURL=DismissibleTrigger.js.map
@@ -1,2 +1,2 @@
1
- import t from"react";import{styled as n}from"../../stitches.js";const i=n("hr",{border:0,bg:"$tonal100",variants:{orientation:{horizontal:{height:1,width:"100%"},vertical:{height:"100%",width:1,minHeight:"$3"}}}}),a=t.forwardRef(({orientation:r="horizontal",...e},o)=>t.createElement(i,{ref:o,orientation:r,...e}));export{a as Divider,i as StyledDivider};
1
+ import t from"react";import{styled as n}from"../../stitches.js";const i=n("hr",{border:0,bg:"$tonal100",variants:{orientation:{horizontal:{height:1,width:"100%"},vertical:{height:"100%",width:1,minHeight:"$3"}}}}),a=t.forwardRef(({orientation:e="horizontal",...r},o)=>t.createElement(i,{ref:o,orientation:e,...r}));export{a as Divider,i as StyledDivider};
2
2
  //# sourceMappingURL=Divider.js.map
@@ -1,2 +1,2 @@
1
- import*as e from"react";import{Text as r}from"../text/Text.js";const s=({children:t,css:o})=>e.createElement(r,{size:"sm",css:{color:"$tonal300",maxWidth:"80ch",...o}},t);export{s as Description};
1
+ import*as t from"react";import{Text as r}from"../text/Text.js";const s=({children:e,css:o})=>t.createElement(r,{size:"sm",css:{color:"$tonal300",maxWidth:"80ch",...o}},e);export{s as Description};
2
2
  //# sourceMappingURL=FieldDescription.js.map
@@ -1,2 +1,2 @@
1
- import*as e from"react";import{Box as o}from"../box/Box.js";import{Checkbox as d}from"../checkbox/Checkbox.js";import{InlineMessage as f}from"../inline-message/InlineMessage.js";import{Label as $}from"../label/Label.js";import{RadioButton as u}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import{Description as E}from"./FieldDescription.js";const l=({align:n="start",children:a,css:s,description:i,direction:t="row",error:m,label:p,required:c})=>e.createElement(o,{css:s},e.createElement($,{align:n,direction:t,required:c,type:"inline"},e.Children.map(a,r=>e.createElement(o,{css:{[t==="reverse"?"ml":"mr"]:"$3",...((r==null?void 0:r.type)===d||(r==null?void 0:r.type)===u)&&{transform:"translateY($space$1)"}}},r)),p),m&&e.createElement(f,{css:{mt:"$2"}},m),i&&e.createElement(E,{css:{mt:"$2",[t==="reverse"?"mr":"ml"]:"calc($space$3 + $sizes$1)"}},i));l.displayName="InlineFieldWrapper";export{l as InlineFieldWrapper};
1
+ import*as e from"react";import{Box as o}from"../box/Box.js";import{Checkbox as d}from"../checkbox/Checkbox.js";import{InlineMessage as $}from"../inline-message/InlineMessage.js";import{Label as f}from"../label/Label.js";import{RadioButton as u}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import{Description as E}from"./FieldDescription.js";const l=({align:n="start",children:a,css:s,description:i,direction:t="row",error:m,label:p,required:c})=>e.createElement(o,{css:s},e.createElement(f,{align:n,direction:t,required:c,type:"inline"},e.Children.map(a,r=>e.createElement(o,{css:{[t==="reverse"?"ml":"mr"]:"$3",...((r==null?void 0:r.type)===d||(r==null?void 0:r.type)===u)&&{transform:"translateY($space$1)"}}},r)),p),m&&e.createElement($,{css:{mt:"$2"}},m),i&&e.createElement(E,{css:{mt:"$2",[t==="reverse"?"mr":"ml"]:"calc($space$3 + $sizes$1)"}},i));l.displayName="InlineFieldWrapper";export{l as InlineFieldWrapper};
2
2
  //# sourceMappingURL=InlineFieldWrapper.js.map
@@ -1,2 +1,2 @@
1
- import*as p from"react";import{styled as o}from"../../stitches.js";import{createThemeVariants as s}from"../../utilities/create-theme-variants/createThemeVariants.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";const n=o("div",{display:"grid",variants:{gap:s("space",{gap:"$key"})}}),e=({css:i,gap:m=2,minItemSize:t,maxItemSize:a="1fr",...r})=>p.createElement(n,{css:{...t&&{gridTemplateColumns:`repeat(auto-fit, minmax(${t}, ${a}))`},...i},gap:m,...r});e.displayName="Grid";export{e as Grid};
1
+ import*as p from"react";import{styled as o}from"../../stitches.js";import{createThemeVariants as s}from"../../utilities/create-theme-variants/createThemeVariants.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";const n=o("div",{display:"grid",variants:{gap:s("space",{gap:"$key"})}}),t=({css:i,gap:m=2,minItemSize:e,maxItemSize:a="1fr",...r})=>p.createElement(n,{css:{...e&&{gridTemplateColumns:`repeat(auto-fit, minmax(${e}, ${a}))`},...i},gap:m,...r});t.displayName="Grid";export{t as Grid};
2
2
  //# sourceMappingURL=Grid.js.map
@@ -1,2 +1,2 @@
1
- import*as e from"react";import{styled as n}from"../../stitches.js";const i=n("svg",{display:"inline-block",fill:"none",stroke:"currentcolor",strokeLinecap:"round",strokeLinejoin:"round",verticalAlign:"middle",variants:{size:{sm:{size:"$1",strokeWidth:"1.5"},md:{size:"$2",strokeWidth:"1.75"},lg:{size:"$3",strokeWidth:"2"}}}}),d=e.forwardRef(({is:r,size:o="md",...t},s)=>e.createElement(i,{size:o,"aria-hidden":"true",...t,as:r,ref:s}));export{d as Icon,i as StyledIcon};
1
+ import*as e from"react";import{styled as n}from"../../stitches.js";const i=n("svg",{display:"inline-block",fill:"none",stroke:"currentcolor",strokeLinecap:"round",strokeLinejoin:"round",verticalAlign:"middle",variants:{size:{sm:{size:"$1",strokeWidth:"1.5"},md:{size:"$2",strokeWidth:"1.75"},lg:{size:"$3",strokeWidth:"2"}}}}),d=e.forwardRef(({is:r,size:o="md",...s},t)=>e.createElement(i,{size:o,"aria-hidden":"true",...s,as:r,ref:t}));export{d as Icon,i as StyledIcon};
2
2
  //# sourceMappingURL=Icon.js.map
@@ -1,2 +1,2 @@
1
- import*as e from"react";import{Flex as a}from"../flex/Flex.js";import{Icon as c}from"../icon/Icon.js";import{Text as E}from"../text/Text.js";import{styled as t}from"../../stitches.js";import{INLINE_MESSAGE_THEMES as f,INLINE_MESSAGE_ICONS as l}from"./InlineMessage.config.js";const p=t(a,{variants:{theme:f}}),I=t(c,{flexShrink:"0",mr:"$2"}),S=({css:s,showIcon:m=!0,theme:r="error",size:o="sm",children:n,...i})=>e.createElement(p,{theme:r,css:s,...i},m&&e.createElement(I,{size:"sm",is:l[r]}),e.createElement(E,{as:"span",size:o,css:{transform:"translateY($space$0)"}},n));export{S as InlineMessage};
1
+ import*as e from"react";import{Flex as a}from"../flex/Flex.js";import{Icon as c}from"../icon/Icon.js";import{Text as E}from"../text/Text.js";import{styled as s}from"../../stitches.js";import{INLINE_MESSAGE_THEMES as f,INLINE_MESSAGE_ICONS as l}from"./InlineMessage.config.js";const p=s(a,{variants:{theme:f}}),I=s(c,{flexShrink:"0",mr:"$2"}),S=({css:t,showIcon:m=!0,theme:r="error",size:o="sm",children:n,...i})=>e.createElement(p,{theme:r,css:t,...i},m&&e.createElement(I,{size:"sm",is:l[r]}),e.createElement(E,{as:"span",size:o,css:{transform:"translateY($space$0)"}},n));export{S as InlineMessage};
2
2
  //# sourceMappingURL=InlineMessage.js.map
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { Override } from '../../utilities/types';
3
3
  declare const StyledInput: import("@stitches/react/types/styled-component").StyledComponent<"input", {
4
- size?: "sm" | "md" | undefined;
4
+ size?: "sm" | "md" | "lg" | undefined;
5
5
  state?: "error" | undefined;
6
6
  }, {
7
7
  sm: string;
@@ -1,2 +1,2 @@
1
- import*as e from"react";import{styled as l}from"../../stitches.js";const i=l("input",{appearance:"none",border:"1px solid $tonal400",borderRadius:"$0",boxShadow:"none",boxSizing:"border-box",color:"$tonal600",cursor:"text",display:"block",fontFamily:"$body",px:"$3",transition:"all 100ms ease-out",width:"100%","&:focus":{borderColor:"$primary",outline:"none"},"&[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&::placeholder":{color:"$tonal300",opacity:1},variants:{size:{sm:{height:"$3",fontSize:"$sm",lineHeight:1.7},md:{height:"$4",fontSize:"$md",lineHeight:2}},state:{error:{border:"1px solid $danger"}}}}),a=e.forwardRef(({type:o="text",size:t="md",...r},n)=>o==="number"?e.createElement(i,{type:"text",inputMode:"numeric",pattern:"[0-9]*",size:t,...r,ref:n}):e.createElement(i,{type:o,size:t,...r,ref:n}));a.displayName="Input";export{a as Input};
1
+ import*as e from"react";import{styled as l}from"../../stitches.js";const n=l("input",{appearance:"none",border:"1px solid $tonal400",borderRadius:"$0",boxShadow:"none",boxSizing:"border-box",color:"$tonal600",cursor:"text",display:"block",fontFamily:"$body",px:"$3",transition:"all 100ms ease-out",width:"100%","&:focus":{borderColor:"$primary",outline:"none"},"&[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&::placeholder":{color:"$tonal300",opacity:1},variants:{size:{sm:{height:"$3",fontSize:"$sm",lineHeight:1.7},md:{height:"$4",fontSize:"$md",lineHeight:2},lg:{height:"$5",fontSize:"$md",lineHeight:2}},state:{error:{border:"1px solid $danger"}}}}),a=e.forwardRef(({type:o="text",size:t="md",...r},i)=>o==="number"?e.createElement(n,{type:"text",inputMode:"numeric",pattern:"[0-9]*",size:t,...r,ref:i}):e.createElement(n,{type:o,size:t,...r,ref:i}));a.displayName="Input";export{a as Input};
2
2
  //# sourceMappingURL=Input.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Input.js","sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { Override } from '~/utilities/types'\n\nconst StyledInput = styled('input', {\n appearance: 'none',\n border: '1px solid $tonal400',\n borderRadius: '$0',\n boxShadow: 'none', // prevent default iOS default styling\n boxSizing: 'border-box',\n color: '$tonal600',\n cursor: 'text',\n display: 'block',\n fontFamily: '$body',\n px: '$3',\n transition: 'all 100ms ease-out',\n width: '100%',\n '&:focus': {\n borderColor: '$primary',\n outline: 'none'\n },\n '&[disabled]': {\n backgroundColor: '$tonal100',\n color: '$tonal400',\n cursor: 'not-allowed'\n },\n '&::placeholder': {\n color: '$tonal300',\n opacity: 1\n },\n variants: {\n size: {\n sm: {\n height: '$3',\n fontSize: '$sm',\n lineHeight: 1.7\n },\n md: {\n height: '$4',\n fontSize: '$md',\n lineHeight: 2\n }\n },\n state: {\n error: {\n border: '1px solid $danger'\n }\n }\n }\n})\n\n// override default 'type' property to prevent Input from being used to render\n// checkboxes, radios etc — we have dedicated components for them\nexport type InputProps = Override<\n React.ComponentProps<typeof StyledInput>,\n {\n name: string\n as?: never\n type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n }\n>\n\nexport const Input: React.FC<InputProps> = React.forwardRef(\n ({ type = 'text', size = 'md', ...rest }, ref) => {\n if (type === 'number') {\n return (\n <StyledInput\n type=\"text\"\n inputMode=\"numeric\"\n pattern=\"[0-9]*\"\n size={size}\n {...rest}\n ref={ref}\n />\n )\n }\n\n return <StyledInput type={type} size={size} {...rest} ref={ref} />\n }\n)\n\nInput.displayName = 'Input'\n"],"names":["StyledInput","styled","Input","React","type","size","rest","ref"],"mappings":"mEAKA,MAAMA,EAAcC,EAAO,QAAS,CAClC,WAAY,OACZ,OAAQ,sBACR,aAAc,KACd,UAAW,OACX,UAAW,aACX,MAAO,YACP,OAAQ,OACR,QAAS,QACT,WAAY,QACZ,GAAI,KACJ,WAAY,qBACZ,MAAO,OACP,UAAW,CACT,YAAa,WACb,QAAS,MACX,EACA,cAAe,CACb,gBAAiB,YACjB,MAAO,YACP,OAAQ,aACV,EACA,iBAAkB,CAChB,MAAO,YACP,QAAS,CACX,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,GACd,EACA,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,CACd,CACF,EACA,MAAO,CACL,MAAO,CACL,OAAQ,mBACV,CACF,CACF,CACF,CAAC,EAaYC,EAA8BC,EAAM,WAC/C,CAAC,CAAE,KAAAC,EAAO,OAAQ,KAAAC,EAAO,QAASC,CAAK,EAAGC,IACpCH,IAAS,SAETD,EAAA,cAACH,EAAA,CACC,KAAK,OACL,UAAU,UACV,QAAQ,SACR,KAAMK,EACL,GAAGC,EACJ,IAAKC,CACP,CAAA,EAIGJ,EAAA,cAACH,EAAA,CAAY,KAAMI,EAAM,KAAMC,EAAO,GAAGC,EAAM,IAAKC,CAAAA,CAAK,CAEpE,EAEAL,EAAM,YAAc"}
1
+ {"version":3,"file":"Input.js","sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { Override } from '~/utilities/types'\n\nconst StyledInput = styled('input', {\n appearance: 'none',\n border: '1px solid $tonal400',\n borderRadius: '$0',\n boxShadow: 'none', // prevent default iOS default styling\n boxSizing: 'border-box',\n color: '$tonal600',\n cursor: 'text',\n display: 'block',\n fontFamily: '$body',\n px: '$3',\n transition: 'all 100ms ease-out',\n width: '100%',\n '&:focus': {\n borderColor: '$primary',\n outline: 'none'\n },\n '&[disabled]': {\n backgroundColor: '$tonal100',\n color: '$tonal400',\n cursor: 'not-allowed'\n },\n '&::placeholder': {\n color: '$tonal300',\n opacity: 1\n },\n variants: {\n size: {\n sm: {\n height: '$3',\n fontSize: '$sm',\n lineHeight: 1.7\n },\n md: {\n height: '$4',\n fontSize: '$md',\n lineHeight: 2\n },\n lg: {\n height: '$5',\n fontSize: '$md',\n lineHeight: 2\n }\n },\n state: {\n error: {\n border: '1px solid $danger'\n }\n }\n }\n})\n\n// override default 'type' property to prevent Input from being used to render\n// checkboxes, radios etc — we have dedicated components for them\nexport type InputProps = Override<\n React.ComponentProps<typeof StyledInput>,\n {\n name: string\n as?: never\n type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n }\n>\n\nexport const Input: React.FC<InputProps> = React.forwardRef(\n ({ type = 'text', size = 'md', ...rest }, ref) => {\n if (type === 'number') {\n return (\n <StyledInput\n type=\"text\"\n inputMode=\"numeric\"\n pattern=\"[0-9]*\"\n size={size}\n {...rest}\n ref={ref}\n />\n )\n }\n\n return <StyledInput type={type} size={size} {...rest} ref={ref} />\n }\n)\n\nInput.displayName = 'Input'\n"],"names":["StyledInput","styled","Input","React","type","size","rest","ref"],"mappings":"mEAKA,MAAMA,EAAcC,EAAO,QAAS,CAClC,WAAY,OACZ,OAAQ,sBACR,aAAc,KACd,UAAW,OACX,UAAW,aACX,MAAO,YACP,OAAQ,OACR,QAAS,QACT,WAAY,QACZ,GAAI,KACJ,WAAY,qBACZ,MAAO,OACP,UAAW,CACT,YAAa,WACb,QAAS,MACX,EACA,cAAe,CACb,gBAAiB,YACjB,MAAO,YACP,OAAQ,aACV,EACA,iBAAkB,CAChB,MAAO,YACP,QAAS,CACX,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,GACd,EACA,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,CACd,EACA,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,CACd,CACF,EACA,MAAO,CACL,MAAO,CACL,OAAQ,mBACV,CACF,CACF,CACF,CAAC,EAaYC,EAA8BC,EAAM,WAC/C,CAAC,CAAE,KAAAC,EAAO,OAAQ,KAAAC,EAAO,QAASC,CAAK,EAAGC,IACpCH,IAAS,SAETD,EAAA,cAACH,EAAA,CACC,KAAK,OACL,UAAU,UACV,QAAQ,SACR,KAAMK,EACL,GAAGC,EACJ,IAAKC,CAAAA,CACP,EAIGJ,EAAA,cAACH,EAAA,CAAY,KAAMI,EAAM,KAAMC,EAAO,GAAGC,EAAM,IAAKC,CAAAA,CAAK,CAEpE,EAEAL,EAAM,YAAc"}
@@ -1,2 +1,2 @@
1
- import*as e from"react";import{styled as t}from"../../stitches.js";import{getTextVariant as i}from"../text/Text.js";const p=t("label",{color:"$tonal500",fontFamily:"$body",m:0,variants:{size:{sm:i({size:"sm"}),md:i({size:"md"})},type:{block:{display:"block",fontWeight:600},inline:{display:"flex",fontWeight:400,maxWidth:"max-content"}},align:{start:{},center:{}},direction:{reverse:{},row:{}}},compoundVariants:[{type:"inline",align:"start",css:{alignItems:"flex-start"}},{type:"inline",align:"center",css:{alignItems:"center"}},{type:"inline",direction:"reverse",css:{flexDirection:"row-reverse"}},{type:"inline",direction:"row",css:{flexDirection:"row"}}]}),y=t("span",{color:"$danger",ml:"$1",fontWeight:400}),n=({align:r="start",as:a="label",direction:l="row",size:o="md",type:s="block",children:c,required:m,...d})=>e.createElement(p,{as:a,size:o,type:s,align:r,direction:l,...d},c,m&&e.createElement(y,{"aria-hidden":!0},"*"));n.displayName="Label";export{n as Label};
1
+ import*as e from"react";import{styled as i}from"../../stitches.js";import{getTextVariant as t}from"../text/Text.js";const p=i("label",{color:"$tonal500",fontFamily:"$body",m:0,variants:{size:{sm:t({size:"sm"}),md:t({size:"md"})},type:{block:{display:"block",fontWeight:600},inline:{display:"flex",fontWeight:400,maxWidth:"max-content"}},align:{start:{},center:{}},direction:{reverse:{},row:{}}},compoundVariants:[{type:"inline",align:"start",css:{alignItems:"flex-start"}},{type:"inline",align:"center",css:{alignItems:"center"}},{type:"inline",direction:"reverse",css:{flexDirection:"row-reverse"}},{type:"inline",direction:"row",css:{flexDirection:"row"}}]}),y=i("span",{color:"$danger",ml:"$1",fontWeight:400}),n=({align:r="start",as:a="label",direction:l="row",size:o="md",type:s="block",children:c,required:m,...d})=>e.createElement(p,{as:a,size:o,type:s,align:r,direction:l,...d},c,m&&e.createElement(y,{"aria-hidden":!0},"*"));n.displayName="Label";export{n as Label};
2
2
  //# sourceMappingURL=Label.js.map