@atom-learning/components 5.11.0 → 5.12.1

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 { disabledStyle } from '~/utilities'\nimport { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { Flex } from '../flex'\nimport { Text } from '../text'\n\nexport const InputBackground = styled(Flex, {\n  background: 'white',\n  color: '$grey1000',\n  border: '1px solid $grey800',\n  borderRadius: '$0',\n  transition: 'background 100ms ease-out, borderColor 100ms ease-out',\n  width: '100%',\n  '&:focus-within': {\n    borderColor: '$blue800'\n  },\n  variants: {\n    size: {\n      sm: {\n        height: '$3'\n      },\n      md: {\n        height: '$4'\n      },\n      lg: {\n        height: '$5'\n      },\n      xl: {\n        height: '$6'\n      }\n    },\n    disabled: {\n      true: disabledStyle\n    },\n    state: {\n      error: {\n        borderColor: '$danger'\n      }\n    }\n  }\n})\n\nInputBackground.displayName = 'InputBackground'\n\nconst StyledInputText = styled.withConfig({\n  shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Text as unknown as 'input', {\n  // unsets\n  appearance: 'none',\n  border: 'none',\n  background: 'none',\n  backgroundImage: 'none',\n  backgroundColor: 'transparent',\n  boxShadow: 'none', // prevent default iOS default styling\n  boxSizing: 'border-box',\n  '&:focus': {\n    outline: 'none'\n  },\n  //\n  px: '$3',\n  size: '100%'\n})\n\nexport type InputTextProps = Omit<\n  React.ComponentProps<typeof StyledInputText>,\n  'size' | 'type' | 'as'\n> & {\n  size: React.ComponentProps<typeof Text>['size']\n  // override default 'type' property to prevent Input from being used to render\n  // checkboxes, radios etc — we have dedicated components for them\n  type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n  as?: never\n}\n\nconst toTextSize = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'md',\n  xl: 'lg'\n}\n\nexport const InputText: React.ForwardRefExoticComponent<InputTextProps> =\n  React.forwardRef(({ type = 'text', css, size, ...rest }, ref) => {\n    const textSize = React.useMemo(\n      () => overrideStitchesVariantValue(size, (s) => toTextSize[s]),\n      [size]\n    )\n\n    return (\n      <StyledInputText\n        ref={ref}\n        as=\"input\"\n        type={type === 'number' ? 'text' : type}\n        inputMode={type === 'number' ? 'numeric' : undefined}\n        pattern={type === 'number' ? '[0-9]*' : undefined}\n        size={textSize}\n        {...rest}\n      />\n    )\n  })\n\nInputText.displayName = 'InputText'\n\ntype InputBackgroundProps = React.ComponentProps<typeof InputBackground>\nexport type InputProps = Omit<\n  React.ComponentProps<typeof InputText>,\n  'size' | 'state'\n> & {\n  size?: InputBackgroundProps['size']\n  state?: InputBackgroundProps['state']\n}\n\nexport const Input: React.ForwardRefExoticComponent<InputProps> =\n  React.forwardRef(\n    ({ className, size = 'md', state, disabled, css, ...rest }, ref) => {\n      return (\n        <InputBackground\n          size={size}\n          disabled={disabled}\n          state={state}\n          css={css}\n          className={className}\n        >\n          <InputText size={size} ref={ref} disabled={disabled} {...rest} />\n        </InputBackground>\n      )\n    }\n  )\n\nInput.displayName = 'Input'\n"],"names":["InputBackground","styled","Flex","disabledStyle","StyledInputText","propName","Text","toTextSize","InputText","React","type","css","size","rest","ref","textSize","overrideStitchesVariantValue","s","Input","className","state","disabled"],"mappings":"+gBASa,MAAAA,EAAkBC,EAAOC,EAAM,CAC1C,WAAY,QACZ,MAAO,YACP,OAAQ,qBACR,aAAc,KACd,WAAY,wDACZ,MAAO,OACP,iBAAkB,CAChB,YAAa,UACf,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,OAAQ,IACV,EACA,GAAI,CACF,OAAQ,IACV,EACA,GAAI,CACF,OAAQ,IACV,EACA,GAAI,CACF,OAAQ,IACV,CACF,EACA,SAAU,CACR,KAAMC,CACR,EACA,MAAO,CACL,MAAO,CACL,YAAa,SACf,CACF,CACF,CACF,CAAC,EAEDH,EAAgB,YAAc,kBAE9B,MAAMI,EAAkBH,EAAO,WAAW,CACxC,0BAA4BI,GAAa,CAAC,IAAI,EAAE,SAASA,CAAQ,CACnE,CAAC,EAAEC,EAA4B,CAE7B,WAAY,OACZ,OAAQ,OACR,WAAY,OACZ,gBAAiB,OACjB,gBAAiB,cACjB,UAAW,OACX,UAAW,aACX,UAAW,CACT,QAAS,MACX,EAEA,GAAI,KACJ,KAAM,MACR,CAAC,EAaKC,EAAa,CACjB,GAAI,KACJ,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EACXC,EAAM,WAAW,CAAC,CAAE,KAAAC,EAAO,OAAQ,IAAAC,EAAK,KAAAC,KAASC,CAAK,EAAGC,IAAQ,CAC/D,MAAMC,EAAWN,EAAM,QACrB,IAAMO,EAA6BJ,EAAOK,GAAMV,EAAWU,EAAE,EAC7D,CAACL,CAAI,CACP,EAEA,OACEH,EAAA,cAACL,EAAA,CACC,IAAKU,EACL,GAAG,QACH,KAAMJ,IAAS,SAAW,OAASA,EACnC,UAAWA,IAAS,SAAW,UAAY,OAC3C,QAASA,IAAS,SAAW,SAAW,OACxC,KAAMK,EACL,GAAGF,CACN,CAAA,CAEJ,CAAC,EAEHL,EAAU,YAAc,YAWjB,MAAMU,EACXT,EAAM,WACJ,CAAC,CAAE,UAAAU,EAAW,KAAAP,EAAO,KAAM,MAAAQ,EAAO,SAAAC,EAAU,IAAAV,KAAQE,CAAK,EAAGC,IAExDL,EAAA,cAACT,EAAA,CACC,KAAMY,EACN,SAAUS,EACV,MAAOD,EACP,IAAKT,EACL,UAAWQ,CAAAA,EAEXV,EAAA,cAACD,EAAU,CAAA,KAAMI,EAAM,IAAKE,EAAK,SAAUO,EAAW,GAAGR,CAAM,CAAA,CACjE,CAGN,EAEFK,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 { overrideStitchesVariantValue } from '~/utilities/override-stitches-variant-value/overrideStitchesVariantValue'\n\nimport { Flex } from '../flex'\nimport { Text } from '../text'\n\nexport const InputBackground = styled(Flex, {\n  color: '$grey1000',\n  transition: 'background 100ms ease-out, borderColor 100ms ease-out',\n  width: '100%',\n  '&::placeholder': {\n    color: '$grey700',\n    opacity: 1\n  },\n  variants: {\n    appearance: {\n      standard: {\n        background: 'white',\n        border: '1px solid $grey800',\n        borderRadius: '$1',\n        '&:focus-within': {\n          borderColor: '$blue800'\n        }\n      },\n      modern: {\n        background: '$grey100',\n        border: 'none',\n        borderRadius: '$1',\n        '&:focus-within': {\n          outline: '2px solid $blue800',\n          outlineOffset: 1,\n          zIndex: 1\n        }\n      }\n    },\n    size: {\n      sm: { height: '$3' },\n      md: { height: '$4' },\n      lg: { height: '$5' },\n      xl: { height: '$6' }\n    },\n    disabled: {\n      true: {\n        opacity: 0.3,\n        cursor: 'not-allowed'\n      }\n    },\n    state: {\n      error: {}\n    }\n  },\n  compoundVariants: [\n    {\n      state: 'error',\n      appearance: 'standard',\n      css: { borderColor: '$danger' }\n    },\n    {\n      state: 'error',\n      appearance: 'modern',\n      css: {\n        bg: '$dangerLight',\n        '&:focus-within': {\n          outlineColor: '$danger'\n        }\n      }\n    }\n  ]\n})\n\nInputBackground.displayName = 'InputBackground'\n\nconst StyledInputText = styled.withConfig({\n  shouldForwardStitchesProp: (propName) => ['as'].includes(propName)\n})(Text as unknown as 'input', {\n  // unsets\n  appearance: 'none',\n  border: 'none',\n  background: 'none',\n  backgroundImage: 'none',\n  backgroundColor: 'transparent',\n  boxShadow: 'none', // prevent default iOS default styling\n  boxSizing: 'border-box',\n  '&:focus': {\n    outline: 'none'\n  },\n  //\n  px: '$3',\n  size: '100%'\n})\n\nexport type InputTextProps = Omit<\n  React.ComponentProps<typeof StyledInputText>,\n  'size' | 'type' | 'as'\n> & {\n  size: React.ComponentProps<typeof Text>['size']\n  // override default 'type' property to prevent Input from being used to render\n  // checkboxes, radios etc — we have dedicated components for them\n  type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n  as?: never\n}\n\nconst toTextSize = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'md',\n  xl: 'lg'\n}\n\nexport const InputText: React.ForwardRefExoticComponent<InputTextProps> =\n  React.forwardRef(({ type = 'text', css, size, ...rest }, ref) => {\n    const textSize = React.useMemo(\n      () => overrideStitchesVariantValue(size, (s) => toTextSize[s]),\n      [size]\n    )\n\n    return (\n      <StyledInputText\n        ref={ref}\n        as=\"input\"\n        type={type === 'number' ? 'text' : type}\n        inputMode={type === 'number' ? 'numeric' : undefined}\n        pattern={type === 'number' ? '[0-9]*' : undefined}\n        size={textSize}\n        {...rest}\n      />\n    )\n  })\n\nInputText.displayName = 'InputText'\n\ntype InputBackgroundProps = React.ComponentProps<typeof InputBackground>\nexport type InputProps = Omit<\n  React.ComponentProps<typeof InputText>,\n  'size' | 'state' | 'appearance'\n> & {\n  size?: InputBackgroundProps['size']\n  state?: InputBackgroundProps['state']\n  appearance?: InputBackgroundProps['appearance']\n}\n\nexport const Input: React.ForwardRefExoticComponent<InputProps> =\n  React.forwardRef(\n    (\n      {\n        className,\n        size = 'md',\n        appearance = 'standard',\n        state,\n        disabled,\n        css,\n        ...rest\n      },\n      ref\n    ) => {\n      return (\n        <InputBackground\n          size={size}\n          appearance={appearance}\n          disabled={disabled}\n          state={state}\n          css={css}\n          className={className}\n        >\n          <InputText size={size} ref={ref} disabled={disabled} {...rest} />\n        </InputBackground>\n      )\n    }\n  )\n\nInput.displayName = 'Input'\n"],"names":["InputBackground","styled","Flex","StyledInputText","propName","Text","toTextSize","InputText","React","type","css","size","rest","ref","textSize","overrideStitchesVariantValue","s","Input","className","appearance","state","disabled"],"mappings":"gRAQa,MAAAA,EAAkBC,EAAOC,EAAM,CAC1C,MAAO,YACP,WAAY,wDACZ,MAAO,OACP,iBAAkB,CAChB,MAAO,WACP,QAAS,CACX,EACA,SAAU,CACR,WAAY,CACV,SAAU,CACR,WAAY,QACZ,OAAQ,qBACR,aAAc,KACd,iBAAkB,CAChB,YAAa,UACf,CACF,EACA,OAAQ,CACN,WAAY,WACZ,OAAQ,OACR,aAAc,KACd,iBAAkB,CAChB,QAAS,qBACT,cAAe,EACf,OAAQ,CACV,CACF,CACF,EACA,KAAM,CACJ,GAAI,CAAE,OAAQ,IAAK,EACnB,GAAI,CAAE,OAAQ,IAAK,EACnB,GAAI,CAAE,OAAQ,IAAK,EACnB,GAAI,CAAE,OAAQ,IAAK,CACrB,EACA,SAAU,CACR,KAAM,CACJ,QAAS,GACT,OAAQ,aACV,CACF,EACA,MAAO,CACL,MAAO,CAAA,CACT,CACF,EACA,iBAAkB,CAChB,CACE,MAAO,QACP,WAAY,WACZ,IAAK,CAAE,YAAa,SAAU,CAChC,EACA,CACE,MAAO,QACP,WAAY,SACZ,IAAK,CACH,GAAI,eACJ,iBAAkB,CAChB,aAAc,SAChB,CACF,CACF,CACF,CACF,CAAC,EAEDF,EAAgB,YAAc,kBAE9B,MAAMG,EAAkBF,EAAO,WAAW,CACxC,0BAA4BG,GAAa,CAAC,IAAI,EAAE,SAASA,CAAQ,CACnE,CAAC,EAAEC,EAA4B,CAE7B,WAAY,OACZ,OAAQ,OACR,WAAY,OACZ,gBAAiB,OACjB,gBAAiB,cACjB,UAAW,OACX,UAAW,aACX,UAAW,CACT,QAAS,MACX,EAEA,GAAI,KACJ,KAAM,MACR,CAAC,EAaKC,EAAa,CACjB,GAAI,KACJ,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EACXC,EAAM,WAAW,CAAC,CAAE,KAAAC,EAAO,OAAQ,IAAAC,EAAK,KAAAC,KAASC,CAAK,EAAGC,IAAQ,CAC/D,MAAMC,EAAWN,EAAM,QACrB,IAAMO,EAA6BJ,EAAOK,GAAMV,EAAWU,EAAE,EAC7D,CAACL,CAAI,CACP,EAEA,OACEH,EAAA,cAACL,EAAA,CACC,IAAKU,EACL,GAAG,QACH,KAAMJ,IAAS,SAAW,OAASA,EACnC,UAAWA,IAAS,SAAW,UAAY,OAC3C,QAASA,IAAS,SAAW,SAAW,OACxC,KAAMK,EACL,GAAGF,CAAAA,CACN,CAEJ,CAAC,EAEHL,EAAU,YAAc,YAYjB,MAAMU,EACXT,EAAM,WACJ,CACE,CACE,UAAAU,EACA,KAAAP,EAAO,KACP,WAAAQ,EAAa,WACb,MAAAC,EACA,SAAAC,EACA,IAAAX,KACGE,CACL,EACAC,IAGEL,EAAA,cAACR,EAAA,CACC,KAAMW,EACN,WAAYQ,EACZ,SAAUE,EACV,MAAOD,EACP,IAAKV,EACL,UAAWQ,CAEXV,EAAAA,EAAA,cAACD,EAAA,CAAU,KAAMI,EAAM,IAAKE,EAAK,SAAUQ,EAAW,GAAGT,CAAAA,CAAM,CACjE,CAGN,EAEFK,EAAM,YAAc"}

package/dist/components/input-field/InputField.d.ts

@@ -3,7 +3,7 @@ import { FieldElementWrapperProps } from '../../components/field-wrapper';
 import { InputProps } from '../../components/input';
 type InputFieldProps = InputProps & FieldElementWrapperProps;
 export declare const InputField: {
-    ({ css, label, name, validation, prompt, description, hideLabel, ...remainingProps }: InputFieldProps): React.JSX.Element;
+    ({ css, label, name, validation, prompt, description, hideLabel, appearance, ...remainingProps }: InputFieldProps): React.JSX.Element;
     displayName: string;
 };
 export {};

package/dist/components/input-field/InputField.js

@@ -1,2 +1,2 @@
-import*as i from"react";import{useFormContext as c}from"react-hook-form";import{FieldWrapper as f}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as F}from"../form/useFieldError.js";import{Input as b}from"../input/Input.js";const p=({css:m,label:l,name:e,validation:r,prompt:a,description:d,hideLabel:n,...s})=>{const{register:o}=c(),{error:t}=F(e),u=r?o(r):o;return i.createElement(f,{css:m,description:d,error:t,fieldId:e,hideLabel:n,label:l,prompt:a,required:Boolean(r==null?void 0:r.required)},i.createElement(b,{id:e,name:e,ref:u,...t&&{state:"error"},...s}))};p.displayName="InputField";export{p as InputField};
+import*as i from"react";import{useFormContext as b}from"react-hook-form";import{FieldWrapper as I}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as v}from"../form/useFieldError.js";import{useFormCustomContext as x}from"../form/useFormCustomContext.js";import{Input as C}from"../input/Input.js";const m=({css:n,label:l,name:e,validation:r,prompt:d,description:s,hideLabel:c,appearance:u,...f})=>{const{register:o}=b(),t=x(),{error:p}=v(e),F=r?o(r):o,a=(t==null?void 0:t.appearance)||u;return i.createElement(I,{css:n,description:s,error:p,fieldId:e,hideLabel:c,label:l,prompt:d,required:Boolean(r==null?void 0:r.required),appearance:a},i.createElement(C,{id:e,name:e,ref:F,appearance:a,...p&&{state:"error"},...f}))};m.displayName="InputField";export{m as InputField};
 //# sourceMappingURL=InputField.js.map

package/dist/components/input-field/InputField.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputField.js","sources":["../../../src/components/input-field/InputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError } from '~/components/form'\nimport { Input, InputProps } from '~/components/input'\n\ntype InputFieldProps = InputProps & FieldElementWrapperProps\n\nexport const InputField = ({\n  css,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  hideLabel,\n  ...remainingProps\n}: InputFieldProps) => {\n  const { register } = useFormContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n\n  return (\n    <FieldWrapper\n      css={css}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n    >\n      <Input\n        id={name}\n        name={name}\n        ref={ref}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nInputField.displayName = 'InputField'\n"],"names":["InputField","css","label","name","validation","prompt","description","hideLabel","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","Input"],"mappings":"yTAYaA,EAAa,CAAC,CACzB,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,UAAAC,KACGC,CACL,IAAuB,CACrB,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcT,CAAI,EAC9BU,EAAMT,EAAaK,EAASL,CAAU,EAAIK,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKd,EACL,YAAaK,EACb,MAAOK,EACP,QAASR,EACT,UAAWI,EACX,MAAOL,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,YAAAA,EAAY,QAAQ,CAEtCU,EAAAA,EAAA,cAACE,EAAA,CACC,GAAIb,EACJ,KAAMA,EACN,IAAKU,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGH,EACN,CACF,CAEJ,EAEAR,EAAW,YAAc"}
+{"version":3,"file":"InputField.js","sources":["../../../src/components/input-field/InputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError, useFormCustomContext } from '~/components/form'\nimport { Input, InputProps } from '~/components/input'\n\ntype InputFieldProps = InputProps & FieldElementWrapperProps\n\nexport const InputField = ({\n  css,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  hideLabel,\n  appearance,\n  ...remainingProps\n}: InputFieldProps) => {\n  const { register } = useFormContext()\n  const context = useFormCustomContext()\n  const { error } = useFieldError(name)\n\n  const ref = validation ? register(validation) : register\n  const formAppearance = context?.appearance || appearance\n\n  return (\n    <FieldWrapper\n      css={css}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      appearance={formAppearance}\n    >\n      <Input\n        id={name}\n        name={name}\n        ref={ref}\n        appearance={formAppearance}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nInputField.displayName = 'InputField'\n"],"names":["InputField","css","label","name","validation","prompt","description","hideLabel","appearance","remainingProps","register","useFormContext","context","useFormCustomContext","error","useFieldError","ref","formAppearance","React","FieldWrapper","Input"],"mappings":"0XAYa,MAAAA,EAAa,CAAC,CACzB,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,UAAAC,EACA,WAAAC,KACGC,CACL,IAAuB,CACrB,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9BC,EAAUC,EACV,EAAA,CAAE,MAAAC,CAAM,EAAIC,EAAcZ,CAAI,EAE9Ba,EAAMZ,EAAaM,EAASN,CAAU,EAAIM,EAC1CO,GAAiBL,GAAA,KAAAA,OAAAA,EAAS,aAAcJ,EAE9C,OACEU,EAAA,cAACC,EAAA,CACC,IAAKlB,EACL,YAAaK,EACb,MAAOQ,EACP,QAASX,EACT,UAAWI,EACX,MAAOL,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,KAAAA,OAAAA,EAAY,QAAQ,EACtC,WAAYa,CAAAA,EAEZC,EAAA,cAACE,EAAA,CACC,GAAIjB,EACJ,KAAMA,EACN,IAAKa,EACL,WAAYC,EACX,GAAIH,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGL,CAAAA,CACN,CACF,CAEJ,EAEAT,EAAW,YAAc"}

package/dist/components/label/Label.d.ts

@@ -2,9 +2,10 @@ import * as React from 'react';
 import type { Override } from '../../utilities/types';
 declare const StyledLabel: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<"label", {
     size?: "sm" | "md" | undefined;
-    type?: "inline" | "block" | undefined;
+    type?: "block" | "inline" | undefined;
     align?: "center" | "start" | undefined;
     direction?: "row" | "reverse" | undefined;
+    appearance?: "standard" | "modern" | undefined;
 }, {
     sm: string;
     md: string;
@@ -374,7 +375,7 @@ declare const StyledLabel: import("@atom-learning/stitches-react/types/styled-co
         marginBottom: string | number | import("@atom-learning/stitches-react/types/css-util").WithScaleValue<"space">;
     };
 }>>;
-type LabelProps = Override<React.ComponentPropsWithoutRef<typeof StyledLabel>, {
+export type LabelProps = Override<React.ComponentPropsWithoutRef<typeof StyledLabel>, {
     as?: 'label' | 'legend';
     required?: boolean;
 }>;

package/dist/components/label/Label.js

@@ -1,2 +1,2 @@
-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:"$grey900",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};
+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:"$grey900",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:{}},appearance:{standard:{},modern:{}}},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"}},{type:"block",appearance:"modern",css:{fontWeight:400}}]}),y=t("span",{color:"$danger",ml:"$1",fontWeight:400}),n=({align:r="start",as:a="label",direction:o="row",size:s="md",type:l="block",children:c,required:m,...d})=>e.createElement(p,{as:a,size:s,type:l,align:r,direction:o,...d},c,m&&e.createElement(y,{"aria-hidden":!0},"*"));n.displayName="Label";export{n as Label};
 //# sourceMappingURL=Label.js.map

package/dist/components/label/Label.js.map

@@ -1 +1 @@
-{"version":3,"file":"Label.js","sources":["../../../src/components/label/Label.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport type { Override } from '~/utilities/types'\n\nimport { getTextVariant } from '../text'\n\nconst StyledLabel = styled('label', {\n  color: '$grey900',\n  fontFamily: '$body',\n  m: 0,\n  variants: {\n    size: {\n      sm: getTextVariant({ size: 'sm' }),\n      md: getTextVariant({ size: 'md' })\n    },\n    type: {\n      block: {\n        display: 'block',\n        fontWeight: 600\n      },\n      inline: {\n        display: 'flex',\n        fontWeight: 400,\n        maxWidth: 'max-content'\n      }\n    },\n    align: { start: {}, center: {} },\n    direction: { reverse: {}, row: {} }\n  },\n  compoundVariants: [\n    {\n      type: 'inline',\n      align: 'start',\n      css: { alignItems: 'flex-start' }\n    },\n    {\n      type: 'inline',\n      align: 'center',\n      css: { alignItems: 'center' }\n    },\n    {\n      type: 'inline',\n      direction: 'reverse',\n      css: { flexDirection: 'row-reverse' }\n    },\n    {\n      type: 'inline',\n      direction: 'row',\n      css: { flexDirection: 'row' }\n    }\n  ]\n})\n\nconst StyledAsterisk = styled('span', {\n  color: '$danger',\n  ml: '$1',\n  fontWeight: 400\n})\n\ntype LabelProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledLabel>,\n  {\n    as?: 'label' | 'legend'\n    required?: boolean\n  }\n>\n\nexport const Label = ({\n  align = 'start',\n  as = 'label',\n  direction = 'row',\n  size = 'md',\n  type = 'block',\n  children,\n  required,\n  ...rest\n}: LabelProps) => (\n  <StyledLabel\n    as={as}\n    size={size}\n    type={type}\n    align={align}\n    direction={direction}\n    {...rest}\n  >\n    {children}\n    {required && <StyledAsterisk aria-hidden>*</StyledAsterisk>}\n  </StyledLabel>\n)\n\nLabel.displayName = 'Label'\n"],"names":["StyledLabel","styled","getTextVariant","StyledAsterisk","Label","align","as","direction","size","type","children","required","rest","React"],"mappings":"oHAOA,MAAMA,EAAcC,EAAO,QAAS,CAClC,MAAO,WACP,WAAY,QACZ,EAAG,EACH,SAAU,CACR,KAAM,CACJ,GAAIC,EAAe,CAAE,KAAM,IAAK,CAAC,EACjC,GAAIA,EAAe,CAAE,KAAM,IAAK,CAAC,CACnC,EACA,KAAM,CACJ,MAAO,CACL,QAAS,QACT,WAAY,GACd,EACA,OAAQ,CACN,QAAS,OACT,WAAY,IACZ,SAAU,aACZ,CACF,EACA,MAAO,CAAE,MAAO,CAAA,EAAI,OAAQ,CAAG,CAAA,EAC/B,UAAW,CAAE,QAAS,CAAI,EAAA,IAAK,EAAG,CACpC,EACA,iBAAkB,CAChB,CACE,KAAM,SACN,MAAO,QACP,IAAK,CAAE,WAAY,YAAa,CAClC,EACA,CACE,KAAM,SACN,MAAO,SACP,IAAK,CAAE,WAAY,QAAS,CAC9B,EACA,CACE,KAAM,SACN,UAAW,UACX,IAAK,CAAE,cAAe,aAAc,CACtC,EACA,CACE,KAAM,SACN,UAAW,MACX,IAAK,CAAE,cAAe,KAAM,CAC9B,CACF,CACF,CAAC,EAEKC,EAAiBF,EAAO,OAAQ,CACpC,MAAO,UACP,GAAI,KACJ,WAAY,GACd,CAAC,EAUYG,EAAQ,CAAC,CACpB,MAAAC,EAAQ,QACR,GAAAC,EAAK,QACL,UAAAC,EAAY,MACZ,KAAAC,EAAO,KACP,KAAAC,EAAO,QACP,SAAAC,EACA,SAAAC,KACGC,CACL,IACEC,EAAA,cAACb,EAAA,CACC,GAAIM,EACJ,KAAME,EACN,KAAMC,EACN,MAAOJ,EACP,UAAWE,EACV,GAAGK,CAEHF,EAAAA,EACAC,GAAYE,EAAA,cAACV,EAAA,CAAe,cAAW,IAAC,GAAC,CAC5C,EAGFC,EAAM,YAAc"}
+{"version":3,"file":"Label.js","sources":["../../../src/components/label/Label.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport type { Override } from '~/utilities/types'\n\nimport { getTextVariant } from '../text'\n\nconst StyledLabel = styled('label', {\n  color: '$grey900',\n  fontFamily: '$body',\n  m: 0,\n  variants: {\n    size: {\n      sm: getTextVariant({ size: 'sm' }),\n      md: getTextVariant({ size: 'md' })\n    },\n    type: {\n      block: {\n        display: 'block',\n        fontWeight: 600\n      },\n      inline: {\n        display: 'flex',\n        fontWeight: 400,\n        maxWidth: 'max-content'\n      }\n    },\n    align: { start: {}, center: {} },\n    direction: { reverse: {}, row: {} },\n    appearance: { standard: {}, modern: {} }\n  },\n  compoundVariants: [\n    {\n      type: 'inline',\n      align: 'start',\n      css: { alignItems: 'flex-start' }\n    },\n    {\n      type: 'inline',\n      align: 'center',\n      css: { alignItems: 'center' }\n    },\n    {\n      type: 'inline',\n      direction: 'reverse',\n      css: { flexDirection: 'row-reverse' }\n    },\n    {\n      type: 'inline',\n      direction: 'row',\n      css: { flexDirection: 'row' }\n    },\n    {\n      type: 'block',\n      appearance: 'modern',\n      css: { fontWeight: 400 }\n    }\n  ]\n})\n\nconst StyledAsterisk = styled('span', {\n  color: '$danger',\n  ml: '$1',\n  fontWeight: 400\n})\n\nexport type LabelProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledLabel>,\n  {\n    as?: 'label' | 'legend'\n    required?: boolean\n  }\n>\n\nexport const Label = ({\n  align = 'start',\n  as = 'label',\n  direction = 'row',\n  size = 'md',\n  type = 'block',\n  children,\n  required,\n  ...rest\n}: LabelProps) => (\n  <StyledLabel\n    as={as}\n    size={size}\n    type={type}\n    align={align}\n    direction={direction}\n    {...rest}\n  >\n    {children}\n    {required && <StyledAsterisk aria-hidden>*</StyledAsterisk>}\n  </StyledLabel>\n)\n\nLabel.displayName = 'Label'\n"],"names":["StyledLabel","styled","getTextVariant","StyledAsterisk","Label","align","as","direction","size","type","children","required","rest","React"],"mappings":"oHAOA,MAAMA,EAAcC,EAAO,QAAS,CAClC,MAAO,WACP,WAAY,QACZ,EAAG,EACH,SAAU,CACR,KAAM,CACJ,GAAIC,EAAe,CAAE,KAAM,IAAK,CAAC,EACjC,GAAIA,EAAe,CAAE,KAAM,IAAK,CAAC,CACnC,EACA,KAAM,CACJ,MAAO,CACL,QAAS,QACT,WAAY,GACd,EACA,OAAQ,CACN,QAAS,OACT,WAAY,IACZ,SAAU,aACZ,CACF,EACA,MAAO,CAAE,MAAO,GAAI,OAAQ,CAAA,CAAG,EAC/B,UAAW,CAAE,QAAS,CAAA,EAAI,IAAK,EAAG,EAClC,WAAY,CAAE,SAAU,CAAC,EAAG,OAAQ,CAAA,CAAG,CACzC,EACA,iBAAkB,CAChB,CACE,KAAM,SACN,MAAO,QACP,IAAK,CAAE,WAAY,YAAa,CAClC,EACA,CACE,KAAM,SACN,MAAO,SACP,IAAK,CAAE,WAAY,QAAS,CAC9B,EACA,CACE,KAAM,SACN,UAAW,UACX,IAAK,CAAE,cAAe,aAAc,CACtC,EACA,CACE,KAAM,SACN,UAAW,MACX,IAAK,CAAE,cAAe,KAAM,CAC9B,EACA,CACE,KAAM,QACN,WAAY,SACZ,IAAK,CAAE,WAAY,GAAI,CACzB,CACF,CACF,CAAC,EAEKC,EAAiBF,EAAO,OAAQ,CACpC,MAAO,UACP,GAAI,KACJ,WAAY,GACd,CAAC,EAUYG,EAAQ,CAAC,CACpB,MAAAC,EAAQ,QACR,GAAAC,EAAK,QACL,UAAAC,EAAY,MACZ,KAAAC,EAAO,KACP,KAAAC,EAAO,QACP,SAAAC,EACA,SAAAC,KACGC,CACL,IACEC,EAAA,cAACb,EAAA,CACC,GAAIM,EACJ,KAAME,EACN,KAAMC,EACN,MAAOJ,EACP,UAAWE,EACV,GAAGK,CAAAA,EAEHF,EACAC,GAAYE,EAAA,cAACV,EAAA,CAAe,cAAW,IAAC,GAAC,CAC5C,EAGFC,EAAM,YAAc"}

package/dist/components/link/Link.js

@@ -1,2 +1,2 @@
-import*as o from"react";import{styled as p}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{disabledStyle as d}from"../../utilities/style/disabledStyle.js";import{getExternalAnchorProps as s}from"../../utilities/uri/index.js";import{StyledHeading as l}from"../heading/Heading.js";import{StyledLi as f}from"../list/List.js";import"../markdown-content/components/MarkdownCode.js";import{StyledMarkdownEmphasis as y}from"../markdown-content/components/MarkdownEmphasis.js";import"../markdown-content/components/MarkdownInlineCode.js";import"../image/Image.js";import{StyledText as c,textVariants as b}from"../text/Text.js";import"../markdown-content/components/MarkdownStrong.js";import"../divider/Divider.js";const t=p("a",{bg:"unset",border:"unset",p:"unset",color:"$primary800",cursor:"pointer",fontFamily:"$body",textDecoration:"none","&:focus, &:hover":{color:"$primary900",textDecoration:"underline"},"&:active":{color:"$primary1000"},"&[disabled]":{...d,pointerEvents:"none"},[`${c} > &, ${l} > &, ${f} > &, ${y} > &`]:{fontSize:"100%",lineHeight:1,"&::before, &::after":{content:"none"}},variants:b,defaultVariants:{size:"md"}}),e=o.forwardRef(({as:i,disabled:n,href:r,...m},a)=>o.createElement(t,{as:i||(r?void 0:"button"),noCapsize:r?void 0:!0,href:r,...n&&{disabled:!0},...m,...s(r),ref:a}));e.displayName="Link";export{e as Link,t as StyledLink};
+import*as o from"react";import{styled as d}from"../../stitches.js";import{getExternalAnchorProps as l}from"../../utilities/uri/index.js";import{textVariants as m}from"../text/Text.js";const r=d("a",{bg:"unset",border:"unset",p:"unset",color:"$primary800",cursor:"pointer",fontFamily:"$body",textDecoration:"none","&:focus, &:hover":{color:"$primary900",textDecoration:"underline"},"&:active":{color:"$primary1000"},"&[disabled]":{opacity:.3,cursor:"not-allowed",pointerEvents:"none"},"p > &, h1 > &, h2 > &, h3 > &, h4 > &, li > &, em > &":{fontSize:"100%",lineHeight:1,"&::before, &::after":{content:"none"}},variants:m,defaultVariants:{size:"md"}}),t=o.forwardRef(({as:n,disabled:i,href:e,...a},s)=>o.createElement(r,{as:n||(e?void 0:"button"),noCapsize:e?void 0:!0,href:e,...i&&{disabled:!0},...a,...l(e),ref:s}));t.displayName="Link";export{t as Link,r as StyledLink};
 //# sourceMappingURL=Link.js.map

package/dist/components/link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sources":["../../../src/components/link/Link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { disabledStyle, Override } from '~/utilities'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { StyledHeading } from '../heading/Heading'\nimport { StyledLi } from '../list/List'\nimport { StyledMarkdownEmphasis } from '../markdown-content/components'\nimport { StyledText, textVariants } from '../text/Text'\n\nexport const StyledLink = styled('a', {\n  bg: 'unset',\n  border: 'unset',\n  p: 'unset',\n  color: '$primary800',\n  cursor: 'pointer',\n  fontFamily: '$body',\n  textDecoration: 'none',\n  '&:focus, &:hover': {\n    color: '$primary900',\n    textDecoration: 'underline'\n  },\n  '&:active': {\n    color: '$primary1000'\n  },\n  '&[disabled]': {\n    ...disabledStyle,\n    pointerEvents: 'none'\n  },\n\n  [`${StyledText} > &, ${StyledHeading} > &, ${StyledLi} > &, ${StyledMarkdownEmphasis} > &`]:\n    {\n      fontSize: '100%',\n      lineHeight: 1,\n      '&::before, &::after': {\n        content: 'none'\n      }\n    },\n  variants: textVariants,\n  defaultVariants: {\n    size: 'md'\n  }\n})\n\ntype LinkProps = Override<\n  React.ComponentProps<typeof StyledLink>,\n  {\n    as?: React.ComponentType | React.ElementType\n  } & NavigatorActions & { disabled?: boolean }\n>\n\nexport const Link: React.ForwardRefExoticComponent<LinkProps> =\n  React.forwardRef(({ as, disabled, href, ...rest }, ref) => (\n    <StyledLink\n      as={as || (!href ? 'button' : undefined)}\n      noCapsize={!href ? true : undefined}\n      href={href}\n      {...(disabled && { disabled: true })}\n      {...rest}\n      {...getExternalAnchorProps(href)}\n      ref={ref}\n    />\n  ))\n\nLink.displayName = 'Link'\n"],"names":["StyledLink","styled","disabledStyle","StyledText","StyledHeading","StyledLi","StyledMarkdownEmphasis","textVariants","Link","React","as","disabled","href","rest","ref","getExternalAnchorProps"],"mappings":"y2BAYa,MAAAA,EAAaC,EAAO,IAAK,CACpC,GAAI,QACJ,OAAQ,QACR,EAAG,QACH,MAAO,cACP,OAAQ,UACR,WAAY,QACZ,eAAgB,OAChB,mBAAoB,CAClB,MAAO,cACP,eAAgB,WAClB,EACA,WAAY,CACV,MAAO,cACT,EACA,cAAe,CACb,GAAGC,EACH,cAAe,MACjB,EAEA,CAAC,GAAGC,UAAmBC,UAAsBC,UAAiBC,SAC5D,CACE,SAAU,OACV,WAAY,EACZ,sBAAuB,CACrB,QAAS,MACX,CACF,EACF,SAAUC,EACV,gBAAiB,CACf,KAAM,IACR,CACF,CAAC,EASYC,EACXC,EAAM,WAAW,CAAC,CAAE,GAAAC,EAAI,SAAAC,EAAU,KAAAC,KAASC,CAAK,EAAGC,IACjDL,EAAA,cAACT,GACC,GAAIU,IAAQE,EAAkB,OAAX,UACnB,UAAYA,EAAc,OAAP,GACnB,KAAMA,EACL,GAAID,GAAY,CAAE,SAAU,EAAK,EACjC,GAAGE,EACH,GAAGE,EAAuBH,CAAI,EAC/B,IAAKE,CAAAA,CACP,CACD,EAEHN,EAAK,YAAc"}
+{"version":3,"file":"Link.js","sources":["../../../src/components/link/Link.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { NavigatorActions } from '~/types'\nimport { Override } from '~/utilities'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { textVariants } from '../text/Text'\n\nexport const StyledLink = styled('a', {\n  bg: 'unset',\n  border: 'unset',\n  p: 'unset',\n  color: '$primary800',\n  cursor: 'pointer',\n  fontFamily: '$body',\n  textDecoration: 'none',\n  '&:focus, &:hover': {\n    color: '$primary900',\n    textDecoration: 'underline'\n  },\n  '&:active': {\n    color: '$primary1000'\n  },\n  '&[disabled]': {\n    opacity: 0.3,\n    cursor: 'not-allowed',\n    pointerEvents: 'none'\n  },\n  'p > &, h1 > &, h2 > &, h3 > &, h4 > &, li > &, em > &': {\n    fontSize: '100%',\n    lineHeight: 1,\n    '&::before, &::after': {\n      content: 'none'\n    }\n  },\n  variants: textVariants,\n  defaultVariants: {\n    size: 'md'\n  }\n})\n\ntype LinkProps = Override<\n  React.ComponentProps<typeof StyledLink>,\n  {\n    as?: React.ComponentType | React.ElementType\n  } & NavigatorActions & { disabled?: boolean }\n>\n\nexport const Link: React.ForwardRefExoticComponent<LinkProps> =\n  React.forwardRef(({ as, disabled, href, ...rest }, ref) => (\n    <StyledLink\n      as={as || (!href ? 'button' : undefined)}\n      noCapsize={!href ? true : undefined}\n      href={href}\n      {...(disabled && { disabled: true })}\n      {...rest}\n      {...getExternalAnchorProps(href)}\n      ref={ref}\n    />\n  ))\n\nLink.displayName = 'Link'\n"],"names":["StyledLink","styled","textVariants","Link","React","as","disabled","href","rest","ref","getExternalAnchorProps"],"mappings":"wLASO,MAAMA,EAAaC,EAAO,IAAK,CACpC,GAAI,QACJ,OAAQ,QACR,EAAG,QACH,MAAO,cACP,OAAQ,UACR,WAAY,QACZ,eAAgB,OAChB,mBAAoB,CAClB,MAAO,cACP,eAAgB,WAClB,EACA,WAAY,CACV,MAAO,cACT,EACA,cAAe,CACb,QAAS,GACT,OAAQ,cACR,cAAe,MACjB,EACA,wDAAyD,CACvD,SAAU,OACV,WAAY,EACZ,sBAAuB,CACrB,QAAS,MACX,CACF,EACA,SAAUC,EACV,gBAAiB,CACf,KAAM,IACR,CACF,CAAC,EASYC,EACXC,EAAM,WAAW,CAAC,CAAE,GAAAC,EAAI,SAAAC,EAAU,KAAAC,KAASC,CAAK,EAAGC,IACjDL,EAAA,cAACJ,GACC,GAAIK,IAAQE,EAAkB,OAAX,UACnB,UAAYA,EAAc,OAAP,GACnB,KAAMA,EACL,GAAID,GAAY,CAAE,SAAU,EAAK,EACjC,GAAGE,EACH,GAAGE,EAAuBH,CAAI,EAC/B,IAAKE,CACP,CAAA,CACD,EAEHN,EAAK,YAAc"}

package/dist/components/list/List.js

@@ -1,2 +1,2 @@
-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:"$primary800"}}}}}}),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};
+import*as e from"react";import{styled as t}from"../../stitches.js";import{textVariants as d}from"../text/Text.js";const i=t("li",{}),l=t("ul",{listStylePosition:"inside",fontFamily:"$body",m:"unset",p:"unset","& > li":{"&:not(:last-child)":{mb:"$2"},"&:last-child":{mb:0}},variants:{...d,as:{ol:{pl:"$4",listStyleType:"decimal","& > li":{pl:"$1","&::marker":{fontSize:".875em",fontWeight:"bold"}}},ul:{pl:"$3","& > li":{pl:"$2","&::marker":{content:"\u2022 ",fontWeight:"bold"}}}},theme:{primary:{"& > li":{"&::marker":{color:"$primary800"}}}}}}),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=i;export{o as List,i as StyledLi,l as StyledList};
 //# sourceMappingURL=List.js.map

package/dist/components/list/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../../src/components/list/List.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { textVariants } from '../text'\n\nexport const StyledLi = styled('li', {})\n\nexport const StyledList = styled('ul', {\n  listStylePosition: 'inside',\n  fontFamily: '$body',\n  m: 'unset',\n  p: 'unset',\n  [`& > ${StyledLi}`]: {\n    '&:not(:last-child)': { mb: '$2' },\n    '&:last-child': { mb: 0 }\n  },\n  variants: {\n    ...textVariants,\n    as: {\n      ol: {\n        pl: '$4',\n        listStyleType: 'decimal',\n        [`& > ${StyledLi}`]: {\n          pl: '$1',\n          '&::marker': { fontSize: '.875em', fontWeight: 'bold' }\n        }\n      },\n      ul: {\n        pl: '$3',\n        [`& > ${StyledLi}`]: {\n          pl: '$2',\n          '&::marker': { content: '• ', fontWeight: 'bold' }\n        }\n      }\n    },\n    theme: {\n      primary: {\n        [`& > ${StyledLi}`]: {\n          '&::marker': { color: '$primary800' }\n        }\n      }\n    }\n  }\n})\n\ntype ListProps = React.ComponentProps<typeof StyledList> & {\n  ordered?: boolean\n}\n\ntype ListType = React.ForwardRefExoticComponent<ListProps> & {\n  Item: typeof StyledLi\n}\n\nexport const List = React.forwardRef(\n  ({ size = 'md', noCapsize = true, ordered, ...remainingProps }, ref) => (\n    <StyledList\n      ref={ref}\n      as={ordered ? 'ol' : 'ul'}\n      size={size}\n      noCapsize={noCapsize}\n      {...remainingProps}\n    />\n  )\n) as ListType\n\nList.Item = StyledLi\n"],"names":["StyledLi","styled","StyledList","textVariants","List","React","size","noCapsize","ordered","remainingProps","ref"],"mappings":"kHAMO,MAAMA,EAAWC,EAAO,KAAM,CAAA,CAAE,EAE1BC,EAAaD,EAAO,KAAM,CACrC,kBAAmB,SACnB,WAAY,QACZ,EAAG,QACH,EAAG,QACH,CAAC,OAAOD,KAAa,CACnB,qBAAsB,CAAE,GAAI,IAAK,EACjC,eAAgB,CAAE,GAAI,CAAE,CAC1B,EACA,SAAU,CACR,GAAGG,EACH,GAAI,CACF,GAAI,CACF,GAAI,KACJ,cAAe,UACf,CAAC,OAAOH,KAAa,CACnB,GAAI,KACJ,YAAa,CAAE,SAAU,SAAU,WAAY,MAAO,CACxD,CACF,EACA,GAAI,CACF,GAAI,KACJ,CAAC,OAAOA,KAAa,CACnB,GAAI,KACJ,YAAa,CAAE,QAAS,UAAM,WAAY,MAAO,CACnD,CACF,CACF,EACA,MAAO,CACL,QAAS,CACP,CAAC,OAAOA,KAAa,CACnB,YAAa,CAAE,MAAO,aAAc,CACtC,CACF,CACF,CACF,CACF,CAAC,EAUYI,EAAOC,EAAM,WACxB,CAAC,CAAE,KAAAC,EAAO,KAAM,UAAAC,EAAY,GAAM,QAAAC,KAAYC,CAAe,EAAGC,IAC9DL,EAAA,cAACH,EAAA,CACC,IAAKQ,EACL,GAAIF,EAAU,KAAO,KACrB,KAAMF,EACN,UAAWC,EACV,GAAGE,CAAAA,CACN,CAEJ,EAEAL,EAAK,KAAOJ"}
+{"version":3,"file":"List.js","sources":["../../../src/components/list/List.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { textVariants } from '../text'\n\nexport const StyledLi = styled('li', {})\n\nexport const StyledList = styled('ul', {\n  listStylePosition: 'inside',\n  fontFamily: '$body',\n  m: 'unset',\n  p: 'unset',\n  '& > li': {\n    '&:not(:last-child)': { mb: '$2' },\n    '&:last-child': { mb: 0 }\n  },\n  variants: {\n    ...textVariants,\n    as: {\n      ol: {\n        pl: '$4',\n        listStyleType: 'decimal',\n        '& > li': {\n          pl: '$1',\n          '&::marker': { fontSize: '.875em', fontWeight: 'bold' }\n        }\n      },\n      ul: {\n        pl: '$3',\n        '& > li': {\n          pl: '$2',\n          '&::marker': { content: '• ', fontWeight: 'bold' }\n        }\n      }\n    },\n    theme: {\n      primary: {\n        '& > li': {\n          '&::marker': { color: '$primary800' }\n        }\n      }\n    }\n  }\n})\n\ntype ListProps = React.ComponentProps<typeof StyledList> & {\n  ordered?: boolean\n}\n\ntype ListType = React.ForwardRefExoticComponent<ListProps> & {\n  Item: typeof StyledLi\n}\n\nexport const List = React.forwardRef(\n  ({ size = 'md', noCapsize = true, ordered, ...remainingProps }, ref) => (\n    <StyledList\n      ref={ref}\n      as={ordered ? 'ol' : 'ul'}\n      size={size}\n      noCapsize={noCapsize}\n      {...remainingProps}\n    />\n  )\n) as ListType\n\nList.Item = StyledLi\n"],"names":["StyledLi","styled","StyledList","textVariants","List","React","size","noCapsize","ordered","remainingProps","ref"],"mappings":"kHAMa,MAAAA,EAAWC,EAAO,KAAM,CAAA,CAAE,EAE1BC,EAAaD,EAAO,KAAM,CACrC,kBAAmB,SACnB,WAAY,QACZ,EAAG,QACH,EAAG,QACH,SAAU,CACR,qBAAsB,CAAE,GAAI,IAAK,EACjC,eAAgB,CAAE,GAAI,CAAE,CAC1B,EACA,SAAU,CACR,GAAGE,EACH,GAAI,CACF,GAAI,CACF,GAAI,KACJ,cAAe,UACf,SAAU,CACR,GAAI,KACJ,YAAa,CAAE,SAAU,SAAU,WAAY,MAAO,CACxD,CACF,EACA,GAAI,CACF,GAAI,KACJ,SAAU,CACR,GAAI,KACJ,YAAa,CAAE,QAAS,UAAM,WAAY,MAAO,CACnD,CACF,CACF,EACA,MAAO,CACL,QAAS,CACP,SAAU,CACR,YAAa,CAAE,MAAO,aAAc,CACtC,CACF,CACF,CACF,CACF,CAAC,EAUYC,EAAOC,EAAM,WACxB,CAAC,CAAE,KAAAC,EAAO,KAAM,UAAAC,EAAY,GAAM,QAAAC,KAAYC,CAAe,EAAGC,IAC9DL,EAAA,cAACH,EACC,CAAA,IAAKQ,EACL,GAAIF,EAAU,KAAO,KACrB,KAAMF,EACN,UAAWC,EACV,GAAGE,CAAAA,CACN,CAEJ,EAEAL,EAAK,KAAOJ"}

package/dist/components/loader/Loader.js

@@ -1,2 +1,2 @@
-import*as m from"@radix-ui/react-visually-hidden";import*as e from"react";import{Flex as r}from"../flex/Flex.js";import{keyframes as s,styled as l}from"../../stitches.js";const c=s({"0%":{opacity:0},"30%":{opacity:1},"50%":{opacity:1},"80%":{opacity:0},"100%":{opacity:0}}),t=l("div",{animationName:`${c}`,animationDuration:"1s",animationFillMode:"both",animationIterationCount:"infinite",animationTimingFunction:"linear",backgroundColor:"currentColor",borderRadius:"$round","&:nth-child(1)":{animationDelay:"-300ms"},"&:nth-child(2)":{animationDelay:"-150ms"},"&:nth-child(3)":{animationDelay:0},variants:{size:{sm:{size:"4px",mx:"2px"},md:{size:"6px",mx:"2px"},lg:{size:"8px",mx:"3px"}}}}),p=({css:n={},message:a="Loading",size:i="md",...o})=>e.createElement(r,{css:{justifyContent:"center",...n},role:"alert",...o},e.createElement(m.Root,null,a),e.createElement(t,{size:i}),e.createElement(t,{size:i}),e.createElement(t,{size:i}));export{p as Loader};
+import*as m from"@radix-ui/react-visually-hidden";import*as e from"react";import{Flex as r}from"../flex/Flex.js";import{keyframes as s,styled as l}from"../../stitches.js";const c=s({"0%":{opacity:0},"30%":{opacity:1},"50%":{opacity:1},"80%":{opacity:0},"100%":{opacity:0}}),t=l("div",{animationName:`${c}`,animationDuration:"1000ms",animationFillMode:"both",animationIterationCount:"infinite",animationTimingFunction:"linear",backgroundColor:"currentColor",borderRadius:"$round","&:nth-child(1)":{animationDelay:"-300ms"},"&:nth-child(2)":{animationDelay:"-150ms"},"&:nth-child(3)":{animationDelay:0},variants:{size:{sm:{size:"4px",mx:"2px"},md:{size:"6px",mx:"2px"},lg:{size:"8px",mx:"3px"}}}}),p=({css:n={},message:a="Loading",size:i="md",...o})=>e.createElement(r,{css:{justifyContent:"center",...n},role:"alert",...o},e.createElement(m.Root,null,a),e.createElement(t,{size:i}),e.createElement(t,{size:i}),e.createElement(t,{size:i}));export{p as Loader};
 //# sourceMappingURL=Loader.js.map

package/dist/components/loader/Loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.js","sources":["../../../src/components/loader/Loader.tsx"],"sourcesContent":["import * as VisuallyHidden from '@radix-ui/react-visually-hidden'\nimport * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { CSS, keyframes, styled } from '~/stitches'\n\nconst FadeInOut = keyframes({\n  '0%': { opacity: 0 },\n  '30%': { opacity: 1 },\n  '50%': { opacity: 1 },\n  '80%': { opacity: 0 },\n  '100%': { opacity: 0 }\n})\n\nconst Dot = styled('div', {\n  animationName: `${FadeInOut}`,\n  animationDuration: '1s',\n  animationFillMode: 'both',\n  animationIterationCount: 'infinite',\n  animationTimingFunction: 'linear',\n  backgroundColor: 'currentColor',\n  borderRadius: '$round',\n  '&:nth-child(1)': {\n    animationDelay: '-300ms'\n  },\n  '&:nth-child(2)': {\n    animationDelay: '-150ms'\n  },\n  '&:nth-child(3)': {\n    animationDelay: 0\n  },\n\n  variants: {\n    size: {\n      sm: { size: '4px', mx: '2px' },\n      md: { size: '6px', mx: '2px' },\n      lg: { size: '8px', mx: '3px' }\n    }\n  }\n})\n\ntype LoaderProps = {\n  message?: string\n  size?: 'sm' | 'md' | 'lg'\n  css?: CSS\n}\n\nexport const Loader = ({\n  css = {},\n  message = 'Loading',\n  size = 'md',\n  ...props\n}: LoaderProps) => (\n  <Flex\n    css={{\n      justifyContent: 'center',\n      // Stitches doesn't recognise CSS as the right type here. The Modulz team doesn't know why.\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      ...(css as any)\n    }}\n    role=\"alert\"\n    {...props}\n  >\n    <VisuallyHidden.Root>{message}</VisuallyHidden.Root>\n    <Dot size={size} />\n    <Dot size={size} />\n    <Dot size={size} />\n  </Flex>\n)\n"],"names":["FadeInOut","keyframes","Dot","styled","Loader","css","message","size","props","React","Flex","VisuallyHidden"],"mappings":"2KAMA,MAAMA,EAAYC,EAAU,CAC1B,KAAM,CAAE,QAAS,CAAE,EACnB,MAAO,CAAE,QAAS,CAAE,EACpB,MAAO,CAAE,QAAS,CAAE,EACpB,MAAO,CAAE,QAAS,CAAE,EACpB,OAAQ,CAAE,QAAS,CAAE,CACvB,CAAC,EAEKC,EAAMC,EAAO,MAAO,CACxB,cAAe,GAAGH,IAClB,kBAAmB,KACnB,kBAAmB,OACnB,wBAAyB,WACzB,wBAAyB,SACzB,gBAAiB,eACjB,aAAc,SACd,iBAAkB,CAChB,eAAgB,QAClB,EACA,iBAAkB,CAChB,eAAgB,QAClB,EACA,iBAAkB,CAChB,eAAgB,CAClB,EAEA,SAAU,CACR,KAAM,CACJ,GAAI,CAAE,KAAM,MAAO,GAAI,KAAM,EAC7B,GAAI,CAAE,KAAM,MAAO,GAAI,KAAM,EAC7B,GAAI,CAAE,KAAM,MAAO,GAAI,KAAM,CAC/B,CACF,CACF,CAAC,EAQYI,EAAS,CAAC,CACrB,IAAAC,EAAM,CAAA,EACN,QAAAC,EAAU,UACV,KAAAC,EAAO,QACJC,CACL,IACEC,EAAA,cAACC,EAAA,CACC,IAAK,CACH,eAAgB,SAGhB,GAAIL,CACN,EACA,KAAK,QACJ,GAAGG,CAEJC,EAAAA,EAAA,cAACE,EAAe,KAAf,KAAqBL,CAAQ,EAC9BG,EAAA,cAACP,EAAA,CAAI,KAAMK,EAAM,EACjBE,EAAA,cAACP,EAAA,CAAI,KAAMK,CAAAA,CAAM,EACjBE,EAAA,cAACP,EAAA,CAAI,KAAMK,EAAM,CACnB"}
+{"version":3,"file":"Loader.js","sources":["../../../src/components/loader/Loader.tsx"],"sourcesContent":["import * as VisuallyHidden from '@radix-ui/react-visually-hidden'\nimport * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { CSS, keyframes, styled } from '~/stitches'\n\nconst FadeInOut = keyframes({\n  '0%': { opacity: 0 },\n  '30%': { opacity: 1 },\n  '50%': { opacity: 1 },\n  '80%': { opacity: 0 },\n  '100%': { opacity: 0 }\n})\n\nconst Dot = styled('div', {\n  animationName: `${FadeInOut}`,\n  animationDuration: '1000ms',\n  animationFillMode: 'both',\n  animationIterationCount: 'infinite',\n  animationTimingFunction: 'linear',\n  backgroundColor: 'currentColor',\n  borderRadius: '$round',\n  '&:nth-child(1)': {\n    animationDelay: '-300ms'\n  },\n  '&:nth-child(2)': {\n    animationDelay: '-150ms'\n  },\n  '&:nth-child(3)': {\n    animationDelay: 0\n  },\n\n  variants: {\n    size: {\n      sm: { size: '4px', mx: '2px' },\n      md: { size: '6px', mx: '2px' },\n      lg: { size: '8px', mx: '3px' }\n    }\n  }\n})\n\ntype LoaderProps = {\n  message?: string\n  size?: 'sm' | 'md' | 'lg'\n  css?: CSS\n}\n\nexport const Loader = ({\n  css = {},\n  message = 'Loading',\n  size = 'md',\n  ...props\n}: LoaderProps) => (\n  <Flex\n    css={{\n      justifyContent: 'center',\n      ...css\n    }}\n    role=\"alert\"\n    {...props}\n  >\n    <VisuallyHidden.Root>{message}</VisuallyHidden.Root>\n    <Dot size={size} />\n    <Dot size={size} />\n    <Dot size={size} />\n  </Flex>\n)\n"],"names":["FadeInOut","keyframes","Dot","styled","Loader","css","message","size","props","React","Flex","VisuallyHidden"],"mappings":"2KAMA,MAAMA,EAAYC,EAAU,CAC1B,KAAM,CAAE,QAAS,CAAE,EACnB,MAAO,CAAE,QAAS,CAAE,EACpB,MAAO,CAAE,QAAS,CAAE,EACpB,MAAO,CAAE,QAAS,CAAE,EACpB,OAAQ,CAAE,QAAS,CAAE,CACvB,CAAC,EAEKC,EAAMC,EAAO,MAAO,CACxB,cAAe,GAAGH,IAClB,kBAAmB,SACnB,kBAAmB,OACnB,wBAAyB,WACzB,wBAAyB,SACzB,gBAAiB,eACjB,aAAc,SACd,iBAAkB,CAChB,eAAgB,QAClB,EACA,iBAAkB,CAChB,eAAgB,QAClB,EACA,iBAAkB,CAChB,eAAgB,CAClB,EAEA,SAAU,CACR,KAAM,CACJ,GAAI,CAAE,KAAM,MAAO,GAAI,KAAM,EAC7B,GAAI,CAAE,KAAM,MAAO,GAAI,KAAM,EAC7B,GAAI,CAAE,KAAM,MAAO,GAAI,KAAM,CAC/B,CACF,CACF,CAAC,EAQYI,EAAS,CAAC,CACrB,IAAAC,EAAM,CAAA,EACN,QAAAC,EAAU,UACV,KAAAC,EAAO,QACJC,CACL,IACEC,EAAA,cAACC,EAAA,CACC,IAAK,CACH,eAAgB,SAChB,GAAGL,CACL,EACA,KAAK,QACJ,GAAGG,CAEJC,EAAAA,EAAA,cAACE,EAAe,KAAf,KAAqBL,CAAQ,EAC9BG,EAAA,cAACP,EAAA,CAAI,KAAMK,EAAM,EACjBE,EAAA,cAACP,EAAA,CAAI,KAAMK,CAAAA,CAAM,EACjBE,EAAA,cAACP,EAAA,CAAI,KAAMK,EAAM,CACnB"}

package/dist/components/markdown-content/MarkdownContent.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 type HandleNode = (node: any) => JSX.Element | null;
 declare const StyledMarkdownContent: import("@atom-learning/stitches-react/types/styled-component").StyledComponent<import("@atom-learning/stitches-react/types/styled-component").StyledComponent<"div", {
-    direction?: "inherit" | "initial" | "revert" | "unset" | "row" | "column" | "column-reverse" | "row-reverse" | "revert-layer" | undefined;
-    wrap?: "inherit" | "initial" | "revert" | "unset" | "wrap" | "nowrap" | "wrap-reverse" | "revert-layer" | undefined;
-    justify?: "left" | "right" | "center" | "stretch" | "inherit" | "initial" | "revert" | "unset" | "end" | "start" | "space-around" | "space-between" | "space-evenly" | "flex-end" | "flex-start" | "normal" | "revert-layer" | "unsafe" | "safe" | undefined;
-    align?: "center" | "stretch" | "inherit" | "initial" | "revert" | "unset" | "end" | "start" | "flex-end" | "flex-start" | "baseline" | "normal" | "self-end" | "self-start" | "revert-layer" | "unsafe" | "safe" | "first baseline" | "last baseline" | undefined;
+    direction?: "inherit" | "initial" | "revert" | "unset" | "row" | "row-reverse" | "column" | "column-reverse" | "revert-layer" | undefined;
+    wrap?: "inherit" | "initial" | "revert" | "unset" | "revert-layer" | "wrap" | "nowrap" | "wrap-reverse" | undefined;
+    justify?: "left" | "right" | "center" | "stretch" | "inherit" | "initial" | "revert" | "unset" | "revert-layer" | "normal" | "unsafe" | "safe" | "start" | "end" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly" | undefined;
+    align?: "center" | "stretch" | "inherit" | "initial" | "revert" | "unset" | "revert-layer" | "normal" | "unsafe" | "safe" | "start" | "end" | "flex-start" | "flex-end" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline" | undefined;
     gap?: number | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "24" | undefined;
 }, {
     sm: string;

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"MarkdownContent.js","sources":["../../../src/components/markdown-content/MarkdownContent.tsx"],"sourcesContent":["import directive from 'mdast-util-directive'\nimport fromMarkdown from 'mdast-util-from-markdown'\nimport syntax from 'micromark-extension-directive'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Flex } from '../flex/Flex'\nimport { StyledHeading } from '../heading/Heading'\nimport { StyledList } from '../list/List'\nimport { StyledText } from '../text'\nimport {\n  MarkdownCode,\n  MarkdownEmphasis,\n  MarkdownHeading,\n  MarkdownImage,\n  MarkdownInlineCode,\n  MarkdownLink,\n  MarkdownList,\n  MarkdownListItem,\n  MarkdownParagraph,\n  MarkdownStrong,\n  MarkdownText,\n  MarkdownThematicBreak\n} from './components'\n\ntype HandleNode = (node) => JSX.Element | null\n\nconst StyledMarkdownContent = styled(Flex, {\n  [`& > ${StyledHeading}`]: {\n    maxWidth: '65ch'\n  },\n  [`& > ${StyledText}`]: {\n    maxWidth: '75ch'\n  },\n  [`& > ${StyledList}`]: {\n    maxWidth: '75ch'\n  }\n})\n\ntype MarkdownContentProps = React.ComponentProps<\n  typeof StyledMarkdownContent\n> & {\n  content: string\n  customComponents?: {\n    [key: string]: (props: { node: any; handleNode: HandleNode }) => JSX.Element\n  }\n}\n\nconst defaultComponentsMap = {\n  code: MarkdownCode,\n  emphasis: MarkdownEmphasis,\n  heading: MarkdownHeading,\n  inlineCode: MarkdownInlineCode,\n  image: MarkdownImage,\n  link: MarkdownLink,\n  list: MarkdownList,\n  listItem: MarkdownListItem,\n  paragraph: MarkdownParagraph,\n  strong: MarkdownStrong,\n  text: MarkdownText,\n  thematicBreak: MarkdownThematicBreak\n}\n\nconst generateNodeKey = (node) => {\n  if (node.position?.start) {\n    const { line, column, offset } = node.position?.start\n    return `${node.type}${line}${column}${offset}`\n  }\n\n  return `${node.type}${+new Date()}`\n}\n\nexport const MarkdownContent = ({\n  content,\n  customComponents = {},\n  css\n}: MarkdownContentProps) => {\n  const AST = fromMarkdown(content, {\n    extensions: [syntax()],\n    mdastExtensions: [directive.fromMarkdown]\n  })\n\n  const componentsMap = {\n    ...defaultComponentsMap,\n    ...customComponents\n  }\n\n  const handleNode: HandleNode = (node) => {\n    const MarkdownComponent = componentsMap[node.type]\n\n    return MarkdownComponent ? (\n      <MarkdownComponent\n        key={generateNodeKey(node)}\n        node={node}\n        handleNode={handleNode}\n      />\n    ) : null\n  }\n\n  return (\n    <StyledMarkdownContent direction=\"column\" gap={5} css={css}>\n      {AST.children.map(handleNode)}\n    </StyledMarkdownContent>\n  )\n}\n\nMarkdownContent.displayName = 'MarkdownContent'\n"],"names":["StyledMarkdownContent","styled","Flex","StyledHeading","StyledText","StyledList","defaultComponentsMap","MarkdownCode","MarkdownEmphasis","MarkdownHeading","MarkdownInlineCode","MarkdownImage","MarkdownLink","MarkdownList","MarkdownListItem","MarkdownParagraph","MarkdownStrong","MarkdownText","MarkdownThematicBreak","generateNodeKey","node","_a","_b","line","column","offset","MarkdownContent","content","customComponents","css","AST","fromMarkdown","syntax","directive","componentsMap","handleNode","MarkdownComponent","React"],"mappings":"uoCA4BA,MAAMA,EAAwBC,EAAOC,EAAM,CACzC,CAAC,OAAOC,KAAkB,CACxB,SAAU,MACZ,EACA,CAAC,OAAOC,KAAe,CACrB,SAAU,MACZ,EACA,CAAC,OAAOC,KAAe,CACrB,SAAU,MACZ,CACF,CAAC,EAWKC,EAAuB,CAC3B,KAAMC,EACN,SAAUC,EACV,QAASC,EACT,WAAYC,EACZ,MAAOC,EACP,KAAMC,EACN,KAAMC,EACN,SAAUC,EACV,UAAWC,EACX,OAAQC,EACR,KAAMC,EACN,cAAeC,CACjB,EAEMC,EAAmBC,GAAS,CAhElC,IAAAC,EAAAC,EAiEE,IAAID,EAAAD,EAAK,WAAL,MAAAC,EAAe,MAAO,CACxB,KAAM,CAAE,KAAAE,EAAM,OAAAC,EAAQ,OAAAC,CAAO,GAAIH,EAAAF,EAAK,WAAL,KAAA,OAAAE,EAAe,MAChD,MAAO,GAAGF,EAAK,OAAOG,IAAOC,IAASC,GACxC,CAEA,MAAO,GAAGL,EAAK,OAAO,CAAC,IAAI,MAC7B,EAEaM,EAAkB,CAAC,CAC9B,QAAAC,EACA,iBAAAC,EAAmB,CACnB,EAAA,IAAAC,CACF,IAA4B,CAC1B,MAAMC,EAAMC,EAAaJ,EAAS,CAChC,WAAY,CAACK,EAAO,CAAC,EACrB,gBAAiB,CAACC,EAAU,YAAY,CAC1C,CAAC,EAEKC,EAAgB,CACpB,GAAG5B,EACH,GAAGsB,CACL,EAEMO,EAA0Bf,GAAS,CACvC,MAAMgB,EAAoBF,EAAcd,EAAK,MAE7C,OAAOgB,EACLC,EAAA,cAACD,EAAA,CACC,IAAKjB,EAAgBC,CAAI,EACzB,KAAMA,EACN,WAAYe,CAAAA,CACd,EACE,IACN,EAEA,OACEE,EAAA,cAACrC,EAAA,CAAsB,UAAU,SAAS,IAAK,EAAG,IAAK6B,CAAAA,EACpDC,EAAI,SAAS,IAAIK,CAAU,CAC9B,CAEJ,EAEAT,EAAgB,YAAc"}
+{"version":3,"file":"MarkdownContent.js","sources":["../../../src/components/markdown-content/MarkdownContent.tsx"],"sourcesContent":["import directive from 'mdast-util-directive'\nimport fromMarkdown from 'mdast-util-from-markdown'\nimport syntax from 'micromark-extension-directive'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nimport { Flex } from '../flex/Flex'\nimport {\n  MarkdownCode,\n  MarkdownEmphasis,\n  MarkdownHeading,\n  MarkdownImage,\n  MarkdownInlineCode,\n  MarkdownLink,\n  MarkdownList,\n  MarkdownListItem,\n  MarkdownParagraph,\n  MarkdownStrong,\n  MarkdownText,\n  MarkdownThematicBreak\n} from './components'\n\ntype HandleNode = (node) => JSX.Element | null\n\nconst StyledMarkdownContent = styled(Flex, {\n  '& > h1, & > h2, & > h3, & > h4': { maxWidth: '65ch' },\n  '& > p': { maxWidth: '75ch' },\n  '& > ul': { maxWidth: '75ch' }\n})\n\ntype MarkdownContentProps = React.ComponentProps<\n  typeof StyledMarkdownContent\n> & {\n  content: string\n  customComponents?: {\n    [key: string]: (props: { node: any; handleNode: HandleNode }) => JSX.Element\n  }\n}\n\nconst defaultComponentsMap = {\n  code: MarkdownCode,\n  emphasis: MarkdownEmphasis,\n  heading: MarkdownHeading,\n  inlineCode: MarkdownInlineCode,\n  image: MarkdownImage,\n  link: MarkdownLink,\n  list: MarkdownList,\n  listItem: MarkdownListItem,\n  paragraph: MarkdownParagraph,\n  strong: MarkdownStrong,\n  text: MarkdownText,\n  thematicBreak: MarkdownThematicBreak\n}\n\nconst generateNodeKey = (node) => {\n  if (node.position?.start) {\n    const { line, column, offset } = node.position?.start\n    return `${node.type}${line}${column}${offset}`\n  }\n\n  return `${node.type}${+new Date()}`\n}\n\nexport const MarkdownContent = ({\n  content,\n  customComponents = {},\n  css\n}: MarkdownContentProps) => {\n  const AST = fromMarkdown(content, {\n    extensions: [syntax()],\n    mdastExtensions: [directive.fromMarkdown]\n  })\n\n  const componentsMap = {\n    ...defaultComponentsMap,\n    ...customComponents\n  }\n\n  const handleNode: HandleNode = (node) => {\n    const MarkdownComponent = componentsMap[node.type]\n\n    return MarkdownComponent ? (\n      <MarkdownComponent\n        key={generateNodeKey(node)}\n        node={node}\n        handleNode={handleNode}\n      />\n    ) : null\n  }\n\n  return (\n    <StyledMarkdownContent direction=\"column\" gap={5} css={css}>\n      {AST.children.map(handleNode)}\n    </StyledMarkdownContent>\n  )\n}\n\nMarkdownContent.displayName = 'MarkdownContent'\n"],"names":["StyledMarkdownContent","styled","Flex","defaultComponentsMap","MarkdownCode","MarkdownEmphasis","MarkdownHeading","MarkdownInlineCode","MarkdownImage","MarkdownLink","MarkdownList","MarkdownListItem","MarkdownParagraph","MarkdownStrong","MarkdownText","MarkdownThematicBreak","generateNodeKey","node","_a","_b","line","column","offset","MarkdownContent","content","customComponents","css","AST","fromMarkdown","syntax","directive","componentsMap","handleNode","MarkdownComponent","React"],"mappings":"u/BAyBA,MAAMA,EAAwBC,EAAOC,EAAM,CACzC,iCAAkC,CAAE,SAAU,MAAO,EACrD,QAAS,CAAE,SAAU,MAAO,EAC5B,SAAU,CAAE,SAAU,MAAO,CAC/B,CAAC,EAWKC,EAAuB,CAC3B,KAAMC,EACN,SAAUC,EACV,QAASC,EACT,WAAYC,EACZ,MAAOC,EACP,KAAMC,EACN,KAAMC,EACN,SAAUC,EACV,UAAWC,EACX,OAAQC,EACR,KAAMC,EACN,cAAeC,CACjB,EAEMC,EAAmBC,GAAS,CAvDlC,IAAAC,EAAAC,EAwDE,IAAID,EAAAD,EAAK,WAAL,MAAAC,EAAe,MAAO,CACxB,KAAM,CAAE,KAAAE,EAAM,OAAAC,EAAQ,OAAAC,CAAO,GAAIH,EAAAF,EAAK,WAAL,KAAAE,OAAAA,EAAe,MAChD,MAAO,GAAGF,EAAK,OAAOG,IAAOC,IAASC,GACxC,CAEA,MAAO,GAAGL,EAAK,OAAO,CAAC,IAAI,MAC7B,EAEaM,EAAkB,CAAC,CAC9B,QAAAC,EACA,iBAAAC,EAAmB,CACnB,EAAA,IAAAC,CACF,IAA4B,CAC1B,MAAMC,EAAMC,EAAaJ,EAAS,CAChC,WAAY,CAACK,EAAO,CAAC,EACrB,gBAAiB,CAACC,EAAU,YAAY,CAC1C,CAAC,EAEKC,EAAgB,CACpB,GAAG5B,EACH,GAAGsB,CACL,EAEMO,EAA0Bf,GAAS,CACvC,MAAMgB,EAAoBF,EAAcd,EAAK,MAE7C,OAAOgB,EACLC,EAAA,cAACD,EAAA,CACC,IAAKjB,EAAgBC,CAAI,EACzB,KAAMA,EACN,WAAYe,CAAAA,CACd,EACE,IACN,EAEA,OACEE,EAAA,cAAClC,EAAA,CAAsB,UAAU,SAAS,IAAK,EAAG,IAAK0B,CAAAA,EACpDC,EAAI,SAAS,IAAIK,CAAU,CAC9B,CAEJ,EAEAT,EAAgB,YAAc"}

package/dist/components/markdown-content/components/MarkdownList.d.ts

@@ -1,6 +1,6 @@
 import type { Content, List as ListType } from 'mdast';
 import * as React from 'react';
-import { CSS } from '../../../stitches';
+import { type CSS } from '../../../stitches';
 type MarkdownListProps = {
     node: ListType;
     handleNode: (node: Content) => React.ReactElement;

package/dist/components/markdown-content/components/MarkdownList.js.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownList.js","sources":["../../../../src/components/markdown-content/components/MarkdownList.tsx"],"sourcesContent":["import type { Content, List as ListType } from 'mdast'\nimport * as React from 'react'\n\nimport { CSS } from '~/stitches'\n\nimport { List } from '../../list'\n\ntype MarkdownListProps = {\n  node: ListType\n  handleNode: (node: Content) => React.ReactElement\n  css?: CSS\n}\n\nexport const MarkdownList = ({ node, handleNode, css }: MarkdownListProps) => (\n  <List\n    css={\n      {\n        '& p': { display: 'inline' },\n        '& p:before, & p:after': { display: 'none' },\n        ...css\n      } as CSS\n    }\n    ordered={node.ordered || undefined}\n  >\n    {node.children?.map(handleNode)}\n  </List>\n)\n"],"names":["MarkdownList","node","handleNode","css","_a","React","List"],"mappings":"kEAaO,MAAMA,EAAe,CAAC,CAAE,KAAAC,EAAM,WAAAC,EAAY,IAAAC,CAAI,IAAsB,CAb3E,IAAAC,EAcE,OAAAC,EAAA,cAACC,EAAA,CACC,IACE,CACE,MAAO,CAAE,QAAS,QAAS,EAC3B,wBAAyB,CAAE,QAAS,MAAO,EAC3C,GAAGH,CACL,EAEF,QAASF,EAAK,SAAW,MAExBG,GAAAA,EAAAH,EAAK,WAAL,KAAA,OAAAG,EAAe,IAAIF,CACtB,CAAA,CAAA"}
+{"version":3,"file":"MarkdownList.js","sources":["../../../../src/components/markdown-content/components/MarkdownList.tsx"],"sourcesContent":["import type { Content, List as ListType } from 'mdast'\nimport * as React from 'react'\n\nimport { type CSS } from '~/stitches'\n\nimport { List } from '../../list'\n\ntype MarkdownListProps = {\n  node: ListType\n  handleNode: (node: Content) => React.ReactElement\n  css?: CSS\n}\n\nexport const MarkdownList = ({ node, handleNode, css }: MarkdownListProps) => (\n  <List\n    css={{\n      '& p': { display: 'inline' },\n      '& p:before, & p:after': { display: 'none' },\n      ...css\n    }}\n    ordered={node.ordered || undefined}\n  >\n    {node.children?.map(handleNode)}\n  </List>\n)\n"],"names":["MarkdownList","node","handleNode","css","_a","React","List"],"mappings":"kEAaO,MAAMA,EAAe,CAAC,CAAE,KAAAC,EAAM,WAAAC,EAAY,IAAAC,CAAI,IAAsB,CAb3E,IAAAC,EAcE,OAAAC,EAAA,cAACC,EAAA,CACC,IAAK,CACH,MAAO,CAAE,QAAS,QAAS,EAC3B,wBAAyB,CAAE,QAAS,MAAO,EAC3C,GAAGH,CACL,EACA,QAASF,EAAK,SAAW,MAExBG,GAAAA,EAAAH,EAAK,WAAL,KAAA,OAAAG,EAAe,IAAIF,CACtB,CAAA,CAAA"}

package/dist/components/navigation/NavigationMenu.js

@@ -1,2 +1,2 @@
-import*as s from"@radix-ui/react-navigation-menu";import t from"react";import{MAX_Z_INDEX as M}from"../../constants/zIndices.js";import{keyframes as h,styled as o}from"../../stitches.js";import{fadeOut as D}from"../../utilities/style/keyframe-animations.js";import{NavigationMenuContext as E}from"./NavigationMenuContext.js";import{NavigationMenuDropdown as x}from"./NavigationMenuDropdown.js";import{NavigationMenuDropdownContent as C}from"./NavigationMenuDropdownContent.js";import{NavigationMenuDropdownItem as I,NavigationMenuDropdownItemTitle as $}from"./NavigationMenuDropdownItem.js";import{NavigationMenuDropdownTrigger as T}from"./NavigationMenuDropdownTrigger.js";import{NavigationMenuLink as j}from"./NavigationMenuLink.js";import{colorSchemes as L}from"./stitches.navigationMenu.colorscheme.config.js";const S=h({"0%, 50%":{opacity:0},"100%":{opacity:1}}),_=o(s.Root,{display:"flex",justifyContent:"center",position:"relative"}),W=o(s.List,{all:"unset",display:"flex",justifyContent:"center",alignItems:"center",gap:"$1",listStyle:"none"}),k=o(s.Viewport,{zIndex:M}),O=o("div",{position:"absolute",left:0,top:"100%",width:"100%",display:"flex",justifyContent:"center"}),u=({children:m,css:p,...d})=>{const[l,f]=t.useState(),[n,c]=t.useState(),[r,g]=t.useState(0),i=t.useRef(null),a=200;t.useLayoutEffect(()=>{i.current&&g(i.current.offsetWidth)},[t.Children.toArray(m).length]),t.useEffect(()=>{let e;return n===""&&(e=setTimeout(()=>f(null),a)),()=>{e!==null&&clearTimeout(e)}},[n]);const v=(e,y)=>{if(e&&r&&n===y){const w=r/2,N=r-e.offsetLeft-e.offsetWidth+e.offsetWidth/2;f(Math.round(w-N))}return e};return t.createElement(E.Provider,{value:{onNodeUpdate:v}},t.createElement(_,{className:L.light,onValueChange:c,css:p,...d},t.createElement(W,{ref:i},m),t.createElement(O,null,t.createElement(k,{css:{"--navigation-menu-viewport-offset":`${l||0}px`,transform:`translateX(${l||0}px)`,'&[data-state="open"]':{animation:`${S} ${a}ms ease`},'&[data-state="closed"]':{animation:`${D} ${a}ms ease-out`}}}))))},V=Object.assign(u,{Link:j,Dropdown:x,DropdownContent:C,DropdownItem:I,DropdownItemTitle:$,DropdownTrigger:T});u.displayName="NavigationMenu";export{V as NavigationMenu};
+import*as r from"@radix-ui/react-navigation-menu";import t from"react";import{keyframes as N,styled as o}from"../../stitches.js";import{fadeOut as h}from"../../utilities/style/keyframe-animations.js";import{NavigationMenuContext as M}from"./NavigationMenuContext.js";import{NavigationMenuDropdown as D}from"./NavigationMenuDropdown.js";import{NavigationMenuDropdownContent as C}from"./NavigationMenuDropdownContent.js";import{NavigationMenuDropdownItem as E,NavigationMenuDropdownItemTitle as x}from"./NavigationMenuDropdownItem.js";import{NavigationMenuDropdownTrigger as I}from"./NavigationMenuDropdownTrigger.js";import{NavigationMenuLink as T}from"./NavigationMenuLink.js";import{colorSchemes as j}from"./stitches.navigationMenu.colorscheme.config.js";const L=N({"0%, 50%":{opacity:0},"100%":{opacity:1}}),S=o(r.Root,{display:"flex",justifyContent:"center",position:"relative"}),W=o(r.List,{all:"unset",display:"flex",justifyContent:"center",alignItems:"center",gap:"$1",listStyle:"none"}),$=o(r.Viewport,{zIndex:2147483647}),k=o("div",{position:"absolute",left:0,top:"100%",width:"100%",display:"flex",justifyContent:"center"}),m=({children:s,css:f,...u})=>{const[p,l]=t.useState(),[n,d]=t.useState(),[i,c]=t.useState(0),a=t.useRef(null);t.useLayoutEffect(()=>{a.current&&c(a.current.offsetWidth)},[t.Children.toArray(s).length]),t.useEffect(()=>{let e;return n===""&&(e=setTimeout(()=>l(null),200)),()=>{e!==null&&clearTimeout(e)}},[n]);const g=(e,v)=>{if(e&&i&&n===v){const y=i/2,w=i-e.offsetLeft-e.offsetWidth+e.offsetWidth/2;l(Math.round(y-w))}return e};return t.createElement(M.Provider,{value:{onNodeUpdate:g}},t.createElement(S,{className:j.light,onValueChange:d,css:f,...u},t.createElement(W,{ref:a},s),t.createElement(k,null,t.createElement($,{style:{"--navigation-menu-viewport-offset":`${p||0}px`},css:{transform:"translateX(var(--navigation-menu-viewport-offset))",'&[data-state="open"]':{animation:`${L} 200ms ease`},'&[data-state="closed"]':{animation:`${h} 200ms ease-out`}}}))))},V=Object.assign(m,{Link:T,Dropdown:D,DropdownContent:C,DropdownItem:E,DropdownItemTitle:x,DropdownTrigger:I});m.displayName="NavigationMenu";export{V as NavigationMenu};
 //# sourceMappingURL=NavigationMenu.js.map

package/dist/components/navigation/NavigationMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenu.js","sources":["../../../src/components/navigation/NavigationMenu.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { MAX_Z_INDEX } from '~/constants/zIndices'\nimport { keyframes, styled } from '~/stitches'\nimport { fadeOut } from '~/utilities/style/keyframe-animations'\n\nimport { NavigationMenuContext } from './NavigationMenuContext'\nimport { NavigationMenuDropdown } from './NavigationMenuDropdown'\nimport { NavigationMenuDropdownContent } from './NavigationMenuDropdownContent'\nimport {\n  NavigationMenuDropdownItem,\n  NavigationMenuDropdownItemTitle\n} from './NavigationMenuDropdownItem'\nimport { NavigationMenuDropdownTrigger } from './NavigationMenuDropdownTrigger'\nimport { NavigationMenuLink } from './NavigationMenuLink'\nimport { colorSchemes as navigationMenuColorSchemes } from './stitches.navigationMenu.colorscheme.config'\n\nconst delayedFadeIn = keyframes({\n  '0%, 50%': { opacity: 0 },\n  '100%': { opacity: 1 }\n})\n\nconst StyledMenu = styled(NavigationMenuPrimitive.Root, {\n  display: 'flex',\n  justifyContent: 'center',\n  position: 'relative'\n})\n\nconst StyledList = styled(NavigationMenuPrimitive.List, {\n  all: 'unset',\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  gap: '$1',\n  listStyle: 'none'\n})\n\nconst StyledViewport = styled(NavigationMenuPrimitive.Viewport, {\n  zIndex: MAX_Z_INDEX\n})\n\nconst ViewportPosition = styled('div', {\n  position: 'absolute',\n  left: 0,\n  top: '100%',\n  width: '100%',\n  display: 'flex',\n  justifyContent: 'center'\n})\n\nconst NavigationMenuComponent = ({\n  children,\n  css,\n  ...props\n}: React.ComponentProps<typeof StyledMenu>) => {\n  const [offset, setOffset] = React.useState<number | null | undefined>()\n  const [activeItem, setActiveItem] = React.useState<string | undefined>()\n  const [listWidth, setListWidth] = React.useState(0)\n  const listRef = React.useRef<HTMLUListElement>(null)\n  const fadeDuration = 200\n\n  React.useLayoutEffect(() => {\n    if (listRef.current) {\n      setListWidth(listRef.current.offsetWidth)\n    }\n  }, [React.Children.toArray(children).length])\n\n  React.useEffect(() => {\n    let timer: ReturnType<typeof setTimeout>\n\n    // Delay transitioning back to initial position\n    // to allow enough time for fadeOut animation to complete\n    if (activeItem === '') {\n      timer = setTimeout(() => setOffset(null), fadeDuration)\n    }\n\n    return () => {\n      if (timer !== null) {\n        clearTimeout(timer)\n      }\n    }\n  }, [activeItem])\n\n  // https://github.com/radix-ui/primitives/issues/1462\n  const onNodeUpdate = (trigger: HTMLButtonElement, itemValue: string) => {\n    if (trigger && listWidth && activeItem === itemValue) {\n      const listCenter = listWidth / 2\n\n      const triggerOffsetRight =\n        listWidth -\n        trigger.offsetLeft -\n        trigger.offsetWidth +\n        trigger.offsetWidth / 2\n\n      setOffset(Math.round(listCenter - triggerOffsetRight))\n    }\n\n    return trigger\n  }\n\n  return (\n    <NavigationMenuContext.Provider value={{ onNodeUpdate }}>\n      <StyledMenu\n        className={navigationMenuColorSchemes['light']}\n        onValueChange={setActiveItem}\n        css={css}\n        {...props}\n      >\n        <StyledList ref={listRef}>{children}</StyledList>\n        <ViewportPosition>\n          <StyledViewport\n            css={{\n              '--navigation-menu-viewport-offset': `${offset || 0}px`,\n              transform: `translateX(${offset || 0}px)`,\n              '&[data-state=\"open\"]': {\n                animation: `${delayedFadeIn} ${fadeDuration}ms ease`\n              },\n              '&[data-state=\"closed\"]': {\n                animation: `${fadeOut} ${fadeDuration}ms ease-out`\n              }\n            }}\n          />\n        </ViewportPosition>\n      </StyledMenu>\n    </NavigationMenuContext.Provider>\n  )\n}\n\nexport const NavigationMenu = Object.assign(NavigationMenuComponent, {\n  Link: NavigationMenuLink,\n  Dropdown: NavigationMenuDropdown,\n  DropdownContent: NavigationMenuDropdownContent,\n  DropdownItem: NavigationMenuDropdownItem,\n  DropdownItemTitle: NavigationMenuDropdownItemTitle,\n  DropdownTrigger: NavigationMenuDropdownTrigger\n})\n\nNavigationMenuComponent.displayName = 'NavigationMenu'\n"],"names":["delayedFadeIn","keyframes","StyledMenu","styled","NavigationMenuPrimitive","StyledList","StyledViewport","MAX_Z_INDEX","ViewportPosition","NavigationMenuComponent","children","css","props","offset","setOffset","React","activeItem","setActiveItem","listWidth","setListWidth","listRef","fadeDuration","timer","onNodeUpdate","trigger","itemValue","listCenter","triggerOffsetRight","NavigationMenuContext","navigationMenuColorSchemes","fadeOut","NavigationMenu","NavigationMenuLink","NavigationMenuDropdown","NavigationMenuDropdownContent","NavigationMenuDropdownItem","NavigationMenuDropdownItemTitle","NavigationMenuDropdownTrigger"],"mappings":"8yBAkBA,MAAMA,EAAgBC,EAAU,CAC9B,UAAW,CAAE,QAAS,CAAE,EACxB,OAAQ,CAAE,QAAS,CAAE,CACvB,CAAC,EAEKC,EAAaC,EAAOC,EAAwB,KAAM,CACtD,QAAS,OACT,eAAgB,SAChB,SAAU,UACZ,CAAC,EAEKC,EAAaF,EAAOC,EAAwB,KAAM,CACtD,IAAK,QACL,QAAS,OACT,eAAgB,SAChB,WAAY,SACZ,IAAK,KACL,UAAW,MACb,CAAC,EAEKE,EAAiBH,EAAOC,EAAwB,SAAU,CAC9D,OAAQG,CACV,CAAC,EAEKC,EAAmBL,EAAO,MAAO,CACrC,SAAU,WACV,KAAM,EACN,IAAK,OACL,MAAO,OACP,QAAS,OACT,eAAgB,QAClB,CAAC,EAEKM,EAA0B,CAAC,CAC/B,SAAAC,EACA,IAAAC,KACGC,CACL,IAA+C,CAC7C,KAAM,CAACC,EAAQC,CAAS,EAAIC,EAAM,WAC5B,CAACC,EAAYC,CAAa,EAAIF,EAAM,SAA6B,EACjE,CAACG,EAAWC,CAAY,EAAIJ,EAAM,SAAS,CAAC,EAC5CK,EAAUL,EAAM,OAAyB,IAAI,EAC7CM,EAAe,IAErBN,EAAM,gBAAgB,IAAM,CACtBK,EAAQ,SACVD,EAAaC,EAAQ,QAAQ,WAAW,CAE5C,EAAG,CAACL,EAAM,SAAS,QAAQL,CAAQ,EAAE,MAAM,CAAC,EAE5CK,EAAM,UAAU,IAAM,CACpB,IAAIO,EAIJ,OAAIN,IAAe,KACjBM,EAAQ,WAAW,IAAMR,EAAU,IAAI,EAAGO,CAAY,GAGjD,IAAM,CACPC,IAAU,MACZ,aAAaA,CAAK,CAEtB,CACF,EAAG,CAACN,CAAU,CAAC,EAGf,MAAMO,EAAe,CAACC,EAA4BC,IAAsB,CACtE,GAAID,GAAWN,GAAaF,IAAeS,EAAW,CACpD,MAAMC,EAAaR,EAAY,EAEzBS,EACJT,EACAM,EAAQ,WACRA,EAAQ,YACRA,EAAQ,YAAc,EAExBV,EAAU,KAAK,MAAMY,EAAaC,CAAkB,CAAC,CACvD,CAEA,OAAOH,CACT,EAEA,OACET,EAAA,cAACa,EAAsB,SAAtB,CAA+B,MAAO,CAAE,aAAAL,CAAa,CAAA,EACpDR,EAAA,cAACb,EAAA,CACC,UAAW2B,EAA2B,MACtC,cAAeZ,EACf,IAAKN,EACJ,GAAGC,CAAAA,EAEJG,EAAA,cAACV,EAAA,CAAW,IAAKe,GAAUV,CAAS,EACpCK,EAAA,cAACP,EAAA,KACCO,EAAA,cAACT,EAAA,CACC,IAAK,CACH,oCAAqC,GAAGO,GAAU,MAClD,UAAW,cAAcA,GAAU,OACnC,uBAAwB,CACtB,UAAW,GAAGb,KAAiBqB,UACjC,EACA,yBAA0B,CACxB,UAAW,GAAGS,KAAWT,cAC3B,CACF,CAAA,CACF,CACF,CACF,CACF,CAEJ,EAEaU,EAAiB,OAAO,OAAOtB,EAAyB,CACnE,KAAMuB,EACN,SAAUC,EACV,gBAAiBC,EACjB,aAAcC,EACd,kBAAmBC,EACnB,gBAAiBC,CACnB,CAAC,EAED5B,EAAwB,YAAc"}
+{"version":3,"file":"NavigationMenu.js","sources":["../../../src/components/navigation/NavigationMenu.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { keyframes, styled } from '~/stitches'\nimport { fadeOut } from '~/utilities/style/keyframe-animations'\n\nimport { NavigationMenuContext } from './NavigationMenuContext'\nimport { NavigationMenuDropdown } from './NavigationMenuDropdown'\nimport { NavigationMenuDropdownContent } from './NavigationMenuDropdownContent'\nimport {\n  NavigationMenuDropdownItem,\n  NavigationMenuDropdownItemTitle\n} from './NavigationMenuDropdownItem'\nimport { NavigationMenuDropdownTrigger } from './NavigationMenuDropdownTrigger'\nimport { NavigationMenuLink } from './NavigationMenuLink'\nimport { colorSchemes as navigationMenuColorSchemes } from './stitches.navigationMenu.colorscheme.config'\n\nconst delayedFadeIn = keyframes({\n  '0%, 50%': { opacity: 0 },\n  '100%': { opacity: 1 }\n})\n\nconst StyledMenu = styled(NavigationMenuPrimitive.Root, {\n  display: 'flex',\n  justifyContent: 'center',\n  position: 'relative'\n})\n\nconst StyledList = styled(NavigationMenuPrimitive.List, {\n  all: 'unset',\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  gap: '$1',\n  listStyle: 'none'\n})\n\nconst StyledViewport = styled(NavigationMenuPrimitive.Viewport, {\n  zIndex: 2147483647\n})\n\nconst ViewportPosition = styled('div', {\n  position: 'absolute',\n  left: 0,\n  top: '100%',\n  width: '100%',\n  display: 'flex',\n  justifyContent: 'center'\n})\n\nconst NavigationMenuComponent = ({\n  children,\n  css,\n  ...props\n}: React.ComponentProps<typeof StyledMenu>) => {\n  const [offset, setOffset] = React.useState<number | null | undefined>()\n  const [activeItem, setActiveItem] = React.useState<string | undefined>()\n  const [listWidth, setListWidth] = React.useState(0)\n  const listRef = React.useRef<HTMLUListElement>(null)\n\n  React.useLayoutEffect(() => {\n    if (listRef.current) {\n      setListWidth(listRef.current.offsetWidth)\n    }\n  }, [React.Children.toArray(children).length])\n\n  React.useEffect(() => {\n    let timer: ReturnType<typeof setTimeout>\n\n    // Delay transitioning back to initial position\n    // to allow enough time for fadeOut animation to complete\n    if (activeItem === '') {\n      timer = setTimeout(() => setOffset(null), 200)\n    }\n\n    return () => {\n      if (timer !== null) {\n        clearTimeout(timer)\n      }\n    }\n  }, [activeItem])\n\n  // https://github.com/radix-ui/primitives/issues/1462\n  const onNodeUpdate = (trigger: HTMLButtonElement, itemValue: string) => {\n    if (trigger && listWidth && activeItem === itemValue) {\n      const listCenter = listWidth / 2\n\n      const triggerOffsetRight =\n        listWidth -\n        trigger.offsetLeft -\n        trigger.offsetWidth +\n        trigger.offsetWidth / 2\n\n      setOffset(Math.round(listCenter - triggerOffsetRight))\n    }\n\n    return trigger\n  }\n\n  return (\n    <NavigationMenuContext.Provider value={{ onNodeUpdate }}>\n      <StyledMenu\n        className={navigationMenuColorSchemes['light']}\n        onValueChange={setActiveItem}\n        css={css}\n        {...props}\n      >\n        <StyledList ref={listRef}>{children}</StyledList>\n        <ViewportPosition>\n          <StyledViewport\n            style={{ '--navigation-menu-viewport-offset': `${offset || 0}px` }}\n            css={{\n              transform: `translateX(var(--navigation-menu-viewport-offset))`,\n              '&[data-state=\"open\"]': {\n                animation: `${delayedFadeIn} 200ms ease`\n              },\n              '&[data-state=\"closed\"]': {\n                animation: `${fadeOut} 200ms ease-out`\n              }\n            }}\n          />\n        </ViewportPosition>\n      </StyledMenu>\n    </NavigationMenuContext.Provider>\n  )\n}\n\nexport const NavigationMenu = Object.assign(NavigationMenuComponent, {\n  Link: NavigationMenuLink,\n  Dropdown: NavigationMenuDropdown,\n  DropdownContent: NavigationMenuDropdownContent,\n  DropdownItem: NavigationMenuDropdownItem,\n  DropdownItemTitle: NavigationMenuDropdownItemTitle,\n  DropdownTrigger: NavigationMenuDropdownTrigger\n})\n\nNavigationMenuComponent.displayName = 'NavigationMenu'\n"],"names":["delayedFadeIn","keyframes","StyledMenu","styled","NavigationMenuPrimitive","StyledList","StyledViewport","ViewportPosition","NavigationMenuComponent","children","css","props","offset","setOffset","React","activeItem","setActiveItem","listWidth","setListWidth","listRef","timer","onNodeUpdate","trigger","itemValue","listCenter","triggerOffsetRight","NavigationMenuContext","navigationMenuColorSchemes","fadeOut","NavigationMenu","NavigationMenuLink","NavigationMenuDropdown","NavigationMenuDropdownContent","NavigationMenuDropdownItem","NavigationMenuDropdownItemTitle","NavigationMenuDropdownTrigger"],"mappings":"ovBAiBA,MAAMA,EAAgBC,EAAU,CAC9B,UAAW,CAAE,QAAS,CAAE,EACxB,OAAQ,CAAE,QAAS,CAAE,CACvB,CAAC,EAEKC,EAAaC,EAAOC,EAAwB,KAAM,CACtD,QAAS,OACT,eAAgB,SAChB,SAAU,UACZ,CAAC,EAEKC,EAAaF,EAAOC,EAAwB,KAAM,CACtD,IAAK,QACL,QAAS,OACT,eAAgB,SAChB,WAAY,SACZ,IAAK,KACL,UAAW,MACb,CAAC,EAEKE,EAAiBH,EAAOC,EAAwB,SAAU,CAC9D,OAAQ,UACV,CAAC,EAEKG,EAAmBJ,EAAO,MAAO,CACrC,SAAU,WACV,KAAM,EACN,IAAK,OACL,MAAO,OACP,QAAS,OACT,eAAgB,QAClB,CAAC,EAEKK,EAA0B,CAAC,CAC/B,SAAAC,EACA,IAAAC,KACGC,CACL,IAA+C,CAC7C,KAAM,CAACC,EAAQC,CAAS,EAAIC,EAAM,SAC5B,EAAA,CAACC,EAAYC,CAAa,EAAIF,EAAM,SAA6B,EACjE,CAACG,EAAWC,CAAY,EAAIJ,EAAM,SAAS,CAAC,EAC5CK,EAAUL,EAAM,OAAyB,IAAI,EAEnDA,EAAM,gBAAgB,IAAM,CACtBK,EAAQ,SACVD,EAAaC,EAAQ,QAAQ,WAAW,CAE5C,EAAG,CAACL,EAAM,SAAS,QAAQL,CAAQ,EAAE,MAAM,CAAC,EAE5CK,EAAM,UAAU,IAAM,CACpB,IAAIM,EAIJ,OAAIL,IAAe,KACjBK,EAAQ,WAAW,IAAMP,EAAU,IAAI,EAAG,GAAG,GAGxC,IAAM,CACPO,IAAU,MACZ,aAAaA,CAAK,CAEtB,CACF,EAAG,CAACL,CAAU,CAAC,EAGf,MAAMM,EAAe,CAACC,EAA4BC,IAAsB,CACtE,GAAID,GAAWL,GAAaF,IAAeQ,EAAW,CACpD,MAAMC,EAAaP,EAAY,EAEzBQ,EACJR,EACAK,EAAQ,WACRA,EAAQ,YACRA,EAAQ,YAAc,EAExBT,EAAU,KAAK,MAAMW,EAAaC,CAAkB,CAAC,CACvD,CAEA,OAAOH,CACT,EAEA,OACER,EAAA,cAACY,EAAsB,SAAtB,CAA+B,MAAO,CAAE,aAAAL,CAAa,CACpDP,EAAAA,EAAA,cAACZ,EAAA,CACC,UAAWyB,EAA2B,MACtC,cAAeX,EACf,IAAKN,EACJ,GAAGC,CAEJG,EAAAA,EAAA,cAACT,EAAA,CAAW,IAAKc,CAAAA,EAAUV,CAAS,EACpCK,EAAA,cAACP,EAAA,KACCO,EAAA,cAACR,EAAA,CACC,MAAO,CAAE,oCAAqC,GAAGM,GAAU,KAAM,EACjE,IAAK,CACH,UAAW,qDACX,uBAAwB,CACtB,UAAW,GAAGZ,cAChB,EACA,yBAA0B,CACxB,UAAW,GAAG4B,kBAChB,CACF,CAAA,CACF,CACF,CACF,CACF,CAEJ,EAEaC,EAAiB,OAAO,OAAOrB,EAAyB,CACnE,KAAMsB,EACN,SAAUC,EACV,gBAAiBC,EACjB,aAAcC,EACd,kBAAmBC,EACnB,gBAAiBC,CACnB,CAAC,EAED3B,EAAwB,YAAc"}

package/dist/components/navigation/NavigationMenuDropdownTrigger.js

@@ -1,2 +1,2 @@
-import{ChevronDown as s}from"@atom-learning/icons";import*as m from"@radix-ui/react-navigation-menu";import e from"react";import{styled as p}from"../../stitches.js";import{Icon as d}from"../icon/Icon.js";import{navigationMenuBaseItemStyles as f,navigationMenuActiveItemStyles as c}from"./NavigationMenu.styles.js";import{preventEvent as t}from"../../utilities/event/preventEvent.js";const g=p(m.Trigger,f,{display:"flex",alignItems:"center",borderRadius:"$1",justifyContent:"space-between",'&[data-state="open"]':{background:"$triggerBackgroundOpen"},variants:{active:{true:{...c}}}}),r=e.forwardRef(({children:o,active:n,...a},i)=>e.createElement(g,{active:n,...a,ref:i,onPointerMove:t,onPointerLeave:t},o,e.createElement(d,{is:s,css:{ml:"$1","[data-state=open] &":{transform:"rotate(-180deg)"},"@media (prefers-reduced-motion: no-preference)":{transition:"transform .2s ease"}},size:"sm"})));r.displayName="NavigationMenuDropdownTrigger";export{r as NavigationMenuDropdownTrigger};
+import{ChevronDown as m}from"@atom-learning/icons";import*as s from"@radix-ui/react-navigation-menu";import e from"react";import{styled as p}from"../../stitches.js";import{Icon as d}from"../icon/Icon.js";import{navigationMenuBaseItemStyles as f,navigationMenuActiveItemStyles as c}from"./NavigationMenu.styles.js";import{preventEvent as t}from"../../utilities/event/preventEvent.js";const g=p(s.Trigger,f,{display:"flex",alignItems:"center",borderRadius:"$1",justifyContent:"space-between",'&[data-state="open"]':{background:"$triggerBackgroundOpen"},variants:{active:{true:{...c}}}}),r=e.forwardRef(({children:o,active:n,...a},i)=>e.createElement(g,{active:n,...a,ref:i,onPointerMove:t,onPointerLeave:t},o,e.createElement(d,{is:m,css:{ml:"$1","[data-state=open] &":{transform:"rotate(-180deg)"},"@media (prefers-reduced-motion: no-preference)":{transition:"transform 200ms ease"}},size:"sm"})));r.displayName="NavigationMenuDropdownTrigger";export{r as NavigationMenuDropdownTrigger};
 //# sourceMappingURL=NavigationMenuDropdownTrigger.js.map

package/dist/components/navigation/NavigationMenuDropdownTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuDropdownTrigger.js","sources":["../../../src/components/navigation/NavigationMenuDropdownTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\nimport { preventEvent } from '~/utilities/event'\n\nimport { Icon } from '../icon'\nimport {\n  navigationMenuActiveItemStyles,\n  navigationMenuBaseItemStyles\n} from './NavigationMenu.styles'\n\nconst StyledTrigger = styled(\n  NavigationMenuPrimitive.Trigger,\n  navigationMenuBaseItemStyles,\n  {\n    display: 'flex',\n    alignItems: 'center',\n    borderRadius: '$1',\n    justifyContent: 'space-between',\n    '&[data-state=\"open\"]': {\n      background: '$triggerBackgroundOpen'\n    },\n    variants: {\n      active: { true: { ...navigationMenuActiveItemStyles } }\n    }\n  }\n)\n\nexport const NavigationMenuDropdownTrigger: React.ForwardRefExoticComponent<\n  React.ComponentProps<typeof StyledTrigger>\n> = React.forwardRef(({ children, active, ...props }, forwardedRef) => (\n  <StyledTrigger\n    active={active}\n    {...props}\n    ref={forwardedRef}\n    onPointerMove={preventEvent}\n    onPointerLeave={preventEvent}\n  >\n    {children}\n    <Icon\n      is={ChevronDown}\n      css={{\n        ml: '$1',\n        '[data-state=open] &': { transform: 'rotate(-180deg)' },\n        '@media (prefers-reduced-motion: no-preference)': {\n          transition: 'transform .2s ease'\n        }\n      }}\n      size=\"sm\"\n    />\n  </StyledTrigger>\n))\n\nNavigationMenuDropdownTrigger.displayName = 'NavigationMenuDropdownTrigger'\n"],"names":["StyledTrigger","styled","NavigationMenuPrimitive","navigationMenuBaseItemStyles","navigationMenuActiveItemStyles","NavigationMenuDropdownTrigger","React","children","active","props","forwardedRef","preventEvent","Icon","ChevronDown"],"mappings":"+XAaA,MAAMA,EAAgBC,EACpBC,EAAwB,QACxBC,EACA,CACE,QAAS,OACT,WAAY,SACZ,aAAc,KACd,eAAgB,gBAChB,uBAAwB,CACtB,WAAY,wBACd,EACA,SAAU,CACR,OAAQ,CAAE,KAAM,CAAE,GAAGC,CAA+B,CAAE,CACxD,CACF,CACF,EAEaC,EAETC,EAAM,WAAW,CAAC,CAAE,SAAAC,EAAU,OAAAC,KAAWC,CAAM,EAAGC,IACpDJ,EAAA,cAACN,EAAA,CACC,OAAQQ,EACP,GAAGC,EACJ,IAAKC,EACL,cAAeC,EACf,eAAgBA,CAAAA,EAEfJ,EACDD,EAAA,cAACM,EAAA,CACC,GAAIC,EACJ,IAAK,CACH,GAAI,KACJ,sBAAuB,CAAE,UAAW,iBAAkB,EACtD,iDAAkD,CAChD,WAAY,oBACd,CACF,EACA,KAAK,IAAA,CACP,CACF,CACD,EAEDR,EAA8B,YAAc"}
+{"version":3,"file":"NavigationMenuDropdownTrigger.js","sources":["../../../src/components/navigation/NavigationMenuDropdownTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\nimport { preventEvent } from '~/utilities/event'\n\nimport { Icon } from '../icon'\nimport {\n  navigationMenuActiveItemStyles,\n  navigationMenuBaseItemStyles\n} from './NavigationMenu.styles'\n\nconst StyledTrigger = styled(\n  NavigationMenuPrimitive.Trigger,\n  navigationMenuBaseItemStyles,\n  {\n    display: 'flex',\n    alignItems: 'center',\n    borderRadius: '$1',\n    justifyContent: 'space-between',\n    '&[data-state=\"open\"]': {\n      background: '$triggerBackgroundOpen'\n    },\n    variants: {\n      active: { true: { ...navigationMenuActiveItemStyles } }\n    }\n  }\n)\n\nexport const NavigationMenuDropdownTrigger: React.ForwardRefExoticComponent<\n  React.ComponentProps<typeof StyledTrigger>\n> = React.forwardRef(({ children, active, ...props }, forwardedRef) => (\n  <StyledTrigger\n    active={active}\n    {...props}\n    ref={forwardedRef}\n    onPointerMove={preventEvent}\n    onPointerLeave={preventEvent}\n  >\n    {children}\n    <Icon\n      is={ChevronDown}\n      css={{\n        ml: '$1',\n        '[data-state=open] &': { transform: 'rotate(-180deg)' },\n        '@media (prefers-reduced-motion: no-preference)': {\n          transition: 'transform 200ms ease'\n        }\n      }}\n      size=\"sm\"\n    />\n  </StyledTrigger>\n))\n\nNavigationMenuDropdownTrigger.displayName = 'NavigationMenuDropdownTrigger'\n"],"names":["StyledTrigger","styled","NavigationMenuPrimitive","navigationMenuBaseItemStyles","navigationMenuActiveItemStyles","NavigationMenuDropdownTrigger","React","children","active","props","forwardedRef","preventEvent","Icon","ChevronDown"],"mappings":"+XAaA,MAAMA,EAAgBC,EACpBC,EAAwB,QACxBC,EACA,CACE,QAAS,OACT,WAAY,SACZ,aAAc,KACd,eAAgB,gBAChB,uBAAwB,CACtB,WAAY,wBACd,EACA,SAAU,CACR,OAAQ,CAAE,KAAM,CAAE,GAAGC,CAA+B,CAAE,CACxD,CACF,CACF,EAEaC,EAETC,EAAM,WAAW,CAAC,CAAE,SAAAC,EAAU,OAAAC,KAAWC,CAAM,EAAGC,IACpDJ,EAAA,cAACN,EAAA,CACC,OAAQQ,EACP,GAAGC,EACJ,IAAKC,EACL,cAAeC,EACf,eAAgBA,CAAAA,EAEfJ,EACDD,EAAA,cAACM,EAAA,CACC,GAAIC,EACJ,IAAK,CACH,GAAI,KACJ,sBAAuB,CAAE,UAAW,iBAAkB,EACtD,iDAAkD,CAChD,WAAY,sBACd,CACF,EACA,KAAK,IAAA,CACP,CACF,CACD,EAEDR,EAA8B,YAAc"}

package/dist/components/navigation-menu-vertical/NavigationMenuVertical.d.ts

@@ -2745,11 +2745,11 @@ export declare const NavigationMenuVertical: (({ children, ...rest }: TNavigatio
     }) => JSX.Element;
     ItemContent: ({ children, ...rest }: Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
         ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-    }, "direction" | "gap" | "css" | "align" | "wrap" | "justify"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
-        direction?: "inherit" | "initial" | "revert" | "unset" | "row" | "column" | "column-reverse" | "row-reverse" | "revert-layer" | undefined;
-        wrap?: "inherit" | "initial" | "revert" | "unset" | "wrap" | "nowrap" | "wrap-reverse" | "revert-layer" | undefined;
-        justify?: "left" | "right" | "center" | "stretch" | "inherit" | "initial" | "revert" | "unset" | "end" | "start" | "space-around" | "space-between" | "space-evenly" | "flex-end" | "flex-start" | "normal" | "revert-layer" | "unsafe" | "safe" | undefined;
-        align?: "center" | "stretch" | "inherit" | "initial" | "revert" | "unset" | "end" | "start" | "flex-end" | "flex-start" | "baseline" | "normal" | "self-end" | "self-start" | "revert-layer" | "unsafe" | "safe" | "first baseline" | "last baseline" | undefined;
+    }, "direction" | "gap" | "css" | "wrap" | "justify" | "align"> & import("@atom-learning/stitches-react/types/styled-component").TransformProps<{
+        direction?: "inherit" | "initial" | "revert" | "unset" | "row" | "row-reverse" | "column" | "column-reverse" | "revert-layer" | undefined;
+        wrap?: "inherit" | "initial" | "revert" | "unset" | "revert-layer" | "wrap" | "nowrap" | "wrap-reverse" | undefined;
+        justify?: "left" | "right" | "center" | "stretch" | "inherit" | "initial" | "revert" | "unset" | "revert-layer" | "normal" | "unsafe" | "safe" | "start" | "end" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly" | undefined;
+        align?: "center" | "stretch" | "inherit" | "initial" | "revert" | "unset" | "revert-layer" | "normal" | "unsafe" | "safe" | "start" | "end" | "flex-start" | "flex-end" | "self-start" | "self-end" | "baseline" | "first baseline" | "last baseline" | undefined;
         gap?: number | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "24" | undefined;
     }, {
         sm: string;

package/dist/components/navigation-menu-vertical/NavigationMenuVertical.styles.d.ts

@@ -1,4 +1,10 @@
 export declare const navigationMenuVerticalItemStyles: {
+    border: string;
+    outline: string;
+    font: string;
+    background: string;
+    textAlign: string;
+    textDecoration: string;
     cursor: string;
     borderRadius: string;
     display: string;
@@ -29,7 +35,7 @@ export declare const navigationMenuVerticalItemStyles: {
             bg: string;
         };
         '&:focus-visible': {
-            outline: "none";
+            outline: string;
             position: string;
             zIndex: number;
             boxShadow: string;
@@ -45,10 +51,4 @@ export declare const navigationMenuVerticalItemStyles: {
             };
         };
     };
-    textDecoration: string;
-    border: string;
-    outline: string;
-    font: string;
-    background: string;
-    textAlign: string;
 };

package/dist/components/navigation-menu-vertical/NavigationMenuVertical.styles.js

@@ -1,2 +1,2 @@
-import"../../stitches.js";import"../../utilities/css-wrapper/CSSWrapper.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as t}from"../../utilities/style/focus-visible-style-block.js";import"../../utilities/style/keyframe-animations.js";import{resetButtonStyles as e,resetLinkStyles as i}from"../../utilities/style/reset.js";const o={...e,...i,cursor:"pointer",borderRadius:"$2",display:"flex",alignItems:"center",p:"$2",pl:"var(--navigation-menu-vertical-item-pl)",width:"100%",color:"$text",bg:"$background","--navigation-menu-vertical-item-font-weight":400,"&[data-active]":{bg:"$backgroundSelected",color:"$textSelected","--navigation-menu-vertical-item-font-weight":600},"&[data-state=open]":{"--navigation-menu-vertical-item-font-weight":600},"&[disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([disabled])":{"&:hover":{bg:"$backgroundHover"},"&:active":{bg:"$backgroundActive"},"&:focus-visible":t()},variants:{size:{md:{minHeight:"$4"},lg:{minHeight:"$5"}}}};export{o as navigationMenuVerticalItemStyles};
+const e={border:"none",outline:"none",font:"inherit",background:"none",textAlign:"inherit",textDecoration:"unset",cursor:"pointer",borderRadius:"$2",display:"flex",alignItems:"center",p:"$2",pl:"var(--navigation-menu-vertical-item-pl)",width:"100%",color:"$text",bg:"$background","--navigation-menu-vertical-item-font-weight":400,"&[data-active]":{bg:"$backgroundSelected",color:"$textSelected","--navigation-menu-vertical-item-font-weight":600},"&[data-state=open]":{"--navigation-menu-vertical-item-font-weight":600},"&[disabled]":{opacity:.3,cursor:"not-allowed"},"&:not([disabled])":{"&:hover":{bg:"$backgroundHover"},"&:active":{bg:"$backgroundActive"},"&:focus-visible":{outline:"none",position:"relative",zIndex:1,boxShadow:"white 0px 0px 0px 2px, $colors$primary800 0px 0px 0px 4px"}},variants:{size:{md:{minHeight:"$4"},lg:{minHeight:"$5"}}}};export{e as navigationMenuVerticalItemStyles};
 //# sourceMappingURL=NavigationMenuVertical.styles.js.map

package/dist/components/navigation-menu-vertical/NavigationMenuVertical.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuVertical.styles.js","sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVertical.styles.ts"],"sourcesContent":["import { focusVisibleStyleBlock } from '~/utilities'\nimport { resetButtonStyles, resetLinkStyles } from '~/utilities/style/reset'\n\nexport const navigationMenuVerticalItemStyles = {\n  ...resetButtonStyles,\n  ...resetLinkStyles,\n  cursor: 'pointer',\n  borderRadius: '$2',\n  display: 'flex',\n  alignItems: 'center',\n  p: '$2',\n  pl: `var(--navigation-menu-vertical-item-pl)`,\n  width: '100%',\n  color: '$text',\n  bg: '$background',\n  '--navigation-menu-vertical-item-font-weight': 400,\n  '&[data-active]': {\n    bg: '$backgroundSelected',\n    color: '$textSelected',\n    '--navigation-menu-vertical-item-font-weight': 600\n  },\n  '&[data-state=open]': {\n    '--navigation-menu-vertical-item-font-weight': 600\n  },\n  '&[disabled]': {\n    opacity: 0.3,\n    cursor: 'not-allowed'\n  },\n  '&:not([disabled])': {\n    '&:hover': {\n      bg: '$backgroundHover'\n    },\n    '&:active': {\n      bg: '$backgroundActive'\n    },\n    '&:focus-visible': focusVisibleStyleBlock()\n  },\n  variants: {\n    size: {\n      md: {\n        minHeight: '$4'\n      },\n      lg: {\n        minHeight: '$5'\n      }\n    }\n  }\n}\n"],"names":["navigationMenuVerticalItemStyles","resetButtonStyles","resetLinkStyles","focusVisibleStyleBlock"],"mappings":"4YAGaA,EAAmC,CAC9C,GAAGC,EACH,GAAGC,EACH,OAAQ,UACR,aAAc,KACd,QAAS,OACT,WAAY,SACZ,EAAG,KACH,GAAI,0CACJ,MAAO,OACP,MAAO,QACP,GAAI,cACJ,8CAA+C,IAC/C,iBAAkB,CAChB,GAAI,sBACJ,MAAO,gBACP,8CAA+C,GACjD,EACA,qBAAsB,CACpB,8CAA+C,GACjD,EACA,cAAe,CACb,QAAS,GACT,OAAQ,aACV,EACA,oBAAqB,CACnB,UAAW,CACT,GAAI,kBACN,EACA,WAAY,CACV,GAAI,mBACN,EACA,kBAAmBC,EAAuB,CAC5C,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,UAAW,IACb,EACA,GAAI,CACF,UAAW,IACb,CACF,CACF,CACF"}
+{"version":3,"file":"NavigationMenuVertical.styles.js","sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVertical.styles.ts"],"sourcesContent":["export const navigationMenuVerticalItemStyles = {\n  border: 'none',\n  outline: 'none',\n  font: 'inherit',\n  background: 'none',\n  textAlign: 'inherit',\n  textDecoration: 'unset',\n  cursor: 'pointer',\n  borderRadius: '$2',\n  display: 'flex',\n  alignItems: 'center',\n  p: '$2',\n  pl: `var(--navigation-menu-vertical-item-pl)`,\n  width: '100%',\n  color: '$text',\n  bg: '$background',\n  '--navigation-menu-vertical-item-font-weight': 400,\n  '&[data-active]': {\n    bg: '$backgroundSelected',\n    color: '$textSelected',\n    '--navigation-menu-vertical-item-font-weight': 600\n  },\n  '&[data-state=open]': {\n    '--navigation-menu-vertical-item-font-weight': 600\n  },\n  '&[disabled]': {\n    opacity: 0.3,\n    cursor: 'not-allowed'\n  },\n  '&:not([disabled])': {\n    '&:hover': {\n      bg: '$backgroundHover'\n    },\n    '&:active': {\n      bg: '$backgroundActive'\n    },\n    '&:focus-visible': {\n      outline: 'none',\n      position: 'relative',\n      zIndex: 1,\n      boxShadow: `white 0px 0px 0px 2px, $colors$primary800 0px 0px 0px 4px`\n    }\n  },\n  variants: {\n    size: {\n      md: {\n        minHeight: '$4'\n      },\n      lg: {\n        minHeight: '$5'\n      }\n    }\n  }\n}\n"],"names":["navigationMenuVerticalItemStyles"],"mappings":"AAAa,MAAAA,EAAmC,CAC9C,OAAQ,OACR,QAAS,OACT,KAAM,UACN,WAAY,OACZ,UAAW,UACX,eAAgB,QAChB,OAAQ,UACR,aAAc,KACd,QAAS,OACT,WAAY,SACZ,EAAG,KACH,GAAI,0CACJ,MAAO,OACP,MAAO,QACP,GAAI,cACJ,8CAA+C,IAC/C,iBAAkB,CAChB,GAAI,sBACJ,MAAO,gBACP,8CAA+C,GACjD,EACA,qBAAsB,CACpB,8CAA+C,GACjD,EACA,cAAe,CACb,QAAS,GACT,OAAQ,aACV,EACA,oBAAqB,CACnB,UAAW,CACT,GAAI,kBACN,EACA,WAAY,CACV,GAAI,mBACN,EACA,kBAAmB,CACjB,QAAS,OACT,SAAU,WACV,OAAQ,EACR,UAAW,2DACb,CACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,UAAW,IACb,EACA,GAAI,CACF,UAAW,IACb,CACF,CACF,CACF"}

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenuVerticalLink.js","sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalLink.tsx"],"sourcesContent":["import { Link } from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\nimport { preventEvent } from '~/utilities/event'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalItem } from './NavigationMenuVerticalItem'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalLink = styled(\n  Link,\n  navigationMenuVerticalItemStyles\n)\n\ntype NavigationMenuVerticalItemProps = React.ComponentProps<\n  typeof StyledNavigationMenuVerticalLink\n> & {\n  as?: React.ComponentType | React.ElementType\n}\n\nexport const NavigationMenuVerticalLink = ({\n  as,\n  href,\n  children,\n  ...rest\n}: NavigationMenuVerticalItemProps) => {\n  const Component = as || (href ? 'a' : 'button')\n  const componentProps = as\n    ? {}\n    : href\n    ? getExternalAnchorProps(href)\n    : { type: 'button' }\n\n  return (\n    <NavigationMenuVerticalItem>\n      <StyledNavigationMenuVerticalLink\n        size=\"lg\"\n        href={href}\n        {...rest}\n        {...componentProps}\n        onSelect={preventEvent}\n        asChild // ?: Can't use `as` for this as we lose `data-active` etc. attributes when we try to. Using `asChild` and `Component` as a workaround.\n      >\n        <Component>\n          <NavigationMenuVerticalItemContent>\n            {children}\n          </NavigationMenuVerticalItemContent>\n        </Component>\n      </StyledNavigationMenuVerticalLink>\n    </NavigationMenuVerticalItem>\n  )\n}\n"],"names":["StyledNavigationMenuVerticalLink","styled","Link","navigationMenuVerticalItemStyles","NavigationMenuVerticalLink","as","href","children","rest","Component","componentProps","getExternalAnchorProps","React","NavigationMenuVerticalItem","preventEvent","NavigationMenuVerticalItemContent"],"mappings":"ggBAWA,MAAMA,EAAmCC,EACvCC,EACAC,CACF,EAQaC,EAA6B,CAAC,CACzC,GAAAC,EACA,KAAAC,EACA,SAAAC,KACGC,CACL,IAAuC,CACrC,MAAMC,EAAYJ,IAAOC,EAAO,IAAM,UAChCI,EAAiBL,EACnB,CAAC,EACDC,EACAK,EAAuBL,CAAI,EAC3B,CAAE,KAAM,QAAS,EAErB,OACEM,EAAA,cAACC,EAAA,KACCD,EAAA,cAACZ,EAAA,CACC,KAAK,KACL,KAAMM,EACL,GAAGE,EACH,GAAGE,EACJ,SAAUI,EACV,QAAO,EAEPF,EAAAA,EAAA,cAACH,EAAA,KACCG,EAAA,cAACG,EAAA,KACER,CACH,CACF,CACF,CACF,CAEJ"}
+{"version":3,"file":"NavigationMenuVerticalLink.js","sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalLink.tsx"],"sourcesContent":["import { Link } from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/stitches'\nimport { preventEvent } from '~/utilities/event'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalItem } from './NavigationMenuVerticalItem'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalLink = styled(\n  Link,\n  navigationMenuVerticalItemStyles\n)\n\ntype NavigationMenuVerticalItemProps = React.ComponentProps<\n  typeof StyledNavigationMenuVerticalLink\n> & {\n  as?: React.ComponentType | React.ElementType\n}\n\nexport const NavigationMenuVerticalLink = ({\n  as,\n  href,\n  children,\n  ...rest\n}: NavigationMenuVerticalItemProps) => {\n  const Component = as || (href ? 'a' : 'button')\n  const componentProps = as\n    ? {}\n    : href\n      ? getExternalAnchorProps(href)\n      : { type: 'button' }\n\n  return (\n    <NavigationMenuVerticalItem>\n      <StyledNavigationMenuVerticalLink\n        size=\"lg\"\n        href={href}\n        {...rest}\n        {...componentProps}\n        onSelect={preventEvent}\n        asChild // ?: Can't use `as` for this as we lose `data-active` etc. attributes when we try to. Using `asChild` and `Component` as a workaround.\n      >\n        <Component>\n          <NavigationMenuVerticalItemContent>\n            {children}\n          </NavigationMenuVerticalItemContent>\n        </Component>\n      </StyledNavigationMenuVerticalLink>\n    </NavigationMenuVerticalItem>\n  )\n}\n"],"names":["StyledNavigationMenuVerticalLink","styled","Link","navigationMenuVerticalItemStyles","NavigationMenuVerticalLink","as","href","children","rest","Component","componentProps","getExternalAnchorProps","React","NavigationMenuVerticalItem","preventEvent","NavigationMenuVerticalItemContent"],"mappings":"ggBAWA,MAAMA,EAAmCC,EACvCC,EACAC,CACF,EAQaC,EAA6B,CAAC,CACzC,GAAAC,EACA,KAAAC,EACA,SAAAC,KACGC,CACL,IAAuC,CACrC,MAAMC,EAAYJ,IAAOC,EAAO,IAAM,UAChCI,EAAiBL,EACnB,CAAC,EACDC,EACEK,EAAuBL,CAAI,EAC3B,CAAE,KAAM,QAAS,EAEvB,OACEM,EAAA,cAACC,EAAA,KACCD,EAAA,cAACZ,EAAA,CACC,KAAK,KACL,KAAMM,EACL,GAAGE,EACH,GAAGE,EACJ,SAAUI,EACV,QAAO,EAEPF,EAAAA,EAAA,cAACH,EAAA,KACCG,EAAA,cAACG,EAAA,KACER,CACH,CACF,CACF,CACF,CAEJ"}

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { CSS } from '../../stitches';
+import { type CSS } from '../../stitches';
 export interface NumberInputProps {
     name: string;
     min?: number;
@@ -10,6 +10,7 @@ export interface NumberInputProps {
     disabled?: boolean;
     readonly?: boolean;
     size?: 'sm' | 'md' | 'lg';
+    appearance?: 'standard' | 'modern';
     onValueChange?: (value: number) => void;
     stepperButtonLabels?: {
         increment?: string;

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

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