@atom-learning/components 1.17.2-beta.0 → 1.18.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 (120) hide show
  1. package/CHANGELOG.md +216 -0
  2. package/dist/components/accordion/Accordion.d.ts +2 -2
  3. package/dist/components/accordion/Accordion.js +1 -1
  4. package/dist/components/accordion/AccordionContent.js +1 -1
  5. package/dist/components/accordion/AccordionItem.js +1 -1
  6. package/dist/components/accordion/AccordionTrigger.js +1 -1
  7. package/dist/components/action-icon/ActionIcon.js +1 -1
  8. package/dist/components/alert-dialog/AlertDialog.js +1 -1
  9. package/dist/components/alert-dialog/AlertDialogContent.js +1 -1
  10. package/dist/components/alert-dialog/alert-context/AlertContext.js +1 -1
  11. package/dist/components/alert-dialog/alert-context/AlertDialog.js +1 -1
  12. package/dist/components/alert-dialog/alert-context/reducer.js +1 -1
  13. package/dist/components/badge/Badge.js +1 -1
  14. package/dist/components/button/Button.js +1 -1
  15. package/dist/components/calendar/Calendar.js +1 -1
  16. package/dist/components/calendar/constants.js +1 -1
  17. package/dist/components/carousel/Carousel.js +1 -1
  18. package/dist/components/carousel/CarouselArrows.js +1 -1
  19. package/dist/components/carousel/CarouselSlide.d.ts +1 -1
  20. package/dist/components/carousel/CarouselSlide.js +1 -1
  21. package/dist/components/carousel/CarouselSlider.d.ts +1 -1
  22. package/dist/components/checkbox/Checkbox.js +1 -1
  23. package/dist/components/checkbox-field/CheckboxField.js +1 -1
  24. package/dist/components/combobox/Combobox.js +1 -1
  25. package/dist/components/date-field/DateField.js +1 -1
  26. package/dist/components/date-input/DateInput.js +1 -1
  27. package/dist/components/date-input/use-date.js +1 -1
  28. package/dist/components/dialog/Dialog.js +1 -1
  29. package/dist/components/dialog/DialogContent.js +1 -1
  30. package/dist/components/divider/Divider.d.ts +1 -1
  31. package/dist/components/divider/Divider.js +1 -1
  32. package/dist/components/dropdown-menu/DropdownMenu.js +1 -1
  33. package/dist/components/dropdown-menu/DropdownMenuItem.js +1 -1
  34. package/dist/components/dropdown-menu/DropdownMenuLinkItem.js +1 -1
  35. package/dist/components/empty-state/EmptyState.js +1 -1
  36. package/dist/components/empty-state/EmptyStateBody.d.ts +1 -1
  37. package/dist/components/field-wrapper/FieldDescription.js +1 -1
  38. package/dist/components/field-wrapper/FieldWrapper.js +1 -1
  39. package/dist/components/field-wrapper/InlineFieldWrapper.js +1 -1
  40. package/dist/components/file-input/FileInput.js +1 -1
  41. package/dist/components/form/Form.js +1 -1
  42. package/dist/components/form/Form.types.js +1 -1
  43. package/dist/components/form/useFieldError.js +1 -1
  44. package/dist/components/grid/Grid.js +1 -1
  45. package/dist/components/heading/Heading.d.ts +2 -2
  46. package/dist/components/heading/Heading.js +1 -1
  47. package/dist/components/icon/Icon.js +1 -1
  48. package/dist/components/input/Input.js +1 -1
  49. package/dist/components/input-field/InputField.js +1 -1
  50. package/dist/components/label/Label.js +1 -1
  51. package/dist/components/link/Link.js +1 -1
  52. package/dist/components/list/List.d.ts +2 -2
  53. package/dist/components/list/List.js +1 -1
  54. package/dist/components/loader/Loader.js +1 -1
  55. package/dist/components/markdown-content/MarkdownContent.js +1 -1
  56. package/dist/components/markdown-content/components/MarkdownCode.js +1 -1
  57. package/dist/components/markdown-content/components/MarkdownEmphasis.js +1 -1
  58. package/dist/components/markdown-content/components/MarkdownHeading.js +1 -1
  59. package/dist/components/markdown-content/components/MarkdownImage.js +1 -1
  60. package/dist/components/markdown-content/components/MarkdownInlineCode.js +1 -1
  61. package/dist/components/markdown-content/components/MarkdownLink.js +1 -1
  62. package/dist/components/markdown-content/components/MarkdownList.js +1 -1
  63. package/dist/components/markdown-content/components/MarkdownListItem.js +1 -1
  64. package/dist/components/markdown-content/components/MarkdownParagraph.js +1 -1
  65. package/dist/components/markdown-content/components/MarkdownStrong.js +1 -1
  66. package/dist/components/markdown-content/components/MarkdownThematicBreak.js +1 -1
  67. package/dist/components/password-field/PasswordField.js +1 -1
  68. package/dist/components/password-input/PasswordInput.js +1 -1
  69. package/dist/components/popover/Popover.js +1 -1
  70. package/dist/components/popover/PopoverContent.js +1 -1
  71. package/dist/components/progress-bar/ProgressBar.js +1 -1
  72. package/dist/components/radio-button/RadioButton.js +1 -1
  73. package/dist/components/radio-button/RadioButtonGroup.js +1 -1
  74. package/dist/components/radio-button-field/RadioButtonField.js +1 -1
  75. package/dist/components/radio-button-field/RadioField.js +1 -1
  76. package/dist/components/radio-card/RadioCard.js +1 -1
  77. package/dist/components/radio-card/RadioCardGroup.js +1 -1
  78. package/dist/components/search-input/SearchInput.js +1 -1
  79. package/dist/components/select/Select.js +1 -1
  80. package/dist/components/select-field/SelectField.js +1 -1
  81. package/dist/components/slider/Slider.js +1 -1
  82. package/dist/components/slider/SliderSteps.js +1 -1
  83. package/dist/components/slider/SliderValue.js +1 -1
  84. package/dist/components/slider-field/SliderField.js +1 -1
  85. package/dist/components/stack/Stack.js +1 -1
  86. package/dist/components/stack-content/StackContent.d.ts +1 -1
  87. package/dist/components/stack-content/StackContent.js +1 -1
  88. package/dist/components/stepper/Stepper.js +1 -1
  89. package/dist/components/stepper/StepperStepBack.js +1 -1
  90. package/dist/components/stepper/StepperStepForward.js +1 -1
  91. package/dist/components/stepper/StepperSteps.js +1 -1
  92. package/dist/components/stepper/stepper-context/StepperContext.js +1 -1
  93. package/dist/components/switch/Switch.js +1 -1
  94. package/dist/components/table/Table.js +1 -1
  95. package/dist/components/table/TableBody.js +1 -1
  96. package/dist/components/table/TableHeader.js +1 -1
  97. package/dist/components/tabs/TabTrigger.js +1 -1
  98. package/dist/components/tabs/Tabs.js +1 -1
  99. package/dist/components/tabs/TabsTriggerList.js +1 -1
  100. package/dist/components/tabs/utils.js +1 -1
  101. package/dist/components/text/Text.d.ts +1 -1
  102. package/dist/components/text/Text.js +1 -1
  103. package/dist/components/textarea/Textarea.js +1 -1
  104. package/dist/components/textarea-field/TextareaField.js +1 -1
  105. package/dist/components/toast/Toast.js +1 -1
  106. package/dist/components/toast/ToastProvider.js +1 -1
  107. package/dist/components/toggle-group/ToggleGroupButton.js +1 -1
  108. package/dist/components/toggle-group/ToggleGroupItem.js +1 -1
  109. package/dist/components/toggle-group/ToggleGroupRoot.js +1 -1
  110. package/dist/components/tooltip/Tooltip.js +1 -1
  111. package/dist/components/tooltip/TooltipContent.js +1 -1
  112. package/dist/components/validation-error/ValidationError.js +1 -1
  113. package/dist/components/video/Video.js +1 -1
  114. package/dist/docgen.json +1 -1
  115. package/dist/index.cjs.js +1 -1
  116. package/dist/stitches.js +1 -1
  117. package/dist/utilities/css-wrapper/CSSWrapper.js +1 -1
  118. package/dist/utilities/style/capsize.js +1 -1
  119. package/dist/utilities/style/keyframe-animations.js +1 -1
  120. package/package.json +6 -6
@@ -1 +1 @@
1
- import{Root as m,Content as n}from"@radix-ui/react-tabs";import{createElement as p}from"react";import{styled as t}from"../../stitches.js";import{TriggerListWrapper as e}from"./TabsTriggerList.js";import{TabTrigger as s}from"./TabTrigger.js";import{passPropsToChildren as g}from"./utils.js";const c=t(m,{display:"flex",flexDirection:"column",variants:{theme:{light:{color:"$primary"},dark:{color:"white"}}}}),i=t(n,{flexGrow:1,fontFamily:"$body",variants:{theme:{light:{color:"$textForeground"},dark:{bg:"$primaryDark",color:"white"}}}}),r=({theme:o="light",children:a,...l})=>p(c,{theme:o,...l},g(a,{theme:o},[e,i]));r.TriggerList=e,r.Trigger=s,r.Content=i,r.displayName="Tabs";export{r as Tabs};
1
+ import{Root as l,Content as n}from"@radix-ui/react-tabs";import*as p from"react";import{styled as o}from"../../stitches.js";import{TriggerListWrapper as t}from"./TabsTriggerList.js";import{TabTrigger as s}from"./TabTrigger.js";import{passPropsToChildren as g}from"./utils.js";const h=o(l,{display:"flex",flexDirection:"column",variants:{theme:{light:{color:"$primary"},dark:{color:"white"}}}}),i=o(n,{flexGrow:1,fontFamily:"$body",variants:{theme:{light:{color:"$textForeground"},dark:{bg:"$primaryDark",color:"white"}}}}),r=({theme:e="light",children:m,...a})=>p.createElement(h,{theme:e,...a},g(m,{theme:e},[t,i]));r.TriggerList=t,r.Trigger=s,r.Content=i,r.displayName="Tabs";export{r as Tabs};
@@ -1 +1 @@
1
- import{ChevronLeft as B,ChevronRight as P}from"@atom-learning/icons";import{List as F}from"@radix-ui/react-tabs";import{opacify as L}from"color2k";import o,{useRef as M,useState as h,useCallback as X,useEffect as W}from"react";import{debounce as _}from"throttle-debounce";import{ActionIcon as j}from"../action-icon/ActionIcon.js";import{Flex as q}from"../flex/Flex.js";import{Icon as y}from"../icon/Icon.js";import{theme as G,styled as E}from"../../stitches.js";import{TabTrigger as k}from"./TabTrigger.js";import{passPropsToChildren as x}from"./utils.js";const H=L("white",-.2),J=L(G.colors.primaryDark.value,-.2),T=E(j,{position:"absolute",transition:"all 125ms",variants:{theme:{light:{bg:`${H} !important`},dark:{bg:`${J} !important`,color:"currentColor !important"}},visible:{true:{opacity:1,visibility:"visible",pointerEvents:"all"},false:{opacity:0,visibility:"hidden",pointerEvents:"none"}}}}),C=E(F,{flexShrink:0,display:"flex",width:"100%",overflowX:"auto","&::-webkit-scrollbar":{display:"none"},scrollbarWidth:"none",variants:{theme:{light:{borderBottom:"1px solid $tonal300"},dark:{bg:"$primaryDark",borderBottom:"1px solid $tonal200"}},appearance:{uppercase:{"& button":{textTransform:"uppercase"}}}}}),K=({children:d,theme:l,appearance:p,enableTabScrolling:z,scrollPercentage:R=10,...u})=>{const n=M(null),[g,c]=h(!1),[b,a]=h(!1),[$,A]=h(),v=X(t=>{const e=n.current;if(e){const{scrollWidth:i,scrollLeft:s,offsetWidth:f}=e,w=Math.round(i*(R/100));let m=s;if(t==="right"){const r=s+w;m=r+f<=i?r:i-f}else{const r=s-w;m=r>0?r:0}e.scroll({left:m,behavior:"smooth"}),setTimeout(()=>{const{scrollWidth:r,scrollLeft:S,offsetWidth:D}=e,I=r-(S+D);S===0?(c(!1),a(!0)):I<5?(a(!1),c(!0)):(c(!0),a(!0))},500)}},[]);return W(()=>{const t=_(500,()=>{A(window.innerWidth)});return window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}},[]),W(()=>{var t;const e=n.current;if(e){const{offsetWidth:i,scrollWidth:s}=e,f=s>i;(t=e.scroll)==null||t.call(e,{left:0}),c(!1),a(f)}},[$]),g||b||z?o.createElement(q,{css:{position:"relative"}},o.createElement(T,{size:"xl",label:"Scroll Left",theme:l,onClick:()=>v("left"),visible:g,css:{left:0}},o.createElement(y,{is:B,size:"lg"})),o.createElement(C,{...u,ref:n,appearance:p,theme:l},x(d,{theme:l},[k])),o.createElement(T,{size:"xl",label:"Scroll right",theme:l,onClick:()=>v("right"),visible:b,css:{right:0}},o.createElement(y,{is:P,size:"lg"}))):o.createElement(C,{theme:l,...u,appearance:p,ref:n},x(d,{theme:l},[k]))};export{K as TriggerListWrapper};
1
+ import{ChevronLeft as P,ChevronRight as R}from"@atom-learning/icons";import{List as _}from"@radix-ui/react-tabs";import{opacify as k}from"color2k";import o,{useRef as F,useState as f,useCallback as J,useEffect as y}from"react";import{debounce as K}from"throttle-debounce";import{ActionIcon as M}from"../action-icon/ActionIcon.js";import{Flex as X}from"../flex/Flex.js";import{Icon as x}from"../icon/Icon.js";import{theme as j,styled as W}from"../../stitches.js";import{TabTrigger as L}from"./TabTrigger.js";import{passPropsToChildren as z}from"./utils.js";const q=k("white",-.2),G=k(j.colors.primaryDark.value,-.2),C=W(M,{position:"absolute",transition:"all 125ms",variants:{theme:{light:{bg:`${q} !important`},dark:{bg:`${G} !important`,color:"currentColor !important"}},visible:{true:{opacity:1,visibility:"visible",pointerEvents:"all"},false:{opacity:0,visibility:"hidden",pointerEvents:"none"}}}}),T=W(_,{flexShrink:0,display:"flex",width:"100%",overflowX:"auto","&::-webkit-scrollbar":{display:"none"},scrollbarWidth:"none",variants:{theme:{light:{borderBottom:"1px solid $tonal300"},dark:{bg:"$primaryDark",borderBottom:"1px solid $tonal200"}},appearance:{uppercase:{"& button":{textTransform:"uppercase"}}}}}),H=({children:h,theme:i,appearance:d,enableTabScrolling:S,scrollPercentage:$=10,...b})=>{const n=F(null),[u,a]=f(!1),[v,c]=f(!1),[D,I]=f(),g=J(t=>{const e=n.current;if(e){const{scrollWidth:l,scrollLeft:s,offsetWidth:m}=e,E=Math.round(l*($/100));let p=s;if(t==="right"){const r=s+E;p=r+m<=l?r:l-m}else{const r=s-E;p=r>0?r:0}e.scroll({left:p,behavior:"smooth"}),setTimeout(()=>{const{scrollWidth:r,scrollLeft:w,offsetWidth:A}=e,B=r-(w+A);w===0?(a(!1),c(!0)):B<5?(c(!1),a(!0)):(a(!0),c(!0))},500)}},[]);return y(()=>{const t=K(500,()=>{I(window.innerWidth)});return window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}},[]),y(()=>{var t;const e=n.current;if(e){const{offsetWidth:l,scrollWidth:s}=e,m=s>l;(t=e.scroll)==null||t.call(e,{left:0}),a(!1),c(m)}},[D]),u||v||S?o.createElement(X,{css:{position:"relative"}},o.createElement(C,{size:"xl",label:"Scroll Left",theme:i,onClick:()=>g("left"),visible:u,css:{left:0}},o.createElement(x,{is:P,size:"lg"})),o.createElement(T,{...b,ref:n,appearance:d,theme:i},z(h,{theme:i},[L])),o.createElement(C,{size:"xl",label:"Scroll right",theme:i,onClick:()=>g("right"),visible:v,css:{right:0}},o.createElement(x,{is:R,size:"lg"}))):o.createElement(T,{theme:i,...b,appearance:d,ref:n},z(h,{theme:i},[L]))};export{H as TriggerListWrapper};
@@ -1 +1 @@
1
- import r from"react";const p=(n,t,o=[])=>r.Children.map(n,e=>r.isValidElement(e)&&o.includes(e==null?void 0:e.type)?r.cloneElement(e,{...t}):e);export{p as passPropsToChildren};
1
+ import e from"react";const t=(n,o,i=[])=>e.Children.map(n,l=>e.isValidElement(l)&&i.includes(l?.type)?e.cloneElement(l,{...o}):l);export{t as passPropsToChildren};
@@ -275,5 +275,5 @@ export declare const StyledText: import("@stitches/react/types/styled-component"
275
275
  declare type TextProps = Override<React.ComponentProps<typeof StyledText>, {
276
276
  as?: 'blockquote' | 'caption' | 'dd' | 'dt' | 'figcaption' | 'li' | 'p' | 'span' | 'legend' | React.ComponentType | React.ElementType;
277
277
  }>;
278
- export declare const Text: React.FC<TextProps>;
278
+ export declare const Text: React.ForwardRefExoticComponent<TextProps>;
279
279
  export {};
@@ -1 +1 @@
1
- import{forwardRef as f,createElement as l}from"react";import{styled as d}from"../../stitches.js";import{capsize as e}from"../../utilities/style/capsize.js";const i=({applyCapsize:t=!0}={})=>({xs:{fontSize:"$xs",lineHeight:1.6,...t?e(.4364):{}},sm:{fontSize:"$sm",lineHeight:1.53,...t?e(.4056):{}},md:{fontSize:"$md",lineHeight:1.5,...t?e(.3864):{}},lg:{fontSize:"$lg",lineHeight:1.52,...t?e(.3983):{}},xl:{fontSize:"$xl",lineHeight:1.42,...t?e(.3506):{}}}),o=d("p",{color:"$tonal600",fontFamily:"$body",fontWeight:400,margin:0,"& > &":{"&:before, &:after":{display:"none"}},variants:{size:i()}}),n=f(({size:t="md",...r},m)=>l(o,{size:t,...r,ref:m}));n.displayName="Text";export{o as StyledText,n as Text,i as textVariantSize};
1
+ import*as t from"react";import{styled as f}from"../../stitches.js";import{capsize as i}from"../../utilities/style/capsize.js";const o=({applyCapsize:e=!0}={})=>({xs:{fontSize:"$xs",lineHeight:1.6,...e?i(.4364):{}},sm:{fontSize:"$sm",lineHeight:1.53,...e?i(.4056):{}},md:{fontSize:"$md",lineHeight:1.5,...e?i(.3864):{}},lg:{fontSize:"$lg",lineHeight:1.52,...e?i(.3983):{}},xl:{fontSize:"$xl",lineHeight:1.42,...e?i(.3506):{}}}),n=f("p",{color:"$tonal600",fontFamily:"$body",fontWeight:400,margin:0,"& > &":{"&:before, &:after":{display:"none"}},variants:{size:o()}}),l=t.forwardRef(({size:e="md",...a},r)=>t.createElement(n,{size:e,...a,ref:r}));l.displayName="Text";export{n as StyledText,l as Text,o as textVariantSize};
@@ -1 +1 @@
1
- import{forwardRef as a,createElement as t}from"react";import{styled as l}from"../../stitches.js";const n=l("textarea",{boxShadow:"none",fontSize:"$md",appearance:"none",border:"1px solid $tonal400",borderRadius:"$0",boxSizing:"border-box",color:"$tonal600",fontFamily:"$body",fontWeight:400,lineHeight:1.4,minHeight:"$7",px:"$3",py:"calc($2 + $1)",resize:"vertical",transition:"all 75ms ease-out",width:"100%","&:focus":{borderColor:"$primary",outline:"none"},"&[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&::placeholder":{color:"$tonal300",opacity:1},variants:{state:{error:{border:"1px solid $danger"}}}}),o=a((e,r)=>t(n,{...e,ref:r}));o.displayName="Textarea";export{o as Textarea};
1
+ import*as o from"react";import{styled as t}from"../../stitches.js";const n=t("textarea",{boxShadow:"none",fontSize:"$md",appearance:"none",border:"1px solid $tonal400",borderRadius:"$0",boxSizing:"border-box",color:"$tonal600",fontFamily:"$body",fontWeight:400,lineHeight:1.4,minHeight:"$7",px:"$3",py:"calc($2 + $1)",resize:"vertical",transition:"all 75ms ease-out",width:"100%","&:focus":{borderColor:"$primary",outline:"none"},"&[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&::placeholder":{color:"$tonal300",opacity:1},variants:{state:{error:{border:"1px solid $danger"}}}}),e=o.forwardRef((r,a)=>o.createElement(n,{...r,ref:a}));e.displayName="Textarea";export{e as Textarea};
@@ -1 +1 @@
1
- import{createElement as i}from"react";import{useFormContext as c}from"react-hook-form";import{FieldWrapper as x}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as F}from"../form/useFieldError.js";import{Textarea as a}from"../textarea/Textarea.js";const m=({css:p=void 0,label:d,name:r,validation:e,prompt:s,description:f,...l})=>{const{register:o}=c(),{error:t}=F(r),u=e?o(e):o;return i(x,{css:p,description:f,error:t,fieldId:r,label:d,prompt:s,required:Boolean(e==null?void 0:e.required)},i(a,{id:r,name:r,ref:u,...t&&{state:"error"},...l}))};m.displayName="TextareaField";export{m as TextareaField};
1
+ import*as i from"react";import{useFormContext as c}from"react-hook-form";import{FieldWrapper as f}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as u}from"../form/useFieldError.js";import{Textarea as x}from"../textarea/Textarea.js";const a=({css:m=void 0,label:p,name:r,validation:e,prompt:l,description:d,...s})=>{const{register:o}=c(),{error:t}=u(r),n=e?o(e):o;return i.createElement(f,{css:m,description:d,error:t,fieldId:r,label:p,prompt:l,required:Boolean(e?.required)},i.createElement(x,{id:r,name:r,ref:n,...t&&{state:"error"},...s}))};a.displayName="TextareaField";export{a as TextareaField};
@@ -1 +1 @@
1
- import{Error as g,Close as $}from"@atom-learning/icons";import{memo as h,createElement as o}from"react";import{toast as y}from"react-hot-toast";import{keyframes as i,styled as e}from"../../stitches.js";import{ActionIcon as v}from"../action-icon/ActionIcon.js";import{Icon as a}from"../icon/Icon.js";import{Loader as w}from"../loader/Loader.js";import{Text as x}from"../text/Text.js";const n=400,T=i({"0%":{transform:"translate3d(0,-100%,0)",opacity:0},"100%":{transform:"translate3d(0,0,0)",opacity:1}}),k=i({"0%":{transform:"translate3d(0,0,0)",opacity:1},"100%":{transform:"translate3d(0,-100%,0)",opacity:0}}),C=e("div",{position:"absolute",width:"100%",variants:{visible:{true:{"@allowMotion":{animation:`${T} 250ms cubic-bezier(0.22, 1, 0.36, 1)`}},false:{opacity:0,"@allowMotion":{animation:`${k} 250ms cubic-bezier(0.22, 1, 0.36, 1)`}}}}}),I=e("div",{pointerEvents:"auto",alignItems:"center",borderRadius:"$0",boxShadow:"$1",boxSizing:"border-box",color:"white",display:"flex",minHeight:"$5",pl:"$4",position:"relative",pr:"$6",py:"$4",transition:"background-color 50ms ease-out",width:"100%","@sm":{width:n},"@allowMotion":{transition:"background-color 50ms ease-out, transform 150ms ease-out"},variants:{status:{blank:{bg:"$primary"},error:{bg:"$danger"},loading:{bg:"$primary"},success:{bg:"$success"}}}}),z=h(({ariaLive:l,height:m,id:t,message:c,role:d,type:r="blank",visible:f,calculateOffset:p,updateHeight:u})=>{const b=p(t,{reverseOrder:!0,margin:8});return o(C,{visible:f},o(I,{ref:s=>{s&&m===void 0&&u(t,s.getBoundingClientRect().height)},status:r,role:d,"aria-live":l,style:{transform:`translateY(${b}px)`}},r==="error"&&o(a,{size:"sm",css:{mr:"$3",flex:"0 0 auto"},is:g}),o(x,{css:{color:"inherit"}},c),r==="loading"?o(w,{css:{flex:"0 0 auto",ml:"auto"}}):o(v,{css:{position:"absolute",top:"$2",right:"$2",color:"white","&:hover,&:focus":{color:"white",opacity:.5}},label:"Close alert",onClick:()=>y.dismiss(t)},o(a,{is:$}))))});export{n as TOAST_WIDTH,z as Toast};
1
+ import{Error as g,Close as h}from"@atom-learning/icons";import*as e from"react";import{toast as $}from"react-hot-toast";import{keyframes as i,styled as a}from"../../stitches.js";import{ActionIcon as v}from"../action-icon/ActionIcon.js";import{Icon as s}from"../icon/Icon.js";import{Loader as y}from"../loader/Loader.js";import{Text as w}from"../text/Text.js";const n=400,x=i({"0%":{transform:"translate3d(0,-100%,0)",opacity:0},"100%":{transform:"translate3d(0,0,0)",opacity:1}}),E=i({"0%":{transform:"translate3d(0,0,0)",opacity:1},"100%":{transform:"translate3d(0,-100%,0)",opacity:0}}),k=a("div",{position:"absolute",width:"100%",variants:{visible:{true:{"@allowMotion":{animation:`${x} 250ms cubic-bezier(0.22, 1, 0.36, 1)`}},false:{opacity:0,"@allowMotion":{animation:`${E} 250ms cubic-bezier(0.22, 1, 0.36, 1)`}}}}}),I=a("div",{pointerEvents:"auto",alignItems:"center",borderRadius:"$0",boxShadow:"$1",boxSizing:"border-box",color:"white",display:"flex",minHeight:"$5",pl:"$4",position:"relative",pr:"$6",py:"$4",transition:"background-color 50ms ease-out",width:"100%","@sm":{width:n},"@allowMotion":{transition:"background-color 50ms ease-out, transform 150ms ease-out"},variants:{status:{blank:{bg:"$primary"},error:{bg:"$danger"},loading:{bg:"$primary"},success:{bg:"$success"}}}}),T=e.memo(({ariaLive:l,height:m,id:t,message:c,role:p,type:o="blank",visible:d,calculateOffset:u,updateHeight:b})=>{const f=u(t,{reverseOrder:!0,margin:8});return e.createElement(k,{visible:d},e.createElement(I,{ref:r=>{r&&m===void 0&&b(t,r.getBoundingClientRect().height)},status:o,role:p,"aria-live":l,style:{transform:`translateY(${f}px)`}},o==="error"&&e.createElement(s,{size:"sm",css:{mr:"$3",flex:"0 0 auto"},is:g}),e.createElement(w,{css:{color:"inherit"}},c),o==="loading"?e.createElement(y,{css:{flex:"0 0 auto",ml:"auto"}}):e.createElement(v,{css:{position:"absolute",top:"$2",right:"$2",color:"white","&:hover,&:focus":{color:"white",opacity:.5}},label:"Close alert",onClick:()=>$.dismiss(t)},e.createElement(s,{is:h}))))});export{n as TOAST_WIDTH,T as Toast};
@@ -1 +1 @@
1
- import{createElement as t,Fragment as d}from"react";import{useToaster as l}from"react-hot-toast";import{default as E}from"react-hot-toast";import{styled as f}from"../../stitches.js";import{TOAST_WIDTH as u,Toast as c}from"./Toast.js";const T=2147483647,x=f("div",{left:"$2",position:"fixed",top:"$2",right:"$2",zIndex:T,"@sm":{top:"$3",right:"auto",left:`calc(50% - ${u/2}px)`}}),o=({children:r})=>{const{toasts:s,handlers:a}=l(),{startPause:n,endPause:i,calculateOffset:m,updateHeight:p}=a;return t(d,null,t(x,{onMouseEnter:n,onMouseLeave:i},s.map(e=>t(c,{key:e.id,calculateOffset:m,updateHeight:p,...e}))),r)};o.displayName="ToastProvider";export{o as ToastProvider,E as toast};
1
+ import*as e from"react";import{useToaster as p}from"react-hot-toast";import{default as E}from"react-hot-toast";import{styled as c}from"../../stitches.js";import{TOAST_WIDTH as d,Toast as f}from"./Toast.js";const u=2147483647,T=c("div",{left:"$2",position:"fixed",top:"$2",right:"$2",zIndex:u,"@sm":{top:"$3",right:"auto",left:`calc(50% - ${d/2}px)`}}),a=({children:o})=>{const{toasts:r,handlers:s}=p(),{startPause:i,endPause:l,calculateOffset:n,updateHeight:m}=s;return e.createElement(e.Fragment,null,e.createElement(T,{onMouseEnter:i,onMouseLeave:l},r.map(t=>e.createElement(f,{key:t.id,calculateOffset:n,updateHeight:m,...t}))),o)};a.displayName="ToastProvider";export{a as ToastProvider,E as toast};
@@ -1 +1 @@
1
- import{Children as d,isValidElement as m,createElement as l,cloneElement as u}from"react";import{styled as f}from"../../stitches.js";import{StyledIcon as $,Icon as p}from"../icon/Icon.js";import{StyledItem as x}from"./ToggleGroupItem.js";const o={sm:"32px",md:"40px",lg:"48px"},I={sm:"$4",md:"$5",lg:"$5"},S={sm:"$2",md:"$3",lg:"$3"},s=n=>({fontSize:`$${n}`,px:I[n],minHeight:o[n],"& > *:not(:last-child)":{mr:S[n]}}),c=f(x,{flexGrow:1,display:"flex",alignItems:"center",justifyContent:"center",fontWeight:600,lineHeight:1,py:"$1",[`& ${$}`]:{flexShrink:0},variants:{size:{sm:s("sm"),md:s("md"),lg:s("lg")},isIconOnly:{true:{}}},compoundVariants:[{isIconOnly:!0,size:"sm",css:{minWidth:o.sm,p:0}},{isIconOnly:!0,size:"md",css:{minWidth:o.md,p:0}},{isIconOnly:!0,size:"lg",css:{minWidth:o.lg,p:0}}]}),h=({size:n,children:g,...a})=>{var r;const e=d.toArray(g),i=e.length<=1,y=i&&m(e[0])&&((r=e[0])==null?void 0:r.type)===p;return l(c,{size:n,isIconOnly:y,...a},e.map(t=>!i&&typeof t=="string"?l("span",{key:t},t):m(t)&&(t==null?void 0:t.type)===p?u(t,{...t.props,size:n}):t))};export{c as StyledButton,h as ToggleGroupButton};
1
+ import*as n from"react";import{styled as a}from"../../stitches.js";import{StyledIcon as g,Icon as r}from"../icon/Icon.js";import{StyledItem as f}from"./ToggleGroupItem.js";const t={sm:"32px",md:"40px",lg:"48px"},h={sm:"$4",md:"$5",lg:"$5"},u={sm:"$2",md:"$3",lg:"$3"},l=i=>({fontSize:`$${i}`,px:h[i],minHeight:t[i],"& > *:not(:last-child)":{mr:u[i]}}),d=a(f,{flexGrow:1,display:"flex",alignItems:"center",justifyContent:"center",fontWeight:600,lineHeight:1,py:"$1",[`& ${g}`]:{flexShrink:0},variants:{size:{sm:l("sm"),md:l("md"),lg:l("lg")},isIconOnly:{true:{}}},compoundVariants:[{isIconOnly:!0,size:"sm",css:{minWidth:t.sm,p:0}},{isIconOnly:!0,size:"md",css:{minWidth:t.md,p:0}},{isIconOnly:!0,size:"lg",css:{minWidth:t.lg,p:0}}]}),$=({size:i,children:p,...c})=>{var m;const s=n.Children.toArray(p),o=s.length<=1,y=o&&n.isValidElement(s[0])&&((m=s[0])==null?void 0:m.type)===r;return n.createElement(d,{size:i,isIconOnly:y,...c},s.map(e=>!o&&typeof e=="string"?n.createElement("span",{key:e},e):n.isValidElement(e)&&e?.type===r?n.cloneElement(e,{...e.props,size:i}):e))};export{d as StyledButton,$ as ToggleGroupButton};
@@ -1 +1 @@
1
- import{Item as t}from"@radix-ui/react-toggle-group";import{styled as e}from"../../stitches.js";import{focusVisibleStyleBlock as o}from"../../utilities/style/focus-visible-style-block.js";const r=e(t,{bg:"white",color:"$tonal400",border:"1px solid $tonal200",cursor:"pointer","&::before":{background:"$tonal200"},"&:not([disabled])":{'&:hover, &:focus-visible, &[data-state="on"]':{"&::before":{background:"none"}},"&:hover":{borderColor:"currentColor !important",color:"$primaryMid"},"&:focus-visible":{...o(),'&[data-state="off"]':{borderColor:"$tonal200 !important"},'&[data-state="on"]':{boxShadow:`inset currentColor 0px 0px 0px 1px, ${o().boxShadow}`}}},"&[disabled]":{opacity:.3,cursor:"not-allowed"},'&[data-state="on"]':{color:"$primary",borderColor:"currentColor !important",boxShadow:"inset currentColor 0px 0px 0px 1px"}}),a=r;export{r as StyledItem,a as ToggleGroupItem};
1
+ import*as t from"@radix-ui/react-toggle-group";import{styled as e}from"../../stitches.js";import{focusVisibleStyleBlock as o}from"../../utilities/style/focus-visible-style-block.js";const r=e(t.Item,{bg:"white",color:"$tonal400",border:"1px solid $tonal200",cursor:"pointer","&::before":{background:"$tonal200"},"&:not([disabled])":{'&:hover, &:focus-visible, &[data-state="on"]':{"&::before":{background:"none"}},"&:hover":{borderColor:"currentColor !important",color:"$primaryMid"},"&:focus-visible":{...o(),'&[data-state="off"]':{borderColor:"$tonal200 !important"},'&[data-state="on"]':{boxShadow:`inset currentColor 0px 0px 0px 1px, ${o().boxShadow}`}}},"&[disabled]":{opacity:.3,cursor:"not-allowed"},'&[data-state="on"]':{color:"$primary",borderColor:"currentColor !important",boxShadow:"inset currentColor 0px 0px 0px 1px"}}),a=r;export{r as StyledItem,a as ToggleGroupItem};
@@ -1 +1 @@
1
- import{Root as m}from"@radix-ui/react-toggle-group";import{Children as u,createElement as n,isValidElement as b,cloneElement as R}from"react";import{Stack as $}from"../stack/Stack.js";import{styled as g}from"../../stitches.js";import{StyledItem as t}from"./ToggleGroupItem.js";const l=g(m,{width:"fit-content",variants:{isFullWidth:{true:{width:"100%",[`& ${t}`]:{flexBasis:0,flexGrow:1}}},hasGap:{true:{[`& ${t}`]:{borderRadius:"$0"}},false:{borderRadius:"$0",bg:"white",[`& ${t}`]:{bg:"transparent",borderRadius:0,position:"relative","&:not(:last-child)::before":{content:"",position:"absolute"}}}},direction:{column:{},row:{}}},compoundVariants:[{hasGap:!1,direction:"row",css:{[`& ${t}`]:{"&:not(:last-child)::before":{top:"-1px",height:"calc(100% + 2px)",width:"1px",right:"0",transform:"translateX(150%)"},"&:not(:first-child)":{borderLeftColor:"transparent"},"&:not(:last-child)":{borderRightColor:"transparent"},"&:first-child":{borderTopLeftRadius:"$0",borderBottomLeftRadius:"$0"},"&:last-child":{borderTopRightRadius:"$0",borderBottomRightRadius:"$0"}}}},{hasGap:!1,direction:"column",css:{[`& ${t}`]:{"&:not(:last-child)::before":{bottom:0,left:"-1px",height:"1px",width:"calc(100% + 2px)",transform:"translateY(150%)"},"&:first-child":{borderTopLeftRadius:"$0",borderTopRightRadius:"$0"},"&:last-child":{borderBottomLeftRadius:"$0",borderBottomRightRadius:"$0"},"&:not(:first-child)":{borderTopColor:"transparent"},"&:not(:last-child)":{borderBottomColor:"transparent"}}}}]}),w=r=>r==="horizontal"?"row":"column",x=({size:r="md",orientation:e="horizontal",gap:i=!1,isFullWidth:d,children:p,wrap:c="no-wrap",...h})=>{const a=typeof i=="number",f=u.toArray(p),s=w(e);return n(l,{direction:s,hasGap:a,isFullWidth:d,orientation:e,...h},n($,{direction:s,gap:a&&i,align:!1,wrap:c},f.map(o=>b(o)?R(o,{...o.props,size:r}):o)))};export{l as StyledRoot,x as ToggleGroupRoot};
1
+ import*as f from"@radix-ui/react-toggle-group";import*as t from"react";import{Stack as u}from"../stack/Stack.js";import{styled as b}from"../../stitches.js";import{StyledItem as o}from"./ToggleGroupItem.js";const d=b(f.Root,{width:"fit-content",variants:{isFullWidth:{true:{width:"100%",[`& ${o}`]:{flexBasis:0,flexGrow:1}}},hasGap:{true:{[`& ${o}`]:{borderRadius:"$0"}},false:{borderRadius:"$0",bg:"white",[`& ${o}`]:{bg:"transparent",borderRadius:0,position:"relative","&:not(:last-child)::before":{content:"",position:"absolute"}}}},direction:{column:{},row:{}}},compoundVariants:[{hasGap:!1,direction:"row",css:{[`& ${o}`]:{"&:not(:last-child)::before":{top:"-1px",height:"calc(100% + 2px)",width:"1px",right:"0",transform:"translateX(150%)"},"&:not(:first-child)":{borderLeftColor:"transparent"},"&:not(:last-child)":{borderRightColor:"transparent"},"&:first-child":{borderTopLeftRadius:"$0",borderBottomLeftRadius:"$0"},"&:last-child":{borderTopRightRadius:"$0",borderBottomRightRadius:"$0"}}}},{hasGap:!1,direction:"column",css:{[`& ${o}`]:{"&:not(:last-child)::before":{bottom:0,left:"-1px",height:"1px",width:"calc(100% + 2px)",transform:"translateY(150%)"},"&:first-child":{borderTopLeftRadius:"$0",borderTopRightRadius:"$0"},"&:last-child":{borderBottomLeftRadius:"$0",borderBottomRightRadius:"$0"},"&:not(:first-child)":{borderTopColor:"transparent"},"&:not(:last-child)":{borderBottomColor:"transparent"}}}}]}),R=e=>e==="horizontal"?"row":"column",g=({size:e="md",orientation:i="horizontal",gap:a=!1,isFullWidth:l,children:p,wrap:h="no-wrap",...c})=>{const s=typeof a=="number",m=t.Children.toArray(p),n=R(i);return t.createElement(d,{direction:n,hasGap:s,isFullWidth:l,orientation:i,...c},t.createElement(u,{direction:n,gap:s&&a,align:!1,wrap:h},m.map(r=>t.isValidElement(r)?t.cloneElement(r,{...r.props,size:e}):r)))};export{d as StyledRoot,g as ToggleGroupRoot};
@@ -1 +1 @@
1
- import{Root as i,Trigger as m,Provider as p}from"@radix-ui/react-tooltip";import{createElement as l}from"react";import{styled as n}from"../../stitches.js";import{TooltipContent as T}from"./TooltipContent.js";const o=({children:r,delayDuration:t=350,...e})=>l(i,{delayDuration:t,...e},r);o.Content=T,o.Trigger=n(m,{}),o.Provider=p,o.displayName="Tooltip";export{o as Tooltip};
1
+ import{Trigger as i,Root as m,Provider as l}from"@radix-ui/react-tooltip";import*as n from"react";import{styled as p}from"../../stitches.js";import{TooltipContent as a}from"./TooltipContent.js";const o=({children:r,delayDuration:t=350,...e})=>n.createElement(m,{delayDuration:t,...e},r);o.Content=a,o.Trigger=p(i,{}),o.Provider=l,o.displayName="Tooltip";export{o as Tooltip};
@@ -1 +1 @@
1
- import{Content as m,Arrow as l}from"@radix-ui/react-tooltip";import{createElement as t}from"react";import{styled as a}from"../../stitches.js";import{slideDownAndFade as r,slideLeftAndFade as s,slideUpAndFade as p,slideRightAndFade as c}from"../../utilities/style/keyframe-animations.js";const f=a(m,{backgroundColor:"$tonal500",borderRadius:"$0",boxShadow:"$0",color:"white",fontFamily:"$body",fontSize:"$sm",lineHeight:1.5,px:"$3",py:"$2","@allowMotion":{animationDuration:"75ms",animationTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)",willChange:"transform, opacity",'&[data-state="delayed-open"]':{'&[data-side="top"]':{animationName:r},'&[data-side="right"]':{animationName:s},'&[data-side="bottom"]':{animationName:p},'&[data-side="left"]':{animationName:c}}},variants:{size:{sm:{maxWidth:"100px"},md:{maxWidth:"250px"},lg:{maxWidth:"400px"}}}}),$=a(l,{fill:"$tonal500",'[data-align="end"] &':{mr:"$2"},'[data-align="start"] &':{ml:"$2"}}),g=({children:o,side:i="top",sideOffset:n=4,size:e="md",...d})=>t(f,{side:i,sideOffset:n,size:e,...d},o,t($,null));export{g as TooltipContent};
1
+ import{Content as m,Arrow as l}from"@radix-ui/react-tooltip";import*as t from"react";import{styled as a}from"../../stitches.js";import{slideDownAndFade as s,slideLeftAndFade as r,slideUpAndFade as p,slideRightAndFade as f}from"../../utilities/style/keyframe-animations.js";const c=a(m,{backgroundColor:"$tonal500",borderRadius:"$0",boxShadow:"$0",color:"white",fontFamily:"$body",fontSize:"$sm",lineHeight:1.5,px:"$3",py:"$2","@allowMotion":{animationDuration:"75ms",animationTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)",willChange:"transform, opacity",'&[data-state="delayed-open"]':{'&[data-side="top"]':{animationName:s},'&[data-side="right"]':{animationName:r},'&[data-side="bottom"]':{animationName:p},'&[data-side="left"]':{animationName:f}}},variants:{size:{sm:{maxWidth:"100px"},md:{maxWidth:"250px"},lg:{maxWidth:"400px"}}}}),h=a(l,{fill:"$tonal500",'[data-align="end"] &':{mr:"$2"},'[data-align="start"] &':{ml:"$2"}}),$=({children:i,side:e="top",sideOffset:o=4,size:n="md",...d})=>t.createElement(c,{side:e,sideOffset:o,size:n,...d},i,t.createElement(h,null));export{$ as TooltipContent};
@@ -1 +1 @@
1
- import{Error as s}from"@atom-learning/icons";import{createElement as r}from"react";import{Flex as i}from"../flex/Flex.js";import{Icon as m}from"../icon/Icon.js";import{Text as a}from"../text/Text.js";const n=({css:o,children:t,...e})=>r(i,{css:{color:"$danger",alignItems:"flex-start",...o},...e},r(m,{is:s,size:"sm",css:{mr:"$2",flexShrink:0},"aria-hidden":!0}),r(a,{css:{color:"inherit",transform:"translateY($space$1)"},size:"sm"},t));export{n as ValidationError};
1
+ import{Error as s}from"@atom-learning/icons";import*as r from"react";import{Flex as m}from"../flex/Flex.js";import{Icon as i}from"../icon/Icon.js";import{Text as a}from"../text/Text.js";const n=({css:e,children:t,...o})=>r.createElement(m,{css:{color:"$danger",alignItems:"flex-start",...e},...o},r.createElement(i,{is:s,size:"sm",css:{mr:"$2",flexShrink:0},"aria-hidden":!0}),r.createElement(a,{css:{color:"inherit",transform:"translateY($space$1)"},size:"sm"},t));export{n as ValidationError};
@@ -1 +1 @@
1
- import{forwardRef as m,createElement as o}from"react";import s from"react-player/vimeo";import{Box as a}from"../box/Box.js";import{styled as l}from"../../stitches.js";import{CSSWrapper as f}from"../../utilities/css-wrapper/CSSWrapper.js";const h=l(s,{}),e=m(({id:r,ratio:t=9/16,css:i,...d},p)=>o(f,{css:i},o(a,{css:{borderRadius:"$0",position:"relative",paddingTop:`${t*100}%`,overflow:"hidden",height:0,width:"100%"}},o(h,{...d,role:"figure",url:`https://player.vimeo.com/video/${r}`,height:"100%",width:"100%",css:{position:"absolute",top:0,left:0},ref:p}))));e.displayName="Video";export{e as Video};
1
+ import*as e from"react";import m from"react-player/vimeo";import{Box as p}from"../box/Box.js";import{styled as a}from"../../stitches.js";import{CSSWrapper as l}from"../../utilities/css-wrapper/CSSWrapper.js";const f=a(m,{}),o=e.forwardRef(({id:r,ratio:t=9/16,css:i,...s},d)=>e.createElement(l,{css:i},e.createElement(p,{css:{borderRadius:"$0",position:"relative",paddingTop:`${t*100}%`,overflow:"hidden",height:0,width:"100%"}},e.createElement(f,{...s,role:"figure",url:`https://player.vimeo.com/video/${r}`,height:"100%",width:"100%",css:{position:"absolute",top:0,left:0},ref:d}))));o.displayName="Video";export{o as Video};