@atom-learning/components 2.32.3-beta.0 → 2.33.0

package/dist/components/sidedrawer/SidedrawerContent.js

@@ -1 +1 @@
-import{Content as a,Portal as i}from"@radix-ui/react-dialog";import e from"react";import{MAX_Z_INDEX as r}from"../../constants/zIndices.js";import{styled as n}from"../../stitches.js";import{SidedrawerOverlay as d}from"./SidedrawerOverlay.js";import{slideInLeft as l,slideOutLeft as m}from"../../utilities/style/keyframe-animations.js";const s=n(a,{bg:"white",boxShadow:"$2",display:"flex",flexDirection:"column",position:"fixed",top:0,left:0,height:"100%",maxWidth:"304px",width:"100%",zIndex:r,"@allowMotion":{'&[data-state="open"]':{animation:`${l} 250ms ease-out`},'&[data-state="closed"]':{animation:`${m} 250ms ease-out`}}}),f=({children:t,...o})=>e.createElement(i,null,e.createElement(d,{"data-testid":"sidedrawer_overlay"}),e.createElement(s,{role:"navigation",...o},t));export{f as SidedrawerContent};
+import{Content as a,Portal as i}from"@radix-ui/react-dialog";import t from"react";import{MAX_Z_INDEX as r}from"../../constants/zIndices.js";import{styled as n}from"../../stitches.js";import{SidedrawerOverlay as d}from"./SidedrawerOverlay.js";import{slideInLeft as l,slideOutLeft as m}from"../../utilities/style/keyframe-animations.js";const s=n(a,{bg:"white",boxShadow:"$2",display:"flex",flexDirection:"column",position:"fixed",top:0,left:0,height:"100%",maxWidth:"304px",width:"100%",zIndex:r,"@allowMotion":{'&[data-state="open"]':{animation:`${l} 250ms ease-out`},'&[data-state="closed"]':{animation:`${m} 250ms ease-out`}}}),f=({children:e,...o})=>t.createElement(i,null,t.createElement(d,{"data-testid":"sidedrawer_overlay"}),t.createElement(s,{role:"navigation",...o},e));export{f as SidedrawerContent};

package/dist/components/slider/Slider.d.ts

@@ -180,8 +180,9 @@ declare const StyledSlider: import("@stitches/react/types/styled-component").Sty
     };
 }>>;
 export declare type SliderProps = React.ComponentProps<typeof StyledSlider>;
-export declare const Slider: React.FC<SliderProps> & {
+declare type SliderType = React.ForwardRefExoticComponent<SliderProps> & {
     Value: typeof SliderValue;
     Steps: typeof SliderSteps;
 };
+export declare const Slider: SliderType;
 export {};

package/dist/components/slider/Slider.js

@@ -1 +1 @@
-import{Track as $,Root as h,Range as b,Thumb as f}from"@radix-ui/react-slider";import*as e from"react";import{styled as t}from"../../stitches.js";import{SliderSteps as g}from"./SliderSteps.js";import{SliderValue as v}from"./SliderValue.js";import{CSSWrapper as x}from"../../utilities/css-wrapper/CSSWrapper.js";const r=t($,{borderRadius:"$round",flexGrow:1,position:"relative",'&[data-orientation="horizontal"]':{height:"$space$1"},'&[data-orientation="vertical"]':{width:"$space$1"}}),y=t(h,{alignItems:"center",display:"flex",position:"relative",touchAction:"none",userSelect:"none",cursor:"pointer",'&[data-orientation="horizontal"]':{height:"$1"},'&[data-orientation="vertical"]':{flexDirection:"column",width:"$1"},"&[data-disabled]":{cursor:"not-allowed",bg:"$tonal100"},variants:{theme:{light:{[`${r}`]:{bg:"#fff"}},tonal:{[`${r}`]:{bg:"$tonal200"}}}}}),S=t(b,{bg:"$primary",borderRadius:"$round",height:"100%",position:"absolute","&[data-disabled]":{bg:"$tonal200",cursor:"not-allowed"}}),w=t(f,{bg:"$primaryMid",borderRadius:"$round",display:"block",size:"$1","&:hover":{bg:"$primaryDark"},"&:focus":{outline:"2px solid $primaryMid",outlineOffset:"2px"},"&[data-disabled]":{bg:"$tonal200",cursor:"not-allowed"}}),o=({value:i,defaultValue:l,min:n=0,max:d=100,theme:s="tonal",css:m,children:u,...c})=>{const a=i||l;return e.createElement(x,{css:m},e.createElement(y,{theme:s,defaultValue:l,value:i,min:n,max:d,...c},e.createElement(r,null,e.createElement(S,null)),(a==null?void 0:a.length)&&a.map((k,p)=>e.createElement(w,{key:`thumb${p}`}))),u)};o.Value=v,o.Steps=g,o.displayName="Slider";export{o as Slider};
+import{Track as f,Root as h,Range as b,Thumb as g}from"@radix-ui/react-slider";import*as e from"react";import{styled as t}from"../../stitches.js";import{SliderSteps as v}from"./SliderSteps.js";import{SliderValue as x}from"./SliderValue.js";import{CSSWrapper as y}from"../../utilities/css-wrapper/CSSWrapper.js";const a=t(f,{borderRadius:"$round",flexGrow:1,position:"relative",'&[data-orientation="horizontal"]':{height:"$space$1"},'&[data-orientation="vertical"]':{width:"$space$1"}}),S=t(h,{alignItems:"center",display:"flex",position:"relative",touchAction:"none",userSelect:"none",cursor:"pointer",'&[data-orientation="horizontal"]':{height:"$1"},'&[data-orientation="vertical"]':{flexDirection:"column",width:"$1"},"&[data-disabled]":{cursor:"not-allowed",bg:"$tonal100"},variants:{theme:{light:{[`${a}`]:{bg:"#fff"}},tonal:{[`${a}`]:{bg:"$tonal200"}}}}}),w=t(b,{bg:"$primary",borderRadius:"$round",height:"100%",position:"absolute","&[data-disabled]":{bg:"$tonal200",cursor:"not-allowed"}}),R=t(g,{bg:"$primaryMid",borderRadius:"$round",display:"block",size:"$1","&:hover":{bg:"$primaryDark"},"&:focus":{outline:"2px solid $primaryMid",outlineOffset:"2px"},"&[data-disabled]":{bg:"$tonal200",cursor:"not-allowed"}}),o=e.forwardRef(({value:i,defaultValue:l,min:n=0,max:d=100,theme:s="tonal",css:m,children:u,...c},p)=>{const r=i||l;return e.createElement(y,{css:m},e.createElement(S,{theme:s,defaultValue:l,value:i,min:n,max:d,ref:p,...c},e.createElement(a,null,e.createElement(w,null)),(r==null?void 0:r.length)&&r.map((k,$)=>e.createElement(R,{key:`thumb${$}`}))),u)});o.Value=x,o.Steps=v,o.displayName="Slider";export{o as Slider};

package/dist/components/slider-field/SliderField.js

@@ -1 +1 @@
-import e from"react";import{useFormContext as x,Controller as E}from"react-hook-form";import{FieldWrapper as V}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import{Slider as l}from"../slider/Slider.js";const n=({css:u,label:i,name:t,defaultValue:a,outputLabel:p,min:r=0,max:m=100,steps:d=[],...s})=>{const{control:c}=x();return e.createElement(V,{css:u,fieldId:t,label:i},e.createElement(E,{control:c,name:t,defaultValue:a,render:({onChange:f,value:o})=>e.createElement(l,{name:t,defaultValue:a,onValueChange:f,value:o,min:r,max:m,...s},e.createElement(l.Steps,{min:r,max:m,steps:d}),e.createElement(l.Value,{value:o||a,outputLabel:p}))}))};n.displayName="SliderField";export{n as SliderField};
+import e from"react";import{useFormContext as b,useController as g}from"react-hook-form";import{FieldWrapper as C}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import{Slider as t}from"../slider/Slider.js";const u=({css:i,label:s,name:a,defaultValue:d,value:l,validation:f,outputLabel:p,min:r=0,max:n=100,steps:c=[],...v})=>{const{control:x}=b(),{field:{ref:E,onChange:m,value:o,name:S}}=g({name:a,control:x,rules:f,defaultValue:d});return e.useEffect(()=>{l!=null&&l.length&&m(l)},[JSON.stringify(l)]),e.createElement(C,{css:i,fieldId:a,label:s},e.createElement(t,{ref:E,name:S,onValueChange:m,value:o,min:r,max:n,...v},e.createElement(t.Steps,{min:r,max:n,steps:c}),e.createElement(t.Value,{value:o,outputLabel:p})))};u.displayName="SliderField";export{u as SliderField};

package/dist/components/stack-content/StackContent.js

@@ -1 +1 @@
-import*as t from"react";import{styled as r}from"../../stitches.js";import{StyledDivider as e}from"../divider/Divider.js";import{StyledHeading as d}from"../heading/Heading.js";import{StyledImage as a}from"../image/Image.js";import{StyledList as l}from"../list/List.js";import{StyledText as c}from"../text/Text.js";const f=r("div",{"& > *":{"&:not(:first-child)":{mt:"$5"},"&:not(:last-child)":{mb:"$5"}},[`& > ${d}`]:{maxWidth:"65ch"},[`& > ${c}`]:{maxWidth:"75ch"},[`& > ${l}`]:{maxWidth:"75ch"},[`& > ${e}`]:{my:"$5"},[`& > ${a}`]:{display:"block","&:not(:first-child)":{mt:"$6"},"&:not(:last-child)":{mb:"$6"}}}),o=t.forwardRef((m,i)=>t.createElement(f,{ref:i,...m}));o.displayName="StackContent";export{o as StackContent};
+import*as t from"react";import{styled as r}from"../../stitches.js";import{StyledDivider as e}from"../divider/Divider.js";import{StyledHeading as d}from"../heading/Heading.js";import{StyledImage as a}from"../image/Image.js";import{StyledList as l}from"../list/List.js";import{StyledText as c}from"../text/Text.js";const f=r("div",{"& > *":{"&:not(:first-child)":{mt:"$5"},"&:not(:last-child)":{mb:"$5"}},[`& > ${d}`]:{maxWidth:"65ch"},[`& > ${c}`]:{maxWidth:"75ch"},[`& > ${l}`]:{maxWidth:"75ch"},[`& > ${e}`]:{my:"$5"},[`& > ${a}`]:{display:"block","&:not(:first-child)":{mt:"$6"},"&:not(:last-child)":{mb:"$6"}}}),m=t.forwardRef((o,i)=>t.createElement(f,{ref:i,...o}));m.displayName="StackContent";export{m as StackContent};

package/dist/components/stepper/StepperStepBack.js

@@ -1 +1 @@
-import*as i from"react";import{Button as n}from"../button/Button.js";import{useStepper as a}from"./stepper-context/StepperContext.js";const l=({label:e,children:t,...r})=>{const{activeStep:o,goToPreviousStep:p}=a();return i.createElement(n,{size:"sm",appearance:"outline",...r,disabled:o===0,onClick:p},t||(e==null?void 0:e(o)))};export{l as StepperStepBack};
+import*as i from"react";import{Button as n}from"../button/Button.js";import{useStepper as a}from"./stepper-context/StepperContext.js";const l=({label:e,children:o,...r})=>{const{activeStep:t,goToPreviousStep:p}=a();return i.createElement(n,{size:"sm",appearance:"outline",...r,disabled:t===0,onClick:p},o||(e==null?void 0:e(t)))};export{l as StepperStepBack};

package/dist/components/table/Table.d.ts

@@ -6,7 +6,6 @@ import { TableFooterCell } from './TableFooterCell';
 import { TableHeader } from './TableHeader';
 import { TableHeaderCell } from './TableHeaderCell';
 import { TableRow } from './TableRow';
-import { TableStickyColumnsContainer } from './TableStickyColumnsContainer';
 declare type TableSubComponents = {
     Body: typeof TableBody;
     Cell: typeof TableCell;
@@ -15,7 +14,6 @@ declare type TableSubComponents = {
     Header: typeof TableHeader;
     HeaderCell: typeof TableHeaderCell;
     Row: typeof TableRow;
-    StickyColumnsContainer: typeof TableStickyColumnsContainer;
 };
 declare const StyledTable: import("@stitches/react/types/styled-component").StyledComponent<"table", {
     size?: "md" | "lg" | undefined;
@@ -196,8 +194,6 @@ declare const StyledTable: import("@stitches/react/types/styled-component").Styl
         marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
     };
 }>>;
-declare type TableProps = React.ComponentProps<typeof StyledTable> & {
-    numberOfStickyColumns?: number;
-};
+declare type TableProps = React.ComponentProps<typeof StyledTable>;
 export declare const Table: React.FC<TableProps> & TableSubComponents;
 export {};

package/dist/components/table/Table.js

@@ -1 +1 @@
-import*as i from"react";import{styled as f}from"../../stitches.js";import{TableBody as b}from"./TableBody.js";import{TableCell as o}from"./TableCell.js";import{TableFooter as p}from"./TableFooter.js";import{TableFooterCell as t}from"./TableFooterCell.js";import{TableHeader as $}from"./TableHeader.js";import{TableHeaderCell as r}from"./TableHeaderCell.js";import{StyledRow as c,TableRow as u}from"./TableRow.js";import{TableStickyColumnsContainer as m}from"./TableStickyColumnsContainer.js";const C=f("table",{borderCollapse:"separate",borderSpacing:0,fontFamily:"$sans",fontSize:"$sm",width:"100%",variants:{size:{md:{[`${o}, ${r}, ${t}`]:{height:"$4"}},lg:{[`${o}, ${r}, ${t}`]:{height:"$5"}}},corners:{round:{[`${r}`]:{"&:first-of-type":{borderTopLeftRadius:"$0"},"&:last-of-type":{borderTopRightRadius:"$0"}},[`${c}:last-child`]:{[`${o}:first-child`]:{borderBottomLeftRadius:"$0"},[`${o}:last-child`]:{borderBottomRightRadius:"$0"}}},square:{}}}}),e=({size:s="md",corners:d="round",numberOfStickyColumns:l=0,...n})=>{const a=i.createElement(C,{size:s,corners:d,...n});return l?i.createElement(m,{numberOfStickyColumns:l},a):a};e.Body=b,e.Cell=o,e.Footer=p,e.FooterCell=t,e.Header=$,e.HeaderCell=r,e.Row=u,e.StickyColumnsContainer=m,e.displayName="Table";export{e as Table};
+import*as d from"react";import{styled as s}from"../../stitches.js";import{TableBody as m}from"./TableBody.js";import{TableCell as o}from"./TableCell.js";import{TableFooter as p}from"./TableFooter.js";import{TableFooterCell as t}from"./TableFooterCell.js";import{TableHeader as $}from"./TableHeader.js";import{TableHeaderCell as r}from"./TableHeaderCell.js";import{StyledRow as f,TableRow as b}from"./TableRow.js";const n=s("table",{borderCollapse:"separate",borderSpacing:0,fontFamily:"$sans",fontSize:"$sm",width:"100%",variants:{size:{md:{[`${o}, ${r}, ${t}`]:{height:"$4"}},lg:{[`${o}, ${r}, ${t}`]:{height:"$5"}}},corners:{round:{[`${r}`]:{"&:first-of-type":{borderTopLeftRadius:"$0"},"&:last-of-type":{borderTopRightRadius:"$0"}},[`${f}:last-child`]:{[`${o}:first-child`]:{borderBottomLeftRadius:"$0"},[`${o}:last-child`]:{borderBottomRightRadius:"$0"}}},square:{}}}}),e=({size:l="md",corners:a="round",...i})=>d.createElement(n,{size:l,corners:a,...i});e.Body=m,e.Cell=o,e.Footer=p,e.FooterCell=t,e.Header=$,e.HeaderCell=r,e.Row=b,e.displayName="Table";export{e as Table};

package/dist/components/table/TableBody.js

@@ -1 +1 @@
-import*as r from"react";import{styled as i}from"../../stitches.js";import{StyledRow as t}from"./TableRow.js";const l=i("tbody",{variants:{striped:{true:{[`${t}`]:{"&:nth-child(odd)":{bg:"white"},"&:nth-child(even)":{bg:"$tonal50"}}},false:{[`${t}`]:{bg:"white"}}}}}),e=({striped:o=!0,...d})=>r.createElement(l,{striped:o,...d});e.displayName="TableBody";export{e as TableBody};
+import*as d from"react";import{styled as r}from"../../stitches.js";import{StyledRow as i}from"./TableRow.js";const l=r("tbody",{variants:{striped:{true:{[`${i}`]:{"&:nth-child(odd)":{bg:"white"},"&:nth-child(even)":{bg:"$tonal50"}}},false:{bg:"white"}}}}),t=({striped:e=!0,...o})=>d.createElement(l,{striped:e,...o});t.displayName="TableBody";export{t as TableBody};

package/dist/components/table/TableHeader.js

@@ -1 +1 @@
-import o from"react";import{styled as l}from"../../stitches.js";import{TableHeaderCell as e}from"./TableHeaderCell.js";const r={PRIMARY:"primary",PRIMARY_DARK:"primaryDark",LIGHT:"light"},i=l("thead",{variants:{theme:{[r.PRIMARY]:{[`${e}`]:{bg:"$primary"}},[r.PRIMARY_DARK]:{[`${e}`]:{bg:"$primaryDark"}},[r.LIGHT]:{[`${e}`]:{bg:"$tonal50",color:"$tonal600"}}}}}),a=({theme:t="primaryDark",...m})=>o.createElement(i,{theme:t,...m});a.displayName="TableHeader";export{r as TABLE_HEADER_THEMES,a as TableHeader};
+import l from"react";import{styled as o}from"../../stitches.js";import{TableHeaderCell as e}from"./TableHeaderCell.js";const r={PRIMARY:"primary",PRIMARY_DARK:"primaryDark",LIGHT:"light"},i=o("thead",{variants:{theme:{[r.PRIMARY]:{[`${e}`]:{bg:"$primary"}},[r.PRIMARY_DARK]:{[`${e}`]:{bg:"$primaryDark"}},[r.LIGHT]:{[`${e}`]:{bg:"$tonal50",color:"$tonal600"}}}}}),a=({theme:t="primaryDark",...m})=>l.createElement(i,{theme:t,...m});a.displayName="TableHeader";export{r as TABLE_HEADER_THEMES,a as TableHeader};

package/dist/components/table/TableRow.js

@@ -1 +1 @@
-import*as e from"react";import{styled as l}from"../../stitches.js";const o=l("tr",{bg:"unset"}),r=e.forwardRef((t,a)=>e.createElement(o,{...t,ref:a}));r.displayName="TableRow";export{o as StyledRow,r as TableRow};
+import*as e from"react";import{styled as l}from"../../stitches.js";const t=l("tr",{bg:"unset"}),o=e.forwardRef((r,a)=>e.createElement(t,{...r,ref:a}));o.displayName="TableRow";export{t as StyledRow,o as TableRow};

package/dist/components/tabs/Tabs.js

@@ -1 +1 @@
-import{Root as i}from"@radix-ui/react-tabs";import*as e from"react";import{styled as m}from"../../stitches.js";import{TabsTriggerList as s}from"./TabsTriggerList.js";import{TabsTrigger as a}from"./TabsTrigger.js";import{TabsContent as g}from"./TabsContent.js";const T=m(i,{width:"100%"}),r=({children:o,...t})=>e.createElement(T,{...t},o);r.TriggerList=s,r.Trigger=a,r.Content=g,r.displayName="Tabs";export{r as Tabs};
+import{Root as i}from"@radix-ui/react-tabs";import*as e from"react";import{styled as m}from"../../stitches.js";import{TabsTriggerList as s}from"./TabsTriggerList.js";import{TabsTrigger as a}from"./TabsTrigger.js";import{TabsContent as g}from"./TabsContent.js";const T=m(i,{width:"100%"}),r=({children:t,...o})=>e.createElement(T,{...o},t);r.TriggerList=s,r.Trigger=a,r.Content=g,r.displayName="Tabs";export{r as Tabs};

package/dist/components/tabs/TabsTrigger.js

@@ -1 +1 @@
-import{Trigger as i}from"@radix-ui/react-tabs";import*as e from"react";import{styled as a}from"../../stitches.js";import{Text as n}from"../text/Text.js";import{focusVisibleStyleBlock as c}from"../../utilities/style/focus-visible-style-block.js";const s=a(i,{background:"none",border:"none",cursor:"pointer",flexShrink:0,p:"$4",userSelect:"none",borderBottom:"2px solid transparent",'&[data-state="active"]':{color:"$interactive1",fontWeight:600,letterSpacing:"-0.005em",borderColor:"currentColor"},"&[data-disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([data-disabled])":{"&:hover, &:focus-visible":{color:"$interactive2",bg:"$accentA1"},"&:active":{color:"$interactive3"},"&:focus-visible":{...c()}}}),o=({children:r,...t})=>e.createElement(s,{asChild:!0,...t},e.createElement(n,{size:"sm",as:"button"},r));o.displayName="TabsTrigger";export{o as TabsTrigger};
+import{Trigger as i}from"@radix-ui/react-tabs";import*as e from"react";import{styled as a}from"../../stitches.js";import{Text as n}from"../text/Text.js";import{focusVisibleStyleBlock as c}from"../../utilities/style/focus-visible-style-block.js";const s=a(i,{background:"none",border:"none",cursor:"pointer",flexShrink:0,p:"$4",userSelect:"none",borderBottom:"2px solid transparent",'&[data-state="active"]':{color:"$interactive1",fontWeight:600,letterSpacing:"-0.005em",borderColor:"currentColor"},"&[data-disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([data-disabled])":{"&:hover, &:focus-visible":{color:"$interactive2",bg:"$accentA1"},"&:active":{color:"$interactive3"},"&:focus-visible":{...c()}}}),r=({children:o,...t})=>e.createElement(s,{asChild:!0,...t},e.createElement(n,{size:"sm",as:"button"},o));r.displayName="TabsTrigger";export{r as TabsTrigger};

package/dist/components/tabs/TabsTriggerList.js

@@ -1 +1 @@
-import{List as y}from"@radix-ui/react-tabs";import e from"react";import{styled as m}from"../../stitches.js";import{useWindowSize as T}from"../../utilities/hooks/useWindowSize.js";import{useCallbackRefState as x}from"../../utilities/hooks/useCallbackRef.js";import{ActionIcon as z}from"../action-icon/ActionIcon.js";import{Icon as p}from"../icon/Icon.js";import{ChevronLeft as $,ChevronRight as R}from"@atom-learning/icons";import{ColorScheme as I}from"../../experiments/color-scheme/ColorScheme.js";const N=m(I,{position:"relative",borderBottom:"1px solid $base3",width:"100%"}),_=m(y,{flexShrink:0,display:"flex",width:"100%",overflowX:"auto","&::-webkit-scrollbar":{display:"none"},scrollbarWidth:"none"}),u=m(z,{height:"100% !important",position:"absolute",top:"50%",transform:"translateY(-50%)",cursor:"pointer",background:"$background !important",color:"$interactive1 !important",borderRadius:0,opacity:.9}),A=10,b=({children:g,colorScheme:v={},...C})=>{const[t,k]=x(),{width:W}=T(),[w,i]=e.useState(!1),[E,s]=e.useState(!1),f=e.useCallback(c=>{if(!t)return;const{scrollWidth:r,scrollLeft:l,offsetWidth:a}=t,h=Math.round(r*(A/100));let n=l;if(c==="right"){const o=l+h;n=o+a<=r?o:r-a}else{const o=l-h;n=o>0?o:0}t.scroll({left:n,behavior:"smooth"}),setTimeout(()=>{const{scrollWidth:o,scrollLeft:d,offsetWidth:L}=t,S=o-(d+L);d===0?(i(!1),s(!0)):S<5?(s(!1),i(!0)):(i(!0),s(!0))},500)},[t]);return e.useEffect(()=>{var c;if(!t)return;const{offsetWidth:r,scrollWidth:l}=t,a=l>r;(c=t.scroll)==null||c.call(t,{left:0}),i(!1),s(a)},[t,W]),e.createElement(N,{base:"slate",accent:"blue",interactive:"hiContrast1",...v,...C},w&&e.createElement(u,{label:"scroll left",size:"md",css:{left:0},onClick:()=>f("left")},e.createElement(p,{is:$})),e.createElement(_,{ref:k},g),E&&e.createElement(u,{label:"scroll right",size:"md",css:{right:0},onClick:()=>f("right")},e.createElement(p,{is:R})))};b.displayName="TabsTriggerList";export{b as TabsTriggerList};
+import{List as y}from"@radix-ui/react-tabs";import e from"react";import{styled as m}from"../../stitches.js";import{ColorScheme as T}from"../../experiments/color-scheme/ColorScheme.js";import{useWindowSize as x}from"../../utilities/hooks/useWindowSize.js";import{useCallbackRefState as z}from"../../utilities/hooks/useCallbackRef.js";import{ActionIcon as $}from"../action-icon/ActionIcon.js";import{Icon as p}from"../icon/Icon.js";import{ChevronLeft as R,ChevronRight as I}from"@atom-learning/icons";const N=m(T,{position:"relative",borderBottom:"1px solid $base3",width:"100%"}),_=m(y,{flexShrink:0,display:"flex",width:"100%",overflowX:"auto","&::-webkit-scrollbar":{display:"none"},scrollbarWidth:"none"}),u=m($,{height:"100% !important",position:"absolute",top:"50%",transform:"translateY(-50%)",cursor:"pointer",background:"$background !important",color:"$interactive1 !important",borderRadius:0,opacity:.9}),A=10,b=({children:g,colorScheme:v={},...C})=>{const[t,k]=z(),{width:W}=x(),[w,i]=e.useState(!1),[E,s]=e.useState(!1),f=e.useCallback(c=>{if(!t)return;const{scrollWidth:r,scrollLeft:l,offsetWidth:a}=t,h=Math.round(r*(A/100));let n=l;if(c==="right"){const o=l+h;n=o+a<=r?o:r-a}else{const o=l-h;n=o>0?o:0}t.scroll({left:n,behavior:"smooth"}),setTimeout(()=>{const{scrollWidth:o,scrollLeft:d,offsetWidth:L}=t,S=o-(d+L);d===0?(i(!1),s(!0)):S<5?(s(!1),i(!0)):(i(!0),s(!0))},500)},[t]);return e.useEffect(()=>{var c;if(!t)return;const{offsetWidth:r,scrollWidth:l}=t,a=l>r;(c=t.scroll)==null||c.call(t,{left:0}),i(!1),s(a)},[t,W]),e.createElement(N,{base:"slate",accent:"blue",interactive:"hiContrast1",...v,...C},w&&e.createElement(u,{label:"scroll left",size:"md",css:{left:0},onClick:()=>f("left")},e.createElement(p,{is:R})),e.createElement(_,{ref:k},g),E&&e.createElement(u,{label:"scroll right",size:"md",css:{right:0},onClick:()=>f("right")},e.createElement(p,{is:I})))};b.displayName="TabsTriggerList";export{b as TabsTriggerList};

package/dist/components/text/Text.js

@@ -1 +1 @@
-import*as o from"react";import{styled as f}from"../../stitches.js";import{capsize as e}from"../../utilities/style/capsize.js";const i={size:{xs:{fontSize:"$xs",lineHeight:1.6,...e(.4364)},sm:{fontSize:"$sm",lineHeight:1.53,...e(.4056)},md:{fontSize:"$md",lineHeight:1.5,...e(.3864)},lg:{fontSize:"$lg",lineHeight:1.52,...e(.3983)},xl:{fontSize:"$xl",lineHeight:1.42,...e(.3506)}},noCapsize:{true:{"&::before, &::after":{display:"none"}}}},l=({size:t,noCapsize:n})=>({...i.size[t],...i.noCapsize[`${n}`]}),a=f("p",{fontFamily:"$body",fontWeight:400,margin:0,"& > &":{"&:before, &:after":{display:"none"}},variants:i}),s=o.forwardRef(({size:t="md",...n},r)=>o.createElement(a,{size:t,...n,ref:r}));s.displayName="Text";export{a as StyledText,s as Text,l as getTextVariant,i as textVariants};
+import*as o from"react";import{styled as f}from"../../stitches.js";import{capsize as e}from"../../utilities/style/capsize.js";const t={size:{xs:{fontSize:"$xs",lineHeight:1.6,...e(.4364)},sm:{fontSize:"$sm",lineHeight:1.53,...e(.4056)},md:{fontSize:"$md",lineHeight:1.5,...e(.3864)},lg:{fontSize:"$lg",lineHeight:1.52,...e(.3983)},xl:{fontSize:"$xl",lineHeight:1.42,...e(.3506)}},noCapsize:{true:{"&::before, &::after":{display:"none !important"}}}},l=({size:i,noCapsize:n})=>({...t.size[i],...t.noCapsize[`${n}`]}),a=f("p",{fontFamily:"$body",fontWeight:400,margin:0,"& > &":{"&:before, &:after":{display:"none"}},variants:t}),r=o.forwardRef(({size:i="md",...n},s)=>o.createElement(a,{size:i,...n,ref:s}));r.displayName="Text";export{a as StyledText,r as Text,l as getTextVariant,t as textVariants};

package/dist/components/toast/Toast.js

@@ -1 +1 @@
-import{Error as g,Close as $}from"@atom-learning/icons";import*as t from"react";import{toast as h}from"react-hot-toast";import{keyframes as a,styled as i}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=a({"0%":{transform:"translate3d(0,-100%,0)",opacity:0},"100%":{transform:"translate3d(0,0,0)",opacity:1}}),E=a({"0%":{transform:"translate3d(0,0,0)",opacity:1},"100%":{transform:"translate3d(0,-100%,0)",opacity:0}}),k=i("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=i("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=t.memo(({ariaLive:l,height:m,id:e,message:c,role:p,type:o="blank",visible:d,calculateOffset:u,updateHeight:b})=>{const f=u(e,{reverseOrder:!0,margin:8});return t.createElement(k,{visible:d},t.createElement(I,{ref:r=>{r&&m===void 0&&b(e,r.getBoundingClientRect().height)},status:o,role:p,"aria-live":l,style:{transform:`translateY(${f}px)`}},o==="error"&&t.createElement(s,{size:"sm",css:{mr:"$3",flex:"0 0 auto"},is:g}),t.createElement(w,null,c),o==="loading"?t.createElement(y,{css:{flex:"0 0 auto",ml:"auto"}}):t.createElement(v,{css:{position:"absolute",top:"$2",right:"$2",color:"white","&:hover,&:focus":{color:"white",opacity:.5}},label:"Close alert",onClick:()=>h.dismiss(e)},t.createElement(s,{is:$}))))});export{n as TOAST_WIDTH,T as Toast};
+import{Error as g,Close as h}from"@atom-learning/icons";import*as t from"react";import{toast as v}from"react-hot-toast";import{keyframes as a,styled as i}from"../../stitches.js";import{ActionIcon as y}from"../action-icon/ActionIcon.js";import{Icon as s}from"../icon/Icon.js";import{Loader as $}from"../loader/Loader.js";import{Text as w}from"../text/Text.js";const n=400,x=a({"0%":{transform:"translate3d(0,-100%,0)",opacity:0},"100%":{transform:"translate3d(0,0,0)",opacity:1}}),E=a({"0%":{transform:"translate3d(0,0,0)",opacity:1},"100%":{transform:"translate3d(0,-100%,0)",opacity:0}}),k=i("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=i("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=t.memo(({ariaLive:l,height:m,id:e,message:c,role:p,type:o="blank",visible:d,calculateOffset:u,updateHeight:b})=>{const f=u(e,{reverseOrder:!0,margin:8});return t.createElement(k,{visible:d},t.createElement(I,{ref:r=>{r&&m===void 0&&b(e,r.getBoundingClientRect().height)},status:o,role:p,"aria-live":l,style:{transform:`translateY(${f}px)`}},o==="error"&&t.createElement(s,{size:"sm",css:{mr:"$3",flex:"0 0 auto"},is:g}),t.createElement(w,null,c),o==="loading"?t.createElement($,{css:{flex:"0 0 auto",ml:"auto"}}):t.createElement(y,{css:{position:"absolute",top:"$2",right:"$2",color:"white","&:hover,&:focus":{color:"white",opacity:.5}},label:"Close alert",onClick:()=>v.dismiss(e)},t.createElement(s,{is:h}))))});export{n as TOAST_WIDTH,T as Toast};

package/dist/components/toast/ToastProvider.js

@@ -1 +1 @@
-import*as t from"react";import{useToaster as p}from"react-hot-toast";import{default as _}from"react-hot-toast";import{styled as c}from"../../stitches.js";import{TOAST_WIDTH as d,Toast as f}from"./Toast.js";import{MAX_Z_INDEX as u}from"../../constants/zIndices.js";const T=c("div",{left:"$2",position:"fixed",top:"$2",right:"$2",zIndex:u,"@sm":{top:"$3",right:"auto",left:`calc(50% - ${d/2}px)`}}),o=({children:a})=>{const{toasts:r,handlers:s}=p(),{startPause:i,endPause:m,calculateOffset:n,updateHeight:l}=s;return t.createElement(t.Fragment,null,t.createElement(T,{onMouseEnter:i,onMouseLeave:m},r.map(e=>t.createElement(f,{key:e.id,calculateOffset:n,updateHeight:l,...e}))),a)};o.displayName="ToastProvider";export{o as ToastProvider,_ as toast};
+import*as t from"react";import{useToaster as p}from"react-hot-toast";import{default as P}from"react-hot-toast";import{styled as c}from"../../stitches.js";import{TOAST_WIDTH as d,Toast as f}from"./Toast.js";import{MAX_Z_INDEX as u}from"../../constants/zIndices.js";const T=c("div",{left:"$2",position:"fixed",top:"$2",right:"$2",zIndex:u,"@sm":{top:"$3",right:"auto",left:`calc(50% - ${d/2}px)`}}),o=({children:a})=>{const{toasts:r,handlers:s}=p(),{startPause:i,endPause:m,calculateOffset:n,updateHeight:l}=s;return t.createElement(t.Fragment,null,t.createElement(T,{onMouseEnter:i,onMouseLeave:m},r.map(e=>t.createElement(f,{key:e.id,calculateOffset:n,updateHeight:l,...e}))),a)};o.displayName="ToastProvider";export{o as ToastProvider,P as toast};

package/dist/components/toggle-group/ToggleGroupButton.js

@@ -1 +1 @@
-import*as n from"react";import{styled as f}from"../../stitches.js";import{StyledIcon as g,Icon as r}from"../icon/Icon.js";import{StyledItem as h}from"./ToggleGroupItem.js";const t={sm:"32px",md:"40px",lg:"48px"},$={sm:"$4",md:"$5",lg:"$5"},u={sm:"$2",md:"$3",lg:"$3"},l=i=>({fontSize:`$${i}`,px:$[i],minHeight:t[i],"& > *:not(:last-child)":{mr:u[i]}}),d=f(h,{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}}]}),x=n.forwardRef(({size:i="md",children:p,...c},y)=>{var o;const s=n.Children.toArray(p),m=s.length<=1,a=m&&n.isValidElement(s[0])&&((o=s[0])==null?void 0:o.type)===r;return n.createElement(d,{ref:y,size:i,isIconOnly:a,...c},s.map(e=>!m&&(typeof e=="string"||typeof e=="number")?n.createElement("span",{key:e},e):n.isValidElement(e)&&(e==null?void 0:e.type)===r?n.cloneElement(e,{...e.props,size:i}):e))});export{d as StyledButton,x as ToggleGroupButton};
+import*as n from"react";import{styled as f}from"../../stitches.js";import{StyledIcon as g,Icon as r}from"../icon/Icon.js";import{StyledItem as h}from"./ToggleGroupItem.js";const s={sm:"32px",md:"40px",lg:"48px"},u={sm:"$4",md:"$5",lg:"$5"},x={sm:"$2",md:"$3",lg:"$3"},l=i=>({fontSize:`$${i}`,px:u[i],minHeight:s[i],"& > *:not(:last-child)":{mr:x[i]}}),d=f(h,{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:s.sm,p:0}},{isIconOnly:!0,size:"md",css:{minWidth:s.md,p:0}},{isIconOnly:!0,size:"lg",css:{minWidth:s.lg,p:0}}]}),I=n.forwardRef(({size:i="md",children:p,...c},y)=>{var m;const t=n.Children.toArray(p),o=t.length<=1,a=o&&n.isValidElement(t[0])&&((m=t[0])==null?void 0:m.type)===r;return n.createElement(d,{ref:y,size:i,isIconOnly:a,...c},t.map(e=>!o&&(typeof e=="string"||typeof e=="number")?n.createElement("span",{key:e},e):n.isValidElement(e)&&(e==null?void 0:e.type)===r?n.cloneElement(e,{...e.props,size:i}):e))});export{d as StyledButton,I as ToggleGroupButton};

package/dist/components/tooltip/TooltipContent.js

@@ -1 +1 @@
-import{Content as m,Arrow as l}from"@radix-ui/react-tooltip";import*as a from"react";import{TOOLTIP_Z_INDEX as r}from"../../constants/zIndices.js";import{styled as t}from"../../stitches.js";import{slideDownAndFade as s,slideLeftAndFade as p,slideUpAndFade as f,slideRightAndFade as c}from"../../utilities/style/keyframe-animations.js";const h=t(m,{backgroundColor:"$tonal500",borderRadius:"$0",boxShadow:"$0",color:"white",fontFamily:"$body",fontSize:"$sm",lineHeight:1.5,whiteSpace:"normal",px:"$3",py:"$2",zIndex:r,"@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:p},'&[data-side="bottom"]':{animationName:f},'&[data-side="left"]':{animationName:c}}},variants:{size:{sm:{maxWidth:"100px"},md:{maxWidth:"250px"},lg:{maxWidth:"400px"}}}}),x=t(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})=>a.createElement(h,{side:e,sideOffset:o,size:n,...d},i,a.createElement(x,null));export{$ as TooltipContent};
+import{Content as m,Arrow as l}from"@radix-ui/react-tooltip";import*as t from"react";import{TOOLTIP_Z_INDEX as r}from"../../constants/zIndices.js";import{styled as a}from"../../stitches.js";import{slideDownAndFade as s,slideLeftAndFade as p,slideUpAndFade as f,slideRightAndFade as c}from"../../utilities/style/keyframe-animations.js";const h=a(m,{backgroundColor:"$tonal500",borderRadius:"$0",boxShadow:"$0",color:"white",fontFamily:"$body",fontSize:"$sm",lineHeight:1.5,whiteSpace:"normal",px:"$3",py:"$2",zIndex:r,"@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:p},'&[data-side="bottom"]':{animationName:f},'&[data-side="left"]':{animationName:c}}},variants:{size:{sm:{maxWidth:"100px"},md:{maxWidth:"250px"},lg:{maxWidth:"400px"}}}}),x=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(h,{side:e,sideOffset:o,size:n,...d},i,t.createElement(x,null));export{$ as TooltipContent};

package/dist/components/video/Video.js

@@ -1 +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};
+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:t,ratio:r=9/16,css:i,...s},d)=>e.createElement(l,{css:i},e.createElement(p,{css:{borderRadius:"$0",position:"relative",paddingTop:`${r*100}%`,overflow:"hidden",height:0,width:"100%"}},e.createElement(f,{...s,role:"figure",url:`https://player.vimeo.com/video/${t}`,height:"100%",width:"100%",css:{position:"absolute",top:0,left:0},ref:d}))));o.displayName="Video";export{o as Video};