@atom-learning/components 2.61.2 → 2.63.0

package/dist/components/date-input/DateInput.d.ts

@@ -5,7 +5,7 @@ export declare type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> & C
     initialDate?: Date;
     dateFormat?: string;
     disabled?: boolean;
-    size?: 'sm' | 'md';
+    size?: 'sm' | 'md' | 'lg';
     revalidate?: () => Promise<boolean>;
     onChange?: (value?: Date) => void;
 };
@@ -13,7 +13,7 @@ export declare const DateInput: React.ForwardRefExoticComponent<Omit<DayzedInter
     initialDate?: Date | undefined;
     dateFormat?: string | undefined;
     disabled?: boolean | undefined;
-    size?: "sm" | "md" | undefined;
+    size?: "sm" | "md" | "lg" | undefined;
     revalidate?: (() => Promise<boolean>) | undefined;
     onChange?: ((value?: Date | undefined) => void) | undefined;
 } & React.RefAttributes<HTMLInputElement>>;

package/dist/components/date-input/DateInput.js

@@ -1,2 +1,2 @@
-import{CalendarEvent as N}from"@atom-learning/icons";import*as e from"react";import{DIALOG_Z_INDEX as x}from"../../constants/zIndices.js";import{ActionIcon as z}from"../action-icon/ActionIcon.js";import{Box as F}from"../box/Box.js";import{Calendar as L}from"../calendar/Calendar.js";import{DEFAULT_LABELS as S}from"../calendar/constants.js";import{Icon as _}from"../icon/Icon.js";import{Input as k}from"../input/Input.js";import{Popover as r}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as R}from"./constants.js";import{useDate as B}from"./use-date.js";const D=e.forwardRef(({initialDate:E,dateFormat:g=R,firstDayOfWeek:h=1,disabled:s,monthNames:b,weekdayNames:v,size:l="md",labels:y,revalidate:o,onChange:n,minDate:A,maxDate:C,...I},w)=>{const{date:a,dateString:O,setDate:m}=B(E,g),i={...S,...y},[T,d]=e.useState(!1),f=e.useRef(null),p=e.useRef(null);return e.useEffect(()=>{n==null||n(a)},[a,n]),e.createElement(F,{css:{position:"relative"}},e.createElement(k,{name:"date",disabled:s,size:l,...I,onChange:t=>m(t.target.value,!0),value:O,ref:w}),e.createElement(r,{modal:!0,open:T,onOpenChange:d},e.createElement(r.Trigger,{asChild:!0},e.createElement(z,{css:{position:"absolute",top:"0",right:"0"},disabled:s,label:i.open,size:l,theme:"neutral",hasTooltip:!1},e.createElement(_,{is:N}))),e.createElement(r.Portal,null,e.createElement(r.Content,{css:{pr:"$sizes$2",zIndex:x},side:"bottom",align:"end",showCloseButton:!1,onOpenAutoFocus:t=>{var c,u;t.preventDefault(),a?(c=p.current)==null||c.focus():(u=f.current)==null||u.focus()}},e.createElement(L,{date:a||new Date,selected:a,onDateSelected:async t=>{d(!1),await m(t.date,!1),o&&o()},setYear:async t=>{await m(t,!1),o&&o()},minDate:A,maxDate:C,refDateToday:f,refDateSelected:p,firstDayOfWeek:h,monthNames:b,weekdayNames:v,labels:i})))))});D.displayName="DateInput";export{D as DateInput};
+import{CalendarEvent as x}from"@atom-learning/icons";import*as e from"react";import{DIALOG_Z_INDEX as F}from"../../constants/zIndices.js";import"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{getFieldIconSize as L}from"../../utilities/style/get-icon-size.js";import{ActionIcon as N}from"../action-icon/ActionIcon.js";import{Box as O}from"../box/Box.js";import{Calendar as _}from"../calendar/Calendar.js";import{DEFAULT_LABELS as k}from"../calendar/constants.js";import{Icon as R}from"../icon/Icon.js";import{Input as B}from"../input/Input.js";import{Popover as r}from"../popover/Popover.js";import{DEFAULT_DATE_FORMAT as M}from"./constants.js";import{useDate as P}from"./use-date.js";const D=e.forwardRef(({initialDate:E,dateFormat:h=M,firstDayOfWeek:g=1,disabled:l,monthNames:I,weekdayNames:b,size:n="md",labels:v,revalidate:o,onChange:m,minDate:y,maxDate:A,...C},w)=>{const{date:a,dateString:z,setDate:i}=P(E,h),s={...k,...v},[S,p]=e.useState(!1),d=e.useRef(null),f=e.useRef(null),T=e.useMemo(()=>L(n),[n]);return e.useEffect(()=>{m==null||m(a)},[a,m]),e.createElement(O,{css:{position:"relative",height:"max-content"}},e.createElement(B,{name:"date",disabled:l,size:n,...C,onChange:t=>i(t.target.value,!0),value:z,ref:w}),e.createElement(r,{modal:!0,open:S,onOpenChange:p},e.createElement(r.Trigger,{asChild:!0},e.createElement(N,{css:{position:"absolute",top:"50%",transform:"translateY(-50%)",right:"0"},disabled:l,label:s.open,size:T,theme:"neutral",hasTooltip:!1},e.createElement(R,{is:x}))),e.createElement(r.Portal,null,e.createElement(r.Content,{css:{pr:"$sizes$2",zIndex:F},side:"bottom",align:"end",showCloseButton:!1,onOpenAutoFocus:t=>{var c,u;t.preventDefault(),a?(c=f.current)==null||c.focus():(u=d.current)==null||u.focus()}},e.createElement(_,{date:a||new Date,selected:a,onDateSelected:async t=>{p(!1),await i(t.date,!1),o&&o()},setYear:async t=>{await i(t,!1),o&&o()},minDate:y,maxDate:A,refDateToday:d,refDateSelected:f,firstDayOfWeek:g,monthNames:I,weekdayNames:b,labels:s})))))});D.displayName="DateInput";export{D as DateInput};
 //# sourceMappingURL=DateInput.js.map

package/dist/components/date-input/DateInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateInput.js","sources":["../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import { CalendarEvent } from '@atom-learning/icons'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport * as React from 'react'\n\nimport { DIALOG_Z_INDEX } from '~/constants/zIndices'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Box } from '../box/Box'\nimport { Calendar, CalendarTranslationProps } from '../calendar/Calendar'\nimport { DEFAULT_LABELS } from '../calendar/constants'\nimport { Icon } from '../icon/Icon'\nimport { Input } from '../input/Input'\nimport { Popover } from '../popover/Popover'\nimport { DEFAULT_DATE_FORMAT } from './constants'\nimport { useDate } from './use-date'\n\nexport type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> &\n  CalendarTranslationProps & {\n    initialDate?: Date\n    dateFormat?: string\n    disabled?: boolean\n    size?: 'sm' | 'md'\n    revalidate?: () => Promise<boolean>\n    onChange?: (value?: Date) => void\n  }\n\nexport const DateInput = React.forwardRef<HTMLInputElement, DateInputProps>(\n  (\n    {\n      initialDate,\n      dateFormat = DEFAULT_DATE_FORMAT,\n      firstDayOfWeek = 1,\n      disabled,\n      monthNames,\n      weekdayNames,\n      size = 'md',\n      labels,\n      revalidate,\n      onChange,\n      minDate,\n      maxDate,\n      ...remainingProps\n    },\n    ref\n  ) => {\n    const { date, dateString, setDate } = useDate(initialDate, dateFormat)\n    const updatedLabels = {\n      ...DEFAULT_LABELS,\n      ...labels\n    }\n\n    const [calendarOpen, setCalendarOpen] = React.useState(false)\n\n    const refDateToday = React.useRef<HTMLButtonElement>(null)\n    const refDateSelected = React.useRef<HTMLButtonElement>(null)\n\n    React.useEffect(() => {\n      onChange?.(date)\n    }, [date, onChange])\n\n    return (\n      <Box css={{ position: 'relative' }}>\n        <Input\n          name=\"date\"\n          disabled={disabled}\n          size={size}\n          {...remainingProps}\n          onChange={(event) => setDate(event.target.value, true)}\n          value={dateString}\n          ref={ref}\n        />\n        <Popover modal open={calendarOpen} onOpenChange={setCalendarOpen}>\n          <Popover.Trigger asChild>\n            <ActionIcon\n              css={{ position: 'absolute', top: '0', right: '0' }}\n              disabled={disabled}\n              label={updatedLabels.open}\n              size={size}\n              theme=\"neutral\"\n              hasTooltip={false}\n            >\n              <Icon is={CalendarEvent} />\n            </ActionIcon>\n          </Popover.Trigger>\n          <Popover.Portal>\n            <Popover.Content\n              css={{ pr: '$sizes$2', zIndex: DIALOG_Z_INDEX }}\n              side=\"bottom\"\n              align=\"end\"\n              showCloseButton={false}\n              onOpenAutoFocus={(e) => {\n                e.preventDefault()\n                if (date) {\n                  refDateSelected.current?.focus()\n                } else {\n                  refDateToday.current?.focus()\n                }\n              }}\n            >\n              <Calendar\n                date={date || new Date()}\n                selected={date}\n                onDateSelected={async (date) => {\n                  setCalendarOpen(false)\n                  await setDate(date.date, false)\n                  if (revalidate) revalidate()\n                }}\n                setYear={async (date) => {\n                  await setDate(date, false)\n                  if (revalidate) revalidate()\n                }}\n                minDate={minDate}\n                maxDate={maxDate}\n                refDateToday={refDateToday}\n                refDateSelected={refDateSelected}\n                firstDayOfWeek={firstDayOfWeek}\n                monthNames={monthNames}\n                weekdayNames={weekdayNames}\n                labels={updatedLabels}\n              />\n            </Popover.Content>\n          </Popover.Portal>\n        </Popover>\n      </Box>\n    )\n  }\n)\n\nDateInput.displayName = 'DateInput'\n"],"names":["DateInput","React","initialDate","dateFormat","DEFAULT_DATE_FORMAT","firstDayOfWeek","disabled","monthNames","weekdayNames","size","labels","revalidate","onChange","minDate","maxDate","remainingProps","ref","date","dateString","setDate","useDate","updatedLabels","DEFAULT_LABELS","calendarOpen","setCalendarOpen","refDateToday","refDateSelected","Box","Input","event","Popover","ActionIcon","Icon","CalendarEvent","DIALOG_Z_INDEX","e","_a","_b","Calendar"],"mappings":"yjBA0BaA,EAAYC,EAAM,WAC7B,CACE,CACE,YAAAC,EACA,WAAAC,EAAaC,EACb,eAAAC,EAAiB,EACjB,SAAAC,EACA,WAAAC,EACA,aAAAC,EACA,KAAAC,EAAO,KACP,OAAAC,EACA,WAAAC,EACA,SAAAC,EACA,QAAAC,EACA,QAAAC,KACGC,CACL,EACAC,IACG,CACH,KAAM,CAAE,KAAAC,EAAM,WAAAC,EAAY,QAAAC,CAAQ,EAAIC,EAAQlB,EAAaC,CAAU,EAC/DkB,EAAgB,CACpB,GAAGC,EACH,GAAGZ,CACL,EAEM,CAACa,EAAcC,CAAe,EAAIvB,EAAM,SAAS,EAAK,EAEtDwB,EAAexB,EAAM,OAA0B,IAAI,EACnDyB,EAAkBzB,EAAM,OAA0B,IAAI,EAE5D,OAAAA,EAAM,UAAU,IAAM,CACpBW,GAAA,MAAAA,EAAWK,CAAAA,CACb,EAAG,CAACA,EAAML,CAAQ,CAAC,EAGjBX,EAAA,cAAC0B,EAAA,CAAI,IAAK,CAAE,SAAU,UAAW,CAC/B1B,EAAAA,EAAA,cAAC2B,EAAA,CACC,KAAK,OACL,SAAUtB,EACV,KAAMG,EACL,GAAGM,EACJ,SAAWc,GAAUV,EAAQU,EAAM,OAAO,MAAO,EAAI,EACrD,MAAOX,EACP,IAAKF,CACP,CAAA,EACAf,EAAA,cAAC6B,EAAA,CAAQ,MAAK,GAAC,KAAMP,EAAc,aAAcC,CAAAA,EAC/CvB,EAAA,cAAC6B,EAAQ,QAAR,CAAgB,QAAO,EAAA,EACtB7B,EAAA,cAAC8B,EAAA,CACC,IAAK,CAAE,SAAU,WAAY,IAAK,IAAK,MAAO,GAAI,EAClD,SAAUzB,EACV,MAAOe,EAAc,KACrB,KAAMZ,EACN,MAAM,UACN,WAAY,EAAA,EAEZR,EAAA,cAAC+B,EAAA,CAAK,GAAIC,CAAe,CAAA,CAC3B,CACF,EACAhC,EAAA,cAAC6B,EAAQ,OAAR,KACC7B,EAAA,cAAC6B,EAAQ,QAAR,CACC,IAAK,CAAE,GAAI,WAAY,OAAQI,CAAe,EAC9C,KAAK,SACL,MAAM,MACN,gBAAiB,GACjB,gBAAkBC,GAAM,CA1FtC,IAAAC,EAAAC,EA2FgBF,EAAE,eACElB,EAAAA,GACFmB,EAAAV,EAAgB,UAAhB,MAAAU,EAAyB,MAEzBC,GAAAA,EAAAZ,EAAa,UAAb,MAAAY,EAAsB,MAE1B,CAAA,CAAA,EAEApC,EAAA,cAACqC,EAAA,CACC,KAAMrB,GAAQ,IAAI,KAClB,SAAUA,EACV,eAAgB,MAAOA,GAAS,CAC9BO,EAAgB,EAAK,EACrB,MAAML,EAAQF,EAAK,KAAM,EAAK,EAC1BN,GAAYA,GAClB,EACA,QAAS,MAAOM,GAAS,CACvB,MAAME,EAAQF,EAAM,EAAK,EACrBN,GAAYA,EAClB,CAAA,EACA,QAASE,EACT,QAASC,EACT,aAAcW,EACd,gBAAiBC,EACjB,eAAgBrB,EAChB,WAAYE,EACZ,aAAcC,EACd,OAAQa,CACV,CAAA,CACF,CACF,CACF,CACF,CAEJ,CACF,EAEArB,EAAU,YAAc"}
+{"version":3,"file":"DateInput.js","sources":["../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import { CalendarEvent } from '@atom-learning/icons'\nimport type { Props as DayzedInterface } from 'dayzed'\nimport * as React from 'react'\n\nimport { DIALOG_Z_INDEX } from '~/constants/zIndices'\nimport { getFieldIconSize } from '~/utilities'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Box } from '../box/Box'\nimport { Calendar, CalendarTranslationProps } from '../calendar/Calendar'\nimport { DEFAULT_LABELS } from '../calendar/constants'\nimport { Icon } from '../icon/Icon'\nimport { Input } from '../input/Input'\nimport { Popover } from '../popover/Popover'\nimport { DEFAULT_DATE_FORMAT } from './constants'\nimport { useDate } from './use-date'\n\nexport type DateInputProps = Omit<DayzedInterface, 'onDateSelected'> &\n  CalendarTranslationProps & {\n    initialDate?: Date\n    dateFormat?: string\n    disabled?: boolean\n    size?: 'sm' | 'md' | 'lg'\n    revalidate?: () => Promise<boolean>\n    onChange?: (value?: Date) => void\n  }\n\nexport const DateInput = React.forwardRef<HTMLInputElement, DateInputProps>(\n  (\n    {\n      initialDate,\n      dateFormat = DEFAULT_DATE_FORMAT,\n      firstDayOfWeek = 1,\n      disabled,\n      monthNames,\n      weekdayNames,\n      size = 'md',\n      labels,\n      revalidate,\n      onChange,\n      minDate,\n      maxDate,\n      ...remainingProps\n    },\n    ref\n  ) => {\n    const { date, dateString, setDate } = useDate(initialDate, dateFormat)\n    const updatedLabels = {\n      ...DEFAULT_LABELS,\n      ...labels\n    }\n\n    const [calendarOpen, setCalendarOpen] = React.useState(false)\n\n    const refDateToday = React.useRef<HTMLButtonElement>(null)\n    const refDateSelected = React.useRef<HTMLButtonElement>(null)\n\n    const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n    React.useEffect(() => {\n      onChange?.(date)\n    }, [date, onChange])\n\n    return (\n      <Box css={{ position: 'relative', height: 'max-content' }}>\n        <Input\n          name=\"date\"\n          disabled={disabled}\n          size={size}\n          {...remainingProps}\n          onChange={(event) => setDate(event.target.value, true)}\n          value={dateString}\n          ref={ref}\n        />\n        <Popover modal open={calendarOpen} onOpenChange={setCalendarOpen}>\n          <Popover.Trigger asChild>\n            <ActionIcon\n              css={{\n                position: 'absolute',\n                top: '50%',\n                transform: 'translateY(-50%)',\n                right: '0'\n              }}\n              disabled={disabled}\n              label={updatedLabels.open}\n              size={iconSize}\n              theme=\"neutral\"\n              hasTooltip={false}\n            >\n              <Icon is={CalendarEvent} />\n            </ActionIcon>\n          </Popover.Trigger>\n          <Popover.Portal>\n            <Popover.Content\n              css={{ pr: '$sizes$2', zIndex: DIALOG_Z_INDEX }}\n              side=\"bottom\"\n              align=\"end\"\n              showCloseButton={false}\n              onOpenAutoFocus={(e) => {\n                e.preventDefault()\n                if (date) {\n                  refDateSelected.current?.focus()\n                } else {\n                  refDateToday.current?.focus()\n                }\n              }}\n            >\n              <Calendar\n                date={date || new Date()}\n                selected={date}\n                onDateSelected={async (date) => {\n                  setCalendarOpen(false)\n                  await setDate(date.date, false)\n                  if (revalidate) revalidate()\n                }}\n                setYear={async (date) => {\n                  await setDate(date, false)\n                  if (revalidate) revalidate()\n                }}\n                minDate={minDate}\n                maxDate={maxDate}\n                refDateToday={refDateToday}\n                refDateSelected={refDateSelected}\n                firstDayOfWeek={firstDayOfWeek}\n                monthNames={monthNames}\n                weekdayNames={weekdayNames}\n                labels={updatedLabels}\n              />\n            </Popover.Content>\n          </Popover.Portal>\n        </Popover>\n      </Box>\n    )\n  }\n)\n\nDateInput.displayName = 'DateInput'\n"],"names":["DateInput","React","initialDate","dateFormat","DEFAULT_DATE_FORMAT","firstDayOfWeek","disabled","monthNames","weekdayNames","size","labels","revalidate","onChange","minDate","maxDate","remainingProps","ref","date","dateString","setDate","useDate","updatedLabels","DEFAULT_LABELS","calendarOpen","setCalendarOpen","refDateToday","refDateSelected","iconSize","getFieldIconSize","Box","Input","event","Popover","ActionIcon","Icon","CalendarEvent","DIALOG_Z_INDEX","e","_a","_b","Calendar"],"mappings":"q1BA2BaA,EAAYC,EAAM,WAC7B,CACE,CACE,YAAAC,EACA,WAAAC,EAAaC,EACb,eAAAC,EAAiB,EACjB,SAAAC,EACA,WAAAC,EACA,aAAAC,EACA,KAAAC,EAAO,KACP,OAAAC,EACA,WAAAC,EACA,SAAAC,EACA,QAAAC,EACA,QAAAC,KACGC,CACL,EACAC,IACG,CACH,KAAM,CAAE,KAAAC,EAAM,WAAAC,EAAY,QAAAC,CAAQ,EAAIC,EAAQlB,EAAaC,CAAU,EAC/DkB,EAAgB,CACpB,GAAGC,EACH,GAAGZ,CACL,EAEM,CAACa,EAAcC,CAAe,EAAIvB,EAAM,SAAS,EAAK,EAEtDwB,EAAexB,EAAM,OAA0B,IAAI,EACnDyB,EAAkBzB,EAAM,OAA0B,IAAI,EAEtD0B,EAAW1B,EAAM,QAAQ,IAAM2B,EAAiBnB,CAAI,EAAG,CAACA,CAAI,CAAC,EAEnE,OAAAR,EAAM,UAAU,IAAM,CACpBW,GAAA,MAAAA,EAAWK,CACb,CAAA,EAAG,CAACA,EAAML,CAAQ,CAAC,EAGjBX,EAAA,cAAC4B,EAAA,CAAI,IAAK,CAAE,SAAU,WAAY,OAAQ,aAAc,CACtD5B,EAAAA,EAAA,cAAC6B,EAAA,CACC,KAAK,OACL,SAAUxB,EACV,KAAMG,EACL,GAAGM,EACJ,SAAWgB,GAAUZ,EAAQY,EAAM,OAAO,MAAO,EAAI,EACrD,MAAOb,EACP,IAAKF,CACP,CAAA,EACAf,EAAA,cAAC+B,EAAA,CAAQ,MAAK,GAAC,KAAMT,EAAc,aAAcC,CAC/CvB,EAAAA,EAAA,cAAC+B,EAAQ,QAAR,CAAgB,QAAO,EAAA,EACtB/B,EAAA,cAACgC,EAAA,CACC,IAAK,CACH,SAAU,WACV,IAAK,MACL,UAAW,mBACX,MAAO,GACT,EACA,SAAU3B,EACV,MAAOe,EAAc,KACrB,KAAMM,EACN,MAAM,UACN,WAAY,EAEZ1B,EAAAA,EAAA,cAACiC,EAAA,CAAK,GAAIC,CAAe,CAAA,CAC3B,CACF,EACAlC,EAAA,cAAC+B,EAAQ,OAAR,KACC/B,EAAA,cAAC+B,EAAQ,QAAR,CACC,IAAK,CAAE,GAAI,WAAY,OAAQI,CAAe,EAC9C,KAAK,SACL,MAAM,MACN,gBAAiB,GACjB,gBAAkBC,GAAM,CAlGtC,IAAAC,EAAAC,EAmGgBF,EAAE,iBACEpB,GACFqB,EAAAZ,EAAgB,UAAhB,MAAAY,EAAyB,MAAA,GAEzBC,EAAAd,EAAa,UAAb,MAAAc,EAAsB,MAE1B,CAAA,CAEAtC,EAAAA,EAAA,cAACuC,EAAA,CACC,KAAMvB,GAAQ,IAAI,KAClB,SAAUA,EACV,eAAgB,MAAOA,GAAS,CAC9BO,EAAgB,EAAK,EACrB,MAAML,EAAQF,EAAK,KAAM,EAAK,EAC1BN,GAAYA,EAClB,CAAA,EACA,QAAS,MAAOM,GAAS,CACvB,MAAME,EAAQF,EAAM,EAAK,EACrBN,GAAYA,EAClB,CAAA,EACA,QAASE,EACT,QAASC,EACT,aAAcW,EACd,gBAAiBC,EACjB,eAAgBrB,EAChB,WAAYE,EACZ,aAAcC,EACd,OAAQa,CACV,CAAA,CACF,CACF,CACF,CACF,CAEJ,CACF,EAEArB,EAAU,YAAc"}

package/dist/components/dismissible/DismissibleRoot.js

@@ -1,2 +1,2 @@
-import{Slot as c}from"@radix-ui/react-slot";import*as e from"react";const r=e.createContext({isDismissed:!1,setIsDismissed:()=>null}),n=({children:t,disabled:s})=>{const[i,l]=e.useState(!1),o=e.useMemo(()=>({disabled:s,isDismissed:i,setIsDismissed:l}),[s,i]);return e.createElement(r.Provider,{value:o},t)},u=({asChild:t=!1,value:s,onDismiss:i,...l})=>{const o=e.useContext(r),{isDismissed:d,disabled:a}=o;if(e.useEffect(()=>{d&&(i==null||i(s))},[d]),d)return null;const m={...a&&{["data-disabled"]:""},...l};return e.createElement(t?c:"div",{...m})},b=({disabled:t=!1,...s})=>e.createElement(n,{disabled:t},e.createElement(u,{...s}));export{b as DismissibleRoot,r as DismissibleRootContext,n as DismissibleRootProvider};
+import{Slot as c}from"@radix-ui/react-slot";import*as e from"react";const r=e.createContext({isDismissed:!1,setIsDismissed:()=>null}),n=({children:i,disabled:s})=>{const[t,l]=e.useState(!1),o=e.useMemo(()=>({disabled:s,isDismissed:t,setIsDismissed:l}),[s,t]);return e.createElement(r.Provider,{value:o},i)},u=({asChild:i=!1,value:s,onDismiss:t,...l})=>{const o=e.useContext(r),{isDismissed:d,disabled:a}=o;if(e.useEffect(()=>{d&&(t==null||t(s))},[d]),d)return null;const m={...a&&{["data-disabled"]:""},...l};return e.createElement(i?c:"div",{...m})},b=({disabled:i=!1,...s})=>e.createElement(n,{disabled:i},e.createElement(u,{...s}));export{b as DismissibleRoot,r as DismissibleRootContext,n as DismissibleRootProvider};
 //# sourceMappingURL=DismissibleRoot.js.map

package/dist/components/dismissible/DismissibleTrigger.js

@@ -1,2 +1,2 @@
-import{Slot as m}from"@radix-ui/react-slot";import*as t from"react";import{DismissibleRootContext as l}from"./DismissibleRoot.js";const b=s=>t.createElement("button",{type:"button",...s},"Dismiss"),a=({asChild:s=!1,...i})=>{const e=t.useContext(l);if(e===void 0)throw new Error("Dismissible.Trigger can only be used within a Dismissible.Item");const{setIsDismissed:o,disabled:r}=e,n={disabled:r,onClick:()=>{o(!0)},...i};return t.createElement(s?m:b,{...n})};export{a as DismissibleTrigger};
+import{Slot as m}from"@radix-ui/react-slot";import*as s from"react";import{DismissibleRootContext as l}from"./DismissibleRoot.js";const b=e=>s.createElement("button",{type:"button",...e},"Dismiss"),a=({asChild:e=!1,...t})=>{const i=s.useContext(l);if(i===void 0)throw new Error("Dismissible.Trigger can only be used within a Dismissible.Item");const{setIsDismissed:o,disabled:r}=i,n={disabled:r,onClick:()=>{o(!0)},...t};return s.createElement(e?m:b,{...n})};export{a as DismissibleTrigger};
 //# sourceMappingURL=DismissibleTrigger.js.map

package/dist/components/divider/Divider.js

@@ -1,2 +1,2 @@
-import t from"react";import{styled as n}from"../../stitches.js";const i=n("hr",{border:0,bg:"$tonal100",variants:{orientation:{horizontal:{height:1,width:"100%"},vertical:{height:"100%",width:1,minHeight:"$3"}}}}),a=t.forwardRef(({orientation:r="horizontal",...e},o)=>t.createElement(i,{ref:o,orientation:r,...e}));export{a as Divider,i as StyledDivider};
+import t from"react";import{styled as n}from"../../stitches.js";const i=n("hr",{border:0,bg:"$tonal100",variants:{orientation:{horizontal:{height:1,width:"100%"},vertical:{height:"100%",width:1,minHeight:"$3"}}}}),a=t.forwardRef(({orientation:e="horizontal",...r},o)=>t.createElement(i,{ref:o,orientation:e,...r}));export{a as Divider,i as StyledDivider};
 //# sourceMappingURL=Divider.js.map

package/dist/components/field-wrapper/FieldDescription.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{Text as r}from"../text/Text.js";const s=({children:t,css:o})=>e.createElement(r,{size:"sm",css:{color:"$tonal300",maxWidth:"80ch",...o}},t);export{s as Description};
+import*as t from"react";import{Text as r}from"../text/Text.js";const s=({children:e,css:o})=>t.createElement(r,{size:"sm",css:{color:"$tonal300",maxWidth:"80ch",...o}},e);export{s as Description};
 //# sourceMappingURL=FieldDescription.js.map

package/dist/components/field-wrapper/InlineFieldWrapper.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{Box as o}from"../box/Box.js";import{Checkbox as d}from"../checkbox/Checkbox.js";import{InlineMessage as f}from"../inline-message/InlineMessage.js";import{Label as $}from"../label/Label.js";import{RadioButton as u}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import{Description as E}from"./FieldDescription.js";const l=({align:n="start",children:a,css:s,description:i,direction:t="row",error:m,label:p,required:c})=>e.createElement(o,{css:s},e.createElement($,{align:n,direction:t,required:c,type:"inline"},e.Children.map(a,r=>e.createElement(o,{css:{[t==="reverse"?"ml":"mr"]:"$3",...((r==null?void 0:r.type)===d||(r==null?void 0:r.type)===u)&&{transform:"translateY($space$1)"}}},r)),p),m&&e.createElement(f,{css:{mt:"$2"}},m),i&&e.createElement(E,{css:{mt:"$2",[t==="reverse"?"mr":"ml"]:"calc($space$3 + $sizes$1)"}},i));l.displayName="InlineFieldWrapper";export{l as InlineFieldWrapper};
+import*as e from"react";import{Box as o}from"../box/Box.js";import{Checkbox as d}from"../checkbox/Checkbox.js";import{InlineMessage as $}from"../inline-message/InlineMessage.js";import{Label as f}from"../label/Label.js";import{RadioButton as u}from"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import{Description as E}from"./FieldDescription.js";const l=({align:n="start",children:a,css:s,description:i,direction:t="row",error:m,label:p,required:c})=>e.createElement(o,{css:s},e.createElement(f,{align:n,direction:t,required:c,type:"inline"},e.Children.map(a,r=>e.createElement(o,{css:{[t==="reverse"?"ml":"mr"]:"$3",...((r==null?void 0:r.type)===d||(r==null?void 0:r.type)===u)&&{transform:"translateY($space$1)"}}},r)),p),m&&e.createElement($,{css:{mt:"$2"}},m),i&&e.createElement(E,{css:{mt:"$2",[t==="reverse"?"mr":"ml"]:"calc($space$3 + $sizes$1)"}},i));l.displayName="InlineFieldWrapper";export{l as InlineFieldWrapper};
 //# sourceMappingURL=InlineFieldWrapper.js.map

package/dist/components/grid/Grid.js

@@ -1,2 +1,2 @@
-import*as p from"react";import{styled as o}from"../../stitches.js";import{createThemeVariants as s}from"../../utilities/create-theme-variants/createThemeVariants.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";const n=o("div",{display:"grid",variants:{gap:s("space",{gap:"$key"})}}),e=({css:i,gap:m=2,minItemSize:t,maxItemSize:a="1fr",...r})=>p.createElement(n,{css:{...t&&{gridTemplateColumns:`repeat(auto-fit, minmax(${t}, ${a}))`},...i},gap:m,...r});e.displayName="Grid";export{e as Grid};
+import*as p from"react";import{styled as o}from"../../stitches.js";import{createThemeVariants as s}from"../../utilities/create-theme-variants/createThemeVariants.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";const n=o("div",{display:"grid",variants:{gap:s("space",{gap:"$key"})}}),t=({css:i,gap:m=2,minItemSize:e,maxItemSize:a="1fr",...r})=>p.createElement(n,{css:{...e&&{gridTemplateColumns:`repeat(auto-fit, minmax(${e}, ${a}))`},...i},gap:m,...r});t.displayName="Grid";export{t as Grid};
 //# sourceMappingURL=Grid.js.map

package/dist/components/icon/Icon.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as n}from"../../stitches.js";const i=n("svg",{display:"inline-block",fill:"none",stroke:"currentcolor",strokeLinecap:"round",strokeLinejoin:"round",verticalAlign:"middle",variants:{size:{sm:{size:"$1",strokeWidth:"1.5"},md:{size:"$2",strokeWidth:"1.75"},lg:{size:"$3",strokeWidth:"2"}}}}),d=e.forwardRef(({is:r,size:o="md",...t},s)=>e.createElement(i,{size:o,"aria-hidden":"true",...t,as:r,ref:s}));export{d as Icon,i as StyledIcon};
+import*as e from"react";import{styled as n}from"../../stitches.js";const i=n("svg",{display:"inline-block",fill:"none",stroke:"currentcolor",strokeLinecap:"round",strokeLinejoin:"round",verticalAlign:"middle",variants:{size:{sm:{size:"$1",strokeWidth:"1.5"},md:{size:"$2",strokeWidth:"1.75"},lg:{size:"$3",strokeWidth:"2"}}}}),d=e.forwardRef(({is:r,size:o="md",...s},t)=>e.createElement(i,{size:o,"aria-hidden":"true",...s,as:r,ref:t}));export{d as Icon,i as StyledIcon};
 //# sourceMappingURL=Icon.js.map

package/dist/components/inline-message/InlineMessage.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{Flex as a}from"../flex/Flex.js";import{Icon as c}from"../icon/Icon.js";import{Text as E}from"../text/Text.js";import{styled as t}from"../../stitches.js";import{INLINE_MESSAGE_THEMES as f,INLINE_MESSAGE_ICONS as l}from"./InlineMessage.config.js";const p=t(a,{variants:{theme:f}}),I=t(c,{flexShrink:"0",mr:"$2"}),S=({css:s,showIcon:m=!0,theme:r="error",size:o="sm",children:n,...i})=>e.createElement(p,{theme:r,css:s,...i},m&&e.createElement(I,{size:"sm",is:l[r]}),e.createElement(E,{as:"span",size:o,css:{transform:"translateY($space$0)"}},n));export{S as InlineMessage};
+import*as e from"react";import{Flex as a}from"../flex/Flex.js";import{Icon as c}from"../icon/Icon.js";import{Text as E}from"../text/Text.js";import{styled as s}from"../../stitches.js";import{INLINE_MESSAGE_THEMES as f,INLINE_MESSAGE_ICONS as l}from"./InlineMessage.config.js";const p=s(a,{variants:{theme:f}}),I=s(c,{flexShrink:"0",mr:"$2"}),S=({css:t,showIcon:m=!0,theme:r="error",size:o="sm",children:n,...i})=>e.createElement(p,{theme:r,css:t,...i},m&&e.createElement(I,{size:"sm",is:l[r]}),e.createElement(E,{as:"span",size:o,css:{transform:"translateY($space$0)"}},n));export{S as InlineMessage};
 //# sourceMappingURL=InlineMessage.js.map

package/dist/components/input/Input.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Override } from '../../utilities/types';
 declare const StyledInput: import("@stitches/react/types/styled-component").StyledComponent<"input", {
-    size?: "sm" | "md" | undefined;
+    size?: "sm" | "md" | "lg" | undefined;
     state?: "error" | undefined;
 }, {
     sm: string;

package/dist/components/input/Input.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as l}from"../../stitches.js";const i=l("input",{appearance:"none",border:"1px solid $tonal400",borderRadius:"$0",boxShadow:"none",boxSizing:"border-box",color:"$tonal600",cursor:"text",display:"block",fontFamily:"$body",px:"$3",transition:"all 100ms ease-out",width:"100%","&:focus":{borderColor:"$primary",outline:"none"},"&[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&::placeholder":{color:"$tonal300",opacity:1},variants:{size:{sm:{height:"$3",fontSize:"$sm",lineHeight:1.7},md:{height:"$4",fontSize:"$md",lineHeight:2}},state:{error:{border:"1px solid $danger"}}}}),a=e.forwardRef(({type:o="text",size:t="md",...r},n)=>o==="number"?e.createElement(i,{type:"text",inputMode:"numeric",pattern:"[0-9]*",size:t,...r,ref:n}):e.createElement(i,{type:o,size:t,...r,ref:n}));a.displayName="Input";export{a as Input};
+import*as e from"react";import{styled as l}from"../../stitches.js";const n=l("input",{appearance:"none",border:"1px solid $tonal400",borderRadius:"$0",boxShadow:"none",boxSizing:"border-box",color:"$tonal600",cursor:"text",display:"block",fontFamily:"$body",px:"$3",transition:"all 100ms ease-out",width:"100%","&:focus":{borderColor:"$primary",outline:"none"},"&[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&::placeholder":{color:"$tonal300",opacity:1},variants:{size:{sm:{height:"$3",fontSize:"$sm",lineHeight:1.7},md:{height:"$4",fontSize:"$md",lineHeight:2},lg:{height:"$5",fontSize:"$md",lineHeight:2}},state:{error:{border:"1px solid $danger"}}}}),a=e.forwardRef(({type:o="text",size:t="md",...r},i)=>o==="number"?e.createElement(n,{type:"text",inputMode:"numeric",pattern:"[0-9]*",size:t,...r,ref:i}):e.createElement(n,{type:o,size:t,...r,ref:i}));a.displayName="Input";export{a as Input};
 //# sourceMappingURL=Input.js.map

package/dist/components/input/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { Override } from '~/utilities/types'\n\nconst StyledInput = styled('input', {\n  appearance: 'none',\n  border: '1px solid $tonal400',\n  borderRadius: '$0',\n  boxShadow: 'none', // prevent default iOS default styling\n  boxSizing: 'border-box',\n  color: '$tonal600',\n  cursor: 'text',\n  display: 'block',\n  fontFamily: '$body',\n  px: '$3',\n  transition: 'all 100ms ease-out',\n  width: '100%',\n  '&:focus': {\n    borderColor: '$primary',\n    outline: 'none'\n  },\n  '&[disabled]': {\n    backgroundColor: '$tonal100',\n    color: '$tonal400',\n    cursor: 'not-allowed'\n  },\n  '&::placeholder': {\n    color: '$tonal300',\n    opacity: 1\n  },\n  variants: {\n    size: {\n      sm: {\n        height: '$3',\n        fontSize: '$sm',\n        lineHeight: 1.7\n      },\n      md: {\n        height: '$4',\n        fontSize: '$md',\n        lineHeight: 2\n      }\n    },\n    state: {\n      error: {\n        border: '1px solid $danger'\n      }\n    }\n  }\n})\n\n// override default 'type' property to prevent Input from being used to render\n// checkboxes, radios etc — we have dedicated components for them\nexport type InputProps = Override<\n  React.ComponentProps<typeof StyledInput>,\n  {\n    name: string\n    as?: never\n    type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n  }\n>\n\nexport const Input: React.FC<InputProps> = React.forwardRef(\n  ({ type = 'text', size = 'md', ...rest }, ref) => {\n    if (type === 'number') {\n      return (\n        <StyledInput\n          type=\"text\"\n          inputMode=\"numeric\"\n          pattern=\"[0-9]*\"\n          size={size}\n          {...rest}\n          ref={ref}\n        />\n      )\n    }\n\n    return <StyledInput type={type} size={size} {...rest} ref={ref} />\n  }\n)\n\nInput.displayName = 'Input'\n"],"names":["StyledInput","styled","Input","React","type","size","rest","ref"],"mappings":"mEAKA,MAAMA,EAAcC,EAAO,QAAS,CAClC,WAAY,OACZ,OAAQ,sBACR,aAAc,KACd,UAAW,OACX,UAAW,aACX,MAAO,YACP,OAAQ,OACR,QAAS,QACT,WAAY,QACZ,GAAI,KACJ,WAAY,qBACZ,MAAO,OACP,UAAW,CACT,YAAa,WACb,QAAS,MACX,EACA,cAAe,CACb,gBAAiB,YACjB,MAAO,YACP,OAAQ,aACV,EACA,iBAAkB,CAChB,MAAO,YACP,QAAS,CACX,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,GACd,EACA,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,CACd,CACF,EACA,MAAO,CACL,MAAO,CACL,OAAQ,mBACV,CACF,CACF,CACF,CAAC,EAaYC,EAA8BC,EAAM,WAC/C,CAAC,CAAE,KAAAC,EAAO,OAAQ,KAAAC,EAAO,QAASC,CAAK,EAAGC,IACpCH,IAAS,SAETD,EAAA,cAACH,EAAA,CACC,KAAK,OACL,UAAU,UACV,QAAQ,SACR,KAAMK,EACL,GAAGC,EACJ,IAAKC,CACP,CAAA,EAIGJ,EAAA,cAACH,EAAA,CAAY,KAAMI,EAAM,KAAMC,EAAO,GAAGC,EAAM,IAAKC,CAAAA,CAAK,CAEpE,EAEAL,EAAM,YAAc"}
+{"version":3,"file":"Input.js","sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { Override } from '~/utilities/types'\n\nconst StyledInput = styled('input', {\n  appearance: 'none',\n  border: '1px solid $tonal400',\n  borderRadius: '$0',\n  boxShadow: 'none', // prevent default iOS default styling\n  boxSizing: 'border-box',\n  color: '$tonal600',\n  cursor: 'text',\n  display: 'block',\n  fontFamily: '$body',\n  px: '$3',\n  transition: 'all 100ms ease-out',\n  width: '100%',\n  '&:focus': {\n    borderColor: '$primary',\n    outline: 'none'\n  },\n  '&[disabled]': {\n    backgroundColor: '$tonal100',\n    color: '$tonal400',\n    cursor: 'not-allowed'\n  },\n  '&::placeholder': {\n    color: '$tonal300',\n    opacity: 1\n  },\n  variants: {\n    size: {\n      sm: {\n        height: '$3',\n        fontSize: '$sm',\n        lineHeight: 1.7\n      },\n      md: {\n        height: '$4',\n        fontSize: '$md',\n        lineHeight: 2\n      },\n      lg: {\n        height: '$5',\n        fontSize: '$md',\n        lineHeight: 2\n      }\n    },\n    state: {\n      error: {\n        border: '1px solid $danger'\n      }\n    }\n  }\n})\n\n// override default 'type' property to prevent Input from being used to render\n// checkboxes, radios etc — we have dedicated components for them\nexport type InputProps = Override<\n  React.ComponentProps<typeof StyledInput>,\n  {\n    name: string\n    as?: never\n    type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n  }\n>\n\nexport const Input: React.FC<InputProps> = React.forwardRef(\n  ({ type = 'text', size = 'md', ...rest }, ref) => {\n    if (type === 'number') {\n      return (\n        <StyledInput\n          type=\"text\"\n          inputMode=\"numeric\"\n          pattern=\"[0-9]*\"\n          size={size}\n          {...rest}\n          ref={ref}\n        />\n      )\n    }\n\n    return <StyledInput type={type} size={size} {...rest} ref={ref} />\n  }\n)\n\nInput.displayName = 'Input'\n"],"names":["StyledInput","styled","Input","React","type","size","rest","ref"],"mappings":"mEAKA,MAAMA,EAAcC,EAAO,QAAS,CAClC,WAAY,OACZ,OAAQ,sBACR,aAAc,KACd,UAAW,OACX,UAAW,aACX,MAAO,YACP,OAAQ,OACR,QAAS,QACT,WAAY,QACZ,GAAI,KACJ,WAAY,qBACZ,MAAO,OACP,UAAW,CACT,YAAa,WACb,QAAS,MACX,EACA,cAAe,CACb,gBAAiB,YACjB,MAAO,YACP,OAAQ,aACV,EACA,iBAAkB,CAChB,MAAO,YACP,QAAS,CACX,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,GACd,EACA,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,CACd,EACA,GAAI,CACF,OAAQ,KACR,SAAU,MACV,WAAY,CACd,CACF,EACA,MAAO,CACL,MAAO,CACL,OAAQ,mBACV,CACF,CACF,CACF,CAAC,EAaYC,EAA8BC,EAAM,WAC/C,CAAC,CAAE,KAAAC,EAAO,OAAQ,KAAAC,EAAO,QAASC,CAAK,EAAGC,IACpCH,IAAS,SAETD,EAAA,cAACH,EAAA,CACC,KAAK,OACL,UAAU,UACV,QAAQ,SACR,KAAMK,EACL,GAAGC,EACJ,IAAKC,CAAAA,CACP,EAIGJ,EAAA,cAACH,EAAA,CAAY,KAAMI,EAAM,KAAMC,EAAO,GAAGC,EAAM,IAAKC,CAAAA,CAAK,CAEpE,EAEAL,EAAM,YAAc"}

package/dist/components/label/Label.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as t}from"../../stitches.js";import{getTextVariant as i}from"../text/Text.js";const p=t("label",{color:"$tonal500",fontFamily:"$body",m:0,variants:{size:{sm:i({size:"sm"}),md:i({size:"md"})},type:{block:{display:"block",fontWeight:600},inline:{display:"flex",fontWeight:400,maxWidth:"max-content"}},align:{start:{},center:{}},direction:{reverse:{},row:{}}},compoundVariants:[{type:"inline",align:"start",css:{alignItems:"flex-start"}},{type:"inline",align:"center",css:{alignItems:"center"}},{type:"inline",direction:"reverse",css:{flexDirection:"row-reverse"}},{type:"inline",direction:"row",css:{flexDirection:"row"}}]}),y=t("span",{color:"$danger",ml:"$1",fontWeight:400}),n=({align:r="start",as:a="label",direction:l="row",size:o="md",type:s="block",children:c,required:m,...d})=>e.createElement(p,{as:a,size:o,type:s,align:r,direction:l,...d},c,m&&e.createElement(y,{"aria-hidden":!0},"*"));n.displayName="Label";export{n as Label};
+import*as e from"react";import{styled as i}from"../../stitches.js";import{getTextVariant as t}from"../text/Text.js";const p=i("label",{color:"$tonal500",fontFamily:"$body",m:0,variants:{size:{sm:t({size:"sm"}),md:t({size:"md"})},type:{block:{display:"block",fontWeight:600},inline:{display:"flex",fontWeight:400,maxWidth:"max-content"}},align:{start:{},center:{}},direction:{reverse:{},row:{}}},compoundVariants:[{type:"inline",align:"start",css:{alignItems:"flex-start"}},{type:"inline",align:"center",css:{alignItems:"center"}},{type:"inline",direction:"reverse",css:{flexDirection:"row-reverse"}},{type:"inline",direction:"row",css:{flexDirection:"row"}}]}),y=i("span",{color:"$danger",ml:"$1",fontWeight:400}),n=({align:r="start",as:a="label",direction:l="row",size:o="md",type:s="block",children:c,required:m,...d})=>e.createElement(p,{as:a,size:o,type:s,align:r,direction:l,...d},c,m&&e.createElement(y,{"aria-hidden":!0},"*"));n.displayName="Label";export{n as Label};
 //# sourceMappingURL=Label.js.map

package/dist/components/link/Link.js

@@ -1,2 +1,2 @@
-import*as t from"react";import{styled as a}from"../../stitches.js";import{StyledHeading as p}from"../heading/Heading.js";import{StyledLi as s}from"../list/List.js";import"../markdown-content/components/MarkdownCode.js";import{StyledMarkdownEmphasis as f}from"../markdown-content/components/MarkdownEmphasis.js";import"../markdown-content/components/MarkdownInlineCode.js";import"../image/Image.js";import{StyledText as d,textVariants as l}from"../text/Text.js";import"../markdown-content/components/MarkdownStrong.js";import"../divider/Divider.js";const e=a("a",{bg:"unset",border:"unset",p:"unset",color:"$primary",cursor:"pointer",fontFamily:"$body",textDecoration:"none","&:focus, &:hover":{color:"$primaryMid",textDecoration:"underline"},"&:active":{color:"$primaryDark"},[`${d} > &, ${p} > &, ${s} > &, ${f} > &`]:{fontSize:"100%",lineHeight:1,"&::before, &::after":{content:"none"}},variants:l}),o=t.forwardRef(({size:i="md",href:r,...n},m)=>t.createElement(e,{...!r&&{as:"button",noCapsize:!0},size:i,href:r,...n,ref:m}));o.displayName="Link";export{o as Link,e as StyledLink};
+import*as e from"react";import{styled as a}from"../../stitches.js";import{StyledHeading as p}from"../heading/Heading.js";import{StyledLi as s}from"../list/List.js";import"../markdown-content/components/MarkdownCode.js";import{StyledMarkdownEmphasis as f}from"../markdown-content/components/MarkdownEmphasis.js";import"../markdown-content/components/MarkdownInlineCode.js";import"../image/Image.js";import{StyledText as d,textVariants as l}from"../text/Text.js";import"../markdown-content/components/MarkdownStrong.js";import"../divider/Divider.js";const t=a("a",{bg:"unset",border:"unset",p:"unset",color:"$primary",cursor:"pointer",fontFamily:"$body",textDecoration:"none","&:focus, &:hover":{color:"$primaryMid",textDecoration:"underline"},"&:active":{color:"$primaryDark"},[`${d} > &, ${p} > &, ${s} > &, ${f} > &`]:{fontSize:"100%",lineHeight:1,"&::before, &::after":{content:"none"}},variants:l}),o=e.forwardRef(({size:i="md",href:r,...n},m)=>e.createElement(t,{...!r&&{as:"button",noCapsize:!0},size:i,href:r,...n,ref:m}));o.displayName="Link";export{o as Link,t as StyledLink};
 //# sourceMappingURL=Link.js.map

package/dist/components/list/List.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as i}from"../../stitches.js";import{textVariants as d}from"../text/Text.js";const t=i("li",{}),l=i("ul",{listStylePosition:"inside",fontFamily:"$body",m:"unset",p:"unset",[`& > ${t}`]:{"&:not(:last-child)":{mb:"$2"},"&:last-child":{mb:0}},variants:{...d,as:{ol:{pl:"$4",listStyleType:"decimal",[`& > ${t}`]:{pl:"$1","&::marker":{fontSize:".875em",fontWeight:"bold"}}},ul:{pl:"$3",[`& > ${t}`]:{pl:"$2","&::marker":{content:"\u2022 ",fontWeight:"bold"}}}},theme:{primary:{[`& > ${t}`]:{"&::marker":{color:"$primary"}}}}}}),o=e.forwardRef(({size:r="md",noCapsize:m=!0,ordered:s,...a},n)=>e.createElement(l,{ref:n,as:s?"ol":"ul",size:r,noCapsize:m,...a}));o.Item=t;export{o as List,t as StyledLi,l as StyledList};
+import*as t from"react";import{styled as i}from"../../stitches.js";import{textVariants as d}from"../text/Text.js";const e=i("li",{}),l=i("ul",{listStylePosition:"inside",fontFamily:"$body",m:"unset",p:"unset",[`& > ${e}`]:{"&:not(:last-child)":{mb:"$2"},"&:last-child":{mb:0}},variants:{...d,as:{ol:{pl:"$4",listStyleType:"decimal",[`& > ${e}`]:{pl:"$1","&::marker":{fontSize:".875em",fontWeight:"bold"}}},ul:{pl:"$3",[`& > ${e}`]:{pl:"$2","&::marker":{content:"\u2022 ",fontWeight:"bold"}}}},theme:{primary:{[`& > ${e}`]:{"&::marker":{color:"$primary"}}}}}}),o=t.forwardRef(({size:r="md",noCapsize:m=!0,ordered:s,...a},n)=>t.createElement(l,{ref:n,as:s?"ol":"ul",size:r,noCapsize:m,...a}));o.Item=e;export{o as List,e as StyledLi,l as StyledList};
 //# sourceMappingURL=List.js.map

package/dist/components/markdown-content/MarkdownContent.js

@@ -1,2 +1,2 @@
-import d from"mdast-util-directive";import k from"mdast-util-from-markdown";import f from"micromark-extension-directive";import*as p from"react";import{StackContent as l}from"../stack-content/StackContent.js";import{MarkdownCode as c}from"./components/MarkdownCode.js";import{MarkdownEmphasis as w}from"./components/MarkdownEmphasis.js";import{MarkdownHeading as M}from"./components/MarkdownHeading.js";import{MarkdownInlineCode as h}from"./components/MarkdownInlineCode.js";import{MarkdownImage as u}from"./components/MarkdownImage.js";import{MarkdownLink as g}from"./components/MarkdownLink.js";import{MarkdownList as C}from"./components/MarkdownList.js";import{MarkdownListItem as $}from"./components/MarkdownListItem.js";import{MarkdownParagraph as x}from"./components/MarkdownParagraph.js";import{MarkdownStrong as y}from"./components/MarkdownStrong.js";import{MarkdownText as E}from"./components/MarkdownText.js";import{MarkdownThematicBreak as I}from"./components/MarkdownThematicBreak.js";const L={code:c,emphasis:w,heading:M,inlineCode:h,image:u,link:g,list:C,listItem:$,paragraph:x,strong:y,text:E,thematicBreak:I},v=o=>{var r,t;if((r=o.position)!=null&&r.start){const{line:e,column:m,offset:n}=(t=o.position)==null?void 0:t.start;return`${o.type}${e}${m}${n}`}return`${o.type}${+new Date}`},s=({content:o,customComponents:r={},css:t})=>{const e=k(o,{extensions:[f()],mdastExtensions:[d.fromMarkdown]}),m={...L,...r},n=a=>{const i=m[a.type];return i?p.createElement(i,{key:v(a),node:a,handleNode:n}):null};return p.createElement(l,{css:t},e.children.map(n))};s.displayName="MarkdownContent";export{s as MarkdownContent};
+import d from"mdast-util-directive";import k from"mdast-util-from-markdown";import f from"micromark-extension-directive";import*as p from"react";import{StackContent as l}from"../stack-content/StackContent.js";import{MarkdownCode as c}from"./components/MarkdownCode.js";import{MarkdownEmphasis as w}from"./components/MarkdownEmphasis.js";import{MarkdownHeading as M}from"./components/MarkdownHeading.js";import{MarkdownInlineCode as h}from"./components/MarkdownInlineCode.js";import{MarkdownImage as u}from"./components/MarkdownImage.js";import{MarkdownLink as g}from"./components/MarkdownLink.js";import{MarkdownList as $}from"./components/MarkdownList.js";import{MarkdownListItem as C}from"./components/MarkdownListItem.js";import{MarkdownParagraph as x}from"./components/MarkdownParagraph.js";import{MarkdownStrong as y}from"./components/MarkdownStrong.js";import{MarkdownText as E}from"./components/MarkdownText.js";import{MarkdownThematicBreak as I}from"./components/MarkdownThematicBreak.js";const L={code:c,emphasis:w,heading:M,inlineCode:h,image:u,link:g,list:$,listItem:C,paragraph:x,strong:y,text:E,thematicBreak:I},v=o=>{var r,t;if((r=o.position)!=null&&r.start){const{line:e,column:m,offset:n}=(t=o.position)==null?void 0:t.start;return`${o.type}${e}${m}${n}`}return`${o.type}${+new Date}`},s=({content:o,customComponents:r={},css:t})=>{const e=k(o,{extensions:[f()],mdastExtensions:[d.fromMarkdown]}),m={...L,...r},n=a=>{const i=m[a.type];return i?p.createElement(i,{key:v(a),node:a,handleNode:n}):null};return p.createElement(l,{css:t},e.children.map(n))};s.displayName="MarkdownContent";export{s as MarkdownContent};
 //# sourceMappingURL=MarkdownContent.js.map

package/dist/components/markdown-content/components/MarkdownCode.js

@@ -1,2 +1,2 @@
-import*as t from"react";import{styled as e}from"../../../stitches.js";import{Box as r}from"../../box/Box.js";const m=e(r,{bg:"$tonal100",borderRadius:"$1",color:"$tonal600",fontFamily:"$mono",fontSize:"$sm",lineHeight:1.4,my:"$4",p:"$3"}),n=({node:o})=>t.createElement(m,{as:"pre"},o.value);export{n as MarkdownCode};
+import*as e from"react";import{styled as t}from"../../../stitches.js";import{Box as r}from"../../box/Box.js";const m=t(r,{bg:"$tonal100",borderRadius:"$1",color:"$tonal600",fontFamily:"$mono",fontSize:"$sm",lineHeight:1.4,my:"$4",p:"$3"}),n=({node:o})=>e.createElement(m,{as:"pre"},o.value);export{n as MarkdownCode};
 //# sourceMappingURL=MarkdownCode.js.map

package/dist/components/markdown-content/components/MarkdownEmphasis.js

@@ -1,2 +1,2 @@
-import*as l from"react";import{styled as n}from"../../../stitches.js";const o=n("em",{fontStyle:"italic"}),a=({node:t,handleNode:r})=>{var e;return l.createElement(o,null,(e=t.children)==null?void 0:e.map(r))};export{a as MarkdownEmphasis,o as StyledMarkdownEmphasis};
+import*as l from"react";import{styled as n}from"../../../stitches.js";const o=n("em",{fontStyle:"italic"}),a=({node:r,handleNode:t})=>{var e;return l.createElement(o,null,(e=r.children)==null?void 0:e.map(t))};export{a as MarkdownEmphasis,o as StyledMarkdownEmphasis};
 //# sourceMappingURL=MarkdownEmphasis.js.map

package/dist/components/markdown-content/components/MarkdownImage.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{Image as o}from"../../image/Image.js";const m=({node:r,css:a})=>{var t;return e.createElement(o,{src:r.url,alt:(t=r.alt)!=null?t:void 0,css:a})};export{m as MarkdownImage};
+import*as o from"react";import{Image as t}from"../../image/Image.js";const m=({node:r,css:a})=>{var e;return o.createElement(t,{src:r.url,alt:(e=r.alt)!=null?e:void 0,css:a})};export{m as MarkdownImage};
 //# sourceMappingURL=MarkdownImage.js.map

package/dist/components/markdown-content/components/MarkdownInlineCode.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as n}from"../../../stitches.js";import{Box as t}from"../../box/Box.js";const r=n(t,{bg:"$tonal100",borderRadius:"$0",color:"$tonal600",display:"inline-block",fontFamily:"$mono",fontSize:"85%",p:"$0 $1"}),l=({node:o})=>e.createElement(r,{as:"code"},o.value);export{l as MarkdownInlineCode};
+import*as e from"react";import{styled as n}from"../../../stitches.js";import{Box as r}from"../../box/Box.js";const t=n(r,{bg:"$tonal100",borderRadius:"$0",color:"$tonal600",display:"inline-block",fontFamily:"$mono",fontSize:"85%",p:"$0 $1"}),l=({node:o})=>e.createElement(t,{as:"code"},o.value);export{l as MarkdownInlineCode};
 //# sourceMappingURL=MarkdownInlineCode.js.map

package/dist/components/markdown-content/components/MarkdownListItem.js

@@ -1,2 +1,2 @@
-import*as o from"react";import{List as n}from"../../list/List.js";const m=({node:e,handleNode:r})=>{var t;return o.createElement(n.Item,null,(t=e.children)==null?void 0:t.map(r))};export{m as MarkdownListItem};
+import*as o from"react";import{List as n}from"../../list/List.js";const m=({node:t,handleNode:r})=>{var e;return o.createElement(n.Item,null,(e=t.children)==null?void 0:e.map(r))};export{m as MarkdownListItem};
 //# sourceMappingURL=MarkdownListItem.js.map

package/dist/components/markdown-content/components/MarkdownParagraph.js

@@ -1,2 +1,2 @@
-import*as t from"react";import{Text as n}from"../../text/Text.js";const d=({node:e,handleNode:a,...o})=>{var r;return t.createElement(n,{...o},(r=e.children)==null?void 0:r.map(a))};export{d as MarkdownParagraph};
+import*as n from"react";import{Text as t}from"../../text/Text.js";const d=({node:e,handleNode:a,...o})=>{var r;return n.createElement(t,{...o},(r=e.children)==null?void 0:r.map(a))};export{d as MarkdownParagraph};
 //# sourceMappingURL=MarkdownParagraph.js.map

package/dist/components/markdown-content/components/MarkdownStrong.js

@@ -1,2 +1,2 @@
-import*as r from"react";import{styled as e}from"../../../stitches.js";const d=e("strong",{fontWeight:600}),l=({node:t,handleNode:n})=>{var o;return r.createElement(d,null,(o=t.children)==null?void 0:o.map(n))};export{l as MarkdownStrong};
+import*as r from"react";import{styled as t}from"../../../stitches.js";const d=t("strong",{fontWeight:600}),l=({node:e,handleNode:n})=>{var o;return r.createElement(d,null,(o=e.children)==null?void 0:o.map(n))};export{l as MarkdownStrong};
 //# sourceMappingURL=MarkdownStrong.js.map

package/dist/components/markdown-content/components/MarkdownThematicBreak.js

@@ -1,2 +1,2 @@
-import*as t from"react";import{Divider as e}from"../../divider/Divider.js";const o=({css:r})=>t.createElement(e,{css:{width:"100%",...r}});export{o as MarkdownThematicBreak};
+import*as r from"react";import{Divider as t}from"../../divider/Divider.js";const o=({css:e})=>r.createElement(t,{css:{width:"100%",...e}});export{o as MarkdownThematicBreak};
 //# sourceMappingURL=MarkdownThematicBreak.js.map

package/dist/components/number-input/NumberInput.d.ts

@@ -9,7 +9,7 @@ export interface NumberInputProps {
     defaultValue?: number;
     disabled?: boolean;
     readonly?: boolean;
-    size?: 'sm' | 'md';
+    size?: 'sm' | 'md' | 'lg';
     onValueChange?: (value: number) => void;
     stepperButtonLabels?: {
         increment?: string;

package/dist/components/number-input/NumberInput.js

@@ -1,2 +1,2 @@
-import{Minus as S,Plus as B}from"@atom-learning/icons";import*as t from"react";import{Flex as H}from"../flex/Flex.js";import{Input as $}from"../input/Input.js";import{NumberInputStepper as g}from"./NumberInputStepper.js";const k=t.forwardRef(({value:d,defaultValue:N=0,onValueChange:C,min:r=0,max:o=Number.MAX_SAFE_INTEGER,step:m=1,disabled:i=!1,readonly:u=!1,size:w="md",stepperButtonLabels:T,disabledTooltipContent:y,css:A,...L},z)=>{const[a,E]=t.useState(d||N);t.useEffect(()=>{typeof d<"u"&&E(d)},[d]);const s=t.useRef(null);t.useImperativeHandle(z,()=>s.current);const R={increment:"increment",decrement:"decrement",...T},h={decrement:`Cannot enter values below ${r}`,increment:`Cannot enter values above ${o}`,...y},c=a>=o,b=a<=r,p=t.useCallback(e=>Math.min(Math.max(e,r),o),[o,r]),n=t.useCallback(e=>{C==null||C(e),E(e)},[C]),D=t.useCallback(e=>{const l=Number(e.target.value.replace(/\D/g,""));n(l)},[n]),f=t.useCallback(()=>{var e;if(c||u)return;(e=s==null?void 0:s.current)==null||e.focus();const l=Number(a)+m;n(p(l))},[p,c,u,m,n,a]),v=t.useCallback(()=>{var e;if(b||u)return;(e=s==null?void 0:s.current)==null||e.focus();const l=Number(a)-m;n(p(l))},[p,b,u,r,m,n,a]),I=t.useCallback(e=>{if(e.nativeEvent.isComposing)return;const l=e.key,x={ArrowUp:f,ArrowRight:f,ArrowDown:v,ArrowLeft:v,Home:()=>n(r),End:()=>n(o)}[l];x&&(e.preventDefault(),x(e))},[f,v,n,r,o]),M={type:"number",value:a,...L,onChange:D,onKeyDown:I,size:w,css:{borderRadius:"0px",width:"$6","&:disabled":{opacity:.3,pointerEvents:"none"}},ref:s,readOnly:u,disabled:i,"aria-valuemin":r,"aria-valuemax":o,"aria-valuenow":a,role:"spinbutton"};return t.createElement(H,{css:A},t.createElement(g,{onClick:v,icon:S,css:{borderRight:"none",borderTopRightRadius:"0px",borderBottomRightRadius:"0px"},size:w,disabled:b||i,showTooltip:b&&!i,disabledTooltipContent:h.decrement,label:R.decrement}),t.createElement($,{...M}),t.createElement(g,{onClick:f,icon:B,css:{borderLeft:"none",borderTopLeftRadius:"0px",borderBottomLeftRadius:"0px"},size:w,disabled:c||i,showTooltip:c&&!i,disabledTooltipContent:h.increment,label:R.increment}))});k.displayName="NumberInput";export{k as NumberInput};
+import{Minus as B,Plus as F}from"@atom-learning/icons";import*as t from"react";import"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{getFieldIconSize as H}from"../../utilities/style/get-icon-size.js";import{Flex as $}from"../flex/Flex.js";import{Input as V}from"../input/Input.js";import{NumberInputStepper as E}from"./NumberInputStepper.js";const N=t.forwardRef(({value:m,defaultValue:T=0,onValueChange:C,min:n=0,max:a=Number.MAX_SAFE_INTEGER,step:d=1,disabled:s=!1,readonly:u=!1,size:w="md",stepperButtonLabels:y,disabledTooltipContent:I,css:A,...M},z)=>{const[o,R]=t.useState(m||T);t.useEffect(()=>{typeof m<"u"&&R(m)},[m]);const l=t.useRef(null);t.useImperativeHandle(z,()=>l.current);const g=t.useMemo(()=>H(w),[w]),h={increment:"increment",decrement:"decrement",...y},x={decrement:`Cannot enter values below ${n}`,increment:`Cannot enter values above ${a}`,...I},c=o>=a,p=o<=n,b=t.useCallback(e=>Math.min(Math.max(e,n),a),[a,n]),r=t.useCallback(e=>{C==null||C(e),R(e)},[C]),L=t.useCallback(e=>{const i=Number(e.target.value.replace(/\D/g,""));r(i)},[r]),f=t.useCallback(()=>{var e;if(c||u)return;(e=l==null?void 0:l.current)==null||e.focus();const i=Number(o)+d;r(b(i))},[b,c,u,d,r,o]),v=t.useCallback(()=>{var e;if(p||u)return;(e=l==null?void 0:l.current)==null||e.focus();const i=Number(o)-d;r(b(i))},[b,p,u,n,d,r,o]),D=t.useCallback(e=>{if(e.nativeEvent.isComposing)return;const i=e.key,k={ArrowUp:f,ArrowRight:f,ArrowDown:v,ArrowLeft:v,Home:()=>r(n),End:()=>r(a)}[i];k&&(e.preventDefault(),k(e))},[f,v,r,n,a]),S={type:"number",value:o,...M,onChange:L,onKeyDown:D,size:w,css:{borderRadius:"0px",width:"$6","&:disabled":{opacity:.3,pointerEvents:"none"}},ref:l,readOnly:u,disabled:s,"aria-valuemin":n,"aria-valuemax":a,"aria-valuenow":o,role:"spinbutton"};return t.createElement($,{css:A},t.createElement(E,{onClick:v,icon:B,css:{borderRight:"none",borderTopRightRadius:"0px",borderBottomRightRadius:"0px"},size:g,disabled:p||s,showTooltip:p&&!s,disabledTooltipContent:x.decrement,label:h.decrement}),t.createElement(V,{...S}),t.createElement(E,{onClick:f,icon:F,css:{borderLeft:"none",borderTopLeftRadius:"0px",borderBottomLeftRadius:"0px"},size:g,disabled:c||s,showTooltip:c&&!s,disabledTooltipContent:x.increment,label:h.increment}))});N.displayName="NumberInput";export{N as NumberInput};
 //# sourceMappingURL=NumberInput.js.map

package/dist/components/number-input/NumberInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInput.js","sources":["../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import { Minus, Plus } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport type { CSS } from '~/stitches'\n\nimport { Flex } from '../flex'\nimport { Input } from '../input'\nimport { NumberInputStepper } from './NumberInputStepper'\n\nexport interface NumberInputProps {\n  name: string\n  min?: number\n  max?: number\n  step?: number\n  value?: number\n  defaultValue?: number\n  disabled?: boolean\n  readonly?: boolean\n  size?: 'sm' | 'md'\n  onValueChange?: (value: number) => void\n  stepperButtonLabels?: { increment?: string; decrement?: string }\n  disabledTooltipContent?: { increment?: string; decrement?: string }\n  css?: CSS\n}\n\nexport const NumberInput = React.forwardRef<HTMLInputElement, NumberInputProps>(\n  (\n    {\n      value,\n      defaultValue = 0,\n      onValueChange,\n      min = 0,\n      max = Number.MAX_SAFE_INTEGER,\n      step = 1,\n      disabled: isDisabled = false,\n      readonly: isReadOnly = false,\n      size = 'md',\n      stepperButtonLabels: stepperButtonLabelsProp,\n      disabledTooltipContent: disabledTooltipContentProp,\n      css,\n      ...rest\n    },\n    ref\n  ): JSX.Element => {\n    const [internalValue, setInternalValue] = React.useState<number>(\n      value || defaultValue\n    )\n    React.useEffect(() => {\n      // Update the internal value to match what is passed in.\n      if (typeof value !== 'undefined') setInternalValue(value)\n    }, [value])\n\n    const inputRef = React.useRef<HTMLInputElement | null>(null)\n\n    React.useImperativeHandle(ref, () => inputRef.current as HTMLInputElement)\n\n    const stepperButtonLabels = {\n      increment: 'increment',\n      decrement: 'decrement',\n      ...stepperButtonLabelsProp\n    }\n\n    const disabledTooltipContent = {\n      decrement: `Cannot enter values below ${min}`,\n      increment: `Cannot enter values above ${max}`,\n      ...disabledTooltipContentProp\n    }\n\n    const isAtMax = internalValue >= max\n    const isAtMin = internalValue <= min\n\n    const clamp = React.useCallback(\n      (internalValue: number) => Math.min(Math.max(internalValue, min), max),\n      [max, min]\n    )\n\n    const updateValue = React.useCallback(\n      (newValue: number) => {\n        onValueChange?.(newValue)\n        setInternalValue(newValue)\n      },\n      [onValueChange]\n    )\n\n    const onInputChange = React.useCallback(\n      (event: React.ChangeEvent<HTMLInputElement>) => {\n        const parsedValue = Number(event.target.value.replace(/\\D/g, ''))\n        updateValue(parsedValue)\n      },\n      [updateValue]\n    )\n\n    const increment = React.useCallback(() => {\n      if (isAtMax || isReadOnly) return\n      inputRef?.current?.focus()\n      const newValue = Number(internalValue) + step\n      updateValue(clamp(newValue))\n    }, [clamp, isAtMax, isReadOnly, step, updateValue, internalValue])\n\n    const decrement = React.useCallback(() => {\n      if (isAtMin || isReadOnly) return\n      inputRef?.current?.focus()\n      const newValue = Number(internalValue) - step\n      updateValue(clamp(newValue))\n    }, [clamp, isAtMin, isReadOnly, min, step, updateValue, internalValue])\n\n    const onKeyDown = React.useCallback(\n      (event: React.KeyboardEvent) => {\n        if (event.nativeEvent.isComposing) return\n\n        /**\n         * Keyboard Accessibility\n         *\n         * We want to increase or decrease the input's value\n         * based on if the user the arrow keys.\n         *\n         * @see https://www.w3.org/TR/wai-aria-practices-1.1/#keyboard-interaction-17\n         */\n        const eventKey = event.key\n\n        const keyMap: Record<string, React.KeyboardEventHandler> = {\n          ArrowUp: increment,\n          ArrowRight: increment,\n          ArrowDown: decrement,\n          ArrowLeft: decrement,\n          Home: () => updateValue(min),\n          End: () => updateValue(max)\n        }\n\n        const action = keyMap[eventKey]\n\n        if (action) {\n          event.preventDefault()\n          action(event)\n        }\n      },\n      [increment, decrement, updateValue, min, max]\n    )\n\n    const inputProps: React.ComponentProps<typeof Input> = {\n      type: 'number',\n      value: internalValue,\n      ...rest,\n      onChange: onInputChange,\n      onKeyDown,\n      size,\n      css: {\n        borderRadius: '0px',\n        width: '$6',\n        '&:disabled': { opacity: 0.3, pointerEvents: 'none' }\n      },\n      ref: inputRef,\n      readOnly: isReadOnly,\n      disabled: isDisabled,\n      'aria-valuemin': min,\n      'aria-valuemax': max,\n      'aria-valuenow': internalValue,\n      role: 'spinbutton'\n    }\n\n    return (\n      <Flex css={css}>\n        <NumberInputStepper\n          onClick={decrement}\n          icon={Minus}\n          css={{\n            borderRight: 'none',\n            borderTopRightRadius: '0px',\n            borderBottomRightRadius: '0px'\n          }}\n          size={size}\n          disabled={isAtMin || isDisabled}\n          showTooltip={isAtMin && !isDisabled}\n          disabledTooltipContent={disabledTooltipContent.decrement}\n          label={stepperButtonLabels.decrement}\n        />\n        <Input {...inputProps} />\n        <NumberInputStepper\n          onClick={increment}\n          icon={Plus}\n          css={{\n            borderLeft: 'none',\n            borderTopLeftRadius: '0px',\n            borderBottomLeftRadius: '0px'\n          }}\n          size={size}\n          disabled={isAtMax || isDisabled}\n          showTooltip={isAtMax && !isDisabled}\n          disabledTooltipContent={disabledTooltipContent.increment}\n          label={stepperButtonLabels.increment}\n        />\n      </Flex>\n    )\n  }\n)\n\nNumberInput.displayName = 'NumberInput'\n"],"names":["NumberInput","React","value","defaultValue","onValueChange","min","max","step","isDisabled","isReadOnly","size","stepperButtonLabelsProp","disabledTooltipContentProp","css","rest","ref","internalValue","setInternalValue","inputRef","stepperButtonLabels","disabledTooltipContent","isAtMax","isAtMin","clamp","updateValue","newValue","onInputChange","event","parsedValue","increment","_a","decrement","onKeyDown","eventKey","action","inputProps","Flex","NumberInputStepper","Minus","Input","Plus"],"mappings":"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"}
+{"version":3,"file":"NumberInput.js","sources":["../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import { Minus, Plus } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport type { CSS } from '~/stitches'\nimport { getFieldIconSize } from '~/utilities'\n\nimport { Flex } from '../flex'\nimport { Input } from '../input'\nimport { NumberInputStepper } from './NumberInputStepper'\n\nexport interface NumberInputProps {\n  name: string\n  min?: number\n  max?: number\n  step?: number\n  value?: number\n  defaultValue?: number\n  disabled?: boolean\n  readonly?: boolean\n  size?: 'sm' | 'md' | 'lg'\n  onValueChange?: (value: number) => void\n  stepperButtonLabels?: { increment?: string; decrement?: string }\n  disabledTooltipContent?: { increment?: string; decrement?: string }\n  css?: CSS\n}\n\nexport const NumberInput = React.forwardRef<HTMLInputElement, NumberInputProps>(\n  (\n    {\n      value,\n      defaultValue = 0,\n      onValueChange,\n      min = 0,\n      max = Number.MAX_SAFE_INTEGER,\n      step = 1,\n      disabled: isDisabled = false,\n      readonly: isReadOnly = false,\n      size = 'md',\n      stepperButtonLabels: stepperButtonLabelsProp,\n      disabledTooltipContent: disabledTooltipContentProp,\n      css,\n      ...rest\n    },\n    ref\n  ): JSX.Element => {\n    const [internalValue, setInternalValue] = React.useState<number>(\n      value || defaultValue\n    )\n    React.useEffect(() => {\n      // Update the internal value to match what is passed in.\n      if (typeof value !== 'undefined') setInternalValue(value)\n    }, [value])\n\n    const inputRef = React.useRef<HTMLInputElement | null>(null)\n\n    React.useImperativeHandle(ref, () => inputRef.current as HTMLInputElement)\n\n    const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n    const stepperButtonLabels = {\n      increment: 'increment',\n      decrement: 'decrement',\n      ...stepperButtonLabelsProp\n    }\n\n    const disabledTooltipContent = {\n      decrement: `Cannot enter values below ${min}`,\n      increment: `Cannot enter values above ${max}`,\n      ...disabledTooltipContentProp\n    }\n\n    const isAtMax = internalValue >= max\n    const isAtMin = internalValue <= min\n\n    const clamp = React.useCallback(\n      (internalValue: number) => Math.min(Math.max(internalValue, min), max),\n      [max, min]\n    )\n\n    const updateValue = React.useCallback(\n      (newValue: number) => {\n        onValueChange?.(newValue)\n        setInternalValue(newValue)\n      },\n      [onValueChange]\n    )\n\n    const onInputChange = React.useCallback(\n      (event: React.ChangeEvent<HTMLInputElement>) => {\n        const parsedValue = Number(event.target.value.replace(/\\D/g, ''))\n        updateValue(parsedValue)\n      },\n      [updateValue]\n    )\n\n    const increment = React.useCallback(() => {\n      if (isAtMax || isReadOnly) return\n      inputRef?.current?.focus()\n      const newValue = Number(internalValue) + step\n      updateValue(clamp(newValue))\n    }, [clamp, isAtMax, isReadOnly, step, updateValue, internalValue])\n\n    const decrement = React.useCallback(() => {\n      if (isAtMin || isReadOnly) return\n      inputRef?.current?.focus()\n      const newValue = Number(internalValue) - step\n      updateValue(clamp(newValue))\n    }, [clamp, isAtMin, isReadOnly, min, step, updateValue, internalValue])\n\n    const onKeyDown = React.useCallback(\n      (event: React.KeyboardEvent) => {\n        if (event.nativeEvent.isComposing) return\n\n        /**\n         * Keyboard Accessibility\n         *\n         * We want to increase or decrease the input's value\n         * based on if the user the arrow keys.\n         *\n         * @see https://www.w3.org/TR/wai-aria-practices-1.1/#keyboard-interaction-17\n         */\n        const eventKey = event.key\n\n        const keyMap: Record<string, React.KeyboardEventHandler> = {\n          ArrowUp: increment,\n          ArrowRight: increment,\n          ArrowDown: decrement,\n          ArrowLeft: decrement,\n          Home: () => updateValue(min),\n          End: () => updateValue(max)\n        }\n\n        const action = keyMap[eventKey]\n\n        if (action) {\n          event.preventDefault()\n          action(event)\n        }\n      },\n      [increment, decrement, updateValue, min, max]\n    )\n\n    const inputProps: React.ComponentProps<typeof Input> = {\n      type: 'number',\n      value: internalValue,\n      ...rest,\n      onChange: onInputChange,\n      onKeyDown,\n      size,\n      css: {\n        borderRadius: '0px',\n        width: '$6',\n        '&:disabled': { opacity: 0.3, pointerEvents: 'none' }\n      },\n      ref: inputRef,\n      readOnly: isReadOnly,\n      disabled: isDisabled,\n      'aria-valuemin': min,\n      'aria-valuemax': max,\n      'aria-valuenow': internalValue,\n      role: 'spinbutton'\n    }\n\n    return (\n      <Flex css={css}>\n        <NumberInputStepper\n          onClick={decrement}\n          icon={Minus}\n          css={{\n            borderRight: 'none',\n            borderTopRightRadius: '0px',\n            borderBottomRightRadius: '0px'\n          }}\n          size={iconSize}\n          disabled={isAtMin || isDisabled}\n          showTooltip={isAtMin && !isDisabled}\n          disabledTooltipContent={disabledTooltipContent.decrement}\n          label={stepperButtonLabels.decrement}\n        />\n        <Input {...inputProps} />\n        <NumberInputStepper\n          onClick={increment}\n          icon={Plus}\n          css={{\n            borderLeft: 'none',\n            borderTopLeftRadius: '0px',\n            borderBottomLeftRadius: '0px'\n          }}\n          size={iconSize}\n          disabled={isAtMax || isDisabled}\n          showTooltip={isAtMax && !isDisabled}\n          disabledTooltipContent={disabledTooltipContent.increment}\n          label={stepperButtonLabels.increment}\n        />\n      </Flex>\n    )\n  }\n)\n\nNumberInput.displayName = 'NumberInput'\n"],"names":["NumberInput","React","value","defaultValue","onValueChange","min","max","step","isDisabled","isReadOnly","size","stepperButtonLabelsProp","disabledTooltipContentProp","css","rest","ref","internalValue","setInternalValue","inputRef","iconSize","getFieldIconSize","stepperButtonLabels","disabledTooltipContent","isAtMax","isAtMin","clamp","updateValue","newValue","onInputChange","event","parsedValue","increment","_a","decrement","onKeyDown","eventKey","action","inputProps","Flex","NumberInputStepper","Minus","Input","Plus"],"mappings":"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"}

package/dist/components/number-input/NumberInputStepper.js

@@ -1,2 +1,2 @@
-import*as o from"react";import{styled as t}from"../../stitches.js";import{ActionIcon as p}from"../action-icon/ActionIcon.js";import{Icon as m}from"../icon/Icon.js";import{Tooltip as e}from"../tooltip/Tooltip.js";const s=t("span",{zIndex:1}),d=t(p,{borderColor:"$tonal400 !important",zIndex:1,"&:hover":{bg:"$tonal50",svg:{color:"$tonal400"}},svg:{color:"$tonal300"},"&:active":{bg:"$tonal100",svg:{color:"$tonal500"}},"&:disabled":{opacity:.3,pointerEvents:"none"}}),b=o.forwardRef((n,r)=>{const{icon:l,disabledTooltipContent:a,showTooltip:i,...c}=n;return o.createElement(e,null,o.createElement(e.Trigger,{asChild:!0},o.createElement(s,{tabIndex:-1},o.createElement(d,{hasTooltip:!1,tabIndex:-1,appearance:"outline",ref:r,...c},o.createElement(m,{is:l})))),i&&o.createElement(e.Content,null,a))});export{b as NumberInputStepper};
+import*as e from"react";import{styled as t}from"../../stitches.js";import{ActionIcon as c}from"../action-icon/ActionIcon.js";import{Icon as m}from"../icon/Icon.js";import{Tooltip as o}from"../tooltip/Tooltip.js";const s=t("span",{zIndex:1}),d=t(c,{borderColor:"$tonal400 !important",zIndex:1,height:"100% !important","&:hover":{bg:"$tonal50",svg:{color:"$tonal400"}},svg:{color:"$tonal300"},"&:active":{bg:"$tonal100",svg:{color:"$tonal500"}},"&:disabled":{opacity:.3,pointerEvents:"none"}}),b=e.forwardRef((n,r)=>{const{icon:l,disabledTooltipContent:a,showTooltip:i,...p}=n;return e.createElement(o,null,e.createElement(o.Trigger,{asChild:!0},e.createElement(s,{tabIndex:-1},e.createElement(d,{hasTooltip:!1,tabIndex:-1,appearance:"outline",ref:r,...p},e.createElement(m,{is:l})))),i&&e.createElement(o.Content,null,a))});export{b as NumberInputStepper};
 //# sourceMappingURL=NumberInputStepper.js.map

package/dist/components/number-input/NumberInputStepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInputStepper.js","sources":["../../../src/components/number-input/NumberInputStepper.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { ActionIcon } from '../action-icon'\nimport { Icon } from '../icon'\nimport { Tooltip } from '../tooltip'\n\nconst StyledSpan = styled('span', { zIndex: 1 })\n\nconst StyledStepperButton = styled(ActionIcon, {\n  borderColor: '$tonal400 !important',\n  zIndex: 1,\n  '&:hover': {\n    bg: '$tonal50',\n    svg: {\n      color: '$tonal400'\n    }\n  },\n  svg: {\n    color: '$tonal300'\n  },\n  '&:active': {\n    bg: '$tonal100',\n    svg: {\n      color: '$tonal500'\n    }\n  },\n  '&:disabled': {\n    opacity: 0.3,\n    pointerEvents: 'none'\n  }\n})\n\ntype NumberInputStepperProps = Omit<\n  React.ComponentProps<typeof ActionIcon>,\n  'children'\n> & {\n  icon: React.FC<React.SVGProps<SVGSVGElement>>\n  showTooltip?: boolean\n  disabledTooltipContent?: string\n}\n\nexport const NumberInputStepper: React.ForwardRefExoticComponent<NumberInputStepperProps> =\n  React.forwardRef((props, forwardedRef) => {\n    const { icon, disabledTooltipContent, showTooltip, ...rest } = props\n\n    /**\n     * Focus has been removed from the button\n     * as the increment and decrement buttons should be keyboard accessible via arrow keys.\n     * see MDN docs https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role\n     */\n    return (\n      <Tooltip>\n        <Tooltip.Trigger asChild>\n          <StyledSpan tabIndex={-1}>\n            <StyledStepperButton\n              hasTooltip={false}\n              tabIndex={-1}\n              appearance=\"outline\"\n              ref={forwardedRef}\n              {...rest}\n            >\n              <Icon is={icon} />\n            </StyledStepperButton>\n          </StyledSpan>\n        </Tooltip.Trigger>\n        {showTooltip && (\n          <Tooltip.Content>{disabledTooltipContent}</Tooltip.Content>\n        )}\n      </Tooltip>\n    )\n  })\n"],"names":["StyledSpan","styled","StyledStepperButton","ActionIcon","NumberInputStepper","React","props","forwardedRef","icon","disabledTooltipContent","showTooltip","rest","Tooltip","Icon"],"mappings":"oNAQA,MAAMA,EAAaC,EAAO,OAAQ,CAAE,OAAQ,CAAE,CAAC,EAEzCC,EAAsBD,EAAOE,EAAY,CAC7C,YAAa,uBACb,OAAQ,EACR,UAAW,CACT,GAAI,WACJ,IAAK,CACH,MAAO,WACT,CACF,EACA,IAAK,CACH,MAAO,WACT,EACA,WAAY,CACV,GAAI,YACJ,IAAK,CACH,MAAO,WACT,CACF,EACA,aAAc,CACZ,QAAS,GACT,cAAe,MACjB,CACF,CAAC,EAWYC,EACXC,EAAM,WAAW,CAACC,EAAOC,IAAiB,CACxC,KAAM,CAAE,KAAAC,EAAM,uBAAAC,EAAwB,YAAAC,KAAgBC,CAAK,EAAIL,EAO/D,OACED,EAAA,cAACO,EAAA,KACCP,EAAA,cAACO,EAAQ,QAAR,CAAgB,QAAO,EAAA,EACtBP,EAAA,cAACL,EAAA,CAAW,SAAU,EACpBK,EAAAA,EAAA,cAACH,EAAA,CACC,WAAY,GACZ,SAAU,GACV,WAAW,UACX,IAAKK,EACJ,GAAGI,CAAAA,EAEJN,EAAA,cAACQ,EAAA,CAAK,GAAIL,CAAM,CAAA,CAClB,CACF,CACF,EACCE,GACCL,EAAA,cAACO,EAAQ,QAAR,KAAiBH,CAAuB,CAE7C,CAEJ,CAAC"}
+{"version":3,"file":"NumberInputStepper.js","sources":["../../../src/components/number-input/NumberInputStepper.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { ActionIcon } from '../action-icon'\nimport { Icon } from '../icon'\nimport { Tooltip } from '../tooltip'\n\nconst StyledSpan = styled('span', { zIndex: 1 })\n\nconst StyledStepperButton = styled(ActionIcon, {\n  borderColor: '$tonal400 !important',\n  zIndex: 1,\n  height: '100% !important',\n  '&:hover': {\n    bg: '$tonal50',\n    svg: {\n      color: '$tonal400'\n    }\n  },\n  svg: {\n    color: '$tonal300'\n  },\n  '&:active': {\n    bg: '$tonal100',\n    svg: {\n      color: '$tonal500'\n    }\n  },\n  '&:disabled': {\n    opacity: 0.3,\n    pointerEvents: 'none'\n  }\n})\n\ntype NumberInputStepperProps = Omit<\n  React.ComponentProps<typeof ActionIcon>,\n  'children'\n> & {\n  icon: React.FC<React.SVGProps<SVGSVGElement>>\n  showTooltip?: boolean\n  disabledTooltipContent?: string\n}\n\nexport const NumberInputStepper: React.ForwardRefExoticComponent<NumberInputStepperProps> =\n  React.forwardRef((props, forwardedRef) => {\n    const { icon, disabledTooltipContent, showTooltip, ...rest } = props\n\n    /**\n     * Focus has been removed from the button\n     * as the increment and decrement buttons should be keyboard accessible via arrow keys.\n     * see MDN docs https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role\n     */\n    return (\n      <Tooltip>\n        <Tooltip.Trigger asChild>\n          <StyledSpan tabIndex={-1}>\n            <StyledStepperButton\n              hasTooltip={false}\n              tabIndex={-1}\n              appearance=\"outline\"\n              ref={forwardedRef}\n              {...rest}\n            >\n              <Icon is={icon} />\n            </StyledStepperButton>\n          </StyledSpan>\n        </Tooltip.Trigger>\n        {showTooltip && (\n          <Tooltip.Content>{disabledTooltipContent}</Tooltip.Content>\n        )}\n      </Tooltip>\n    )\n  })\n"],"names":["StyledSpan","styled","StyledStepperButton","ActionIcon","NumberInputStepper","React","props","forwardedRef","icon","disabledTooltipContent","showTooltip","rest","Tooltip","Icon"],"mappings":"oNAQA,MAAMA,EAAaC,EAAO,OAAQ,CAAE,OAAQ,CAAE,CAAC,EAEzCC,EAAsBD,EAAOE,EAAY,CAC7C,YAAa,uBACb,OAAQ,EACR,OAAQ,kBACR,UAAW,CACT,GAAI,WACJ,IAAK,CACH,MAAO,WACT,CACF,EACA,IAAK,CACH,MAAO,WACT,EACA,WAAY,CACV,GAAI,YACJ,IAAK,CACH,MAAO,WACT,CACF,EACA,aAAc,CACZ,QAAS,GACT,cAAe,MACjB,CACF,CAAC,EAWYC,EACXC,EAAM,WAAW,CAACC,EAAOC,IAAiB,CACxC,KAAM,CAAE,KAAAC,EAAM,uBAAAC,EAAwB,YAAAC,KAAgBC,CAAK,EAAIL,EAO/D,OACED,EAAA,cAACO,EAAA,KACCP,EAAA,cAACO,EAAQ,QAAR,CAAgB,QAAO,EACtBP,EAAAA,EAAA,cAACL,EAAA,CAAW,SAAU,EAAA,EACpBK,EAAA,cAACH,EAAA,CACC,WAAY,GACZ,SAAU,GACV,WAAW,UACX,IAAKK,EACJ,GAAGI,GAEJN,EAAA,cAACQ,EAAA,CAAK,GAAIL,CAAAA,CAAM,CAClB,CACF,CACF,EACCE,GACCL,EAAA,cAACO,EAAQ,QAAR,KAAiBH,CAAuB,CAE7C,CAEJ,CAAC"}

package/dist/components/number-input-field/NumberInputField.js

@@ -1,2 +1,2 @@
-import*as l from"react";import{useFormContext as I,useController as N}from"react-hook-form";import{FieldWrapper as V}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as E}from"../form/useFieldError.js";import{NumberInput as g}from"../number-input/NumberInput.js";const m=({css:p,defaultValue:t=0,value:r,prompt:d,description:s,label:f,name:e,validation:o,onValueChange:a,...c})=>{const{control:v}=I(),{field:{ref:F,onChange:n,value:b,name:C}}=N({name:e,control:v,rules:o,defaultValue:t}),{error:u}=E(e);return l.useEffect(()=>{typeof r<"u"&&n(r)},[r]),l.createElement(V,{css:p,description:s,error:u,fieldId:e,label:f,prompt:d,required:Boolean(o==null?void 0:o.required)},l.createElement(g,{id:e,name:C,ref:F,...u&&{state:"error","aria-invalid":!0},defaultValue:t,onValueChange:i=>{n(i),a==null||a(i)},value:b,...c}))};m.displayName="NumberInputField";export{m as NumberInputField};
+import*as l from"react";import{useFormContext as I,useController as N}from"react-hook-form";import{FieldWrapper as V}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as E}from"../form/useFieldError.js";import{NumberInput as g}from"../number-input/NumberInput.js";const m=({css:p,defaultValue:a=0,value:r,prompt:d,description:s,label:f,name:e,validation:o,onValueChange:t,...c})=>{const{control:v}=I(),{field:{ref:F,onChange:n,value:b,name:C}}=N({name:e,control:v,rules:o,defaultValue:a}),{error:u}=E(e);return l.useEffect(()=>{typeof r<"u"&&n(r)},[r]),l.createElement(V,{css:p,description:s,error:u,fieldId:e,label:f,prompt:d,required:Boolean(o==null?void 0:o.required)},l.createElement(g,{id:e,name:C,ref:F,...u&&{state:"error","aria-invalid":!0},defaultValue:a,onValueChange:i=>{n(i),t==null||t(i)},value:b,...c}))};m.displayName="NumberInputField";export{m as NumberInputField};
 //# sourceMappingURL=NumberInputField.js.map

package/dist/components/pagination/PaginationItem.js

@@ -1,2 +1,2 @@
-import*as d from"react";import{styled as b}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as m}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";import{usePagination as g}from"./usePagination.js";const p=b("button",{alignItems:"center",border:"1px solid transparent",borderRadius:"$0",cursor:"pointer",fontFamily:"$body",justifyContent:"center",whiteSpace:"nowrap",width:"max-content",display:"flex",flexDirection:"column",p:"0",fontWeight:400,color:"$grey800",bg:"$base1",position:"relative","&:not(:disabled)":{"&:hover":{color:"$accent10",bg:"$base2"},"&:active":{bg:"$base3",color:"$grey1000"},"&:focus-visible":{...m()}},"&:disabled":{opacity:"0.3",cursor:"not-allowed"},variants:{size:{md:{width:"$4",height:"$4"}},selected:{true:{border:"1px solid $accent9",color:"$accent9",fontWeight:600,"&:not(:disabled)":{"&:hover":{borderColor:"$accent10",color:"$accent10"},"&:active":{borderColor:"$accent11",fontColor:"$accent11"}}}},indicated:{true:{fontWeight:600,color:"$accent9","&:after":{content:"",position:"absolute",bottom:"$1",left:"50%",transform:"translateX(-50%)",borderRadius:"$round",size:"4px",bg:"$accent9"},"&:not(:disabled)":{"&:hover":{color:"$accent10","&:after":{bg:"$accent10"}},"&:active":{color:"$accent11","&:after":{bg:"$accent11"}}}}}}}),u=({pageNumber:e,css:a})=>{const{currentPage:c,goToPage:i,indicatedPages:n,disabledPages:s,onItemHover:r}=g(),l=n.includes(e),o=s.includes(e),t=c===e;return d.createElement(p,{selected:t,size:"md",onClick:()=>i(e),css:a,indicated:l,disabled:o,"aria-current":t&&"page","aria-disabled":o,onMouseOver:()=>{t||o||r==null||r(e)}},e)};export{u as PaginationItem};
+import*as d from"react";import{styled as b}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as $}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";import{usePagination as m}from"./usePagination.js";const g=b("button",{alignItems:"center",border:"1px solid transparent",borderRadius:"$0",cursor:"pointer",fontFamily:"$body",justifyContent:"center",whiteSpace:"nowrap",width:"max-content",display:"flex",flexDirection:"column",p:"0",fontWeight:400,color:"$grey800",bg:"$base1",position:"relative","&:not(:disabled)":{"&:hover":{color:"$accent10",bg:"$base2"},"&:active":{bg:"$base3",color:"$grey1000"},"&:focus-visible":{...$()}},"&:disabled":{opacity:"0.3",cursor:"not-allowed"},variants:{size:{md:{width:"$4",height:"$4"}},selected:{true:{border:"1px solid $accent9",color:"$accent9",fontWeight:600,"&:not(:disabled)":{"&:hover":{borderColor:"$accent10",color:"$accent10"},"&:active":{borderColor:"$accent11",fontColor:"$accent11"}}}},indicated:{true:{fontWeight:600,color:"$accent9","&:after":{content:"",position:"absolute",bottom:"$1",left:"50%",transform:"translateX(-50%)",borderRadius:"$round",size:"4px",bg:"$accent9"},"&:not(:disabled)":{"&:hover":{color:"$accent10","&:after":{bg:"$accent10"}},"&:active":{color:"$accent11","&:after":{bg:"$accent11"}}}}}}}),p=({pageNumber:e,css:a})=>{const{currentPage:c,goToPage:i,indicatedPages:n,disabledPages:s,onItemHover:r}=m(),l=n.includes(e),o=s.includes(e),t=c===e;return d.createElement(g,{selected:t,size:"md",onClick:()=>i(e),css:a,indicated:l,disabled:o,"aria-current":t&&"page","aria-disabled":o,onMouseOver:()=>{t||o||r==null||r(e)}},e)};export{p as PaginationItem};
 //# sourceMappingURL=PaginationItem.js.map

package/dist/components/password-field/PasswordField.js

@@ -1,2 +1,2 @@
-import*as i from"react";import{useFormContext as c}from"react-hook-form";import{FieldWrapper as u}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as f}from"../form/useFieldError.js";import{PasswordInput as v}from"../password-input/PasswordInput.js";const s=({css:a={},label:d="Password",name:r,prompt:m=void 0,description:p,validation:o,...l})=>{const{register:e}=c(),{error:t}=f(r),n=o?e(o):e;return i.createElement(u,{css:{...a,position:"relative"},description:p,error:t,fieldId:r,label:d,prompt:m,required:Boolean(o==null?void 0:o.required)},i.createElement(v,{autoComplete:"current-password",name:r,id:r,ref:n,...t!==void 0&&{state:"error"},...l}))};s.displayName="PasswordField";export{s as PasswordField};
+import*as i from"react";import{useFormContext as c}from"react-hook-form";import{FieldWrapper as u}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as f}from"../form/useFieldError.js";import{PasswordInput as v}from"../password-input/PasswordInput.js";const s=({css:a={},label:d="Password",name:r,prompt:m=void 0,description:p,validation:e,...l})=>{const{register:o}=c(),{error:t}=f(r),n=e?o(e):o;return i.createElement(u,{css:{...a,position:"relative"},description:p,error:t,fieldId:r,label:d,prompt:m,required:Boolean(e==null?void 0:e.required)},i.createElement(v,{autoComplete:"current-password",name:r,id:r,ref:n,...t!==void 0&&{state:"error"},...l}))};s.displayName="PasswordField";export{s as PasswordField};
 //# sourceMappingURL=PasswordField.js.map

package/dist/components/password-input/PasswordInput.js

@@ -1,2 +1,2 @@
-import{Eye as l,EyeCrossed as f}from"@atom-learning/icons";import*as e from"react";import{useState as w}from"react";import{ActionIcon as u}from"../action-icon/ActionIcon.js";import{Box as E}from"../box/Box.js";import{Icon as h}from"../icon/Icon.js";import{Input as x}from"../input/Input.js";const r=e.forwardRef(({css:a,hidePasswordText:i="Hide password",showPasswordText:m="Show password",size:t="md",...p},n)=>{const[o,c]=w(!1),d=()=>c(s=>!s);return e.createElement(E,{css:{position:"relative",...a}},e.createElement(x,{...p,size:t,type:o?"text":"password",ref:n,css:{pr:"$sizes$2"}}),e.createElement(u,{appearance:"simple",theme:"neutral",css:{bottom:0,position:"absolute",right:0},label:o?i:m,onClick:d,onMouseDown:s=>s.preventDefault(),size:t},e.createElement(h,{is:o?l:f})))});r.displayName="PasswordInput";export{r as PasswordInput};
+import{Eye as f,EyeCrossed as w}from"@atom-learning/icons";import*as e from"react";import{useState as u}from"react";import{ActionIcon as x}from"../action-icon/ActionIcon.js";import{Box as E}from"../box/Box.js";import{Icon as I}from"../icon/Icon.js";import{Input as h}from"../input/Input.js";import"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import"../../utilities/style/keyframe-animations.js";import{getFieldIconSize as z}from"../../utilities/style/get-icon-size.js";const s=e.forwardRef(({css:i,hidePasswordText:m="Hide password",showPasswordText:p="Show password",size:o="md",...a},n)=>{const[t,c]=u(!1),l=()=>c(r=>!r),d=e.useMemo(()=>z(o),[o]);return e.createElement(E,{css:{position:"relative",...i}},e.createElement(h,{...a,size:o,type:t?"text":"password",ref:n,css:{pr:"$sizes$2"}}),e.createElement(x,{appearance:"simple",theme:"neutral",css:{bottom:o==="lg"?"4px":0,position:"absolute",right:0},label:t?m:p,onClick:l,onMouseDown:r=>r.preventDefault(),size:d},e.createElement(I,{is:t?f:w})))});s.displayName="PasswordInput";export{s as PasswordInput};
 //# sourceMappingURL=PasswordInput.js.map

package/dist/components/password-input/PasswordInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordInput.js","sources":["../../../src/components/password-input/PasswordInput.tsx"],"sourcesContent":["import { Eye, EyeCrossed } from '@atom-learning/icons'\nimport * as React from 'react'\nimport { useState } from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Box } from '~/components/box'\nimport { Icon } from '~/components/icon'\nimport type { InputProps } from '~/components/input'\nimport { Input } from '~/components/input'\nimport type { CSS } from '~/stitches'\n\ntype PasswordInputProps = Omit<InputProps, 'type'> & {\n  hidePasswordText?: string\n  showPasswordText?: string\n}\n\nexport const PasswordInput: React.FC<PasswordInputProps> = React.forwardRef(\n  (\n    {\n      css,\n      hidePasswordText = 'Hide password',\n      showPasswordText = 'Show password',\n      size = 'md',\n      ...restProps\n    },\n    ref\n  ) => {\n    const [isPasswordVisible, setIsPasswordVisible] = useState<boolean>(false)\n    const togglePasswordVisibility = () =>\n      setIsPasswordVisible((currentState) => !currentState)\n\n    return (\n      <Box css={{ position: 'relative', ...css } as CSS}>\n        <Input\n          {...restProps}\n          size={size}\n          type={isPasswordVisible ? 'text' : 'password'}\n          ref={ref}\n          css={{ pr: '$sizes$2' }}\n        />\n        <ActionIcon\n          appearance=\"simple\"\n          theme=\"neutral\"\n          css={{ bottom: 0, position: 'absolute', right: 0 }}\n          label={isPasswordVisible ? hidePasswordText : showPasswordText}\n          onClick={togglePasswordVisibility}\n          onMouseDown={(e) => e.preventDefault()} // prevent focus being lost from password input\n          size={size}\n        >\n          <Icon is={isPasswordVisible ? Eye : EyeCrossed} />\n        </ActionIcon>\n      </Box>\n    )\n  }\n)\n\nPasswordInput.displayName = 'PasswordInput'\n"],"names":["PasswordInput","React","css","hidePasswordText","showPasswordText","size","restProps","ref","isPasswordVisible","setIsPasswordVisible","useState","togglePasswordVisibility","currentState","Box","Input","ActionIcon","e","Icon","Eye","EyeCrossed"],"mappings":"mSAgBO,MAAMA,EAA8CC,EAAM,WAC/D,CACE,CACE,IAAAC,EACA,iBAAAC,EAAmB,gBACnB,iBAAAC,EAAmB,gBACnB,KAAAC,EAAO,QACJC,CACL,EACAC,IACG,CACH,KAAM,CAACC,EAAmBC,CAAoB,EAAIC,EAAkB,EAAK,EACnEC,EAA2B,IAC/BF,EAAsBG,GAAiB,CAACA,CAAY,EAEtD,OACEX,EAAA,cAACY,EAAA,CAAI,IAAK,CAAE,SAAU,WAAY,GAAGX,CAAI,CAAA,EACvCD,EAAA,cAACa,EAAA,CACE,GAAGR,EACJ,KAAMD,EACN,KAAMG,EAAoB,OAAS,WACnC,IAAKD,EACL,IAAK,CAAE,GAAI,UAAW,EACxB,EACAN,EAAA,cAACc,EAAA,CACC,WAAW,SACX,MAAM,UACN,IAAK,CAAE,OAAQ,EAAG,SAAU,WAAY,MAAO,CAAE,EACjD,MAAOP,EAAoBL,EAAmBC,EAC9C,QAASO,EACT,YAAcK,GAAMA,EAAE,iBACtB,KAAMX,CAAAA,EAENJ,EAAA,cAACgB,EAAA,CAAK,GAAIT,EAAoBU,EAAMC,CAAY,CAAA,CAClD,CACF,CAEJ,CACF,EAEAnB,EAAc,YAAc"}
+{"version":3,"file":"PasswordInput.js","sources":["../../../src/components/password-input/PasswordInput.tsx"],"sourcesContent":["import { Eye, EyeCrossed } from '@atom-learning/icons'\nimport * as React from 'react'\nimport { useState } from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Box } from '~/components/box'\nimport { Icon } from '~/components/icon'\nimport type { InputProps } from '~/components/input'\nimport { Input } from '~/components/input'\nimport type { CSS } from '~/stitches'\nimport { getFieldIconSize } from '~/utilities'\n\ntype PasswordInputProps = Omit<InputProps, 'type'> & {\n  hidePasswordText?: string\n  showPasswordText?: string\n}\n\nexport const PasswordInput: React.FC<PasswordInputProps> = React.forwardRef(\n  (\n    {\n      css,\n      hidePasswordText = 'Hide password',\n      showPasswordText = 'Show password',\n      size = 'md',\n      ...restProps\n    },\n    ref\n  ) => {\n    const [isPasswordVisible, setIsPasswordVisible] = useState<boolean>(false)\n    const togglePasswordVisibility = () =>\n      setIsPasswordVisible((currentState) => !currentState)\n\n    const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n    return (\n      <Box css={{ position: 'relative', ...css } as CSS}>\n        <Input\n          {...restProps}\n          size={size}\n          type={isPasswordVisible ? 'text' : 'password'}\n          ref={ref}\n          css={{ pr: '$sizes$2' }}\n        />\n        <ActionIcon\n          appearance=\"simple\"\n          theme=\"neutral\"\n          css={{\n            bottom: size === 'lg' ? '4px' : 0,\n            position: 'absolute',\n            right: 0\n          }}\n          label={isPasswordVisible ? hidePasswordText : showPasswordText}\n          onClick={togglePasswordVisibility}\n          onMouseDown={(e) => e.preventDefault()} // prevent focus being lost from password input\n          size={iconSize}\n        >\n          <Icon is={isPasswordVisible ? Eye : EyeCrossed} />\n        </ActionIcon>\n      </Box>\n    )\n  }\n)\n\nPasswordInput.displayName = 'PasswordInput'\n"],"names":["PasswordInput","React","css","hidePasswordText","showPasswordText","size","restProps","ref","isPasswordVisible","setIsPasswordVisible","useState","togglePasswordVisibility","currentState","iconSize","getFieldIconSize","Box","Input","ActionIcon","e","Icon","Eye","EyeCrossed"],"mappings":"+jBAiBO,MAAMA,EAA8CC,EAAM,WAC/D,CACE,CACE,IAAAC,EACA,iBAAAC,EAAmB,gBACnB,iBAAAC,EAAmB,gBACnB,KAAAC,EAAO,QACJC,CACL,EACAC,IACG,CACH,KAAM,CAACC,EAAmBC,CAAoB,EAAIC,EAAkB,EAAK,EACnEC,EAA2B,IAC/BF,EAAsBG,GAAiB,CAACA,CAAY,EAEhDC,EAAWZ,EAAM,QAAQ,IAAMa,EAAiBT,CAAI,EAAG,CAACA,CAAI,CAAC,EAEnE,OACEJ,EAAA,cAACc,EAAA,CAAI,IAAK,CAAE,SAAU,WAAY,GAAGb,CAAI,CAAA,EACvCD,EAAA,cAACe,EAAA,CACE,GAAGV,EACJ,KAAMD,EACN,KAAMG,EAAoB,OAAS,WACnC,IAAKD,EACL,IAAK,CAAE,GAAI,UAAW,CACxB,CAAA,EACAN,EAAA,cAACgB,EAAA,CACC,WAAW,SACX,MAAM,UACN,IAAK,CACH,OAAQZ,IAAS,KAAO,MAAQ,EAChC,SAAU,WACV,MAAO,CACT,EACA,MAAOG,EAAoBL,EAAmBC,EAC9C,QAASO,EACT,YAAcO,GAAMA,EAAE,iBACtB,KAAML,CAAAA,EAENZ,EAAA,cAACkB,EAAA,CAAK,GAAIX,EAAoBY,EAAMC,EAAY,CAClD,CACF,CAEJ,CACF,EAEArB,EAAc,YAAc"}

package/dist/components/popover/PopoverContent.js

@@ -1,2 +1,2 @@
-import{Close as d}from"@atom-learning/icons";import{Content as l,Arrow as p,Close as h}from"@radix-ui/react-popover";import*as t from"react";import{POPOVER_Z_INDEX as c}from"../../constants/zIndices.js";import{styled as e}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{slideDownAndFade as f,slideLeftAndFade as x,slideUpAndFade as $,slideRightAndFade as g}from"../../utilities/style/keyframe-animations.js";import{ActionIcon as w}from"../action-icon/ActionIcon.js";import{Icon as z}from"../icon/Icon.js";const b=e(l,{bg:"white",borderRadius:"$1",boxShadow:"$2",maxWidth:"90vw",p:"$sizes$2",pr:"$6",position:"relative",zIndex:c,"@allowMotion":{animationDuration:"75ms",animationTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)",willChange:"transform, opacity",'&[data-state="open"]':{'&[data-side="top"]':{animationName:f},'&[data-side="right"]':{animationName:x},'&[data-side="bottom"]':{animationName:$},'&[data-side="left"]':{animationName:g}}},variants:{size:{sm:{maxWidth:"200px"},md:{maxWidth:"400px"},lg:{maxWidth:"600px"}}}}),C=e(p,{fill:"white",zIndex:1,'[data-align="end"] &':{mr:"$sizes$2"},'[data-align="start"] &':{ml:"$sizes$2"}}),u=({children:i,side:o="top",sideOffset:a=8,closePopoverText:s="Close popover",showCloseButton:n=!0,size:m="md",...r})=>t.createElement(b,{size:m,side:o,sideOffset:a,...r},n&&t.createElement(w,{as:h,css:{position:"absolute",right:"$0",top:"$0"},label:s,size:"md",hasTooltip:!1,theme:"neutral"},t.createElement(z,{is:d})),i,t.createElement(C,{width:16,height:8}));export{u as PopoverContent};
+import{Close as d}from"@atom-learning/icons";import{Content as l,Arrow as p,Close as h}from"@radix-ui/react-popover";import*as e from"react";import{POPOVER_Z_INDEX as c}from"../../constants/zIndices.js";import{styled as t}from"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{slideDownAndFade as f,slideLeftAndFade as x,slideUpAndFade as $,slideRightAndFade as g}from"../../utilities/style/keyframe-animations.js";import{ActionIcon as w}from"../action-icon/ActionIcon.js";import{Icon as z}from"../icon/Icon.js";const b=t(l,{bg:"white",borderRadius:"$1",boxShadow:"$2",maxWidth:"90vw",p:"$sizes$2",pr:"$6",position:"relative",zIndex:c,"@allowMotion":{animationDuration:"75ms",animationTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)",willChange:"transform, opacity",'&[data-state="open"]':{'&[data-side="top"]':{animationName:f},'&[data-side="right"]':{animationName:x},'&[data-side="bottom"]':{animationName:$},'&[data-side="left"]':{animationName:g}}},variants:{size:{sm:{maxWidth:"200px"},md:{maxWidth:"400px"},lg:{maxWidth:"600px"}}}}),C=t(p,{fill:"white",zIndex:1,'[data-align="end"] &':{mr:"$sizes$2"},'[data-align="start"] &':{ml:"$sizes$2"}}),u=({children:i,side:o="top",sideOffset:a=8,closePopoverText:s="Close popover",showCloseButton:n=!0,size:m="md",...r})=>e.createElement(b,{size:m,side:o,sideOffset:a,...r},n&&e.createElement(w,{as:h,css:{position:"absolute",right:"$0",top:"$0"},label:s,size:"md",hasTooltip:!1,theme:"neutral"},e.createElement(z,{is:d})),i,e.createElement(C,{width:16,height:8}));export{u as PopoverContent};
 //# sourceMappingURL=PopoverContent.js.map

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

@@ -1,2 +1,2 @@
-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};
+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 $}from"./RadioField.js";const q=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:I}}=F({name:a,control:C,rules:t,defaultValue:l}),{error:u}=V(a);return e.useEffect(()=>{typeof o<"u"&&m(o)},[o]),e.createElement(q,{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=$,r.displayName="RadioButtonField";export{r as RadioButtonField};
 //# sourceMappingURL=RadioButtonField.js.map

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

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

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

@@ -1,2 +1,2 @@
-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:a,align:o,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:a,align:o}):i)));export{f as RadioCardGroup};
+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:l,isFullWidth:a,align:o,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:l,isFullWidth:a,align:o}):i)));export{f as RadioCardGroup};
 //# sourceMappingURL=RadioCardGroup.js.map

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

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Input } from '../../components/input';
 import { CSS } from '../../stitches';
 export declare type SearchInputProps = React.ComponentProps<typeof Input> & {
-    size?: 'sm' | 'md';
+    size?: 'sm' | 'md' | 'lg';
     css?: CSS;
     value?: string;
     defaultValue?: string;

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

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