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

package/dist/components/progress-bar/ProgressBar.js

@@ -1 +1,2 @@
 import*as e from"@radix-ui/react-progress";import*as a from"react";import{styled as t}from"../../stitches.js";const l=t(e.Root,{borderRadius:"$round",background:"$tonal100",height:"$0",position:"relative",overflow:"hidden",width:"100%",variants:{theme:{primary:{color:"$primary"},success:{color:"$success"},warning:{color:"$warning"},danger:{color:"$danger"}}}}),d=t(e.Indicator,{backgroundColor:"currentcolor",borderRadius:"$round",boxSizing:"border-box",height:"100%",position:"absolute",transition:"all 300ms ease-out"}),s=({value:r,max:o=100,theme:i="primary",...n})=>a.createElement(l,{value:r,max:o,theme:i,...n},a.createElement(d,{style:{width:"100%",transform:`translateX(-${100-(r||0)/o*100}%)`}}));s.displayName="ProgressBar";export{s as ProgressBar};
+//# sourceMappingURL=ProgressBar.js.map

package/dist/components/progress-bar/ProgressBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressBar.js","sources":["../../../src/components/progress-bar/ProgressBar.tsx"],"sourcesContent":["import * as Progress from '@radix-ui/react-progress'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nconst StyledProgressBar = styled(Progress.Root, {\n  borderRadius: '$round',\n  background: '$tonal100',\n  height: '$0',\n  position: 'relative',\n  overflow: 'hidden',\n  width: '100%',\n  variants: {\n    theme: {\n      primary: { color: '$primary' },\n      success: { color: '$success' },\n      warning: { color: '$warning' },\n      danger: { color: '$danger' }\n    }\n  }\n})\n\nconst StyledIndicator = styled(Progress.Indicator, {\n  backgroundColor: 'currentcolor',\n  borderRadius: '$round',\n  boxSizing: 'border-box',\n  height: '100%',\n  position: 'absolute',\n  transition: 'all 300ms ease-out'\n})\n\ntype ProgressBarProps = React.ComponentPropsWithoutRef<\n  typeof StyledProgressBar\n> &\n  (\n    | { id: string; 'aria-label'?: string }\n    | { 'aria-label': string; id?: string }\n  )\n\nexport const ProgressBar: React.FC<ProgressBarProps> = ({\n  value,\n  max = 100,\n  theme = 'primary',\n  ...remainingProps\n}) => (\n  <StyledProgressBar value={value} max={max} theme={theme} {...remainingProps}>\n    <StyledIndicator\n      style={{\n        width: '100%',\n        transform: `translateX(-${100 - ((value || 0) / max) * 100}%)`\n      }}\n    />\n  </StyledProgressBar>\n)\n\nProgressBar.displayName = 'ProgressBar'\n"],"names":["StyledProgressBar","styled","Progress","StyledIndicator","ProgressBar","value","max","theme","remainingProps","React"],"mappings":"8GAKA,MAAMA,EAAoBC,EAAOC,EAAS,KAAM,CAC9C,aAAc,SACd,WAAY,YACZ,OAAQ,KACR,SAAU,WACV,SAAU,SACV,MAAO,OACP,SAAU,CACR,MAAO,CACL,QAAS,CAAE,MAAO,UAAW,EAC7B,QAAS,CAAE,MAAO,UAAW,EAC7B,QAAS,CAAE,MAAO,UAAW,EAC7B,OAAQ,CAAE,MAAO,SAAU,CAC7B,CACF,CACF,CAAC,EAEKC,EAAkBF,EAAOC,EAAS,UAAW,CACjD,gBAAiB,eACjB,aAAc,SACd,UAAW,aACX,OAAQ,OACR,SAAU,WACV,WAAY,oBACd,CAAC,EAUYE,EAA0C,CAAC,CACtD,MAAAC,EACA,IAAAC,EAAM,IACN,MAAAC,EAAQ,aACLC,CACL,IACEC,EAAA,cAACT,EAAA,CAAkB,MAAOK,EAAO,IAAKC,EAAK,MAAOC,EAAQ,GAAGC,CAC3DC,EAAAA,EAAA,cAACN,EAAA,CACC,MAAO,CACL,MAAO,OACP,UAAW,eAAe,KAAQE,GAAS,GAAKC,EAAO,OACzD,CACF,CAAA,CACF,EAGFF,EAAY,YAAc"}

package/dist/components/radio-button/RadioButton.js

@@ -1 +1,2 @@
-import*as o from"@radix-ui/react-radio-group";import*as r from"react";import{styled as e}from"../../stitches.js";const n=e(o.Item,{alignItems:"center",appearance:"none",backgroundColor:"transparent",border:"1px solid $tonal400",borderRadius:"$round",color:"white",cursor:"pointer",display:"flex",justifyContent:"center",p:0,size:"$1",transition:"all 50ms ease-out","&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},'&[data-state="checked"]':{backgroundColor:"$primary",borderColor:"$primary"},"&[disabled]":{backgroundColor:"$tonal100",borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"}}),l=e(o.Indicator,{size:"6px",borderRadius:"$round",backgroundColor:"currentcolor",position:"absolute"}),t=a=>r.createElement(n,{...a},r.createElement(l,null));t.displayName="RadioButton";export{t as RadioButton};
+import*as o from"@radix-ui/react-radio-group";import*as r from"react";import{styled as t}from"../../stitches.js";const n=t(o.Item,{alignItems:"center",appearance:"none",backgroundColor:"transparent",border:"1px solid $tonal400",borderRadius:"$round",color:"white",cursor:"pointer",display:"flex",justifyContent:"center",p:0,size:"$1",transition:"all 50ms ease-out","&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},'&[data-state="checked"]':{backgroundColor:"$primary",borderColor:"$primary"},"&[disabled]":{backgroundColor:"$tonal100",borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"}}),l=t(o.Indicator,{size:"6px",borderRadius:"$round",backgroundColor:"currentcolor",position:"absolute"}),e=a=>r.createElement(n,{...a},r.createElement(l,null));e.displayName="RadioButton";export{e as RadioButton};
+//# sourceMappingURL=RadioButton.js.map

package/dist/components/radio-button/RadioButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.js","sources":["../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { Override } from '~/utilities/types'\n\nconst StyledRadioButton = styled(RadioGroup.Item, {\n  alignItems: 'center',\n  appearance: 'none',\n  backgroundColor: 'transparent',\n  border: '1px solid $tonal400',\n  borderRadius: '$round',\n  color: 'white',\n  cursor: 'pointer',\n  display: 'flex',\n  justifyContent: 'center',\n  p: 0,\n  size: '$1',\n  transition: 'all 50ms ease-out',\n  '&:focus': {\n    outline: '2px solid $primary',\n    outlineOffset: '1px'\n  },\n  '&[data-state=\"checked\"]': {\n    backgroundColor: '$primary',\n    borderColor: '$primary'\n  },\n  '&[disabled]': {\n    backgroundColor: '$tonal100',\n    borderColor: '$tonal400',\n    color: '$tonal400',\n    cursor: 'not-allowed'\n  }\n})\n\nconst StyledIndicator = styled(RadioGroup.Indicator, {\n  size: '6px',\n  borderRadius: '$round',\n  backgroundColor: 'currentcolor',\n  position: 'absolute'\n})\n\ntype RadioButtonProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledRadioButton>,\n  {\n    as?: never\n  } & {\n    'aria-label'?: string\n  }\n>\n\nexport const RadioButton: React.FC<RadioButtonProps> = (props) => (\n  <StyledRadioButton {...props}>\n    <StyledIndicator />\n  </StyledRadioButton>\n)\n\nRadioButton.displayName = 'RadioButton'\n"],"names":["StyledRadioButton","styled","RadioGroup","StyledIndicator","RadioButton","props","React"],"mappings":"iHAMA,MAAMA,EAAoBC,EAAOC,EAAW,KAAM,CAChD,WAAY,SACZ,WAAY,OACZ,gBAAiB,cACjB,OAAQ,sBACR,aAAc,SACd,MAAO,QACP,OAAQ,UACR,QAAS,OACT,eAAgB,SAChB,EAAG,EACH,KAAM,KACN,WAAY,oBACZ,UAAW,CACT,QAAS,qBACT,cAAe,KACjB,EACA,0BAA2B,CACzB,gBAAiB,WACjB,YAAa,UACf,EACA,cAAe,CACb,gBAAiB,YACjB,YAAa,YACb,MAAO,YACP,OAAQ,aACV,CACF,CAAC,EAEKC,EAAkBF,EAAOC,EAAW,UAAW,CACnD,KAAM,MACN,aAAc,SACd,gBAAiB,eACjB,SAAU,UACZ,CAAC,EAWYE,EAA2CC,GACtDC,EAAA,cAACN,EAAA,CAAmB,GAAGK,GACrBC,EAAA,cAACH,EAAA,IAAgB,CACnB,EAGFC,EAAY,YAAc"}

package/dist/components/radio-button/RadioButtonGroup.js

@@ -1 +1,2 @@
 import*as r from"@radix-ui/react-radio-group";import{styled as t}from"../../stitches.js";const o=t(r.Root,{display:"flex",flexWrap:"wrap",variants:{direction:{row:{flexDirection:"row","& > *:not(:last-child)":{mr:"$5"}},column:{flexDirection:"column"}}}});o.displayName="RadioButtonGroup";export{o as RadioButtonGroup};
+//# sourceMappingURL=RadioButtonGroup.js.map

package/dist/components/radio-button/RadioButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonGroup.js","sources":["../../../src/components/radio-button/RadioButtonGroup.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\n\nimport { styled } from '~/stitches'\n\nexport const RadioButtonGroup = styled(RadioGroup.Root, {\n  display: 'flex',\n  flexWrap: 'wrap',\n  variants: {\n    direction: {\n      row: {\n        flexDirection: 'row',\n        '& > *:not(:last-child)': { mr: '$5' }\n      },\n      column: { flexDirection: 'column' }\n    }\n  }\n})\n\nRadioButtonGroup.displayName = 'RadioButtonGroup'\n"],"names":["RadioButtonGroup","styled","RadioGroup"],"mappings":"+FAIaA,EAAmBC,EAAOC,EAAW,KAAM,CACtD,QAAS,OACT,SAAU,OACV,SAAU,CACR,UAAW,CACT,IAAK,CACH,cAAe,MACf,yBAA0B,CAAE,GAAI,IAAK,CACvC,EACA,OAAQ,CAAE,cAAe,QAAS,CACpC,CACF,CACF,CAAC,EAEDF,EAAiB,YAAc"}

package/dist/components/radio-button-field/RadioButtonField.js

@@ -1 +1,2 @@
-import*as e from"react";import{useFormContext as C,Controller as F}from"react-hook-form";import{Description as V}from"../field-wrapper/FieldDescription.js";import"../form/Form.js";import{useFieldError as b}from"../form/useFieldError.js";import{InlineMessage as h}from"../inline-message/InlineMessage.js";import{Label as v}from"../label/Label.js";import"../radio-button/RadioButton.js";import{RadioButtonGroup as B}from"../radio-button/RadioButtonGroup.js";import{styled as R}from"../../stitches.js";import{RadioField as $}from"./RadioField.js";const q=R("fieldset",{all:"unset"}),r=({children:s,css:d,direction:u="column",defaultValue:t,description:l,label:c,name:n,validation:o,onValueChange:a,...p})=>{const{control:f}=C(),{error:m}=b(n);return e.createElement(q,{css:d},e.createElement(v,{as:"legend",css:{p:0,mb:"$3"},required:Boolean(o==null?void 0:o.required)},c),l&&e.createElement(V,{css:{mb:"$3"}},l),e.createElement(F,{control:f,name:n,rules:o,defaultValue:t,render:({onChange:E,value:g})=>e.createElement(B,{direction:u,defaultValue:t,onValueChange:i=>{E(i),a==null||a(i)},value:g,...p},s)}),m&&e.createElement(h,{css:{mt:"$2"}},m))};r.Item=$,r.displayName="RadioButtonField";export{r as RadioButtonField};
+import*as e from"react";import{useFormContext as B,useController as F}from"react-hook-form";import{Description as R}from"../field-wrapper/FieldDescription.js";import"../form/Form.js";import{useFieldError as V}from"../form/useFieldError.js";import{InlineMessage as b}from"../inline-message/InlineMessage.js";import{Label as h}from"../label/Label.js";import"../radio-button/RadioButton.js";import{RadioButtonGroup as x}from"../radio-button/RadioButtonGroup.js";import{styled as y}from"../../stitches.js";import{RadioField as q}from"./RadioField.js";const I=y("fieldset",{all:"unset"}),r=({children:d,css:c,direction:f="column",defaultValue:l,value:o,description:n,label:p,name:a,validation:t,onValueChange:i,...E})=>{const{control:C}=B(),{field:{ref:g,onChange:m,value:v,name:$}}=F({name:a,control:C,rules:t,defaultValue:l}),{error:u}=V(a);return e.useEffect(()=>{typeof o<"u"&&m(o)},[o]),e.createElement(I,{css:c},e.createElement(h,{as:"legend",css:{p:0,mb:"$3"},required:Boolean(t==null?void 0:t.required)},p),n&&e.createElement(R,{css:{mb:"$3"}},n),e.createElement(x,{ref:g,direction:f,defaultValue:l,onValueChange:s=>{m(s),i==null||i(s)},value:v,...E},d),u&&e.createElement(b,{css:{mt:"$2"}},u))};r.Item=q,r.displayName="RadioButtonField";export{r as RadioButtonField};
+//# sourceMappingURL=RadioButtonField.js.map

package/dist/components/radio-button-field/RadioButtonField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButtonField.js","sources":["../../../src/components/radio-button-field/RadioButtonField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { FieldElementWrapperProps } from '~/components/field-wrapper'\nimport { Description as FieldDescription } from '~/components/field-wrapper/FieldDescription'\nimport { useFieldError } from '~/components/form'\nimport { InlineMessage } from '~/components/inline-message'\nimport { Label } from '~/components/label'\nimport { RadioButtonGroup } from '~/components/radio-button'\nimport { styled } from '~/stitches'\n\nimport { RadioField } from './RadioField'\n\nconst Fieldset = styled('fieldset', {\n  all: 'unset'\n})\n\ntype RadioButtonFieldProps = React.ComponentProps<typeof RadioButtonGroup> &\n  FieldElementWrapperProps\n\nexport const RadioButtonField: React.FC<RadioButtonFieldProps> & {\n  Item: typeof RadioField\n} = ({\n  children,\n  css,\n  direction = 'column',\n  defaultValue,\n  value,\n  description,\n  label,\n  name,\n  validation,\n  onValueChange,\n  ...remainingProps\n}) => {\n  const { control } = useFormContext()\n  const {\n    field: { ref, onChange, value: innerValue, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue\n  })\n  const { error } = useFieldError(name)\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner value to match what is passed in.\n    if (typeof value !== 'undefined') onChange(value)\n  }, [value])\n\n  return (\n    <Fieldset css={css}>\n      <Label\n        as=\"legend\"\n        css={{ p: 0, mb: '$3' }}\n        required={Boolean(validation?.required)}\n      >\n        {label}\n      </Label>\n      {description && (\n        <FieldDescription css={{ mb: '$3' }}>{description}</FieldDescription>\n      )}\n\n      <RadioButtonGroup\n        ref={ref}\n        direction={direction}\n        defaultValue={defaultValue}\n        onValueChange={(newValue) => {\n          onChange(newValue)\n          onValueChange?.(newValue)\n        }}\n        value={innerValue}\n        {...remainingProps}\n      >\n        {children}\n      </RadioButtonGroup>\n\n      {error && <InlineMessage css={{ mt: '$2' }}>{error}</InlineMessage>}\n    </Fieldset>\n  )\n}\n\nRadioButtonField.Item = RadioField\n\nRadioButtonField.displayName = 'RadioButtonField'\n"],"names":["Fieldset","styled","RadioButtonField","children","css","direction","defaultValue","value","description","label","name","validation","onValueChange","remainingProps","control","useFormContext","ref","onChange","innerValue","innerName","useController","error","useFieldError","React","Label","FieldDescription","RadioButtonGroup","newValue","InlineMessage","RadioField"],"mappings":"miBAaA,MAAMA,EAAWC,EAAO,WAAY,CAClC,IAAK,OACP,CAAC,EAKYC,EAET,CAAC,CACH,SAAAC,EACA,IAAAC,EACA,UAAAC,EAAY,SACZ,aAAAC,EACA,MAAAC,EACA,YAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,cAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,QAAAC,CAAQ,EAAIC,IACd,CACJ,MAAO,CAAE,IAAAC,EAAK,SAAAC,EAAU,MAAOC,EAAY,KAAMC,CAAU,CAC7D,EAAIC,EAAc,CAChB,KAAAV,EACA,QAAAI,EACA,MAAOH,EACP,aAAAL,CACF,CAAC,EACK,CAAE,MAAAe,CAAM,EAAIC,EAAcZ,CAAI,EAEpC,OAAAa,EAAM,UAAU,IAAM,CAEhB,OAAOhB,EAAU,KAAaU,EAASV,CAAK,CAClD,EAAG,CAACA,CAAK,CAAC,EAGRgB,EAAA,cAACvB,EAAA,CAAS,IAAKI,GACbmB,EAAA,cAACC,EAAA,CACC,GAAG,SACH,IAAK,CAAE,EAAG,EAAG,GAAI,IAAK,EACtB,SAAU,QAAQb,GAAA,KAAA,OAAAA,EAAY,QAAQ,GAErCF,CACH,EACCD,GACCe,EAAA,cAACE,EAAA,CAAiB,IAAK,CAAE,GAAI,IAAK,CAAA,EAAIjB,CAAY,EAGpDe,EAAA,cAACG,EAAA,CACC,IAAKV,EACL,UAAWX,EACX,aAAcC,EACd,cAAgBqB,GAAa,CAC3BV,EAASU,CAAQ,EACjBf,GAAA,MAAAA,EAAgBe,EAClB,EACA,MAAOT,EACN,GAAGL,CAEHV,EAAAA,CACH,EAECkB,GAASE,EAAA,cAACK,EAAA,CAAc,IAAK,CAAE,GAAI,IAAK,CAAIP,EAAAA,CAAM,CACrD,CAEJ,EAEAnB,EAAiB,KAAO2B,EAExB3B,EAAiB,YAAc"}

package/dist/components/radio-button-field/RadioField.js

@@ -1 +1,2 @@
-import*as e from"react";import"../field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as t}from"../field-wrapper/InlineFieldWrapper.js";import{RadioButton as m}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";const o=({css:a,label:i,value:l,...r})=>e.createElement(t,{css:a,label:i},e.createElement(m,{value:l,...r}));o.displayName="RadioField";export{o as RadioField};
+import*as e from"react";import"../field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as r}from"../field-wrapper/InlineFieldWrapper.js";import{RadioButton as m}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";const o=({css:t,label:a,value:i,...l})=>e.createElement(r,{css:t,label:a},e.createElement(m,{value:i,...l}));o.displayName="RadioField";export{o as RadioField};
+//# sourceMappingURL=RadioField.js.map

package/dist/components/radio-button-field/RadioField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioField.js","sources":["../../../src/components/radio-button-field/RadioField.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { InlineFieldWrapper } from '~/components/field-wrapper'\nimport { ValidationOptions } from '~/components/form'\nimport { RadioButton } from '~/components/radio-button'\nimport { CSS } from '~/stitches'\n\ntype RadioFieldProps = {\n  css?: CSS\n  defaultChecked?: boolean\n  error?: string\n  label: string\n  validation?: ValidationOptions\n} & React.ComponentProps<typeof RadioButton>\n\nexport const RadioField: React.FC<RadioFieldProps> = ({\n  css,\n  label,\n  value,\n  ...remainingProps\n}) => (\n  <InlineFieldWrapper css={css} label={label}>\n    <RadioButton value={value} {...remainingProps} />\n  </InlineFieldWrapper>\n)\n\nRadioField.displayName = 'RadioField'\n"],"names":["RadioField","css","label","value","remainingProps","React","InlineFieldWrapper","RadioButton"],"mappings":"sPAeO,MAAMA,EAAwC,CAAC,CACpD,IAAAC,EACA,MAAAC,EACA,MAAAC,KACGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAmB,IAAKL,EAAK,MAAOC,CACnCG,EAAAA,EAAA,cAACE,EAAA,CAAY,MAAOJ,EAAQ,GAAGC,EAAgB,CACjD,EAGFJ,EAAW,YAAc"}

package/dist/components/radio-card/RadioCard.js

@@ -1 +1,2 @@
 import*as l from"@radix-ui/react-radio-group";import*as e from"react";import{styled as t}from"../../stitches.js";import{Box as d}from"../box/Box.js";const o=t(l.Item,{alignItems:"center",bg:"white",border:"1px solid $tonal200",borderRadius:"$0",cursor:"pointer",display:"flex",textAlign:"left",'&[data-state="checked"]':{outline:"2px solid $primary",outlineOffset:"-2px"},variants:{align:{left:{flexDirection:"row"},right:{flexDirection:"row-reverse"}},size:{md:{px:"$4",py:"$3"},lg:{px:"$5",py:"$4"}},isFullWidth:{true:{width:"100%"},false:{width:"max-content"}}}}),c=t("div",{alignItems:"center",appearance:"none",backgroundColor:"transparent",border:"1px solid $tonal500",borderRadius:"$round",display:"flex",flexShrink:0,justifyContent:"center",p:0,size:"$1",transition:"all 50ms ease-out",'[data-state="checked"] &':{backgroundColor:"$primary",borderColor:"$primary"},variants:{containerIsFullWidth:{true:{},false:{}},align:{left:{mr:"$4"},right:{}}},compoundVariants:[{containerIsFullWidth:!0,align:"right",css:{ml:"auto"}},{containerIsFullWidth:!1,align:"right",css:{ml:"$4"}}]}),p=t(l.Indicator,{backgroundColor:"white",borderRadius:"$round",position:"absolute",size:"6px"}),u=({children:a,isFullWidth:r=!1,size:n="md",align:i="left",...s})=>e.createElement(o,{...s,align:i,isFullWidth:r,size:n},e.createElement(c,{align:i,containerIsFullWidth:r},e.createElement(p,null)),e.createElement(d,null,a));export{u as RadioCard,o as StyledRadioCard};
+//# sourceMappingURL=RadioCard.js.map

package/dist/components/radio-card/RadioCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioCard.js","sources":["../../../src/components/radio-card/RadioCard.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Box } from '../box/Box'\n\nexport const StyledRadioCard = styled(RadioGroup.Item, {\n  alignItems: 'center',\n  bg: 'white',\n  border: '1px solid $tonal200',\n  borderRadius: '$0',\n  cursor: 'pointer',\n  display: 'flex',\n  textAlign: 'left',\n  '&[data-state=\"checked\"]': {\n    outline: '2px solid $primary',\n    outlineOffset: '-2px'\n  },\n  variants: {\n    align: {\n      left: { flexDirection: 'row' },\n      right: { flexDirection: 'row-reverse' }\n    },\n    size: {\n      md: { px: '$4', py: '$3' },\n      lg: { px: '$5', py: '$4' }\n    },\n    isFullWidth: {\n      true: { width: '100%' },\n      false: { width: 'max-content' }\n    }\n  }\n})\n\nconst RadioButton = styled('div', {\n  alignItems: 'center',\n  appearance: 'none',\n  backgroundColor: 'transparent',\n  border: '1px solid $tonal500',\n  borderRadius: '$round',\n  display: 'flex',\n  flexShrink: 0,\n  justifyContent: 'center',\n  p: 0,\n  size: '$1',\n  transition: 'all 50ms ease-out',\n  '[data-state=\"checked\"] &': {\n    backgroundColor: '$primary',\n    borderColor: '$primary'\n  },\n  variants: {\n    containerIsFullWidth: {\n      true: {},\n      false: {}\n    },\n    align: {\n      left: { mr: '$4' },\n      right: {}\n    }\n  },\n\n  compoundVariants: [\n    {\n      containerIsFullWidth: true,\n      align: 'right',\n      css: { ml: 'auto' }\n    },\n    {\n      containerIsFullWidth: false,\n      align: 'right',\n      css: { ml: '$4' }\n    }\n  ]\n})\n\nconst Indicator = styled(RadioGroup.Indicator, {\n  backgroundColor: 'white',\n  borderRadius: '$round',\n  position: 'absolute',\n  size: '6px'\n})\n\ntype RadioCardProps = React.ComponentProps<typeof StyledRadioCard>\n\nexport const RadioCard: React.FC<RadioCardProps> = ({\n  children,\n  isFullWidth = false,\n  size = 'md',\n  align = 'left',\n  ...rest\n}) => (\n  <StyledRadioCard\n    {...rest}\n    align={align}\n    isFullWidth={isFullWidth}\n    size={size}\n  >\n    <RadioButton align={align} containerIsFullWidth={isFullWidth}>\n      <Indicator />\n    </RadioButton>\n    <Box>{children}</Box>\n  </StyledRadioCard>\n)\n"],"names":["StyledRadioCard","styled","RadioGroup","RadioButton","Indicator","RadioCard","children","isFullWidth","size","align","rest","React","Box"],"mappings":"qJAOa,MAAAA,EAAkBC,EAAOC,EAAW,KAAM,CACrD,WAAY,SACZ,GAAI,QACJ,OAAQ,sBACR,aAAc,KACd,OAAQ,UACR,QAAS,OACT,UAAW,OACX,0BAA2B,CACzB,QAAS,qBACT,cAAe,MACjB,EACA,SAAU,CACR,MAAO,CACL,KAAM,CAAE,cAAe,KAAM,EAC7B,MAAO,CAAE,cAAe,aAAc,CACxC,EACA,KAAM,CACJ,GAAI,CAAE,GAAI,KAAM,GAAI,IAAK,EACzB,GAAI,CAAE,GAAI,KAAM,GAAI,IAAK,CAC3B,EACA,YAAa,CACX,KAAM,CAAE,MAAO,MAAO,EACtB,MAAO,CAAE,MAAO,aAAc,CAChC,CACF,CACF,CAAC,EAEKC,EAAcF,EAAO,MAAO,CAChC,WAAY,SACZ,WAAY,OACZ,gBAAiB,cACjB,OAAQ,sBACR,aAAc,SACd,QAAS,OACT,WAAY,EACZ,eAAgB,SAChB,EAAG,EACH,KAAM,KACN,WAAY,oBACZ,2BAA4B,CAC1B,gBAAiB,WACjB,YAAa,UACf,EACA,SAAU,CACR,qBAAsB,CACpB,KAAM,CAAA,EACN,MAAO,EACT,EACA,MAAO,CACL,KAAM,CAAE,GAAI,IAAK,EACjB,MAAO,CACT,CAAA,CACF,EAEA,iBAAkB,CAChB,CACE,qBAAsB,GACtB,MAAO,QACP,IAAK,CAAE,GAAI,MAAO,CACpB,EACA,CACE,qBAAsB,GACtB,MAAO,QACP,IAAK,CAAE,GAAI,IAAK,CAClB,CACF,CACF,CAAC,EAEKG,EAAYH,EAAOC,EAAW,UAAW,CAC7C,gBAAiB,QACjB,aAAc,SACd,SAAU,WACV,KAAM,KACR,CAAC,EAIYG,EAAsC,CAAC,CAClD,SAAAC,EACA,YAAAC,EAAc,GACd,KAAAC,EAAO,KACP,MAAAC,EAAQ,UACLC,CACL,IACEC,EAAA,cAACX,GACE,GAAGU,EACJ,MAAOD,EACP,YAAaF,EACb,KAAMC,CAAAA,EAENG,EAAA,cAACR,EAAA,CAAY,MAAOM,EAAO,qBAAsBF,CAC/CI,EAAAA,EAAA,cAACP,EAAA,IAAU,CACb,EACAO,EAAA,cAACC,EAAA,KAAKN,CAAS,CACjB"}

package/dist/components/radio-card/RadioCardGroup.js

@@ -1 +1,2 @@
-import*as d from"@radix-ui/react-radio-group";import*as e from"react";import{Stack as p}from"../stack/Stack.js";import{RadioCard as c}from"./RadioCard.js";const f=({css:t,children:r,size:o,isFullWidth:l,align:a,gap:s="3",justify:m,...n})=>e.createElement(d.Root,{...n},e.createElement(p,{direction:"row",justify:m,gap:s,css:t},e.Children.map(r,i=>e.isValidElement(i)&&(i==null?void 0:i.type)===c?e.cloneElement(i,{size:o,isFullWidth:l,align:a}):i)));export{f as RadioCardGroup};
+import*as d from"@radix-ui/react-radio-group";import*as t from"react";import{Stack as p}from"../stack/Stack.js";import{RadioCard as c}from"./RadioCard.js";const f=({css:e,children:r,size:l,isFullWidth:o,align:a,gap:s="3",justify:m,...n})=>t.createElement(d.Root,{...n},t.createElement(p,{direction:"row",justify:m,gap:s,css:e},t.Children.map(r,i=>t.isValidElement(i)&&(i==null?void 0:i.type)===c?t.cloneElement(i,{size:l,isFullWidth:o,align:a}):i)));export{f as RadioCardGroup};
+//# sourceMappingURL=RadioCardGroup.js.map

package/dist/components/radio-card/RadioCardGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioCardGroup.js","sources":["../../../src/components/radio-card/RadioCardGroup.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport type { VariantProps } from '@stitches/react'\nimport * as React from 'react'\n\nimport type { Override } from '~/utilities'\n\nimport { Stack } from '../stack/Stack'\nimport { RadioCard, StyledRadioCard } from './RadioCard'\n\ntype RadioCardGroupProps = Override<\n  Pick<React.ComponentProps<typeof Stack>, 'justify' | 'gap' | 'css'> &\n    VariantProps<typeof StyledRadioCard>,\n  React.ComponentProps<typeof RadioGroup.Root>\n>\n\nexport const RadioCardGroup: React.FC<RadioCardGroupProps> = ({\n  css,\n  children,\n  size,\n  isFullWidth,\n  align,\n  gap = '3',\n  justify,\n  ...rest\n}) => (\n  <RadioGroup.Root {...rest}>\n    <Stack direction=\"row\" justify={justify} gap={gap} css={css}>\n      {React.Children.map(children, (child) => {\n        if (React.isValidElement(child) && child?.type === RadioCard) {\n          return React.cloneElement(child, { size, isFullWidth, align })\n        }\n        return child\n      })}\n    </Stack>\n  </RadioGroup.Root>\n)\n"],"names":["RadioCardGroup","css","children","size","isFullWidth","align","gap","justify","rest","React","RadioGroup","Stack","child","RadioCard"],"mappings":"iKAeaA,EAAgD,CAAC,CAC5D,IAAAC,EACA,SAAAC,EACA,KAAAC,EACA,YAAAC,EACA,MAAAC,EACA,IAAAC,EAAM,IACN,QAAAC,KACGC,CACL,IACEC,EAAA,cAACC,EAAW,KAAX,CAAiB,GAAGF,CACnBC,EAAAA,EAAA,cAACE,EAAA,CAAM,UAAU,MAAM,QAASJ,EAAS,IAAKD,EAAK,IAAKL,GACrDQ,EAAM,SAAS,IAAIP,EAAWU,GACzBH,EAAM,eAAeG,CAAK,IAAKA,GAAA,YAAAA,EAAO,QAASC,EAC1CJ,EAAM,aAAaG,EAAO,CAAE,KAAAT,EAAM,YAAAC,EAAa,MAAAC,CAAM,CAAC,EAExDO,CACR,CACH,CACF"}

package/dist/components/search-field/SearchField.js

@@ -1 +1,2 @@
 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{SearchInput as F}from"../search-input/SearchInput.js";const m=({css:p,label:a,name:r,validation:e,prompt:l,description:d,...n})=>{const{register:o}=c(),{error:t}=u(r),s=e?o(e):o;return i.createElement(f,{css:p,description:d,error:t,fieldId:r,label:a,prompt:l,required:Boolean(e==null?void 0:e.required)},i.createElement(F,{id:r,name:r,ref:s,...t&&{state:"error"},...n}))};m.displayName="SearchField";export{m as SearchField};
+//# sourceMappingURL=SearchField.js.map

package/dist/components/search-field/SearchField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchField.js","sources":["../../../src/components/search-field/SearchField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldWrapper,\n  FieldElementWrapperProps\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { SearchInput, SearchInputProps } from '~/components/search-input'\n\ntype SearchFieldProps = SearchInputProps & FieldElementWrapperProps\n\nexport const SearchField: React.FC<SearchFieldProps> = ({\n  css,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\n  const { register } = useFormContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n\n  return (\n    <FieldWrapper\n      css={css}\n      description={description}\n      error={error}\n      fieldId={name}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n    >\n      <SearchInput\n        id={name}\n        name={name}\n        ref={ref}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nSearchField.displayName = 'SearchField'\n"],"names":["SearchField","css","label","name","validation","prompt","description","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","SearchInput"],"mappings":"sUAYa,MAAAA,EAA0C,CAAC,CACtD,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcR,CAAI,EAC9BS,EAAMR,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKb,EACL,YAAaK,EACb,MAAOI,EACP,QAASP,EACT,MAAOD,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,KAAA,OAAAA,EAAY,QAAQ,CAAA,EAEtCS,EAAA,cAACE,EAAA,CACC,GAAIZ,EACJ,KAAMA,EACN,IAAKS,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGH,EACN,CACF,CAEJ,EAEAP,EAAY,YAAc"}

package/dist/components/search-input/SearchInput.d.ts

@@ -5,6 +5,8 @@ export declare type SearchInputProps = React.ComponentProps<typeof Input> & {
     size?: 'sm' | 'md';
     css?: CSS;
     value?: string;
+    defaultValue?: string;
+    onValueChange?: (newValue: string) => void;
     clearText?: string;
     onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
 };

package/dist/components/search-input/SearchInput.js

@@ -1 +1,2 @@
-import{Search as z,Close as y}from"@atom-learning/icons";import*as t from"react";import{ActionIcon as H}from"../action-icon/ActionIcon.js";import{Box as I}from"../box/Box.js";import{Icon as l}from"../icon/Icon.js";import{Input as k}from"../input/Input.js";import{styled as p}from"../../stitches.js";import{useCallbackRef as L}from"../../utilities/hooks/useCallbackRef.js";var $=(e=>(e.SEARCH="SEARCH",e.CLEAR="CLEAR",e))($||{});const x=p(l,{color:"$tonal300",position:"absolute",pointerEvents:"none",variants:{size:{sm:{top:"$2",right:"$2",size:"$1"},md:{top:10,right:10,size:20}}}}),O=p(k,{'&::-webkit-search-decoration, &::-webkit-search-cancel-button, &::-webkit-search-results-button, & input[type="search"]::-webkit-search-results-decoration':{display:"none"}}),u=t.forwardRef(({size:e="md",css:m,value:n,clearText:E="Clear",onChange:a,...h},b)=>{const[i,f]=L(),[v,C]=t.useState(n||""),[d,R]=t.useState(n?"CLEAR":"SEARCH");t.useImperativeHandle(b,()=>i.current);const A=()=>{var r,c;const o=i.current;if(!o)return;const s=(r=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value"))==null?void 0:r.set;(c=s==null?void 0:s.call)==null||c.call(s,o,"");const w=new Event("input",{bubbles:!0});o.dispatchEvent(w),o.focus()},S=r=>{C(r.target.value),R(r.target.value?"CLEAR":"SEARCH"),a==null||a(r)},g=()=>d==="SEARCH"?t.createElement(x,{is:z,size:e,css:{size:e=="sm"?"$1":20}}):t.createElement(H,{label:E,theme:"neutral",size:e,css:{position:"absolute",top:"0",right:"$1"},onClick:A},t.createElement(l,{is:y}));return t.createElement(I,{css:{position:"relative",...m}},t.createElement(O,{ref:f,size:e,type:"search",...h,value:v,onChange:S,css:{pr:e==="sm"?"$5":"$6"}}),g())});u.displayName="SearchInput";export{u as SearchInput};
+import{Search as z,Close as H}from"@atom-learning/icons";import*as e from"react";import{ActionIcon as I}from"../action-icon/ActionIcon.js";import{Box as k}from"../box/Box.js";import{Icon as E}from"../icon/Icon.js";import{Input as L}from"../input/Input.js";import{styled as f}from"../../stitches.js";import{useCallbackRef as x}from"../../utilities/hooks/useCallbackRef.js";var N=(t=>(t.SEARCH="SEARCH",t.CLEAR="CLEAR",t))(N||{});const O=f(E,{color:"$tonal300",position:"absolute",pointerEvents:"none",variants:{size:{sm:{top:"$2",right:"$2",size:"$1"},md:{top:10,right:10,size:20}}}}),T=f(L,{'&::-webkit-search-decoration, &::-webkit-search-cancel-button, &::-webkit-search-results-button, & input[type="search"]::-webkit-search-results-decoration':{display:"none"}}),h=e.forwardRef(({size:t="md",css:C,value:r,defaultValue:i="",onValueChange:n,clearText:b="Clear",onChange:c,...d},v)=>{const[u,R]=x(),[A,p]=e.useState(i),[S,m]=e.useState(i?"CLEAR":"SEARCH");e.useEffect(()=>{typeof r>"u"||(p(r),m(r?"CLEAR":"SEARCH"))},[r]),e.useImperativeHandle(v,()=>u.current);const w=()=>{var s,o;const a=u.current;if(!a)return;const l=(s=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value"))==null?void 0:s.set;(o=l==null?void 0:l.call)==null||o.call(l,a,"");const g=new Event("input",{bubbles:!0});a.dispatchEvent(g),a.focus(),n==null||n("")},y=s=>{c==null||c(s);const o=s.target.value;p(o),n==null||n(o),m(o?"CLEAR":"SEARCH")},$=()=>S==="SEARCH"?e.createElement(O,{is:z,size:t,css:{size:t=="sm"?"$1":20}}):e.createElement(I,{label:b,theme:"neutral",size:t,css:{position:"absolute",top:"0",right:"$1"},onClick:w},e.createElement(E,{is:H}));return e.createElement(k,{css:{position:"relative",...C}},e.createElement(T,{ref:R,size:t,type:"search",...d,value:A,onChange:y,css:{pr:t==="sm"?"$5":"$6"}}),$())});h.displayName="SearchInput";export{h as SearchInput};
+//# sourceMappingURL=SearchInput.js.map

package/dist/components/search-input/SearchInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.js","sources":["../../../src/components/search-input/SearchInput.tsx"],"sourcesContent":["import { Close, Search } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Box } from '~/components/box/'\nimport { Icon } from '~/components/icon/'\nimport { Input } from '~/components/input/'\nimport { CSS, styled } from '~/stitches'\nimport { useCallbackRef } from '~/utilities/hooks/useCallbackRef'\n\nexport type SearchInputProps = React.ComponentProps<typeof Input> & {\n  size?: 'sm' | 'md'\n  css?: CSS\n  value?: string\n  defaultValue?: string\n  onValueChange?: (newValue: string) => void\n  clearText?: string\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void\n}\n\nenum INPUT_ICON {\n  SEARCH = 'SEARCH',\n  CLEAR = 'CLEAR'\n}\n\nconst StyledIcon = styled(Icon, {\n  color: '$tonal300',\n  position: 'absolute',\n  pointerEvents: 'none',\n  variants: {\n    size: {\n      sm: {\n        top: '$2',\n        right: '$2',\n        size: '$1'\n      },\n      md: {\n        top: 10,\n        right: 10,\n        size: 20\n      }\n    }\n  }\n})\n\nconst StyledSearchInput = styled(Input, {\n  '&::-webkit-search-decoration, &::-webkit-search-cancel-button, &::-webkit-search-results-button, & input[type=\"search\"]::-webkit-search-results-decoration':\n    {\n      display: 'none'\n    }\n})\n\nexport const SearchInput: React.FC<SearchInputProps> = React.forwardRef(\n  (\n    {\n      size = 'md',\n      css,\n      value,\n      defaultValue = '',\n      onValueChange,\n      clearText = 'Clear',\n      onChange,\n      ...remainingProps\n    },\n    ref\n  ) => {\n    const [inputElRef, setInputElRef] = useCallbackRef()\n    const [innerValue, setInnerValue] = React.useState(defaultValue)\n    const [activeIcon, setActiveIcon] = React.useState<INPUT_ICON>(\n      defaultValue ? INPUT_ICON.CLEAR : INPUT_ICON.SEARCH\n    )\n    React.useEffect(() => {\n      if (typeof value === 'undefined') return\n      setInnerValue(value)\n      setActiveIcon(value ? INPUT_ICON.CLEAR : INPUT_ICON.SEARCH)\n    }, [value])\n\n    React.useImperativeHandle(ref, () => inputElRef.current as HTMLInputElement)\n\n    const handleClear = () => {\n      const inputEl = inputElRef.current\n      if (!inputEl) return\n\n      // https://stackoverflow.com/a/46012210\n      const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n        window.HTMLInputElement.prototype,\n        'value'\n      )?.set\n      nativeInputValueSetter?.call?.(inputEl, '')\n      const ev2 = new Event('input', {\n        bubbles: true\n      })\n      inputEl.dispatchEvent(ev2)\n      inputEl.focus()\n      onValueChange?.('')\n    }\n\n    const handleOnChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n      onChange?.(event)\n\n      const newValue = event.target.value\n      setInnerValue(newValue)\n      onValueChange?.(newValue)\n      setActiveIcon(newValue ? INPUT_ICON.CLEAR : INPUT_ICON.SEARCH)\n    }\n\n    const getIcon = () => {\n      if (activeIcon === INPUT_ICON.SEARCH)\n        return (\n          <StyledIcon\n            is={Search}\n            size={size}\n            css={{ size: size == 'sm' ? '$1' : 20 }}\n          />\n        )\n\n      return (\n        <ActionIcon\n          label={clearText}\n          theme=\"neutral\"\n          size={size}\n          css={{ position: 'absolute', top: '0', right: '$1' }}\n          onClick={handleClear}\n        >\n          <Icon is={Close} />\n        </ActionIcon>\n      )\n    }\n\n    return (\n      <Box css={{ position: 'relative', ...css }}>\n        <StyledSearchInput\n          ref={setInputElRef}\n          size={size}\n          type=\"search\"\n          {...remainingProps}\n          value={innerValue}\n          onChange={handleOnChange}\n          css={{ pr: size === 'sm' ? '$5' : '$6' }}\n        />\n        {getIcon()}\n      </Box>\n    )\n  }\n)\n\nSearchInput.displayName = 'SearchInput'\n"],"names":["INPUT_ICON","$","StyledIcon","styled","Icon","StyledSearchInput","Input","SearchInput","React","size","css","value","defaultValue","onValueChange","clearText","onChange","remainingProps","ref","inputElRef","setInputElRef","useCallbackRef","innerValue","setInnerValue","activeIcon","setActiveIcon","handleClear","_a","_b","inputEl","nativeInputValueSetter","ev2","handleOnChange","event","newValue","getIcon","Search","ActionIcon","Close","Box"],"mappings":"oXAoBA,IAAKA,OACHA,EAAA,OAAS,SACTA,EAAA,MAAQ,QAFLA,IAAAC,GAAA,CAAA,CAAA,EAKL,MAAMC,EAAaC,EAAOC,EAAM,CAC9B,MAAO,YACP,SAAU,WACV,cAAe,OACf,SAAU,CACR,KAAM,CACJ,GAAI,CACF,IAAK,KACL,MAAO,KACP,KAAM,IACR,EACA,GAAI,CACF,IAAK,GACL,MAAO,GACP,KAAM,EACR,CACF,CACF,CACF,CAAC,EAEKC,EAAoBF,EAAOG,EAAO,CACtC,6JACE,CACE,QAAS,MACX,CACJ,CAAC,EAEYC,EAA0CC,EAAM,WAC3D,CACE,CACE,KAAAC,EAAO,KACP,IAAAC,EACA,MAAAC,EACA,aAAAC,EAAe,GACf,cAAAC,EACA,UAAAC,EAAY,QACZ,SAAAC,KACGC,CACL,EACAC,IACG,CACH,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAAe,EAC7C,CAACC,EAAYC,CAAa,EAAId,EAAM,SAASI,CAAY,EACzD,CAACW,EAAYC,CAAa,EAAIhB,EAAM,SACxCI,EAAe,QAAmB,QACpC,EACAJ,EAAM,UAAU,IAAM,CAChB,OAAOG,EAAU,MACrBW,EAAcX,CAAK,EACnBa,EAAcb,EAAQ,QAAmB,QAAiB,EAC5D,EAAG,CAACA,CAAK,CAAC,EAEVH,EAAM,oBAAoBS,EAAK,IAAMC,EAAW,OAA2B,EAE3E,MAAMO,EAAc,IAAM,CA/E9B,IAAAC,EAAAC,EAgFM,MAAMC,EAAUV,EAAW,QAC3B,GAAI,CAACU,EAAS,OAGd,MAAMC,GAAyBH,EAAA,OAAO,yBACpC,OAAO,iBAAiB,UACxB,OACF,IAH+B,KAAAA,OAAAA,EAG5B,KACHC,EAAAE,GAAA,KAAAA,OAAAA,EAAwB,OAAxB,MAAAF,EAAA,KAAAE,EAA+BD,EAAS,EACxC,EAAA,MAAME,EAAM,IAAI,MAAM,QAAS,CAC7B,QAAS,EACX,CAAC,EACDF,EAAQ,cAAcE,CAAG,EACzBF,EAAQ,QACRf,GAAA,MAAAA,EAAgB,EAAA,CAClB,EAEMkB,EAAkBC,GAA+C,CACrEjB,GAAA,MAAAA,EAAWiB,CAAAA,EAEX,MAAMC,EAAWD,EAAM,OAAO,MAC9BV,EAAcW,CAAQ,EACtBpB,GAAA,MAAAA,EAAgBoB,GAChBT,EAAcS,EAAW,QAAmB,QAAiB,CAC/D,EAEMC,EAAU,IACVX,IAAe,SAEff,EAAA,cAACN,EAAA,CACC,GAAIiC,EACJ,KAAM1B,EACN,IAAK,CAAE,KAAMA,GAAQ,KAAO,KAAO,EAAG,CAAA,CACxC,EAIFD,EAAA,cAAC4B,EAAA,CACC,MAAOtB,EACP,MAAM,UACN,KAAML,EACN,IAAK,CAAE,SAAU,WAAY,IAAK,IAAK,MAAO,IAAK,EACnD,QAASgB,CAAAA,EAETjB,EAAA,cAACJ,EAAA,CAAK,GAAIiC,CAAAA,CAAO,CACnB,EAIJ,OACE7B,EAAA,cAAC8B,EAAA,CAAI,IAAK,CAAE,SAAU,WAAY,GAAG5B,CAAI,CAAA,EACvCF,EAAA,cAACH,EAAA,CACC,IAAKc,EACL,KAAMV,EACN,KAAK,SACJ,GAAGO,EACJ,MAAOK,EACP,SAAUU,EACV,IAAK,CAAE,GAAItB,IAAS,KAAO,KAAO,IAAK,CAAA,CACzC,EACCyB,EAAQ,CACX,CAEJ,CACF,EAEA3B,EAAY,YAAc"}

package/dist/components/select/Select.js

@@ -1 +1,2 @@
 import*as e from"react";import{styled as s,theme as c}from"../../stitches.js";import{encodeBackgroundIcon as p}from"../../utilities/style/encode-background-icon.js";const u=s("select",{appearance:"none",backgroundColor:"white",backgroundImage:p(c.colors.tonal300.value,"chevron"),backgroundRepeat:"no-repeat, repeat",border:"1px solid $tonal300",borderRadius:"$0",color:"$tonal600",display:"block",fontFamily:"$body",fontWeight:400,lineHeight:1.4,transition:"all 75ms ease-out",width:"100%","&:hover":{cursor:"pointer"},"&:focus":{borderColor:"$primary",outline:"none"},"&::-ms-expand":{display:"none"},"&[disabled], > option[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},variants:{size:{sm:{backgroundPosition:"right $space$2 top 50%, 0 0",backgroundSize:"18px auto, 100%",fontSize:"$sm",height:"$3",pl:"$2",pr:"$5"},md:{backgroundPosition:"right $space$3 top 50%, 0 0",backgroundSize:"20px auto, 100%",fontSize:"$md",height:"$4",pl:"$3",pr:"$6"}},state:{error:{border:"1px solid $danger"}}}}),t=e.forwardRef(({placeholder:r,children:n,size:l="md",...o},i)=>{const a={size:l,ref:i,...o};return[o.value,o.defaultValue].every(d=>d===void 0)&&(a.defaultValue=""),e.createElement(u,{...a},r&&e.createElement("option",{disabled:!0,hidden:!0,value:""},r),n)});t.displayName="Select";export{t as Select};
+//# sourceMappingURL=Select.js.map

package/dist/components/select/Select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.js","sources":["../../../src/components/select/Select.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled, theme } from '~/stitches'\nimport { encodeBackgroundIcon } from '~/utilities'\nimport { Override } from '~/utilities/types'\n\nconst StyledSelect = styled('select', {\n  appearance: 'none',\n  backgroundColor: 'white',\n  backgroundImage: encodeBackgroundIcon(theme.colors.tonal300.value, 'chevron'),\n  backgroundRepeat: 'no-repeat, repeat',\n  border: '1px solid $tonal300',\n  borderRadius: '$0',\n  color: '$tonal600',\n  display: 'block',\n  fontFamily: '$body',\n  fontWeight: 400,\n  lineHeight: 1.4,\n  transition: 'all 75ms ease-out',\n  width: '100%',\n  '&:hover': {\n    cursor: 'pointer'\n  },\n  '&:focus': {\n    borderColor: '$primary',\n    outline: 'none'\n  },\n  '&::-ms-expand': {\n    display: 'none'\n  },\n  '&[disabled], > option[disabled]': {\n    backgroundColor: '$tonal100',\n    color: '$tonal400',\n    cursor: 'not-allowed'\n  },\n  variants: {\n    size: {\n      sm: {\n        backgroundPosition: 'right $space$2 top 50%, 0 0',\n        backgroundSize: '18px auto, 100%',\n        fontSize: '$sm',\n        height: '$3',\n        pl: '$2',\n        pr: '$5'\n      },\n      md: {\n        backgroundPosition: 'right $space$3 top 50%, 0 0',\n        backgroundSize: '20px auto, 100%',\n        fontSize: '$md',\n        height: '$4',\n        pl: '$3',\n        pr: '$6'\n      }\n    },\n    state: {\n      error: {\n        border: '1px solid $danger'\n      }\n    }\n  }\n})\n\nexport type SelectProps = Override<\n  React.ComponentProps<typeof StyledSelect>,\n  {\n    as?: never\n    placeholder?: string\n  }\n  // TODO: figure out why uncommenting this causes TS errors in\n  // component declaration\n  // & (\n  //   | { id: string; 'aria-label'?: string }\n  //   | { 'aria-label': string; id?: string }\n  // )\n>\n\nexport const Select: React.FC<SelectProps> = React.forwardRef(\n  ({ placeholder, children, size = 'md', ...remainingProps }, ref) => {\n    const props = { size, ref, ...remainingProps }\n\n    if (\n      [remainingProps.value, remainingProps.defaultValue].every(\n        (value) => value === undefined\n      )\n    ) {\n      props.defaultValue = ''\n    }\n\n    return (\n      <StyledSelect {...props}>\n        {placeholder && (\n          <option disabled hidden value=\"\">\n            {placeholder}\n          </option>\n        )}\n        {children}\n      </StyledSelect>\n    )\n  }\n)\n\nSelect.displayName = 'Select'\n"],"names":["StyledSelect","styled","encodeBackgroundIcon","theme","Select","React","placeholder","children","size","remainingProps","ref","props","value"],"mappings":"qKAMA,MAAMA,EAAeC,EAAO,SAAU,CACpC,WAAY,OACZ,gBAAiB,QACjB,gBAAiBC,EAAqBC,EAAM,OAAO,SAAS,MAAO,SAAS,EAC5E,iBAAkB,oBAClB,OAAQ,sBACR,aAAc,KACd,MAAO,YACP,QAAS,QACT,WAAY,QACZ,WAAY,IACZ,WAAY,IACZ,WAAY,oBACZ,MAAO,OACP,UAAW,CACT,OAAQ,SACV,EACA,UAAW,CACT,YAAa,WACb,QAAS,MACX,EACA,gBAAiB,CACf,QAAS,MACX,EACA,kCAAmC,CACjC,gBAAiB,YACjB,MAAO,YACP,OAAQ,aACV,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,mBAAoB,8BACpB,eAAgB,kBAChB,SAAU,MACV,OAAQ,KACR,GAAI,KACJ,GAAI,IACN,EACA,GAAI,CACF,mBAAoB,8BACpB,eAAgB,kBAChB,SAAU,MACV,OAAQ,KACR,GAAI,KACJ,GAAI,IACN,CACF,EACA,MAAO,CACL,MAAO,CACL,OAAQ,mBACV,CACF,CACF,CACF,CAAC,EAgBYC,EAAgCC,EAAM,WACjD,CAAC,CAAE,YAAAC,EAAa,SAAAC,EAAU,KAAAC,EAAO,QAASC,CAAe,EAAGC,IAAQ,CAClE,MAAMC,EAAQ,CAAE,KAAAH,EAAM,IAAAE,EAAK,GAAGD,CAAe,EAE7C,MACE,CAACA,EAAe,MAAOA,EAAe,YAAY,EAAE,MACjDG,GAAUA,IAAU,MACvB,IAEAD,EAAM,aAAe,IAIrBN,EAAA,cAACL,EAAA,CAAc,GAAGW,CACfL,EAAAA,GACCD,EAAA,cAAC,SAAA,CAAO,SAAQ,GAAC,OAAM,GAAC,MAAM,EAAA,EAC3BC,CACH,EAEDC,CACH,CAEJ,CACF,EAEAH,EAAO,YAAc"}

package/dist/components/select-field/SelectField.js

@@ -1 +1,2 @@
-import*as t from"react";import{useFormContext as u}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 b}from"../form/useFieldError.js";import{Select as h}from"../select/Select.js";const l=({css:m=void 0,children:d,name:e,label:p,validation:r,prompt:a,description:n,hideLabel:s,...c})=>{const{register:o}=u(),{error:i}=b(e),f=r?o(r):o;return t.createElement(F,{css:m,description:n,error:i,fieldId:e,label:p,prompt:a,required:Boolean(r==null?void 0:r.required),hideLabel:s},t.createElement(h,{name:e,id:e,...c,ref:f,...i&&{state:"error"}},d))};l.displayName="SelectField";export{l as SelectField};
+import*as i from"react";import{useFormContext as u}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 b}from"../form/useFieldError.js";import{Select as h}from"../select/Select.js";const l=({css:m=void 0,children:d,name:e,label:p,validation:r,prompt:a,description:n,hideLabel:s,...c})=>{const{register:o}=u(),{error:t}=b(e),f=r?o(r):o;return i.createElement(F,{css:m,description:n,error:t,fieldId:e,label:p,prompt:a,required:Boolean(r==null?void 0:r.required),hideLabel:s},i.createElement(h,{name:e,id:e,...c,ref:f,...t&&{state:"error"}},d))};l.displayName="SelectField";export{l as SelectField};
+//# sourceMappingURL=SelectField.js.map

package/dist/components/select-field/SelectField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectField.js","sources":["../../../src/components/select-field/SelectField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { Select, SelectProps } from '~/components/select'\n\ntype SelectFieldProps = SelectProps & FieldElementWrapperProps\n\nexport const SelectField: React.FC<SelectFieldProps> = ({\n  css = undefined,\n  children,\n  name,\n  label,\n  validation,\n  prompt,\n  description,\n  hideLabel,\n  ...remainingProps\n}) => {\n  const { register } = useFormContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n\n  return (\n    <FieldWrapper\n      css={css}\n      description={description}\n      error={error}\n      fieldId={name}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      hideLabel={hideLabel}\n    >\n      <Select\n        name={name}\n        id={name}\n        {...remainingProps}\n        ref={ref}\n        {...(error && { state: 'error' })}\n      >\n        {children}\n      </Select>\n    </FieldWrapper>\n  )\n}\n\nSelectField.displayName = 'SelectField'\n"],"names":["SelectField","css","children","name","label","validation","prompt","description","hideLabel","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","Select"],"mappings":"sTAYO,MAAMA,EAA0C,CAAC,CACtD,IAAAC,EAAM,OACN,SAAAC,EACA,KAAAC,EACA,MAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,UAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcV,CAAI,EAC9BW,EAAMT,EAAaK,EAASL,CAAU,EAAIK,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKf,EACL,YAAaM,EACb,MAAOK,EACP,QAAST,EACT,MAAOC,EACP,OAAQE,EACR,SAAU,QAAQD,GAAA,KAAAA,OAAAA,EAAY,QAAQ,EACtC,UAAWG,CAEXO,EAAAA,EAAA,cAACE,EAAA,CACC,KAAMd,EACN,GAAIA,EACH,GAAGM,EACJ,IAAKK,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,CAE9BV,EAAAA,CACH,CACF,CAEJ,EAEAF,EAAY,YAAc"}

package/dist/components/sidedrawer/Sidedrawer.js

@@ -1 +1,2 @@
 import*as i from"@radix-ui/react-dialog";import d from"react";import"./SidedrawerAccordion/SidedrawerAccordionRoot.js";import{SidedrawerAccordionContent as t}from"./SidedrawerAccordion/SidedrawerAccordionContent.js";import{SidedrawerAccordionItem as m}from"./SidedrawerAccordion/SidedrawerAccordionItem.js";import{SidedrawerAccordionTrigger as n}from"./SidedrawerAccordion/SidedrawerAccordionTrigger.js";import{SidedrawerBody as a}from"./SidedrawerBody.js";import{SidedrawerClose as c}from"./SidedrawerClose.js";import{SidedrawerContent as p}from"./SidedrawerContent.js";import{SidedrawerFooter as f}from"./SidedrawerFooter.js";import{SidedrawerHeader as w}from"./SidedrawerHeader.js";import{SidedrawerItem as S}from"./SidedrawerItem.js";import{SidedrawerTrigger as g}from"./SidedrawerTrigger.js";const r=({children:o,...e})=>d.createElement(i.Root,{...e},o);r.Accordion=m,r.AccordionContent=t,r.AccordionTrigger=n,r.Body=a,r.Close=c,r.Content=p,r.Footer=f,r.Header=w,r.Item=S,r.Trigger=g;export{r as Sidedrawer};
+//# sourceMappingURL=Sidedrawer.js.map

package/dist/components/sidedrawer/Sidedrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sidedrawer.js","sources":["../../../src/components/sidedrawer/Sidedrawer.tsx"],"sourcesContent":["import * as Dialog from '@radix-ui/react-dialog'\nimport React from 'react'\n\nimport {\n  SidedrawerAccordionContent,\n  SidedrawerAccordionItem,\n  SidedrawerAccordionTrigger\n} from './SidedrawerAccordion'\nimport { SidedrawerBody } from './SidedrawerBody'\nimport { SidedrawerClose } from './SidedrawerClose'\nimport { SidedrawerContent } from './SidedrawerContent'\nimport { SidedrawerFooter } from './SidedrawerFooter'\nimport { SidedrawerHeader } from './SidedrawerHeader'\nimport { SidedrawerItem } from './SidedrawerItem'\nimport { SidedrawerTrigger } from './SidedrawerTrigger'\n\ntype SidedrawerSubComponents = {\n  Accordion: typeof SidedrawerAccordionItem\n  AccordionContent: typeof SidedrawerAccordionContent\n  AccordionTrigger: typeof SidedrawerAccordionTrigger\n  Body: typeof SidedrawerBody\n  Close: typeof SidedrawerClose\n  Content: typeof SidedrawerContent\n  Footer: typeof SidedrawerFooter\n  Header: typeof SidedrawerHeader\n  Item: typeof SidedrawerItem\n  Trigger: typeof SidedrawerTrigger\n}\n\nexport const Sidedrawer: React.FC<React.ComponentProps<typeof Dialog.Root>> &\n  SidedrawerSubComponents = ({ children, ...remainingProps }) => (\n  <Dialog.Root {...remainingProps}>{children}</Dialog.Root>\n)\n\nSidedrawer.Accordion = SidedrawerAccordionItem\nSidedrawer.AccordionContent = SidedrawerAccordionContent\nSidedrawer.AccordionTrigger = SidedrawerAccordionTrigger\nSidedrawer.Body = SidedrawerBody\nSidedrawer.Close = SidedrawerClose\nSidedrawer.Content = SidedrawerContent\nSidedrawer.Footer = SidedrawerFooter\nSidedrawer.Header = SidedrawerHeader\nSidedrawer.Item = SidedrawerItem\nSidedrawer.Trigger = SidedrawerTrigger\n"],"names":["Sidedrawer","children","remainingProps","React","Dialog","SidedrawerAccordionItem","SidedrawerAccordionContent","SidedrawerAccordionTrigger","SidedrawerBody","SidedrawerClose","SidedrawerContent","SidedrawerFooter","SidedrawerHeader","SidedrawerItem","SidedrawerTrigger"],"mappings":"6xBA6Ba,MAAAA,EACe,CAAC,CAAE,SAAAC,KAAaC,CAAe,IACzDC,EAAA,cAACC,EAAO,KAAP,CAAa,GAAGF,CAAAA,EAAiBD,CAAS,EAG7CD,EAAW,UAAYK,EACvBL,EAAW,iBAAmBM,EAC9BN,EAAW,iBAAmBO,EAC9BP,EAAW,KAAOQ,EAClBR,EAAW,MAAQS,EACnBT,EAAW,QAAUU,EACrBV,EAAW,OAASW,EACpBX,EAAW,OAASY,EACpBZ,EAAW,KAAOa,EAClBb,EAAW,QAAUc"}

package/dist/components/sidedrawer/Sidedrawer.styles.js

@@ -1 +1,2 @@
 const t={alignItems:"center",bg:"white",border:"unset",borderLeft:"4px solid transparent",color:"$tonal600",cursor:"pointer",display:"flex",fontFamily:"$body",fontWeight:"400",fontSize:"$md",margin:0,minHeight:"48px",outline:"unset",outlineOffset:"unset",py:"$3",px:"$4",width:"100%",textDecoration:"none","&:hover":{bg:"$tonal50"},"&:active":{bg:"$tonal100"},"&:focus-visible":{boxShadow:"inset 0 0 0 2px $colors$primary"},"&[disabled]":{opacity:"0.3",pointerEvents:"none",cursor:"default"},variants:{active:{true:{bg:"$primaryLight",borderLeft:"4px solid $primary",color:"$primary",fontWeight:"600"}}}};export{t as sidedrawerItemStyles};
+//# sourceMappingURL=Sidedrawer.styles.js.map

package/dist/components/sidedrawer/Sidedrawer.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sidedrawer.styles.js","sources":["../../../src/components/sidedrawer/Sidedrawer.styles.ts"],"sourcesContent":["export const sidedrawerItemStyles = {\n  alignItems: 'center',\n  bg: 'white',\n  border: 'unset',\n  borderLeft: '4px solid transparent',\n  color: '$tonal600',\n  cursor: 'pointer',\n  display: 'flex',\n  fontFamily: '$body',\n  fontWeight: '400',\n  fontSize: '$md',\n  margin: 0,\n  minHeight: '48px',\n  outline: 'unset',\n  outlineOffset: 'unset',\n  py: '$3',\n  px: '$4',\n  width: '100%',\n  textDecoration: 'none',\n  '&:hover': { bg: '$tonal50' },\n  '&:active': { bg: '$tonal100' },\n  '&:focus-visible': {\n    boxShadow: 'inset 0 0 0 2px $colors$primary'\n  },\n  '&[disabled]': {\n    opacity: '0.3',\n    pointerEvents: 'none',\n    cursor: 'default'\n  },\n  variants: {\n    active: {\n      true: {\n        bg: '$primaryLight',\n        borderLeft: '4px solid $primary',\n        color: '$primary',\n        fontWeight: '600'\n      }\n    }\n  }\n}\n"],"names":["sidedrawerItemStyles"],"mappings":"AAAO,MAAMA,EAAuB,CAClC,WAAY,SACZ,GAAI,QACJ,OAAQ,QACR,WAAY,wBACZ,MAAO,YACP,OAAQ,UACR,QAAS,OACT,WAAY,QACZ,WAAY,MACZ,SAAU,MACV,OAAQ,EACR,UAAW,OACX,QAAS,QACT,cAAe,QACf,GAAI,KACJ,GAAI,KACJ,MAAO,OACP,eAAgB,OAChB,UAAW,CAAE,GAAI,UAAW,EAC5B,WAAY,CAAE,GAAI,WAAY,EAC9B,kBAAmB,CACjB,UAAW,iCACb,EACA,cAAe,CACb,QAAS,MACT,cAAe,OACf,OAAQ,SACV,EACA,SAAU,CACR,OAAQ,CACN,KAAM,CACJ,GAAI,gBACJ,WAAY,qBACZ,MAAO,WACP,WAAY,KACd,CACF,CACF,CACF"}

package/dist/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionContent.js

@@ -1 +1,2 @@
-import{Content as i}from"@radix-ui/react-accordion";import t from"react";import{keyframes as o,styled as n}from"../../../stitches.js";import{Box as m}from"../../box/Box.js";const c=o({from:{height:0},to:{height:"var(--radix-accordion-content-height)"}}),d=o({from:{height:"var(--radix-accordion-content-height)"},to:{height:0}}),h=n(i,{bg:"white",overflow:"hidden","@allowMotion":{'&[data-state="open"]':{animation:`${c} 300ms ease-out`},'&[data-state="closed"]':{animation:`${d} 300ms ease-out`}}}),s=({children:e,...a})=>t.createElement(h,{...a},t.Children.map(e,r=>t.createElement(m,{css:{"> a":{px:"$6"},"> button":{px:"$6"}}},r)));export{s as SidedrawerAccordionContent};
+import{Content as i}from"@radix-ui/react-accordion";import t from"react";import{keyframes as e,styled as n}from"../../../stitches.js";import{Box as m}from"../../box/Box.js";const c=e({from:{height:0},to:{height:"var(--radix-accordion-content-height)"}}),d=e({from:{height:"var(--radix-accordion-content-height)"},to:{height:0}}),h=n(i,{bg:"white",overflow:"hidden","@allowMotion":{'&[data-state="open"]':{animation:`${c} 300ms ease-out`},'&[data-state="closed"]':{animation:`${d} 300ms ease-out`}}}),s=({children:o,...a})=>t.createElement(h,{...a},t.Children.map(o,r=>t.createElement(m,{css:{"> a":{px:"$6"},"> button":{px:"$6"}}},r)));export{s as SidedrawerAccordionContent};
+//# sourceMappingURL=SidedrawerAccordionContent.js.map

package/dist/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerAccordionContent.js","sources":["../../../../src/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionContent.tsx"],"sourcesContent":["import { Content } from '@radix-ui/react-accordion'\nimport React from 'react'\n\nimport { keyframes, styled } from '~/stitches'\n\nimport { Box } from '../../box/Box'\n\nconst open = keyframes({\n  from: { height: 0 },\n  to: { height: 'var(--radix-accordion-content-height)' }\n})\n\nconst close = keyframes({\n  from: { height: 'var(--radix-accordion-content-height)' },\n  to: { height: 0 }\n})\n\nconst StyledContent = styled(Content, {\n  bg: 'white',\n  overflow: 'hidden',\n  '@allowMotion': {\n    '&[data-state=\"open\"]': { animation: `${open} 300ms ease-out` },\n    '&[data-state=\"closed\"]': { animation: `${close} 300ms ease-out` }\n  }\n})\n\nexport const SidedrawerAccordionContent: React.FC<\n  React.ComponentProps<typeof StyledContent>\n> = ({ children, ...remainingProps }) => (\n  <StyledContent {...remainingProps}>\n    {React.Children.map(children, (child) => {\n      return (\n        <Box\n          css={{\n            '> a': {\n              px: '$6'\n            },\n            '> button': {\n              px: '$6'\n            }\n          }}\n        >\n          {child}\n        </Box>\n      )\n    })}\n  </StyledContent>\n)\n"],"names":["open","keyframes","close","StyledContent","styled","Content","SidedrawerAccordionContent","children","remainingProps","React","child","Box"],"mappings":"6KAOA,MAAMA,EAAOC,EAAU,CACrB,KAAM,CAAE,OAAQ,CAAE,EAClB,GAAI,CAAE,OAAQ,uCAAwC,CACxD,CAAC,EAEKC,EAAQD,EAAU,CACtB,KAAM,CAAE,OAAQ,uCAAwC,EACxD,GAAI,CAAE,OAAQ,CAAE,CAClB,CAAC,EAEKE,EAAgBC,EAAOC,EAAS,CACpC,GAAI,QACJ,SAAU,SACV,eAAgB,CACd,uBAAwB,CAAE,UAAW,GAAGL,kBAAsB,EAC9D,yBAA0B,CAAE,UAAW,GAAGE,kBAAuB,CACnE,CACF,CAAC,EAEYI,EAET,CAAC,CAAE,SAAAC,KAAaC,CAAe,IACjCC,EAAA,cAACN,EAAA,CAAe,GAAGK,CAAAA,EAChBC,EAAM,SAAS,IAAIF,EAAWG,GAE3BD,EAAA,cAACE,EAAA,CACC,IAAK,CACH,MAAO,CACL,GAAI,IACN,EACA,WAAY,CACV,GAAI,IACN,CACF,CAAA,EAECD,CACH,CAEH,CACH"}

package/dist/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionItem.js

@@ -1 +1,2 @@
 import{Item as o}from"@radix-ui/react-accordion";import{styled as r}from"../../../stitches.js";const t=r(o,{});export{t as SidedrawerAccordionItem};
+//# sourceMappingURL=SidedrawerAccordionItem.js.map

package/dist/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerAccordionItem.js","sources":["../../../../src/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionItem.tsx"],"sourcesContent":["import { Item } from '@radix-ui/react-accordion'\n\nimport { styled } from '~/stitches'\n\nexport const SidedrawerAccordionItem = styled(Item, {})\n"],"names":["SidedrawerAccordionItem","styled","Item"],"mappings":"+FAIO,MAAMA,EAA0BC,EAAOC,EAAM,CAAE,CAAA"}

package/dist/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionRoot.js

@@ -1 +1,2 @@
 import{Root as r}from"@radix-ui/react-accordion";import{styled as d}from"../../../stitches.js";const o=d(r,{width:"100%"});o.displayName="SidedrawerAccordionRoot";export{o as SidedrawerAccordionRoot};
+//# sourceMappingURL=SidedrawerAccordionRoot.js.map

package/dist/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerAccordionRoot.js","sources":["../../../../src/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionRoot.tsx"],"sourcesContent":["import { Root } from '@radix-ui/react-accordion'\n\nimport { styled } from '~/stitches'\n\nexport const SidedrawerAccordionRoot = styled(Root, {\n  width: '100%'\n})\n\nSidedrawerAccordionRoot.displayName = 'SidedrawerAccordionRoot'\n"],"names":["SidedrawerAccordionRoot","styled","Root"],"mappings":"+FAIO,MAAMA,EAA0BC,EAAOC,EAAM,CAClD,MAAO,MACT,CAAC,EAEDF,EAAwB,YAAc"}

package/dist/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionTrigger.js

@@ -1 +1,2 @@
 import{ChevronDown as m}from"@atom-learning/icons";import{Trigger as n,Header as a}from"@radix-ui/react-accordion";import e from"react";import{styled as t}from"../../../stitches.js";import{Flex as i}from"../../flex/Flex.js";import{Icon as s}from"../../icon/Icon.js";import{sidedrawerItemStyles as c}from"../Sidedrawer.styles.js";const p=t(n,{justifyContent:"space-between",m:0,p:0,"&[data-state=open]":{fontWeight:"600"},...c}),d=t(s,{transition:"transform 300ms",'[data-state="open"] > &':{transform:"rotate(180deg)"}}),f=({children:r,...o})=>e.createElement(a,null,e.createElement(p,{...o},e.createElement(i,{css:{alignItems:"center"}},r),e.createElement(d,{is:m,size:"sm"})));export{f as SidedrawerAccordionTrigger};
+//# sourceMappingURL=SidedrawerAccordionTrigger.js.map

package/dist/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerAccordionTrigger.js","sources":["../../../../src/components/sidedrawer/SidedrawerAccordion/SidedrawerAccordionTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Header, Trigger } from '@radix-ui/react-accordion'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Flex } from '../../flex/Flex'\nimport { Icon } from '../../icon/Icon'\nimport { sidedrawerItemStyles } from '../Sidedrawer.styles'\n\nconst StyledTrigger = styled(Trigger, {\n  justifyContent: 'space-between',\n  m: 0,\n  p: 0,\n  '&[data-state=open]': { fontWeight: '600' },\n  ...sidedrawerItemStyles\n})\n\nconst StyledIcon = styled(Icon, {\n  transition: 'transform 300ms',\n  '[data-state=\"open\"] > &': {\n    transform: 'rotate(180deg)'\n  }\n})\n\nexport const SidedrawerAccordionTrigger: React.FC<\n  React.ComponentProps<typeof StyledTrigger>\n> = ({ children, ...remainingProps }) => (\n  <Header>\n    <StyledTrigger {...remainingProps}>\n      <Flex\n        css={{\n          alignItems: 'center'\n        }}\n      >\n        {children}\n      </Flex>\n      <StyledIcon is={ChevronDown} size=\"sm\" />\n    </StyledTrigger>\n  </Header>\n)\n"],"names":["StyledTrigger","styled","Trigger","sidedrawerItemStyles","StyledIcon","Icon","SidedrawerAccordionTrigger","children","remainingProps","React","Header","Flex","ChevronDown"],"mappings":"yUAUA,MAAMA,EAAgBC,EAAOC,EAAS,CACpC,eAAgB,gBAChB,EAAG,EACH,EAAG,EACH,qBAAsB,CAAE,WAAY,KAAM,EAC1C,GAAGC,CACL,CAAC,EAEKC,EAAaH,EAAOI,EAAM,CAC9B,WAAY,kBACZ,0BAA2B,CACzB,UAAW,gBACb,CACF,CAAC,EAEYC,EAET,CAAC,CAAE,SAAAC,KAAaC,CAAe,IACjCC,EAAA,cAACC,EAAA,KACCD,EAAA,cAACT,EAAA,CAAe,GAAGQ,GACjBC,EAAA,cAACE,EAAA,CACC,IAAK,CACH,WAAY,QACd,CAAA,EAECJ,CACH,EACAE,EAAA,cAACL,EAAA,CAAW,GAAIQ,EAAa,KAAK,IAAK,CAAA,CACzC,CACF"}

package/dist/components/sidedrawer/SidedrawerBody.js

@@ -1 +1,2 @@
 import r,{isValidElement as l}from"react";import{Box as d}from"../box/Box.js";import{SidedrawerAccordionRoot as m}from"./SidedrawerAccordion/SidedrawerAccordionRoot.js";import"./SidedrawerAccordion/SidedrawerAccordionContent.js";import"./SidedrawerAccordion/SidedrawerAccordionItem.js";import"./SidedrawerAccordion/SidedrawerAccordionTrigger.js";const a=({children:e})=>{let o=!1;return r.Children.forEach(e,t=>{var i;l(t)&&((i=t.props)==null?void 0:i.value)&&(o=!0)}),r.createElement(d,{css:{flexGrow:1,width:"100%",overflowY:"auto"}},o?r.createElement(m,{type:"single"},e):e)};export{a as SidedrawerBody};
+//# sourceMappingURL=SidedrawerBody.js.map

package/dist/components/sidedrawer/SidedrawerBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerBody.js","sources":["../../../src/components/sidedrawer/SidedrawerBody.tsx"],"sourcesContent":["import React, { isValidElement } from 'react'\n\nimport { Box } from '../box'\nimport { SidedrawerAccordionRoot } from './SidedrawerAccordion/'\n\nexport const SidedrawerBody: React.FC = ({ children }) => {\n  let hasAccordionItems = false\n\n  React.Children.forEach(children, (child) => {\n    if (isValidElement(child) && child.props?.value) {\n      hasAccordionItems = true\n    }\n  })\n\n  return (\n    <Box\n      css={{\n        flexGrow: 1,\n        width: '100%',\n        overflowY: 'auto'\n      }}\n    >\n      {hasAccordionItems ? (\n        <SidedrawerAccordionRoot type=\"single\">\n          {children}\n        </SidedrawerAccordionRoot>\n      ) : (\n        children\n      )}\n    </Box>\n  )\n}\n"],"names":["SidedrawerBody","children","hasAccordionItems","React","child","_a","isValidElement","Box","SidedrawerAccordionRoot"],"mappings":"0VAKO,MAAMA,EAA2B,CAAC,CAAE,SAAAC,CAAS,IAAM,CACxD,IAAIC,EAAoB,GAExB,OAAAC,EAAM,SAAS,QAAQF,EAAWG,GAAU,CAR9C,IAAAC,EASQC,EAAeF,CAAK,KAAKC,EAAAD,EAAM,QAAN,KAAAC,OAAAA,EAAa,SACxCH,EAAoB,GAExB,CAAC,EAGCC,EAAA,cAACI,EAAA,CACC,IAAK,CACH,SAAU,EACV,MAAO,OACP,UAAW,MACb,CAAA,EAECL,EACCC,EAAA,cAACK,EAAA,CAAwB,KAAK,QAAA,EAC3BP,CACH,EAEAA,CAEJ,CAEJ"}

package/dist/components/sidedrawer/SidedrawerClose.js

@@ -1 +1,2 @@
 import{Close as l}from"@atom-learning/icons";import{Close as i}from"@radix-ui/react-dialog";import e from"react";import{ActionIcon as s}from"../action-icon/ActionIcon.js";import{Icon as p}from"../icon/Icon.js";const c=({appearance:o="simple",label:r="close",size:t="md",theme:m="neutral",...a})=>e.createElement(i,{asChild:!0},e.createElement(s,{theme:m,appearance:o,size:t,label:r,...a},e.createElement(p,{is:l})));export{c as SidedrawerClose};
+//# sourceMappingURL=SidedrawerClose.js.map

package/dist/components/sidedrawer/SidedrawerClose.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerClose.js","sources":["../../../src/components/sidedrawer/SidedrawerClose.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport { Close as DialogClose } from '@radix-ui/react-dialog'\nimport React from 'react'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\n\nexport const SidedrawerClose: React.FC<\n  React.ComponentProps<typeof ActionIcon>\n> = ({\n  appearance = 'simple',\n  label = 'close',\n  size = 'md',\n  theme = 'neutral',\n\n  ...remainingProps\n}) => (\n  <DialogClose asChild>\n    <ActionIcon\n      theme={theme}\n      appearance={appearance}\n      size={size}\n      label={label}\n      {...remainingProps}\n    >\n      <Icon is={Close} />\n    </ActionIcon>\n  </DialogClose>\n)\n"],"names":["SidedrawerClose","appearance","label","size","theme","remainingProps","React","DialogClose","ActionIcon","Icon","Close"],"mappings":"kNAOa,MAAAA,EAET,CAAC,CACH,WAAAC,EAAa,SACb,MAAAC,EAAQ,QACR,KAAAC,EAAO,KACP,MAAAC,EAAQ,aAELC,CACL,IACEC,EAAA,cAACC,EAAA,CAAY,QAAO,EAClBD,EAAAA,EAAA,cAACE,EAAA,CACC,MAAOJ,EACP,WAAYH,EACZ,KAAME,EACN,MAAOD,EACN,GAAGG,CAAAA,EAEJC,EAAA,cAACG,EAAA,CAAK,GAAIC,CAAAA,CAAO,CACnB,CACF"}

package/dist/components/sidedrawer/SidedrawerContent.js

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

package/dist/components/sidedrawer/SidedrawerContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerContent.js","sources":["../../../src/components/sidedrawer/SidedrawerContent.tsx"],"sourcesContent":["import { Content, Portal } from '@radix-ui/react-dialog'\nimport React from 'react'\n\nimport { MAX_Z_INDEX } from '~/constants/zIndices'\nimport { styled } from '~/stitches'\nimport { slideInLeft, slideOutLeft } from '~/utilities'\n\nimport { SidedrawerOverlay } from './SidedrawerOverlay'\n\nconst StyledContent = styled(Content, {\n  bg: 'white',\n  boxShadow: '$2',\n  display: 'flex',\n  flexDirection: 'column',\n  position: 'fixed',\n  top: 0,\n  left: 0,\n  height: '100%',\n  maxWidth: '304px',\n  width: '100%',\n  zIndex: MAX_Z_INDEX,\n  '@allowMotion': {\n    '&[data-state=\"open\"]': {\n      animation: `${slideInLeft} 250ms ease-out`\n    },\n    '&[data-state=\"closed\"]': {\n      animation: `${slideOutLeft} 250ms ease-out`\n    }\n  }\n})\n\nexport const SidedrawerContent: React.FC<\n  React.ComponentProps<typeof StyledContent>\n> = ({ children, ...remainingProps }) => (\n  <Portal>\n    <SidedrawerOverlay data-testid=\"sidedrawer_overlay\" />\n    <StyledContent role=\"navigation\" {...remainingProps}>\n      {children}\n    </StyledContent>\n  </Portal>\n)\n"],"names":["StyledContent","styled","Content","MAX_Z_INDEX","slideInLeft","slideOutLeft","SidedrawerContent","children","remainingProps","React","Portal","SidedrawerOverlay"],"mappings":"+UASA,MAAMA,EAAgBC,EAAOC,EAAS,CACpC,GAAI,QACJ,UAAW,KACX,QAAS,OACT,cAAe,SACf,SAAU,QACV,IAAK,EACL,KAAM,EACN,OAAQ,OACR,SAAU,QACV,MAAO,OACP,OAAQC,EACR,eAAgB,CACd,uBAAwB,CACtB,UAAW,GAAGC,kBAChB,EACA,yBAA0B,CACxB,UAAW,GAAGC,kBAChB,CACF,CACF,CAAC,EAEYC,EAET,CAAC,CAAE,SAAAC,KAAaC,CAAe,IACjCC,EAAA,cAACC,EAAA,KACCD,EAAA,cAACE,EAAA,CAAkB,cAAY,qBAAqB,EACpDF,EAAA,cAACT,EAAA,CAAc,KAAK,aAAc,GAAGQ,CAClCD,EAAAA,CACH,CACF"}

package/dist/components/sidedrawer/SidedrawerFooter.js

@@ -1 +1,2 @@
 import{styled as o}from"../../stitches.js";const t=o("footer",{alignItems:"center",borderTop:"1px solid $tonal100",bottom:0,boxShadow:"$3",display:"flex",height:"$6",justifyContent:"center",p:"$3",width:"100%"});export{t as SidedrawerFooter};
+//# sourceMappingURL=SidedrawerFooter.js.map

package/dist/components/sidedrawer/SidedrawerFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerFooter.js","sources":["../../../src/components/sidedrawer/SidedrawerFooter.tsx"],"sourcesContent":["import { styled } from '~/stitches'\n\nexport const SidedrawerFooter = styled('footer', {\n  alignItems: 'center',\n  borderTop: '1px solid $tonal100',\n  bottom: 0,\n  boxShadow: '$3',\n  display: 'flex',\n  height: '$6',\n  justifyContent: 'center',\n  p: '$3',\n  width: '100%'\n})\n"],"names":["SidedrawerFooter","styled"],"mappings":"2CAEa,MAAAA,EAAmBC,EAAO,SAAU,CAC/C,WAAY,SACZ,UAAW,sBACX,OAAQ,EACR,UAAW,KACX,QAAS,OACT,OAAQ,KACR,eAAgB,SAChB,EAAG,KACH,MAAO,MACT,CAAC"}

package/dist/components/sidedrawer/SidedrawerHeader.js

@@ -1 +1,2 @@
 import e from"react";import{styled as o}from"../../stitches.js";import{TopBar as d}from"../top-bar/TopBar.js";const m=o("header",{"> div":{width:"100%"}}),a=({children:r,...t})=>e.createElement(m,{...t},e.createElement(d,{css:{mx:"$3"}},r));export{a as SidedrawerHeader};
+//# sourceMappingURL=SidedrawerHeader.js.map

package/dist/components/sidedrawer/SidedrawerHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerHeader.js","sources":["../../../src/components/sidedrawer/SidedrawerHeader.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { TopBar } from '../top-bar'\n\nconst StyledHeader = styled('header', {\n  '> div': {\n    width: '100%'\n  }\n})\n\nexport const SidedrawerHeader: React.FC<\n  React.ComponentProps<typeof StyledHeader>\n> = ({ children, ...remainingProps }) => (\n  <StyledHeader {...remainingProps}>\n    <TopBar\n      css={{\n        mx: '$3'\n      }}\n    >\n      {children}\n    </TopBar>\n  </StyledHeader>\n)\n"],"names":["StyledHeader","styled","SidedrawerHeader","children","remainingProps","React","TopBar"],"mappings":"8GAMA,MAAMA,EAAeC,EAAO,SAAU,CACpC,QAAS,CACP,MAAO,MACT,CACF,CAAC,EAEYC,EAET,CAAC,CAAE,SAAAC,KAAaC,CAAe,IACjCC,EAAA,cAACL,EAAA,CAAc,GAAGI,GAChBC,EAAA,cAACC,EAAA,CACC,IAAK,CACH,GAAI,IACN,CAECH,EAAAA,CACH,CACF"}

package/dist/components/sidedrawer/SidedrawerItem.js

@@ -1 +1,2 @@
 import a from"react";import{styled as c}from"../../stitches.js";import{sidedrawerItemStyles as l}from"./Sidedrawer.styles.js";const d=c("a",l),n=c("button",l),s=({active:e,children:t,disabled:m,href:r,onClick:i,...o})=>r?a.createElement(d,{active:e,href:r,onClick:i,...o},t):a.createElement(n,{active:e,disabled:m,onClick:i,...o},t);export{s as SidedrawerItem};
+//# sourceMappingURL=SidedrawerItem.js.map

package/dist/components/sidedrawer/SidedrawerItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerItem.js","sources":["../../../src/components/sidedrawer/SidedrawerItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { sidedrawerItemStyles } from './Sidedrawer.styles'\n\nconst StyledLink = styled('a', sidedrawerItemStyles)\nconst StyledButton = styled('button', sidedrawerItemStyles)\n\ntype SidedrawerItemProps = {\n  active?: boolean\n  disabled?: boolean\n  href?: string\n  onClick?: () => void\n}\n\nexport const SidedrawerItem: React.FC<SidedrawerItemProps> = ({\n  active,\n  children,\n  disabled,\n  href,\n  onClick,\n  ...remainingProps\n}) => {\n  if (href) {\n    return (\n      <StyledLink\n        active={active}\n        href={href}\n        onClick={onClick}\n        {...remainingProps}\n      >\n        {children}\n      </StyledLink>\n    )\n  }\n\n  return (\n    <StyledButton\n      active={active}\n      disabled={disabled}\n      onClick={onClick}\n      {...remainingProps}\n    >\n      {children}\n    </StyledButton>\n  )\n}\n"],"names":["StyledLink","styled","sidedrawerItemStyles","StyledButton","SidedrawerItem","active","children","disabled","href","onClick","remainingProps","React"],"mappings":"8HAMA,MAAMA,EAAaC,EAAO,IAAKC,CAAoB,EAC7CC,EAAeF,EAAO,SAAUC,CAAoB,EAS7CE,EAAgD,CAAC,CAC5D,OAAAC,EACA,SAAAC,EACA,SAAAC,EACA,KAAAC,EACA,QAAAC,KACGC,CACL,IACMF,EAEAG,EAAA,cAACX,EAAA,CACC,OAAQK,EACR,KAAMG,EACN,QAASC,EACR,GAAGC,CAEHJ,EAAAA,CACH,EAKFK,EAAA,cAACR,EAAA,CACC,OAAQE,EACR,SAAUE,EACV,QAASE,EACR,GAAGC,GAEHJ,CACH"}

package/dist/components/sidedrawer/SidedrawerOverlay.js

@@ -1 +1,2 @@
 import{Overlay as o}from"@radix-ui/react-dialog";import{MAX_Z_INDEX as t}from"../../constants/zIndices.js";import{styled as a}from"../../stitches.js";import{fadeIn as e,fadeOut as i}from"../../utilities/style/keyframe-animations.js";const r=a(o,{animationFillMode:"forwards",bg:"$alpha600",cursor:"pointer",height:"100vh",left:"0",position:"fixed",top:"0",width:"100vw",zIndex:t-1,"@allowMotion":{'&[data-state="open"]':{animation:`${e} 250ms ease-out`},'&[data-state="closed"]':{animation:`${i} 550ms ease-out`}}});export{r as SidedrawerOverlay};
+//# sourceMappingURL=SidedrawerOverlay.js.map

package/dist/components/sidedrawer/SidedrawerOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerOverlay.js","sources":["../../../src/components/sidedrawer/SidedrawerOverlay.tsx"],"sourcesContent":["import { Overlay } from '@radix-ui/react-dialog'\n\nimport { MAX_Z_INDEX } from '~/constants/zIndices'\nimport { styled } from '~/stitches'\nimport { fadeIn, fadeOut } from '~/utilities'\n\nexport const SidedrawerOverlay = styled(Overlay, {\n  animationFillMode: 'forwards',\n  bg: '$alpha600',\n  cursor: 'pointer',\n  height: '100vh',\n  left: '0',\n  position: 'fixed',\n  top: '0',\n  width: '100vw',\n  zIndex: MAX_Z_INDEX - 1,\n  '@allowMotion': {\n    '&[data-state=\"open\"]': {\n      animation: `${fadeIn} 250ms ease-out`\n    },\n    '&[data-state=\"closed\"]': {\n      animation: `${fadeOut} 550ms ease-out`\n    }\n  }\n})\n"],"names":["SidedrawerOverlay","styled","Overlay","MAX_Z_INDEX","fadeIn","fadeOut"],"mappings":"yOAMO,MAAMA,EAAoBC,EAAOC,EAAS,CAC/C,kBAAmB,WACnB,GAAI,YACJ,OAAQ,UACR,OAAQ,QACR,KAAM,IACN,SAAU,QACV,IAAK,IACL,MAAO,QACP,OAAQC,EAAc,EACtB,eAAgB,CACd,uBAAwB,CACtB,UAAW,GAAGC,kBAChB,EACA,yBAA0B,CACxB,UAAW,GAAGC,kBAChB,CACF,CACF,CAAC"}

package/dist/components/sidedrawer/SidedrawerTrigger.js

@@ -1 +1,2 @@
 import{Trigger as r}from"@radix-ui/react-dialog";import{styled as e}from"../../stitches.js";const o=e(r,{});export{o as SidedrawerTrigger};
+//# sourceMappingURL=SidedrawerTrigger.js.map

package/dist/components/sidedrawer/SidedrawerTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidedrawerTrigger.js","sources":["../../../src/components/sidedrawer/SidedrawerTrigger.tsx"],"sourcesContent":["import { Trigger } from '@radix-ui/react-dialog'\n\nimport { styled } from '~/stitches'\n\nexport const SidedrawerTrigger = styled(Trigger, {})\n"],"names":["SidedrawerTrigger","styled","Trigger"],"mappings":"4FAIO,MAAMA,EAAoBC,EAAOC,EAAS,CAAE,CAAA"}

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

package/dist/components/slider/Slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.js","sources":["../../../src/components/slider/Slider.tsx"],"sourcesContent":["import { Range, Root, Thumb, Track } from '@radix-ui/react-slider'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { CSSWrapper } from '~/utilities'\n\nimport { SliderSteps } from './SliderSteps'\nimport { SliderValue } from './SliderValue'\n\nconst StyledTrack = styled(Track, {\n  borderRadius: '$round',\n  flexGrow: 1,\n  position: 'relative',\n  '&[data-orientation=\"horizontal\"]': { height: '$space$1' },\n  '&[data-orientation=\"vertical\"]': { width: '$space$1' }\n})\n\nconst StyledSlider = styled(Root, {\n  alignItems: 'center',\n  display: 'flex',\n  position: 'relative',\n  touchAction: 'none',\n  userSelect: 'none',\n  cursor: 'pointer',\n  '&[data-orientation=\"horizontal\"]': {\n    height: '$1'\n  },\n  '&[data-orientation=\"vertical\"]': {\n    flexDirection: 'column',\n    width: '$1'\n  },\n  '&[data-disabled]': { cursor: 'not-allowed', bg: '$tonal100' },\n  variants: {\n    theme: {\n      light: {\n        [`${StyledTrack}`]: { bg: '#fff' }\n      },\n      tonal: {\n        [`${StyledTrack}`]: { bg: '$tonal200' }\n      }\n    }\n  }\n})\n\nconst StyledRange = styled(Range, {\n  bg: '$primary',\n  borderRadius: '$round',\n  height: '100%',\n  position: 'absolute',\n  '&[data-disabled]': { bg: '$tonal200', cursor: 'not-allowed' }\n})\n\nconst StyledThumb = styled(Thumb, {\n  bg: '$primaryMid',\n  borderRadius: '$round',\n  display: 'block',\n  size: '$1',\n  '&:hover': {\n    bg: '$primaryDark'\n  },\n  '&:focus': {\n    outline: '2px solid $primaryMid',\n    outlineOffset: '2px'\n  },\n  '&[data-disabled]': { bg: '$tonal200', cursor: 'not-allowed' }\n})\n\nexport type SliderProps = React.ComponentProps<typeof StyledSlider>\n\ntype SliderType = React.ForwardRefExoticComponent<SliderProps> & {\n  Value: typeof SliderValue\n  Steps: typeof SliderSteps\n}\n\nexport const Slider: SliderType = React.forwardRef(\n  (\n    {\n      value,\n      defaultValue,\n      min = 0,\n      max = 100,\n      theme = 'tonal',\n      css,\n      children,\n      ...remainingProps\n    },\n    ref\n  ) => {\n    const values = value || defaultValue\n    return (\n      <CSSWrapper css={css}>\n        <StyledSlider\n          theme={theme}\n          defaultValue={defaultValue}\n          value={value}\n          min={min}\n          max={max}\n          ref={ref}\n          {...remainingProps}\n        >\n          <StyledTrack>\n            <StyledRange />\n          </StyledTrack>\n          {values?.length &&\n            values.map((_, i) => <StyledThumb key={`thumb${i}`} />)}\n        </StyledSlider>\n        {children}\n      </CSSWrapper>\n    )\n  }\n) as SliderType\n\nSlider.Value = SliderValue\nSlider.Steps = SliderSteps\n\nSlider.displayName = 'Slider'\n"],"names":["StyledTrack","styled","Track","StyledSlider","Root","StyledRange","Range","StyledThumb","Thumb","Slider","React","value","defaultValue","min","max","theme","css","children","remainingProps","ref","values","CSSWrapper","_","i","SliderValue","SliderSteps"],"mappings":"uTASA,MAAMA,EAAcC,EAAOC,EAAO,CAChC,aAAc,SACd,SAAU,EACV,SAAU,WACV,mCAAoC,CAAE,OAAQ,UAAW,EACzD,iCAAkC,CAAE,MAAO,UAAW,CACxD,CAAC,EAEKC,EAAeF,EAAOG,EAAM,CAChC,WAAY,SACZ,QAAS,OACT,SAAU,WACV,YAAa,OACb,WAAY,OACZ,OAAQ,UACR,mCAAoC,CAClC,OAAQ,IACV,EACA,iCAAkC,CAChC,cAAe,SACf,MAAO,IACT,EACA,mBAAoB,CAAE,OAAQ,cAAe,GAAI,WAAY,EAC7D,SAAU,CACR,MAAO,CACL,MAAO,CACL,CAAC,GAAGJ,KAAgB,CAAE,GAAI,MAAO,CACnC,EACA,MAAO,CACL,CAAC,GAAGA,KAAgB,CAAE,GAAI,WAAY,CACxC,CACF,CACF,CACF,CAAC,EAEKK,EAAcJ,EAAOK,EAAO,CAChC,GAAI,WACJ,aAAc,SACd,OAAQ,OACR,SAAU,WACV,mBAAoB,CAAE,GAAI,YAAa,OAAQ,aAAc,CAC/D,CAAC,EAEKC,EAAcN,EAAOO,EAAO,CAChC,GAAI,cACJ,aAAc,SACd,QAAS,QACT,KAAM,KACN,UAAW,CACT,GAAI,cACN,EACA,UAAW,CACT,QAAS,wBACT,cAAe,KACjB,EACA,mBAAoB,CAAE,GAAI,YAAa,OAAQ,aAAc,CAC/D,CAAC,EASYC,EAAqBC,EAAM,WACtC,CACE,CACE,MAAAC,EACA,aAAAC,EACA,IAAAC,EAAM,EACN,IAAAC,EAAM,IACN,MAAAC,EAAQ,QACR,IAAAC,EACA,SAAAC,KACGC,CACL,EACAC,IACG,CACH,MAAMC,EAAST,GAASC,EACxB,OACEF,EAAA,cAACW,EAAA,CAAW,IAAKL,CACfN,EAAAA,EAAA,cAACP,EAAA,CACC,MAAOY,EACP,aAAcH,EACd,MAAOD,EACP,IAAKE,EACL,IAAKC,EACL,IAAKK,EACJ,GAAGD,CAEJR,EAAAA,EAAA,cAACV,EAAA,KACCU,EAAA,cAACL,EAAA,IAAY,CACf,GACCe,GAAA,KAAA,OAAAA,EAAQ,SACPA,EAAO,IAAI,CAACE,EAAGC,IAAMb,EAAA,cAACH,EAAA,CAAY,IAAK,QAAQgB,GAAK,CAAA,CAAE,CAC1D,EACCN,CACH,CAEJ,CACF,EAEAR,EAAO,MAAQe,EACff,EAAO,MAAQgB,EAEfhB,EAAO,YAAc"}

package/dist/components/slider/SliderSteps.js

@@ -1 +1,2 @@
 import*as a from"react";import{styled as n}from"../../stitches.js";import{Text as r}from"../text/Text.js";const i=n("div",{height:"$space$3",mt:"$3",position:"relative",width:"100%"}),s=(l,t,o)=>(l-t)/(o-t)*100,m=(l,t,o)=>{const e=s(l,t,o);return e<=10?0:e>=90?100:50},p=({min:l,max:t,steps:o=[]})=>o.length===0?null:a.createElement(i,null,o.map(e=>a.createElement(r,{as:"span",key:e.value,css:{position:"absolute",color:"$tonal300"},style:{left:`${s(e.value,l,t)}%`,transform:`translateX(-${m(e.value,l,t)}%)`}},e.label)));export{p as SliderSteps};
+//# sourceMappingURL=SliderSteps.js.map

package/dist/components/slider/SliderSteps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderSteps.js","sources":["../../../src/components/slider/SliderSteps.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Text } from '../text'\n\nexport type SliderStepsType = {\n  steps?: { label: string; value: number }[]\n}\n\ntype SliderStepsProps = {\n  min: number\n  max: number\n} & SliderStepsType\n\nconst SliderStepsContainer = styled('div', {\n  height: '$space$3',\n  mt: '$3',\n  position: 'relative',\n  width: '100%'\n})\n\nconst getPercentValue = (value: number, min: number, max: number): number => {\n  return ((value - min) / (max - min)) * 100\n}\n\nconst getTransformValue = (value: number, min: number, max: number): number => {\n  const percentage = getPercentValue(value, min, max)\n\n  if (percentage <= 10) return 0\n  if (percentage >= 90) return 100\n  return 50\n}\n\nexport const SliderSteps: React.FC<SliderStepsProps> = ({\n  min,\n  max,\n  steps = []\n}) => {\n  if (steps.length === 0) return null\n\n  return (\n    <SliderStepsContainer>\n      {steps.map((step) => (\n        <Text\n          as=\"span\"\n          key={step.value}\n          css={{\n            position: 'absolute',\n            color: '$tonal300'\n          }}\n          style={{\n            left: `${getPercentValue(step.value, min, max)}%`,\n            transform: `translateX(-${getTransformValue(\n              step.value,\n              min,\n              max\n            )}%)`\n          }}\n        >\n          {step.label}\n        </Text>\n      ))}\n    </SliderStepsContainer>\n  )\n}\n"],"names":["SliderStepsContainer","styled","getPercentValue","value","min","max","getTransformValue","percentage","SliderSteps","steps","React","step","Text"],"mappings":"0GAeA,MAAMA,EAAuBC,EAAO,MAAO,CACzC,OAAQ,WACR,GAAI,KACJ,SAAU,WACV,MAAO,MACT,CAAC,EAEKC,EAAkB,CAACC,EAAeC,EAAaC,KAC1CF,EAAQC,IAAQC,EAAMD,GAAQ,IAGnCE,EAAoB,CAACH,EAAeC,EAAaC,IAAwB,CAC7E,MAAME,EAAaL,EAAgBC,EAAOC,EAAKC,CAAG,EAElD,OAAIE,GAAc,GAAW,EACzBA,GAAc,GAAW,IACtB,EACT,EAEaC,EAA0C,CAAC,CACtD,IAAAJ,EACA,IAAAC,EACA,MAAAI,EAAQ,CACV,CAAA,IACMA,EAAM,SAAW,EAAU,KAG7BC,EAAA,cAACV,EAAA,KACES,EAAM,IAAKE,GACVD,EAAA,cAACE,EAAA,CACC,GAAG,OACH,IAAKD,EAAK,MACV,IAAK,CACH,SAAU,WACV,MAAO,WACT,EACA,MAAO,CACL,KAAM,GAAGT,EAAgBS,EAAK,MAAOP,EAAKC,CAAG,KAC7C,UAAW,eAAeC,EACxBK,EAAK,MACLP,EACAC,CACF,KACF,CAECM,EAAAA,EAAK,KACR,CACD,CACH"}

package/dist/components/slider/SliderValue.js

@@ -1 +1,2 @@
 import*as r from"react";import{Text as l}from"../text/Text.js";const a=({value:t=[],outputLabel:e=o=>`Current value is ${o}`})=>r.createElement(l,{css:{mt:"$4",color:"$tonal300",width:"100%"}},e(t.length===1?t[0]:t));export{a as SliderValue};
+//# sourceMappingURL=SliderValue.js.map

package/dist/components/slider/SliderValue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderValue.js","sources":["../../../src/components/slider/SliderValue.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text } from '../text'\n\nexport type SliderValueType = {\n  outputLabel?: (value: number | number[]) => string\n}\n\ntype SliderValueProps = SliderValueType & {\n  value?: number[]\n}\n\nexport const SliderValue: React.FC<SliderValueProps> = ({\n  value = [],\n  outputLabel = (value) => `Current value is ${value}`\n}) => {\n  return (\n    <Text css={{ mt: '$4', color: '$tonal300', width: '100%' }}>\n      {outputLabel(value.length === 1 ? value[0] : value)}\n    </Text>\n  )\n}\n"],"names":["SliderValue","value","outputLabel","React","Text"],"mappings":"qEAYaA,EAA0C,CAAC,CACtD,MAAAC,EAAQ,CAAC,EACT,YAAAC,EAAeD,GAAU,oBAAoBA,GAC/C,IAEIE,EAAA,cAACC,EAAA,CAAK,IAAK,CAAE,GAAI,KAAM,MAAO,YAAa,MAAO,MAAO,CAAA,EACtDF,EAAYD,EAAM,SAAW,EAAIA,EAAM,GAAKA,CAAK,CACpD"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"SliderField.js","sources":["../../../src/components/slider-field/SliderField.tsx"],"sourcesContent":["import React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { Slider, SliderProps } from '~/components/slider'\nimport { SliderStepsType } from '~/components/slider/SliderSteps'\n\nimport { SliderValueType } from '../slider/SliderValue'\n\ntype SliderFieldProps = SliderProps &\n  SliderStepsType &\n  SliderValueType &\n  FieldElementWrapperProps\n\nexport const SliderField: React.FC<SliderFieldProps> = ({\n  css,\n  label,\n  name,\n  defaultValue,\n  value,\n  validation,\n  outputLabel,\n  min = 0,\n  max = 100,\n  steps = [],\n  ...remainingProps\n}) => {\n  const { control } = useFormContext()\n  const {\n    field: { ref, onChange, value: innerValue, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue\n  })\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner value to match what is passed in.\n    if (value?.length) onChange(value)\n  }, [JSON.stringify(value)])\n\n  return (\n    <FieldWrapper css={css} fieldId={name} label={label}>\n      <Slider\n        ref={ref}\n        name={innerName}\n        onValueChange={onChange}\n        value={innerValue}\n        min={min}\n        max={max}\n        {...remainingProps}\n      >\n        <Slider.Steps min={min} max={max} steps={steps} />\n\n        <Slider.Value value={innerValue} outputLabel={outputLabel} />\n      </Slider>\n    </FieldWrapper>\n  )\n}\n\nSliderField.displayName = 'SliderField'\n"],"names":["SliderField","css","label","name","defaultValue","value","validation","outputLabel","min","max","steps","remainingProps","control","useFormContext","ref","onChange","innerValue","innerName","useController","React","FieldWrapper","Slider"],"mappings":"qPAiBO,MAAMA,EAA0C,CAAC,CACtD,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,aAAAC,EACA,MAAAC,EACA,WAAAC,EACA,YAAAC,EACA,IAAAC,EAAM,EACN,IAAAC,EAAM,IACN,MAAAC,EAAQ,CAAA,KACLC,CACL,IAAM,CACJ,KAAM,CAAE,QAAAC,CAAQ,EAAIC,EAAAA,EACd,CACJ,MAAO,CAAE,IAAAC,EAAK,SAAAC,EAAU,MAAOC,EAAY,KAAMC,CAAU,CAC7D,EAAIC,EAAc,CAChB,KAAAf,EACA,QAAAS,EACA,MAAON,EACP,aAAAF,CACF,CAAC,EAED,OAAAe,EAAM,UAAU,IAAM,CAEhBd,GAAA,MAAAA,EAAO,QAAQU,EAASV,CAAK,CACnC,EAAG,CAAC,KAAK,UAAUA,CAAK,CAAC,CAAC,EAGxBc,EAAA,cAACC,EAAA,CAAa,IAAKnB,EAAK,QAASE,EAAM,MAAOD,CAC5CiB,EAAAA,EAAA,cAACE,EAAA,CACC,IAAKP,EACL,KAAMG,EACN,cAAeF,EACf,MAAOC,EACP,IAAKR,EACL,IAAKC,EACJ,GAAGE,CAAAA,EAEJQ,EAAA,cAACE,EAAO,MAAP,CAAa,IAAKb,EAAK,IAAKC,EAAK,MAAOC,EAAO,EAEhDS,EAAA,cAACE,EAAO,MAAP,CAAa,MAAOL,EAAY,YAAaT,EAAa,CAC7D,CACF,CAEJ,EAEAP,EAAY,YAAc"}

package/dist/components/stack/Stack.js

@@ -1 +1,2 @@
 import*as e from"react";import{styled as p}from"../../stitches.js";import{CSSWrapper as c}from"../../utilities/css-wrapper/CSSWrapper.js";import{createThemeVariants as m}from"../../utilities/create-theme-variants/createThemeVariants.js";const w=p("div",{display:"flex","& > *":{m:0},variants:{direction:{row:{flexDirection:"row"},"row-reverse":{flexDirection:"row-reverse"},column:{flexDirection:"column"}},wrap:{wrap:{flexWrap:"wrap"},"no-wrap":{flexWrap:"no-wrap"},"wrap-reverse":{flexWrap:"wrap-reverse"}},justify:{start:{justifyContent:"flex-start"},center:{justifyContent:"center"},end:{justifyContent:"flex-end"},false:{}},align:{start:{alignItems:"flex-start"},center:{alignItems:"center"},end:{alignItems:"flex-end"},false:{}},gap:{...m("space",{mt:"-$key",ml:"-$key","& > *":{mt:"$key",ml:"$key"}}),false:{}}}}),a=e.forwardRef(({css:n,gap:s=2,direction:r="row",wrap:i="wrap",justify:o="start",align:t,...l},f)=>e.createElement(c,{css:n},e.createElement(w,{ref:f,direction:r,gap:s,wrap:i,justify:o,align:typeof t>"u"&&r!=="column"?"center":t,...l})));a.displayName="Stack";export{a as Stack};
+//# sourceMappingURL=Stack.js.map

package/dist/components/stack/Stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stack.js","sources":["../../../src/components/stack/Stack.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { CSS, styled } from '~/stitches'\nimport { createThemeVariants } from '~/utilities'\nimport { CSSWrapper } from '~/utilities/css-wrapper'\n\nconst StyledStack = styled('div', {\n  display: 'flex',\n  '& > *': {\n    m: 0\n  },\n  variants: {\n    direction: {\n      row: {\n        flexDirection: 'row'\n      },\n      'row-reverse': {\n        flexDirection: 'row-reverse'\n      },\n      column: {\n        flexDirection: 'column'\n      }\n    },\n    wrap: {\n      wrap: {\n        flexWrap: 'wrap'\n      },\n      'no-wrap': {\n        flexWrap: 'no-wrap'\n      },\n      'wrap-reverse': {\n        flexWrap: 'wrap-reverse'\n      }\n    },\n    justify: {\n      start: { justifyContent: 'flex-start' },\n      center: { justifyContent: 'center' },\n      end: { justifyContent: 'flex-end' },\n      false: {}\n    },\n    align: {\n      start: { alignItems: 'flex-start' },\n      center: { alignItems: 'center' },\n      end: { alignItems: 'flex-end' },\n      false: {}\n    },\n    gap: {\n      ...createThemeVariants('space', {\n        mt: '-$key',\n        ml: '-$key',\n        '& > *': {\n          mt: '$key',\n          ml: '$key'\n        }\n      }),\n      false: {}\n    }\n  }\n})\n\ntype StackPropsType = React.ComponentProps<typeof StyledStack> & {\n  css?: CSS\n  as?: any\n} // (!) `css` and `as` are both props that come from `stitches`. It would be better to figure out and export the appropriate type for them in stitches!\n\nexport const Stack: React.ForwardRefExoticComponent<StackPropsType> =\n  React.forwardRef(\n    (\n      {\n        css,\n        gap = 2,\n        direction = 'row',\n        wrap = 'wrap',\n        justify = 'start',\n        align,\n        ...remainingProps\n      },\n      ref\n    ) => {\n      return (\n        <CSSWrapper css={css}>\n          <StyledStack\n            ref={ref}\n            direction={direction}\n            gap={gap}\n            wrap={wrap}\n            justify={justify}\n            align={\n              typeof align === 'undefined' && direction !== 'column'\n                ? 'center'\n                : align\n            }\n            {...remainingProps}\n          />\n        </CSSWrapper>\n      )\n    }\n  )\n\nStack.displayName = 'Stack'\n"],"names":["StyledStack","styled","createThemeVariants","Stack","React","css","gap","direction","wrap","justify","align","remainingProps","ref","CSSWrapper"],"mappings":"6OAMA,MAAMA,EAAcC,EAAO,MAAO,CAChC,QAAS,OACT,QAAS,CACP,EAAG,CACL,EACA,SAAU,CACR,UAAW,CACT,IAAK,CACH,cAAe,KACjB,EACA,cAAe,CACb,cAAe,aACjB,EACA,OAAQ,CACN,cAAe,QACjB,CACF,EACA,KAAM,CACJ,KAAM,CACJ,SAAU,MACZ,EACA,UAAW,CACT,SAAU,SACZ,EACA,eAAgB,CACd,SAAU,cACZ,CACF,EACA,QAAS,CACP,MAAO,CAAE,eAAgB,YAAa,EACtC,OAAQ,CAAE,eAAgB,QAAS,EACnC,IAAK,CAAE,eAAgB,UAAW,EAClC,MAAO,CACT,CAAA,EACA,MAAO,CACL,MAAO,CAAE,WAAY,YAAa,EAClC,OAAQ,CAAE,WAAY,QAAS,EAC/B,IAAK,CAAE,WAAY,UAAW,EAC9B,MAAO,CACT,CAAA,EACA,IAAK,CACH,GAAGC,EAAoB,QAAS,CAC9B,GAAI,QACJ,GAAI,QACJ,QAAS,CACP,GAAI,OACJ,GAAI,MACN,CACF,CAAC,EACD,MAAO,EACT,CACF,CACF,CAAC,EAOYC,EACXC,EAAM,WACJ,CACE,CACE,IAAAC,EACA,IAAAC,EAAM,EACN,UAAAC,EAAY,MACZ,KAAAC,EAAO,OACP,QAAAC,EAAU,QACV,MAAAC,KACGC,CACL,EACAC,IAGER,EAAA,cAACS,EAAA,CAAW,IAAKR,GACfD,EAAA,cAACJ,EAAA,CACC,IAAKY,EACL,UAAWL,EACX,IAAKD,EACL,KAAME,EACN,QAASC,EACT,MACE,OAAOC,EAAU,KAAeH,IAAc,SAC1C,SACAG,EAEL,GAAGC,EACN,CACF,CAGN,EAEFR,EAAM,YAAc"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"StackContent.js","sources":["../../../src/components/stack-content/StackContent.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport type { CSS } from '~/stitches'\nimport { styled } from '~/stitches'\n\nimport { StyledDivider } from '../divider/Divider'\nimport { StyledHeading } from '../heading/Heading'\nimport { StyledImage } from '../image/Image'\nimport { StyledList } from '../list/List'\nimport { StyledText } from '../text/Text'\n\nconst StyledStackContent = styled('div', {\n  '& > *': {\n    '&:not(:first-child)': { mt: '$5' },\n    '&:not(:last-child)': { mb: '$5' }\n  },\n  [`& > ${StyledHeading}`]: {\n    maxWidth: '65ch'\n  },\n  [`& > ${StyledText}`]: {\n    maxWidth: '75ch'\n  },\n  [`& > ${StyledList}`]: {\n    maxWidth: '75ch'\n  },\n  [`& > ${StyledDivider}`]: {\n    my: '$5'\n  },\n  [`& > ${StyledImage}`]: {\n    display: 'block',\n    '&:not(:first-child)': { mt: '$6' },\n    '&:not(:last-child)': { mb: '$6' }\n  }\n})\n\ntype StackContentProps = React.ComponentProps<typeof StyledStackContent> & {\n  children: React.ReactNode\n  css?: CSS\n}\n\nexport const StackContent: React.ForwardRefExoticComponent<StackContentProps> =\n  React.forwardRef((props, ref) => <StyledStackContent ref={ref} {...props} />)\n\nStackContent.displayName = 'StackContent'\n"],"names":["StyledStackContent","styled","StyledHeading","StyledText","StyledList","StyledDivider","StyledImage","StackContent","React","props","ref"],"mappings":"yTAWA,MAAMA,EAAqBC,EAAO,MAAO,CACvC,QAAS,CACP,sBAAuB,CAAE,GAAI,IAAK,EAClC,qBAAsB,CAAE,GAAI,IAAK,CACnC,EACA,CAAC,OAAOC,KAAkB,CACxB,SAAU,MACZ,EACA,CAAC,OAAOC,KAAe,CACrB,SAAU,MACZ,EACA,CAAC,OAAOC,KAAe,CACrB,SAAU,MACZ,EACA,CAAC,OAAOC,KAAkB,CACxB,GAAI,IACN,EACA,CAAC,OAAOC,KAAgB,CACtB,QAAS,QACT,sBAAuB,CAAE,GAAI,IAAK,EAClC,qBAAsB,CAAE,GAAI,IAAK,CACnC,CACF,CAAC,EAOYC,EACXC,EAAM,WAAW,CAACC,EAAOC,IAAQF,EAAA,cAACR,EAAA,CAAmB,IAAKU,EAAM,GAAGD,CAAO,CAAA,CAAE,EAE9EF,EAAa,YAAc"}

package/dist/components/stepper/Stepper.js

@@ -1 +1,2 @@
 import c from"invariant";import*as r from"react";import{Box as h}from"../box/Box.js";import{StepperProvider as C}from"./stepper-context/StepperContext.js";import{StepperStepBack as f}from"./StepperStepBack.js";import{StepperStepForward as w}from"./StepperStepForward.js";import{StepperSteps as u}from"./StepperSteps.js";const e=({children:s,stepCount:t,allowSkip:i,onComplete:n,onStepChange:l,direction:a="horizontal",steps:o,hideLabels:m=!1,showCompletedIcons:d=!1,css:S})=>{c(!(t&&o),"`Stepper` should only be given one of `stepCount` or `steps`. When both are provided, `steps` will be used and `stepCount` will be ignored.");const p=(o==null?void 0:o.length)||t||0;return r.createElement(C,{stepCount:p,allowSkip:i,onComplete:n,onStepChange:t?l:void 0,direction:a,steps:o||Array(p).fill(""),hideLabels:m,showCompletedIcons:d},r.createElement(h,{"aria-label":"progress",css:{width:"100%",...S}},s))};e.StepBack=f,e.StepForward=w,e.Steps=u,e.displayName="Stepper";export{e as Stepper};
+//# sourceMappingURL=Stepper.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Stepper.js","sources":["../../../src/components/stepper/Stepper.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\n\nimport { Box } from '../box/Box'\nimport { StepperProvider } from './stepper-context/StepperContext'\nimport { StepperStepBack } from './StepperStepBack'\nimport { StepperStepForward } from './StepperStepForward'\nimport { StepperSteps } from './StepperSteps'\nimport { IStepperProps } from './types'\n\nexport const Stepper: React.FC<IStepperProps> & {\n  StepBack: typeof StepperStepBack\n  StepForward: typeof StepperStepForward\n  Steps: typeof StepperSteps\n} = ({\n  children,\n  stepCount,\n  allowSkip,\n  onComplete,\n  onStepChange,\n  direction = 'horizontal',\n  steps,\n  hideLabels = false,\n  showCompletedIcons = false,\n  css\n}) => {\n  invariant(\n    !(stepCount && steps),\n    '`Stepper` should only be given one of `stepCount` or `steps`. When both are provided, `steps` will be used and `stepCount` will be ignored.'\n  )\n\n  const count = steps?.length || stepCount || 0\n\n  return (\n    <StepperProvider\n      stepCount={count}\n      allowSkip={allowSkip}\n      onComplete={onComplete}\n      onStepChange={stepCount ? onStepChange : undefined}\n      direction={direction}\n      steps={steps || Array(count).fill('')}\n      hideLabels={hideLabels}\n      showCompletedIcons={showCompletedIcons}\n    >\n      <Box\n        aria-label=\"progress\"\n        css={{\n          width: '100%',\n          ...css\n        }}\n      >\n        {children}\n      </Box>\n    </StepperProvider>\n  )\n}\n\nStepper.StepBack = StepperStepBack\nStepper.StepForward = StepperStepForward\nStepper.Steps = StepperSteps\n\nStepper.displayName = 'Stepper'\n"],"names":["Stepper","children","stepCount","allowSkip","onComplete","onStepChange","direction","steps","hideLabels","showCompletedIcons","css","invariant","count","React","StepperProvider","Box","StepperStepBack","StepperStepForward","StepperSteps"],"mappings":"gUAUO,MAAMA,EAIT,CAAC,CACH,SAAAC,EACA,UAAAC,EACA,UAAAC,EACA,WAAAC,EACA,aAAAC,EACA,UAAAC,EAAY,aACZ,MAAAC,EACA,WAAAC,EAAa,GACb,mBAAAC,EAAqB,GACrB,IAAAC,CACF,IAAM,CACJC,EACE,EAAET,GAAaK,GACf,6IACF,EAEA,MAAMK,GAAQL,GAAA,KAAA,OAAAA,EAAO,SAAUL,GAAa,EAE5C,OACEW,EAAA,cAACC,EAAA,CACC,UAAWF,EACX,UAAWT,EACX,WAAYC,EACZ,aAAcF,EAAYG,EAAe,OACzC,UAAWC,EACX,MAAOC,GAAS,MAAMK,CAAK,EAAE,KAAK,EAAE,EACpC,WAAYJ,EACZ,mBAAoBC,CAEpBI,EAAAA,EAAA,cAACE,EAAA,CACC,aAAW,WACX,IAAK,CACH,MAAO,OACP,GAAGL,CACL,CAAA,EAECT,CACH,CACF,CAEJ,EAEAD,EAAQ,SAAWgB,EACnBhB,EAAQ,YAAciB,EACtBjB,EAAQ,MAAQkB,EAEhBlB,EAAQ,YAAc"}

package/dist/components/stepper/StepperStepBack.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"StepperStepBack.js","sources":["../../../src/components/stepper/StepperStepBack.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 StepperStepBack: React.FC<\n  IStepperNavigateProps & Omit<React.ComponentProps<typeof Button>, 'children'>\n> = ({ label, children, ...rest }) => {\n  const { activeStep, goToPreviousStep } = useStepper()\n  return (\n    <Button\n      size=\"sm\"\n      appearance=\"outline\"\n      {...rest}\n      disabled={activeStep === 0}\n      onClick={goToPreviousStep}\n    >\n      {children || label?.(activeStep)}\n    </Button>\n  )\n}\n"],"names":["StepperStepBack","label","children","rest","activeStep","goToPreviousStep","useStepper","React","Button"],"mappings":"sIAMO,MAAMA,EAET,CAAC,CAAE,MAAAC,EAAO,SAAAC,KAAaC,CAAK,IAAM,CACpC,KAAM,CAAE,WAAAC,EAAY,iBAAAC,CAAiB,EAAIC,IACzC,OACEC,EAAA,cAACC,EAAA,CACC,KAAK,KACL,WAAW,UACV,GAAGL,EACJ,SAAUC,IAAe,EACzB,QAASC,CAAAA,EAERH,IAAYD,GAAA,KAAA,OAAAA,EAAQG,CAAAA,EACvB,CAEJ"}