@atom-learning/components 2.33.0 → 2.35.0

package/dist/components/stepper/StepperStepBullet.d.ts

@@ -21,6 +21,42 @@ export declare const StepperStepBullet: import("@stitches/react/types/styled-com
         textPlaceholder: any;
         background: any;
         backgroundAccent: any;
+        grey100: any;
+        grey200: any;
+        grey300: any;
+        grey400: any;
+        grey500: any;
+        grey600: any;
+        grey700: any;
+        grey800: any;
+        grey900: any;
+        grey1000: any;
+        grey1100: any;
+        grey1200: any;
+        blue100: any;
+        blue200: any;
+        blue300: any;
+        blue400: any;
+        blue500: any;
+        blue600: any;
+        blue700: any;
+        blue800: any;
+        blue900: any;
+        blue1000: any;
+        blue1100: any;
+        blue1200: any;
+        purple100: any;
+        purple200: any;
+        purple300: any;
+        purple400: any;
+        purple500: any;
+        purple600: any;
+        purple700: any;
+        purple800: any;
+        purple900: any;
+        purple1000: any;
+        purple1100: any;
+        purple1200: any;
         tonal50: any;
         tonal100: any;
         tonal200: any;
@@ -78,6 +114,7 @@ export declare const StepperStepBullet: import("@stitches/react/types/styled-com
         "7": any;
         "8": any;
         "9": any;
+        "24": any;
     };
     fontSizes: {
         xs: any;
@@ -198,6 +235,42 @@ export declare const StepperStepBullet: import("@stitches/react/types/styled-com
         textPlaceholder: any;
         background: any;
         backgroundAccent: any;
+        grey100: any;
+        grey200: any;
+        grey300: any;
+        grey400: any;
+        grey500: any;
+        grey600: any;
+        grey700: any;
+        grey800: any;
+        grey900: any;
+        grey1000: any;
+        grey1100: any;
+        grey1200: any;
+        blue100: any;
+        blue200: any;
+        blue300: any;
+        blue400: any;
+        blue500: any;
+        blue600: any;
+        blue700: any;
+        blue800: any;
+        blue900: any;
+        blue1000: any;
+        blue1100: any;
+        blue1200: any;
+        purple100: any;
+        purple200: any;
+        purple300: any;
+        purple400: any;
+        purple500: any;
+        purple600: any;
+        purple700: any;
+        purple800: any;
+        purple900: any;
+        purple1000: any;
+        purple1100: any;
+        purple1200: any;
         tonal50: any;
         tonal100: any;
         tonal200: any;
@@ -255,6 +328,7 @@ export declare const StepperStepBullet: import("@stitches/react/types/styled-com
         "7": any;
         "8": any;
         "9": any;
+        "24": any;
     };
     fontSizes: {
         xs: any;

package/dist/components/stepper/StepperStepBullet.js

@@ -1 +1,2 @@
 import{styled as e}from"../../stitches.js";import{Flex as o}from"../flex/Flex.js";const r=e(o,{position:"relative",p:"$2",justifyContent:"center",alignItems:"center",size:"$3",borderRadius:"50%",border:"none",bg:"$tonal100",zIndex:1,flex:"none",variants:{status:{default:{bg:"$tonal100",color:"$tonal300"},active:{bg:"white",color:"$primaryMid",border:"2px solid",borderColor:"currentColor"},viewed:{bg:"white",border:"2px solid $tonal200",color:"$tonal600"},completed:{bg:"$primary",color:"white"},reviewed:{bg:"$primaryMid",color:"white"},success:{bg:"$success",color:"white"}}}});export{r as StepperStepBullet};
+//# sourceMappingURL=StepperStepBullet.js.map

package/dist/components/stepper/StepperStepBullet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepperStepBullet.js","sources":["../../../src/components/stepper/StepperStepBullet.tsx"],"sourcesContent":["import { styled } from '~/stitches'\n\nimport { Flex } from '../flex'\n\nexport const StepperStepBullet = styled(Flex, {\n  position: 'relative',\n  p: '$2',\n  justifyContent: 'center',\n  alignItems: 'center',\n  size: '$3',\n  borderRadius: '50%',\n  border: 'none',\n  bg: '$tonal100',\n  zIndex: 1,\n  flex: 'none',\n  variants: {\n    status: {\n      default: { bg: '$tonal100', color: '$tonal300' },\n      active: {\n        bg: 'white',\n        color: '$primaryMid',\n        border: '2px solid',\n        borderColor: 'currentColor'\n      },\n      viewed: {\n        bg: 'white',\n        border: '2px solid $tonal200',\n        color: '$tonal600'\n      },\n      completed: { bg: '$primary', color: 'white' },\n      reviewed: { bg: '$primaryMid', color: 'white' },\n      success: { bg: '$success', color: 'white' }\n    }\n  }\n})\n"],"names":["StepperStepBullet","styled","Flex"],"mappings":"kFAIa,MAAAA,EAAoBC,EAAOC,EAAM,CAC5C,SAAU,WACV,EAAG,KACH,eAAgB,SAChB,WAAY,SACZ,KAAM,KACN,aAAc,MACd,OAAQ,OACR,GAAI,YACJ,OAAQ,EACR,KAAM,OACN,SAAU,CACR,OAAQ,CACN,QAAS,CAAE,GAAI,YAAa,MAAO,WAAY,EAC/C,OAAQ,CACN,GAAI,QACJ,MAAO,cACP,OAAQ,YACR,YAAa,cACf,EACA,OAAQ,CACN,GAAI,QACJ,OAAQ,sBACR,MAAO,WACT,EACA,UAAW,CAAE,GAAI,WAAY,MAAO,OAAQ,EAC5C,SAAU,CAAE,GAAI,cAAe,MAAO,OAAQ,EAC9C,QAAS,CAAE,GAAI,WAAY,MAAO,OAAQ,CAC5C,CACF,CACF,CAAC"}

package/dist/components/stepper/StepperStepContainer.d.ts

@@ -21,6 +21,42 @@ export declare const StepperStepContainer: import("@stitches/react/types/styled-
         textPlaceholder: any;
         background: any;
         backgroundAccent: any;
+        grey100: any;
+        grey200: any;
+        grey300: any;
+        grey400: any;
+        grey500: any;
+        grey600: any;
+        grey700: any;
+        grey800: any;
+        grey900: any;
+        grey1000: any;
+        grey1100: any;
+        grey1200: any;
+        blue100: any;
+        blue200: any;
+        blue300: any;
+        blue400: any;
+        blue500: any;
+        blue600: any;
+        blue700: any;
+        blue800: any;
+        blue900: any;
+        blue1000: any;
+        blue1100: any;
+        blue1200: any;
+        purple100: any;
+        purple200: any;
+        purple300: any;
+        purple400: any;
+        purple500: any;
+        purple600: any;
+        purple700: any;
+        purple800: any;
+        purple900: any;
+        purple1000: any;
+        purple1100: any;
+        purple1200: any;
         tonal50: any;
         tonal100: any;
         tonal200: any;
@@ -78,6 +114,7 @@ export declare const StepperStepContainer: import("@stitches/react/types/styled-
         "7": any;
         "8": any;
         "9": any;
+        "24": any;
     };
     fontSizes: {
         xs: any;
@@ -201,6 +238,42 @@ export declare const StepperStepContainer: import("@stitches/react/types/styled-
         textPlaceholder: any;
         background: any;
         backgroundAccent: any;
+        grey100: any;
+        grey200: any;
+        grey300: any;
+        grey400: any;
+        grey500: any;
+        grey600: any;
+        grey700: any;
+        grey800: any;
+        grey900: any;
+        grey1000: any;
+        grey1100: any;
+        grey1200: any;
+        blue100: any;
+        blue200: any;
+        blue300: any;
+        blue400: any;
+        blue500: any;
+        blue600: any;
+        blue700: any;
+        blue800: any;
+        blue900: any;
+        blue1000: any;
+        blue1100: any;
+        blue1200: any;
+        purple100: any;
+        purple200: any;
+        purple300: any;
+        purple400: any;
+        purple500: any;
+        purple600: any;
+        purple700: any;
+        purple800: any;
+        purple900: any;
+        purple1000: any;
+        purple1100: any;
+        purple1200: any;
         tonal50: any;
         tonal100: any;
         tonal200: any;
@@ -258,6 +331,7 @@ export declare const StepperStepContainer: import("@stitches/react/types/styled-
         "7": any;
         "8": any;
         "9": any;
+        "24": any;
     };
     fontSizes: {
         xs: any;

package/dist/components/stepper/StepperStepContainer.js

@@ -1 +1,2 @@
 import{styled as t}from"../../stitches.js";import{Flex as i}from"../flex/Flex.js";const o=t(i,{position:"relative",fontFamily:"$body",fontWeight:600,fontSize:"$md",alignItems:"center","&:not(:last-child)::after":{content:"",position:"absolute"},"&:focus-visible":{outline:"none"},variants:{canInteract:{true:{}},direction:{vertical:{py:"$3",flexDirection:"row","&:not(:last-child)::after":{height:"100%",width:"4px",left:"14px",top:"50%"}},horizontal:{px:"$2",flexDirection:"column","&:not(:last-child)::after":{width:"100%",height:"4px",left:"50%",top:"14px"}}},separator:{default:{"&:not(:last-child)::after":{bg:"$tonal100"}},active:{"&:not(:last-child)::after":{bg:"$primary"}},success:{"&:not(:last-child)::after":{bg:"$success"}},viewed:{"&:not(:last-child)::after":{bg:"$tonal200"}}},status:{completed:{},active:{},default:{},viewed:{},success:{},reviewed:{}}},compoundVariants:[{canInteract:!0,status:"completed",css:{"&:hover":{"& :first-child":{bg:"$primaryMid",color:"white !important"},"& :last-child":{color:"$primaryMid"}},"&:focus-visible":{"& :first-child":{outline:"2px solid $primary",outlineOffset:"2px"}}}},{canInteract:!0,status:"active",css:{"&:hover":{"& :first-child":{borderColor:"$tonal400",color:"$tonal600"},"& :last-child":{color:"$tonal600"}},"&:focus-visible":{"& :first-child":{outline:"2px solid $primary",outlineOffset:"2px"}}}},{canInteract:!0,status:"viewed",css:{"&:hover":{"& :first-child":{borderColor:"$tonal400",color:"$tonal600"},"& :last-child":{color:"$tonal600"}},"&:focus-visible":{"& :first-child":{outline:"2px solid $primary !important",outlineOffset:"2px !important"}}}},{canInteract:!0,status:"reviewed",css:{"&:focus-visible":{"& :first-child":{outline:"2px solid $primary !important",outlineOffset:"2px !important"}}}}]});export{o as StepperStepContainer};
+//# sourceMappingURL=StepperStepContainer.js.map

package/dist/components/stepper/StepperStepContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepperStepContainer.js","sources":["../../../src/components/stepper/StepperStepContainer.tsx"],"sourcesContent":["import { styled } from '~/stitches'\n\nimport { Flex } from '../flex'\n\nexport const StepperStepContainer = styled(Flex, {\n  position: 'relative',\n  fontFamily: '$body',\n  fontWeight: 600,\n  fontSize: '$md',\n  alignItems: 'center',\n  '&:not(:last-child)::after': {\n    content: '',\n    position: 'absolute'\n  },\n  '&:focus-visible': {\n    outline: 'none'\n  },\n  variants: {\n    canInteract: { true: {} },\n    direction: {\n      vertical: {\n        py: '$3',\n        flexDirection: 'row',\n        '&:not(:last-child)::after': {\n          height: '100%',\n          width: '4px',\n          left: '14px',\n          top: '50%'\n        }\n      },\n      horizontal: {\n        px: '$2',\n        flexDirection: 'column',\n        '&:not(:last-child)::after': {\n          width: '100%',\n          height: '4px',\n          left: '50%',\n          top: '14px'\n        }\n      }\n    },\n    separator: {\n      default: { '&:not(:last-child)::after': { bg: '$tonal100' } },\n      active: { '&:not(:last-child)::after': { bg: '$primary' } },\n      success: { '&:not(:last-child)::after': { bg: '$success' } },\n      viewed: { '&:not(:last-child)::after': { bg: '$tonal200' } }\n    },\n    status: {\n      completed: {},\n      active: {},\n      default: {},\n      viewed: {},\n      success: {},\n      reviewed: {}\n    }\n  },\n  compoundVariants: [\n    {\n      canInteract: true,\n      status: 'completed',\n      css: {\n        '&:hover': {\n          '& :first-child': { bg: '$primaryMid', color: 'white !important' },\n          '& :last-child': { color: '$primaryMid' }\n        },\n        '&:focus-visible': {\n          '& :first-child': {\n            outline: '2px solid $primary',\n            outlineOffset: '2px'\n          }\n        }\n      }\n    },\n    {\n      canInteract: true,\n      status: 'active',\n      css: {\n        '&:hover': {\n          '& :first-child': { borderColor: '$tonal400', color: '$tonal600' },\n          '& :last-child': { color: '$tonal600' }\n        },\n        '&:focus-visible': {\n          '& :first-child': {\n            outline: '2px solid $primary',\n            outlineOffset: '2px'\n          }\n        }\n      }\n    },\n    {\n      canInteract: true,\n      status: 'viewed',\n      css: {\n        '&:hover': {\n          '& :first-child': { borderColor: '$tonal400', color: '$tonal600' },\n          '& :last-child': { color: '$tonal600' }\n        },\n        '&:focus-visible': {\n          '& :first-child': {\n            outline: '2px solid $primary !important',\n            outlineOffset: '2px !important'\n          }\n        }\n      }\n    },\n    {\n      canInteract: true,\n      status: 'reviewed',\n      css: {\n        '&:focus-visible': {\n          '& :first-child': {\n            outline: '2px solid $primary !important',\n            outlineOffset: '2px !important'\n          }\n        }\n      }\n    }\n  ]\n})\n"],"names":["StepperStepContainer","styled","Flex"],"mappings":"kFAIO,MAAMA,EAAuBC,EAAOC,EAAM,CAC/C,SAAU,WACV,WAAY,QACZ,WAAY,IACZ,SAAU,MACV,WAAY,SACZ,4BAA6B,CAC3B,QAAS,GACT,SAAU,UACZ,EACA,kBAAmB,CACjB,QAAS,MACX,EACA,SAAU,CACR,YAAa,CAAE,KAAM,EAAG,EACxB,UAAW,CACT,SAAU,CACR,GAAI,KACJ,cAAe,MACf,4BAA6B,CAC3B,OAAQ,OACR,MAAO,MACP,KAAM,OACN,IAAK,KACP,CACF,EACA,WAAY,CACV,GAAI,KACJ,cAAe,SACf,4BAA6B,CAC3B,MAAO,OACP,OAAQ,MACR,KAAM,MACN,IAAK,MACP,CACF,CACF,EACA,UAAW,CACT,QAAS,CAAE,4BAA6B,CAAE,GAAI,WAAY,CAAE,EAC5D,OAAQ,CAAE,4BAA6B,CAAE,GAAI,UAAW,CAAE,EAC1D,QAAS,CAAE,4BAA6B,CAAE,GAAI,UAAW,CAAE,EAC3D,OAAQ,CAAE,4BAA6B,CAAE,GAAI,WAAY,CAAE,CAC7D,EACA,OAAQ,CACN,UAAW,GACX,OAAQ,CAAA,EACR,QAAS,CACT,EAAA,OAAQ,CAAA,EACR,QAAS,CAAC,EACV,SAAU,EACZ,CACF,EACA,iBAAkB,CAChB,CACE,YAAa,GACb,OAAQ,YACR,IAAK,CACH,UAAW,CACT,iBAAkB,CAAE,GAAI,cAAe,MAAO,kBAAmB,EACjE,gBAAiB,CAAE,MAAO,aAAc,CAC1C,EACA,kBAAmB,CACjB,iBAAkB,CAChB,QAAS,qBACT,cAAe,KACjB,CACF,CACF,CACF,EACA,CACE,YAAa,GACb,OAAQ,SACR,IAAK,CACH,UAAW,CACT,iBAAkB,CAAE,YAAa,YAAa,MAAO,WAAY,EACjE,gBAAiB,CAAE,MAAO,WAAY,CACxC,EACA,kBAAmB,CACjB,iBAAkB,CAChB,QAAS,qBACT,cAAe,KACjB,CACF,CACF,CACF,EACA,CACE,YAAa,GACb,OAAQ,SACR,IAAK,CACH,UAAW,CACT,iBAAkB,CAAE,YAAa,YAAa,MAAO,WAAY,EACjE,gBAAiB,CAAE,MAAO,WAAY,CACxC,EACA,kBAAmB,CACjB,iBAAkB,CAChB,QAAS,gCACT,cAAe,gBACjB,CACF,CACF,CACF,EACA,CACE,YAAa,GACb,OAAQ,WACR,IAAK,CACH,kBAAmB,CACjB,iBAAkB,CAChB,QAAS,gCACT,cAAe,gBACjB,CACF,CACF,CACF,CACF,CACF,CAAC"}

package/dist/components/stepper/StepperStepForward.js

@@ -1 +1,2 @@
 import*as n from"react";import{Button as p}from"../button/Button.js";import{useStepper as m}from"./stepper-context/StepperContext.js";const c=({label:e,children:r,onClick:o,...i})=>{const{goToNextStep:t,activeStep:l}=m();return n.createElement(p,{size:"sm",...i,onClick:()=>{if(o)return o(t);t==null||t()},css:{ml:"auto"}},r||(e==null?void 0:e(l)))};export{c as StepperStepForward};
+//# sourceMappingURL=StepperStepForward.js.map

package/dist/components/stepper/StepperStepForward.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepperStepForward.js","sources":["../../../src/components/stepper/StepperStepForward.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Button } from '../button'\nimport { useStepper } from './stepper-context/StepperContext'\nimport { IStepperNavigateProps } from './types'\n\nexport const StepperStepForward: React.FC<\n  IStepperNavigateProps & Omit<React.ComponentProps<typeof Button>, 'children'>\n> = ({ label, children, onClick, ...rest }) => {\n  const { goToNextStep, activeStep } = useStepper()\n\n  const handleClick = () => {\n    if (onClick) {\n      return onClick(goToNextStep)\n    }\n    goToNextStep?.()\n  }\n\n  return (\n    <Button size=\"sm\" {...rest} onClick={handleClick} css={{ ml: 'auto' }}>\n      {children || label?.(activeStep)}\n    </Button>\n  )\n}\n"],"names":["StepperStepForward","label","children","onClick","rest","goToNextStep","activeStep","useStepper","React","Button"],"mappings":"sIAMa,MAAAA,EAET,CAAC,CAAE,MAAAC,EAAO,SAAAC,EAAU,QAAAC,KAAYC,CAAK,IAAM,CAC7C,KAAM,CAAE,aAAAC,EAAc,WAAAC,CAAW,EAAIC,EAAW,EAShD,OACEC,EAAA,cAACC,EAAA,CAAO,KAAK,KAAM,GAAGL,EAAM,QARV,IAAM,CACxB,GAAID,EACF,OAAOA,EAAQE,CAAY,EAE7BA,GAAA,MAAAA,GACF,EAGoD,IAAK,CAAE,GAAI,MAAO,CAAA,EACjEH,IAAYD,GAAA,KAAAA,OAAAA,EAAQK,GACvB,CAEJ"}

package/dist/components/stepper/StepperStepLabel.d.ts

@@ -28,6 +28,42 @@ export declare const StepperStepLabel: import("@stitches/react/types/styled-comp
             textPlaceholder: any;
             background: any;
             backgroundAccent: any;
+            grey100: any;
+            grey200: any;
+            grey300: any;
+            grey400: any;
+            grey500: any;
+            grey600: any;
+            grey700: any;
+            grey800: any;
+            grey900: any;
+            grey1000: any;
+            grey1100: any;
+            grey1200: any;
+            blue100: any;
+            blue200: any;
+            blue300: any;
+            blue400: any;
+            blue500: any;
+            blue600: any;
+            blue700: any;
+            blue800: any;
+            blue900: any;
+            blue1000: any;
+            blue1100: any;
+            blue1200: any;
+            purple100: any;
+            purple200: any;
+            purple300: any;
+            purple400: any;
+            purple500: any;
+            purple600: any;
+            purple700: any;
+            purple800: any;
+            purple900: any;
+            purple1000: any;
+            purple1100: any;
+            purple1200: any;
             tonal50: any;
             tonal100: any;
             tonal200: any;
@@ -85,6 +121,7 @@ export declare const StepperStepLabel: import("@stitches/react/types/styled-comp
             "7": any;
             "8": any;
             "9": any;
+            "24": any;
         };
         fontSizes: {
             xs: any;
@@ -209,6 +246,42 @@ export declare const StepperStepLabel: import("@stitches/react/types/styled-comp
         textPlaceholder: any;
         background: any;
         backgroundAccent: any;
+        grey100: any;
+        grey200: any;
+        grey300: any;
+        grey400: any;
+        grey500: any;
+        grey600: any;
+        grey700: any;
+        grey800: any;
+        grey900: any;
+        grey1000: any;
+        grey1100: any;
+        grey1200: any;
+        blue100: any;
+        blue200: any;
+        blue300: any;
+        blue400: any;
+        blue500: any;
+        blue600: any;
+        blue700: any;
+        blue800: any;
+        blue900: any;
+        blue1000: any;
+        blue1100: any;
+        blue1200: any;
+        purple100: any;
+        purple200: any;
+        purple300: any;
+        purple400: any;
+        purple500: any;
+        purple600: any;
+        purple700: any;
+        purple800: any;
+        purple900: any;
+        purple1000: any;
+        purple1100: any;
+        purple1200: any;
         tonal50: any;
         tonal100: any;
         tonal200: any;
@@ -266,6 +339,7 @@ export declare const StepperStepLabel: import("@stitches/react/types/styled-comp
         "7": any;
         "8": any;
         "9": any;
+        "24": any;
     };
     fontSizes: {
         xs: any;

package/dist/components/stepper/StepperStepLabel.js

@@ -1 +1,2 @@
 import{styled as t}from"../../stitches.js";import{Text as e}from"../text/Text.js";const o=t(e,{fontWeight:600,variants:{direction:{vertical:{ml:"$3",textAlign:"left"},horizontal:{mt:"$3",textAlign:"center"}},status:{default:{color:"$tonal300",fontWeight:400},active:{color:"$primaryMid"},viewed:{color:"$tonal600"},completed:{color:"$primary"},success:{color:"$success"},reviewed:{}}}});export{o as StepperStepLabel};
+//# sourceMappingURL=StepperStepLabel.js.map

package/dist/components/stepper/StepperStepLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepperStepLabel.js","sources":["../../../src/components/stepper/StepperStepLabel.tsx"],"sourcesContent":["import { styled } from '~/stitches'\n\nimport { Text } from '../text'\n\nexport const StepperStepLabel = styled(Text, {\n  fontWeight: 600,\n  variants: {\n    direction: {\n      vertical: { ml: '$3', textAlign: 'left' },\n      horizontal: { mt: '$3', textAlign: 'center' }\n    },\n    status: {\n      default: { color: '$tonal300', fontWeight: 400 },\n      active: {\n        color: '$primaryMid'\n      },\n      viewed: { color: '$tonal600' },\n      completed: { color: '$primary' },\n      success: { color: '$success' },\n      reviewed: {}\n    }\n  }\n})\n"],"names":["StepperStepLabel","styled","Text"],"mappings":"kFAIO,MAAMA,EAAmBC,EAAOC,EAAM,CAC3C,WAAY,IACZ,SAAU,CACR,UAAW,CACT,SAAU,CAAE,GAAI,KAAM,UAAW,MAAO,EACxC,WAAY,CAAE,GAAI,KAAM,UAAW,QAAS,CAC9C,EACA,OAAQ,CACN,QAAS,CAAE,MAAO,YAAa,WAAY,GAAI,EAC/C,OAAQ,CACN,MAAO,aACT,EACA,OAAQ,CAAE,MAAO,WAAY,EAC7B,UAAW,CAAE,MAAO,UAAW,EAC/B,QAAS,CAAE,MAAO,UAAW,EAC7B,SAAU,CAAA,CACZ,CACF,CACF,CAAC"}

package/dist/components/stepper/StepperSteps.js

@@ -1 +1,2 @@
 import{Ok as h}from"@atom-learning/icons";import*as n from"react";import{styled as b}from"../../stitches.js";import{Flex as v}from"../flex/Flex.js";import{Icon as D}from"../icon/Icon.js";import{useStepper as I}from"./stepper-context/StepperContext.js";import{StepperStepBullet as g}from"./StepperStepBullet.js";import{StepperStepContainer as T}from"./StepperStepContainer.js";import{StepperStepLabel as w}from"./StepperStepLabel.js";import{Status as t}from"./types.js";const L=b(v,{justifyContent:"space-between",variants:{direction:{vertical:{flexDirection:"column"},horizontal:{flexDirection:"row"}}}}),U=({css:S})=>{const{steps:i,goToStep:m,activeStep:r,viewedSteps:a,allowSkip:l,direction:c,hideLabels:E,completedSteps:p,showCompletedIcons:u}=I(),d=o=>{const e=i[o];return e.status?e.status:p.length===i.length?t.SUCCESS:r===o&&p.includes(r)?t.REVIEWED:r===o?t.ACTIVE:p.includes(o)?t.COMPLETED:a.includes(o)?t.VIEWED:t.DEFAULT},C=o=>{var e;const s=(e=i[o])==null?void 0:e.status;return p.length===i.length?t.SUCCESS:s===t.SUCCESS?t.SUCCESS:s===t.COMPLETED||o<Math.max(...a)?t.ACTIVE:s===t.VIEWED?t.VIEWED:t.DEFAULT};return n.createElement(L,{css:S,direction:c},i.map((o,e)=>{const s=d(e),f=C(e);return n.createElement(T,{tabIndex:0,key:`step_${e}`,direction:c,separator:f,status:s,css:c==="horizontal"?{width:`calc(100% / ${i.length})`}:{height:`calc(100% / ${i.length})`},canInteract:l},n.createElement(g,{as:l?"button":"div",onClick:()=>l&&a.includes(e)?m==null?void 0:m(e):void 0,status:s,"aria-current":e===r?"step":void 0,"aria-label":o.label?"":`step ${e+1}`,"aria-labelledby":o.label?`step-${e}`:void 0,css:{cursor:l&&a.includes(e)?"pointer":"auto"}},o.status===t.SUCCESS||u&&s===t.COMPLETED?n.createElement(D,{is:h}):e+1),o.label&&!E&&n.createElement(w,{as:"span",id:`step-${e}`,direction:c,status:s},o.label))}))};export{U as StepperSteps};
+//# sourceMappingURL=StepperSteps.js.map

package/dist/components/stepper/StepperSteps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepperSteps.js","sources":["../../../src/components/stepper/StepperSteps.tsx"],"sourcesContent":["import { Ok } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Flex } from '../flex'\nimport { Icon } from '../icon'\nimport { useStepper } from './stepper-context/StepperContext'\nimport { StepperStepBullet } from './StepperStepBullet'\nimport { StepperStepContainer } from './StepperStepContainer'\nimport { StepperStepLabel } from './StepperStepLabel'\nimport { IStepperStepsProps, Status } from './types'\n\nconst StepperStepsContainer = styled(Flex, {\n  justifyContent: 'space-between',\n  variants: {\n    direction: {\n      vertical: { flexDirection: 'column' },\n      horizontal: { flexDirection: 'row' }\n    }\n  }\n})\n\nexport const StepperSteps: React.FC<IStepperStepsProps> = ({ css }) => {\n  const {\n    steps,\n    goToStep,\n    activeStep,\n    viewedSteps,\n    allowSkip,\n    direction,\n    hideLabels,\n    completedSteps,\n    showCompletedIcons\n  } = useStepper()\n\n  const getBulletStatus = (index: number) => {\n    const activeBullet = steps[index]\n\n    if (activeBullet.status) return activeBullet.status\n    if (completedSteps.length === steps.length) return Status.SUCCESS\n    if (activeStep === index && completedSteps.includes(activeStep))\n      return Status.REVIEWED\n    if (activeStep === index) return Status.ACTIVE\n    if (completedSteps.includes(index)) return Status.COMPLETED\n    if (viewedSteps.includes(index)) return Status.VIEWED\n    return Status.DEFAULT\n  }\n\n  const getSeparatorStatus = (index: number) => {\n    const bulletStatus = steps[index]?.status\n\n    if (completedSteps.length === steps.length) {\n      return Status.SUCCESS\n    }\n\n    if (bulletStatus === Status.SUCCESS) {\n      return Status.SUCCESS\n    }\n\n    if (bulletStatus === Status.COMPLETED || index < Math.max(...viewedSteps)) {\n      return Status.ACTIVE\n    }\n\n    if (bulletStatus === Status.VIEWED) {\n      return Status.VIEWED\n    }\n\n    return Status.DEFAULT\n  }\n\n  return (\n    <StepperStepsContainer css={css} direction={direction}>\n      {steps.map((step, index) => {\n        const bulletStatus = getBulletStatus(index)\n        const separatorStatus = getSeparatorStatus(index)\n\n        return (\n          <StepperStepContainer\n            tabIndex={0}\n            key={`step_${index}`}\n            direction={direction}\n            separator={separatorStatus}\n            status={bulletStatus}\n            css={\n              direction === 'horizontal'\n                ? { width: `calc(100% / ${steps.length})` }\n                : { height: `calc(100% / ${steps.length})` }\n            }\n            canInteract={allowSkip}\n          >\n            <StepperStepBullet\n              as={allowSkip ? 'button' : 'div'}\n              onClick={() =>\n                allowSkip && viewedSteps.includes(index)\n                  ? goToStep?.(index)\n                  : undefined\n              }\n              status={bulletStatus}\n              aria-current={index === activeStep ? 'step' : undefined}\n              aria-label={!step.label ? `step ${index + 1}` : ''}\n              aria-labelledby={step.label ? `step-${index}` : undefined}\n              css={{\n                cursor:\n                  allowSkip && viewedSteps.includes(index) ? 'pointer' : 'auto'\n              }}\n            >\n              {step.status === Status.SUCCESS ||\n              (showCompletedIcons && bulletStatus === Status.COMPLETED) ? (\n                <Icon is={Ok} />\n              ) : (\n                index + 1\n              )}\n            </StepperStepBullet>\n\n            {step.label && !hideLabels && (\n              <StepperStepLabel\n                as=\"span\"\n                id={`step-${index}`}\n                direction={direction}\n                status={bulletStatus}\n              >\n                {step.label}\n              </StepperStepLabel>\n            )}\n          </StepperStepContainer>\n        )\n      })}\n    </StepperStepsContainer>\n  )\n}\n"],"names":["StepperStepsContainer","styled","Flex","StepperSteps","css","steps","goToStep","activeStep","viewedSteps","allowSkip","direction","hideLabels","completedSteps","showCompletedIcons","useStepper","getBulletStatus","index","activeBullet","Status","getSeparatorStatus","_a","bulletStatus","React","step","separatorStatus","StepperStepContainer","StepperStepBullet","Icon","Ok","StepperStepLabel"],"mappings":"qdAaA,MAAMA,EAAwBC,EAAOC,EAAM,CACzC,eAAgB,gBAChB,SAAU,CACR,UAAW,CACT,SAAU,CAAE,cAAe,QAAS,EACpC,WAAY,CAAE,cAAe,KAAM,CACrC,CACF,CACF,CAAC,EAEYC,EAA6C,CAAC,CAAE,IAAAC,CAAI,IAAM,CACrE,KAAM,CACJ,MAAAC,EACA,SAAAC,EACA,WAAAC,EACA,YAAAC,EACA,UAAAC,EACA,UAAAC,EACA,WAAAC,EACA,eAAAC,EACA,mBAAAC,CACF,EAAIC,EAAW,EAETC,EAAmBC,GAAkB,CACzC,MAAMC,EAAeZ,EAAMW,GAE3B,OAAIC,EAAa,OAAeA,EAAa,OACzCL,EAAe,SAAWP,EAAM,OAAea,EAAO,QACtDX,IAAeS,GAASJ,EAAe,SAASL,CAAU,EACrDW,EAAO,SACZX,IAAeS,EAAcE,EAAO,OACpCN,EAAe,SAASI,CAAK,EAAUE,EAAO,UAC9CV,EAAY,SAASQ,CAAK,EAAUE,EAAO,OACxCA,EAAO,OAChB,EAEMC,EAAsBH,GAAkB,CAjDhD,IAAAI,EAkDI,MAAMC,GAAeD,EAAAf,EAAMW,KAAN,KAAA,OAAAI,EAAc,OAEnC,OAAIR,EAAe,SAAWP,EAAM,OAC3Ba,EAAO,QAGZG,IAAiBH,EAAO,QACnBA,EAAO,QAGZG,IAAiBH,EAAO,WAAaF,EAAQ,KAAK,IAAI,GAAGR,CAAW,EAC/DU,EAAO,OAGZG,IAAiBH,EAAO,OACnBA,EAAO,OAGTA,EAAO,OAChB,EAEA,OACEI,EAAA,cAACtB,EAAA,CAAsB,IAAKI,EAAK,UAAWM,CAAAA,EACzCL,EAAM,IAAI,CAACkB,EAAMP,IAAU,CAC1B,MAAMK,EAAeN,EAAgBC,CAAK,EACpCQ,EAAkBL,EAAmBH,CAAK,EAEhD,OACEM,EAAA,cAACG,EAAA,CACC,SAAU,EACV,IAAK,QAAQT,IACb,UAAWN,EACX,UAAWc,EACX,OAAQH,EACR,IACEX,IAAc,aACV,CAAE,MAAO,eAAeL,EAAM,SAAU,EACxC,CAAE,OAAQ,eAAeA,EAAM,SAAU,EAE/C,YAAaI,CAEba,EAAAA,EAAA,cAACI,EAAA,CACC,GAAIjB,EAAY,SAAW,MAC3B,QAAS,IACPA,GAAaD,EAAY,SAASQ,CAAK,EACnCV,GAAA,KAAA,OAAAA,EAAWU,CACX,EAAA,OAEN,OAAQK,EACR,eAAcL,IAAUT,EAAa,OAAS,OAC9C,aAAagB,EAAK,MAA8B,GAAtB,QAAQP,EAAQ,IAC1C,kBAAiBO,EAAK,MAAQ,QAAQP,IAAU,OAChD,IAAK,CACH,OACEP,GAAaD,EAAY,SAASQ,CAAK,EAAI,UAAY,MAC3D,CAECO,EAAAA,EAAK,SAAWL,EAAO,SACvBL,GAAsBQ,IAAiBH,EAAO,UAC7CI,EAAA,cAACK,EAAA,CAAK,GAAIC,EAAI,EAEdZ,EAAQ,CAEZ,EAECO,EAAK,OAAS,CAACZ,GACdW,EAAA,cAACO,EAAA,CACC,GAAG,OACH,GAAI,QAAQb,IACZ,UAAWN,EACX,OAAQW,GAEPE,EAAK,KACR,CAEJ,CAEJ,CAAC,CACH,CAEJ"}

package/dist/components/stepper/stepper-context/StepperContext.js

@@ -1 +1,2 @@
 import*as o from"react";const d=o.createContext({steps:[],goToPreviousStep:()=>null,goToNextStep:()=>null,goToStep:()=>null,activeStep:0,viewedSteps:[],allowSkip:!1,direction:"horizontal",hideLabels:!1,completedSteps:[],showCompletedIcons:!1}),b=({children:s,stepCount:i,allowSkip:S,onComplete:p,onStepChange:l,direction:a,steps:h,hideLabels:v,showCompletedIcons:w})=>{const[e,r]=o.useState(0),[m,g]=o.useState([0]),[C,f]=o.useState([]),c=!i;o.useEffect(()=>{g(t=>t.includes(e)?t:[...t,e]),l==null||l(e)},[e,l]);const T=()=>{const t=p&&e===i-1,u=e<i-1;if((p||u)&&f(n=>n.includes(e)?n:[...n,e]),t)return p==null?void 0:p();if(u)return r(n=>n+1)},x=()=>{r(t=>t-1)},P=t=>{r(t)};return o.createElement(d.Provider,{value:{steps:h||Array(i).fill(""),goToPreviousStep:c?void 0:x,goToNextStep:c?void 0:T,goToStep:c?void 0:P,activeStep:e,viewedSteps:m,completedSteps:C,allowSkip:S,direction:a,hideLabels:v,showCompletedIcons:w}},s)},E=()=>{const s=o.useContext(d);if(!s)throw new Error("Ensure that you wrap any components with the root component Stepper");return s};export{b as StepperProvider,E as useStepper};
+//# sourceMappingURL=StepperContext.js.map

package/dist/components/stepper/stepper-context/StepperContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StepperContext.js","sources":["../../../../src/components/stepper/stepper-context/StepperContext.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Context, StepperProviderProps } from '../types'\n\nconst StepperContext = React.createContext<Context>({\n  steps: [],\n  goToPreviousStep: () => null,\n  goToNextStep: () => null,\n  goToStep: () => null,\n  activeStep: 0,\n  viewedSteps: [],\n  allowSkip: false,\n  direction: 'horizontal',\n  hideLabels: false,\n  completedSteps: [],\n  showCompletedIcons: false\n})\n\nexport const StepperProvider: React.FC<StepperProviderProps> = ({\n  children,\n  stepCount,\n  allowSkip,\n  onComplete,\n  onStepChange,\n  direction,\n  steps,\n  hideLabels,\n  showCompletedIcons\n}) => {\n  const [activeStep, setActiveStep] = React.useState(0)\n\n  const [viewedSteps, setviewedSteps] = React.useState<number[]>([0])\n  const [completedSteps, setCompletedSteps] = React.useState<number[]>([])\n\n  const isControlled = !stepCount\n\n  React.useEffect(() => {\n    setviewedSteps((prev) =>\n      prev.includes(activeStep) ? prev : [...prev, activeStep]\n    )\n\n    onStepChange?.(activeStep)\n  }, [activeStep, onStepChange])\n\n  const goToNextStep = () => {\n    const isCompleted = onComplete && activeStep === stepCount - 1\n    const isNextStep = activeStep < stepCount - 1\n\n    if (onComplete || isNextStep) {\n      setCompletedSteps((prev) =>\n        prev.includes(activeStep) ? prev : [...prev, activeStep]\n      )\n    }\n\n    if (isCompleted) {\n      return onComplete?.()\n    }\n    if (isNextStep) {\n      return setActiveStep((current) => current + 1)\n    }\n  }\n\n  const goToPreviousStep = () => {\n    setActiveStep((current) => current - 1)\n  }\n\n  const goToStep = (index: number) => {\n    setActiveStep(index)\n  }\n\n  return (\n    <StepperContext.Provider\n      value={{\n        steps: steps || Array(stepCount).fill(''),\n        goToPreviousStep: isControlled ? undefined : goToPreviousStep,\n        goToNextStep: isControlled ? undefined : goToNextStep,\n        goToStep: isControlled ? undefined : goToStep,\n        activeStep,\n        viewedSteps,\n        completedSteps,\n        allowSkip,\n        direction,\n        hideLabels,\n        showCompletedIcons\n      }}\n    >\n      {children}\n    </StepperContext.Provider>\n  )\n}\n\nexport const useStepper = (): Context => {\n  const context = React.useContext(StepperContext)\n  if (!context)\n    throw new Error(\n      'Ensure that you wrap any components with the root component Stepper'\n    )\n\n  return context\n}\n"],"names":["StepperContext","React","StepperProvider","children","stepCount","allowSkip","onComplete","onStepChange","direction","steps","hideLabels","showCompletedIcons","activeStep","setActiveStep","viewedSteps","setviewedSteps","completedSteps","setCompletedSteps","isControlled","prev","goToNextStep","isCompleted","isNextStep","current","goToPreviousStep","goToStep","index","useStepper","context"],"mappings":"wBAIA,MAAMA,EAAiBC,EAAM,cAAuB,CAClD,MAAO,CAAA,EACP,iBAAkB,IAAM,KACxB,aAAc,IAAM,KACpB,SAAU,IAAM,KAChB,WAAY,EACZ,YAAa,CAAC,EACd,UAAW,GACX,UAAW,aACX,WAAY,GACZ,eAAgB,CAAC,EACjB,mBAAoB,EACtB,CAAC,EAEYC,EAAkD,CAAC,CAC9D,SAAAC,EACA,UAAAC,EACA,UAAAC,EACA,WAAAC,EACA,aAAAC,EACA,UAAAC,EACA,MAAAC,EACA,WAAAC,EACA,mBAAAC,CACF,IAAM,CACJ,KAAM,CAACC,EAAYC,CAAa,EAAIZ,EAAM,SAAS,CAAC,EAE9C,CAACa,EAAaC,CAAc,EAAId,EAAM,SAAmB,CAAC,CAAC,CAAC,EAC5D,CAACe,EAAgBC,CAAiB,EAAIhB,EAAM,SAAmB,CAAE,CAAA,EAEjEiB,EAAe,CAACd,EAEtBH,EAAM,UAAU,IAAM,CACpBc,EAAgBI,GACdA,EAAK,SAASP,CAAU,EAAIO,EAAO,CAAC,GAAGA,EAAMP,CAAU,CACzD,EAEAL,GAAA,MAAAA,EAAeK,CAAAA,CACjB,EAAG,CAACA,EAAYL,CAAY,CAAC,EAE7B,MAAMa,EAAe,IAAM,CACzB,MAAMC,EAAcf,GAAcM,IAAeR,EAAY,EACvDkB,EAAaV,EAAaR,EAAY,EAQ5C,IANIE,GAAcgB,IAChBL,EAAmBE,GACjBA,EAAK,SAASP,CAAU,EAAIO,EAAO,CAAC,GAAGA,EAAMP,CAAU,CACzD,EAGES,EACF,OAAOf,GAAA,YAAAA,EAET,EAAA,GAAIgB,EACF,OAAOT,EAAeU,GAAYA,EAAU,CAAC,CAEjD,EAEMC,EAAmB,IAAM,CAC7BX,EAAeU,GAAYA,EAAU,CAAC,CACxC,EAEME,EAAYC,GAAkB,CAClCb,EAAca,CAAK,CACrB,EAEA,OACEzB,EAAA,cAACD,EAAe,SAAf,CACC,MAAO,CACL,MAAOS,GAAS,MAAML,CAAS,EAAE,KAAK,EAAE,EACxC,iBAAkBc,EAAe,OAAYM,EAC7C,aAAcN,EAAe,OAAYE,EACzC,SAAUF,EAAe,OAAYO,EACrC,WAAAb,EACA,YAAAE,EACA,eAAAE,EACA,UAAAX,EACA,UAAAG,EACA,WAAAE,EACA,mBAAAC,CACF,CAECR,EAAAA,CACH,CAEJ,EAEawB,EAAa,IAAe,CACvC,MAAMC,EAAU3B,EAAM,WAAWD,CAAc,EAC/C,GAAI,CAAC4B,EACH,MAAM,IAAI,MACR,qEACF,EAEF,OAAOA,CACT"}

package/dist/components/stepper/types.js

@@ -1 +1,2 @@
 var t=(E=>(E.ACTIVE="active",E.VIEWED="viewed",E.SUCCESS="success",E.DEFAULT="default",E.COMPLETED="completed",E.REVIEWED="reviewed",E))(t||{});export{t as Status};
+//# sourceMappingURL=types.js.map

package/dist/components/stepper/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":["../../../src/components/stepper/types.ts"],"sourcesContent":["import { CSS } from '~/stitches'\n\nexport enum Status {\n  ACTIVE = 'active',\n  VIEWED = 'viewed',\n  SUCCESS = 'success',\n  DEFAULT = 'default',\n  COMPLETED = 'completed',\n  REVIEWED = 'reviewed'\n}\nexport interface Step {\n  label?: string\n  status: `${Status}`\n}\n\nexport type Direction = 'vertical' | 'horizontal'\n\nexport type Context = {\n  steps: Step[]\n  goToPreviousStep?: () => void\n  goToNextStep?: () => void\n  goToStep?: (index: number) => void\n  activeStep: number\n  viewedSteps: number[]\n  completedSteps: number[]\n  allowSkip?: boolean\n  direction?: Direction\n  hideLabels: boolean\n  showCompletedIcons: boolean\n}\n\nexport type StepperProviderProps = {\n  stepCount: number\n  allowSkip?: boolean\n  onComplete?: () => void\n  onStepChange?: (activeStep: number) => void\n  direction?: Direction\n  steps: Step[]\n  hideLabels: boolean\n  showCompletedIcons: boolean\n}\n\nexport interface IStepperProps {\n  css?: CSS\n  stepCount?: number\n  allowSkip?: boolean\n  onComplete?: () => void\n  onStepChange?: (activeStep: number) => void\n  direction?: Direction\n  steps?: Step[]\n  hideLabels?: boolean\n  showCompletedIcons?: boolean\n}\n\nexport interface IStepperNavigateProps {\n  label?: (currentStep?: number) => string\n  onClick?: (next: () => void) => void\n}\n\nexport interface IStepperStepsProps {\n  css?: CSS\n}\n"],"names":["Status"],"mappings":"AAEY,IAAAA,GAAAA,IACVA,EAAA,OAAS,SACTA,EAAA,OAAS,SACTA,EAAA,QAAU,UACVA,EAAA,QAAU,UACVA,EAAA,UAAY,YACZA,EAAA,SAAW,WANDA,IAAAA,GAAA,CAAA,CAAA"}

package/dist/components/switch/Switch.d.ts

@@ -23,6 +23,42 @@ declare const StyledSwitch: import("@stitches/react/types/styled-component").Sty
         textPlaceholder: any;
         background: any;
         backgroundAccent: any;
+        grey100: any;
+        grey200: any;
+        grey300: any;
+        grey400: any;
+        grey500: any;
+        grey600: any;
+        grey700: any;
+        grey800: any;
+        grey900: any;
+        grey1000: any;
+        grey1100: any;
+        grey1200: any;
+        blue100: any;
+        blue200: any;
+        blue300: any;
+        blue400: any;
+        blue500: any;
+        blue600: any;
+        blue700: any;
+        blue800: any;
+        blue900: any;
+        blue1000: any;
+        blue1100: any;
+        blue1200: any;
+        purple100: any;
+        purple200: any;
+        purple300: any;
+        purple400: any;
+        purple500: any;
+        purple600: any;
+        purple700: any;
+        purple800: any;
+        purple900: any;
+        purple1000: any;
+        purple1100: any;
+        purple1200: any;
         tonal50: any;
         tonal100: any;
         tonal200: any;
@@ -80,6 +116,7 @@ declare const StyledSwitch: import("@stitches/react/types/styled-component").Sty
         "7": any;
         "8": any;
         "9": any;
+        "24": any;
     };
     fontSizes: {
         xs: any;

package/dist/components/switch/Switch.js

@@ -1 +1,2 @@
 import*as o from"@radix-ui/react-switch";import*as r from"react";import{styled as a}from"../../stitches.js";const n=a(o.Root,{appearance:"none",backgroundColor:"$tonal200",border:"none",borderRadius:"$round",cursor:"pointer",display:"flex",overflow:"hidden",p:"$0",position:"relative",transition:"all 50ms ease-out",width:"$4","&:hover":{backgroundColor:"$tonal300"},"&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},'&[data-state="checked"]':{backgroundColor:"$primary"},'&[data-state="checked"]:hover':{backgroundColor:"$primaryMid"}}),i=a(o.Thumb,{backgroundColor:"white",borderRadius:"$round",display:"block",size:"$1",transition:"transform 50ms",willChange:"transform",'&[data-state="checked"]':{transform:"translateX(calc($sizes$2 - $space$1))"}}),e=t=>r.createElement(n,{...t},r.createElement(i,null));e.displayName="Switch";export{e as Switch};
+//# sourceMappingURL=Switch.js.map

package/dist/components/switch/Switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.js","sources":["../../../src/components/switch/Switch.tsx"],"sourcesContent":["import * as RadixSwitch from '@radix-ui/react-switch'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nconst StyledSwitch = styled(RadixSwitch.Root, {\n  appearance: 'none',\n  backgroundColor: '$tonal200',\n  border: 'none',\n  borderRadius: '$round',\n  cursor: 'pointer',\n  display: 'flex',\n  overflow: 'hidden',\n  p: '$0',\n  position: 'relative',\n  transition: 'all 50ms ease-out',\n  width: '$4',\n  '&:hover': {\n    backgroundColor: '$tonal300'\n  },\n  '&:focus': {\n    outline: '2px solid $primary',\n    outlineOffset: '1px'\n  },\n  '&[data-state=\"checked\"]': {\n    backgroundColor: '$primary'\n  },\n  '&[data-state=\"checked\"]:hover': {\n    backgroundColor: '$primaryMid'\n  }\n})\n\nconst StyledThumb = styled(RadixSwitch.Thumb, {\n  backgroundColor: 'white',\n  borderRadius: '$round',\n  display: 'block',\n  size: '$1',\n  transition: 'transform 50ms',\n  willChange: 'transform',\n  '&[data-state=\"checked\"]': {\n    transform: 'translateX(calc($sizes$2 - $space$1))'\n  }\n})\n\ntype SwitchProps = React.ComponentProps<typeof StyledSwitch>\n\nexport const Switch: React.FC<SwitchProps> = (props) => (\n  <StyledSwitch {...props}>\n    <StyledThumb />\n  </StyledSwitch>\n)\n\nSwitch.displayName = 'Switch'\n"],"names":["StyledSwitch","styled","RadixSwitch","StyledThumb","Switch","props","React"],"mappings":"4GAKA,MAAMA,EAAeC,EAAOC,EAAY,KAAM,CAC5C,WAAY,OACZ,gBAAiB,YACjB,OAAQ,OACR,aAAc,SACd,OAAQ,UACR,QAAS,OACT,SAAU,SACV,EAAG,KACH,SAAU,WACV,WAAY,oBACZ,MAAO,KACP,UAAW,CACT,gBAAiB,WACnB,EACA,UAAW,CACT,QAAS,qBACT,cAAe,KACjB,EACA,0BAA2B,CACzB,gBAAiB,UACnB,EACA,gCAAiC,CAC/B,gBAAiB,aACnB,CACF,CAAC,EAEKC,EAAcF,EAAOC,EAAY,MAAO,CAC5C,gBAAiB,QACjB,aAAc,SACd,QAAS,QACT,KAAM,KACN,WAAY,iBACZ,WAAY,YACZ,0BAA2B,CACzB,UAAW,uCACb,CACF,CAAC,EAIYE,EAAiCC,GAC5CC,EAAA,cAACN,EAAA,CAAc,GAAGK,CAAAA,EAChBC,EAAA,cAACH,EAAA,IAAY,CACf,EAGFC,EAAO,YAAc"}

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

@@ -41,6 +41,42 @@ declare const StyledTable: import("@stitches/react/types/styled-component").Styl
         textPlaceholder: any;
         background: any;
         backgroundAccent: any;
+        grey100: any;
+        grey200: any;
+        grey300: any;
+        grey400: any;
+        grey500: any;
+        grey600: any;
+        grey700: any;
+        grey800: any;
+        grey900: any;
+        grey1000: any;
+        grey1100: any;
+        grey1200: any;
+        blue100: any;
+        blue200: any;
+        blue300: any;
+        blue400: any;
+        blue500: any;
+        blue600: any;
+        blue700: any;
+        blue800: any;
+        blue900: any;
+        blue1000: any;
+        blue1100: any;
+        blue1200: any;
+        purple100: any;
+        purple200: any;
+        purple300: any;
+        purple400: any;
+        purple500: any;
+        purple600: any;
+        purple700: any;
+        purple800: any;
+        purple900: any;
+        purple1000: any;
+        purple1100: any;
+        purple1200: any;
         tonal50: any;
         tonal100: any;
         tonal200: any;
@@ -98,6 +134,7 @@ declare const StyledTable: import("@stitches/react/types/styled-component").Styl
         "7": any;
         "8": any;
         "9": any;
+        "24": any;
     };
     fontSizes: {
         xs: any;

package/dist/components/table/Table.js

@@ -1 +1,2 @@
 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};
+//# sourceMappingURL=Table.js.map

package/dist/components/table/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","sources":["../../../src/components/table/Table.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { TableBody } from './TableBody'\nimport { TableCell } from './TableCell'\nimport { TableFooter } from './TableFooter'\nimport { TableFooterCell } from './TableFooterCell'\nimport { TableHeader } from './TableHeader'\nimport { TableHeaderCell } from './TableHeaderCell'\nimport { StyledRow, TableRow } from './TableRow'\n\ntype TableSubComponents = {\n  Body: typeof TableBody\n  Cell: typeof TableCell\n  Footer: typeof TableFooter\n  FooterCell: typeof TableFooterCell\n  Header: typeof TableHeader\n  HeaderCell: typeof TableHeaderCell\n  Row: typeof TableRow\n}\n\nconst StyledTable = styled('table', {\n  borderCollapse: 'separate',\n  borderSpacing: 0,\n  fontFamily: '$sans',\n  fontSize: '$sm',\n  width: '100%',\n  variants: {\n    size: {\n      md: {\n        [`${TableCell}, ${TableHeaderCell}, ${TableFooterCell}`]: {\n          height: '$4'\n        }\n      },\n      lg: {\n        [`${TableCell}, ${TableHeaderCell}, ${TableFooterCell}`]: {\n          height: '$5'\n        }\n      }\n    },\n    corners: {\n      round: {\n        [`${TableHeaderCell}`]: {\n          '&:first-of-type': { borderTopLeftRadius: '$0' },\n          '&:last-of-type': { borderTopRightRadius: '$0' }\n        },\n        [`${StyledRow}:last-child`]: {\n          [`${TableCell}:first-child`]: { borderBottomLeftRadius: '$0' },\n          [`${TableCell}:last-child`]: { borderBottomRightRadius: '$0' }\n        }\n      },\n      square: {}\n    }\n  }\n})\n\ntype TableProps = React.ComponentProps<typeof StyledTable>\n\nexport const Table: React.FC<TableProps> & TableSubComponents = ({\n  size = 'md',\n  corners = 'round',\n  ...rest\n}: TableProps) => <StyledTable size={size} corners={corners} {...rest} />\n\nTable.Body = TableBody\nTable.Cell = TableCell\nTable.Footer = TableFooter\nTable.FooterCell = TableFooterCell\nTable.Header = TableHeader\nTable.HeaderCell = TableHeaderCell\nTable.Row = TableRow\n\nTable.displayName = 'Table'\n"],"names":["StyledTable","styled","TableCell","TableHeaderCell","TableFooterCell","StyledRow","Table","size","corners","rest","React","TableBody","TableFooter","TableHeader","TableRow"],"mappings":"6ZAsBA,MAAMA,EAAcC,EAAO,QAAS,CAClC,eAAgB,WAChB,cAAe,EACf,WAAY,QACZ,SAAU,MACV,MAAO,OACP,SAAU,CACR,KAAM,CACJ,GAAI,CACF,CAAC,GAAGC,MAAcC,MAAoBC,KAAoB,CACxD,OAAQ,IACV,CACF,EACA,GAAI,CACF,CAAC,GAAGF,MAAcC,MAAoBC,KAAoB,CACxD,OAAQ,IACV,CACF,CACF,EACA,QAAS,CACP,MAAO,CACL,CAAC,GAAGD,KAAoB,CACtB,kBAAmB,CAAE,oBAAqB,IAAK,EAC/C,iBAAkB,CAAE,qBAAsB,IAAK,CACjD,EACA,CAAC,GAAGE,gBAAyB,CAC3B,CAAC,GAAGH,iBAA0B,CAAE,uBAAwB,IAAK,EAC7D,CAAC,GAAGA,gBAAyB,CAAE,wBAAyB,IAAK,CAC/D,CACF,EACA,OAAQ,CAAA,CACV,CACF,CACF,CAAC,EAIYI,EAAmD,CAAC,CAC/D,KAAAC,EAAO,KACP,QAAAC,EAAU,WACPC,CACL,IAAkBC,EAAA,cAACV,EAAA,CAAY,KAAMO,EAAM,QAASC,EAAU,GAAGC,CAAAA,CAAM,EAEvEH,EAAM,KAAOK,EACbL,EAAM,KAAOJ,EACbI,EAAM,OAASM,EACfN,EAAM,WAAaF,EACnBE,EAAM,OAASO,EACfP,EAAM,WAAaH,EACnBG,EAAM,IAAMQ,EAEZR,EAAM,YAAc"}

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

@@ -24,6 +24,42 @@ declare const StyledTableBody: import("@stitches/react/types/styled-component").
         textPlaceholder: any;
         background: any;
         backgroundAccent: any;
+        grey100: any;
+        grey200: any;
+        grey300: any;
+        grey400: any;
+        grey500: any;
+        grey600: any;
+        grey700: any;
+        grey800: any;
+        grey900: any;
+        grey1000: any;
+        grey1100: any;
+        grey1200: any;
+        blue100: any;
+        blue200: any;
+        blue300: any;
+        blue400: any;
+        blue500: any;
+        blue600: any;
+        blue700: any;
+        blue800: any;
+        blue900: any;
+        blue1000: any;
+        blue1100: any;
+        blue1200: any;
+        purple100: any;
+        purple200: any;
+        purple300: any;
+        purple400: any;
+        purple500: any;
+        purple600: any;
+        purple700: any;
+        purple800: any;
+        purple900: any;
+        purple1000: any;
+        purple1100: any;
+        purple1200: any;
         tonal50: any;
         tonal100: any;
         tonal200: any;
@@ -81,6 +117,7 @@ declare const StyledTableBody: import("@stitches/react/types/styled-component").
         "7": any;
         "8": any;
         "9": any;
+        "24": any;
     };
     fontSizes: {
         xs: any;

package/dist/components/table/TableBody.js

@@ -1 +1,2 @@
 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};
+//# sourceMappingURL=TableBody.js.map

package/dist/components/table/TableBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableBody.js","sources":["../../../src/components/table/TableBody.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { StyledRow } from './TableRow'\n\nconst StyledTableBody = styled('tbody', {\n  variants: {\n    striped: {\n      true: {\n        [`${StyledRow}`]: {\n          '&:nth-child(odd)': { bg: 'white' },\n          '&:nth-child(even)': { bg: '$tonal50' }\n        }\n      },\n      false: {\n        bg: 'white'\n      }\n    }\n  }\n})\n\ntype TableBodyProps = React.ComponentProps<typeof StyledTableBody>\n\nexport const TableBody: React.FC<TableBodyProps> = ({\n  striped = true,\n  ...rest\n}) => <StyledTableBody striped={striped} {...rest} />\n\nTableBody.displayName = 'TableBody'\n"],"names":["StyledTableBody","styled","StyledRow","TableBody","striped","rest","React"],"mappings":"6GAMA,MAAMA,EAAkBC,EAAO,QAAS,CACtC,SAAU,CACR,QAAS,CACP,KAAM,CACJ,CAAC,GAAGC,KAAc,CAChB,mBAAoB,CAAE,GAAI,OAAQ,EAClC,oBAAqB,CAAE,GAAI,UAAW,CACxC,CACF,EACA,MAAO,CACL,GAAI,OACN,CACF,CACF,CACF,CAAC,EAIYC,EAAsC,CAAC,CAClD,QAAAC,EAAU,MACPC,CACL,IAAMC,EAAA,cAACN,EAAA,CAAgB,QAASI,EAAU,GAAGC,CAAM,CAAA,EAEnDF,EAAU,YAAc"}