@atom-learning/components 2.33.0 → 2.35.0

package/dist/components/flex/Flex.d.ts

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

package/dist/components/flex/Flex.js

@@ -1 +1,2 @@
 import{styled as l}from"../../stitches.js";const e=l("div",{display:"flex"});e.displayName="Flex";export{e as Flex};
+//# sourceMappingURL=Flex.js.map

package/dist/components/flex/Flex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex.js","sources":["../../../src/components/flex/Flex.tsx"],"sourcesContent":["import { styled } from '~/stitches'\n\nexport const Flex = styled('div', { display: 'flex' })\n\nFlex.displayName = 'Flex'\n"],"names":["Flex","styled"],"mappings":"2CAEO,MAAMA,EAAOC,EAAO,MAAO,CAAE,QAAS,MAAO,CAAC,EAErDD,EAAK,YAAc"}

package/dist/components/form/Form.d.ts

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

package/dist/components/form/Form.js

@@ -1 +1,2 @@
 import w from"invariant";import*as m from"react";import{useForm as S,FormProvider as E}from"react-hook-form";import g from"react-hook-form-persist";import{styled as F}from"../../stitches.js";import{StorageEnum as V}from"./Form.types.js";const v=F("form",{}),x=({persist:r,watch:o,setValue:n,children:l})=>{const{id:i,...e}=r;let t={...e,storage:e.storage===V.LOCAL?window.localStorage:window.sessionStorage};if(e.exclude){const{exclude:h,...a}=t,u=o(),c=Object.keys(u).filter(s=>{var d;if(!((d=e.exclude)!=null&&d.includes(s)))return s});t={...a,include:c}}return g(i,{watch:o,setValue:n},t),l},b=({formMethods:r,handleSubmit:o,onSubmit:n,onError:l,children:i,...e})=>m.createElement(E,{...r},m.createElement(v,{"aria-label":"form",...e,onSubmit:o(n,l)},i)),p=({children:r,defaultValues:o={},onSubmit:n,onError:l,validationMode:i="onBlur",render:e,persist:t,...h})=>{w(!(r&&e),"`Form` should only be given one of `children` or `render`. When both are provided, `render` will be used and `children` will be ignored.");const a=S({defaultValues:o,mode:i}),{handleSubmit:u,watch:c,setValue:s}=a,d=e?e(a):r,f={formMethods:a,handleSubmit:u,onSubmit:n,onError:l,...h};return t?m.createElement(x,{persist:t,watch:c,setValue:s},m.createElement(b,{...f},d)):m.createElement(b,{...f},d)};p.displayName="Form";export{p as Form};
+//# sourceMappingURL=Form.js.map

package/dist/components/form/Form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.js","sources":["../../../src/components/form/Form.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport useFormPersist from 'react-hook-form-persist'\n\nimport { styled } from '~/stitches'\n\nimport type {\n  FormContentValues,\n  FormPersistParams,\n  FormValues,\n  PersistFormWrapperValues\n} from './Form.types'\nimport { StorageEnum } from './Form.types'\n\nconst StyledForm = styled('form', {})\n\ntype FormProps = React.ComponentPropsWithoutRef<typeof StyledForm> & FormValues\n\ntype FormContentProps = React.ComponentPropsWithoutRef<typeof StyledForm> &\n  FormContentValues\n\ntype PersistFormWrapperProps = React.ComponentPropsWithoutRef<\n  typeof StyledForm\n> &\n  PersistFormWrapperValues\n\nconst PersistFormWrapper: React.FC<PersistFormWrapperProps> = ({\n  persist,\n  watch,\n  setValue,\n  children\n}) => {\n  const { id, ...options } = persist\n\n  let params: FormPersistParams = {\n    ...options,\n    storage:\n      options.storage === StorageEnum.LOCAL\n        ? window.localStorage\n        : window.sessionStorage\n  }\n\n  if (options.exclude) {\n    // Workaround for bug in react-hook-form-persist package\n    // package will still read from and save exclude param\n    // so need to send inputs we actually want to read from in include param instead\n    const { exclude, ...rest } = params\n    const allValues = watch()\n    const include = Object.keys(allValues).filter((key) => {\n      if (!options.exclude?.includes(key)) return key\n    })\n    params = { ...rest, include }\n  }\n\n  useFormPersist(id, { watch, setValue }, params)\n\n  return children\n}\n\nconst FormContent: React.FC<FormContentProps> = ({\n  formMethods,\n  handleSubmit,\n  onSubmit,\n  onError,\n  children,\n  ...remainingProps\n}) => (\n  <FormProvider {...formMethods}>\n    <StyledForm\n      aria-label=\"form\"\n      {...remainingProps}\n      onSubmit={handleSubmit(onSubmit, onError)}\n    >\n      {children}\n    </StyledForm>\n  </FormProvider>\n)\n\nexport const Form: React.FC<FormProps> = ({\n  children,\n  defaultValues = {},\n  onSubmit,\n  onError,\n  validationMode = 'onBlur',\n  render,\n  persist,\n  ...remainingProps\n}) => {\n  invariant(\n    !(children && render),\n    '`Form` should only be given one of `children` or `render`. When both are provided, `render` will be used and `children` will be ignored.'\n  )\n\n  const formMethods = useForm({\n    defaultValues,\n    mode: validationMode\n  })\n  const { handleSubmit, watch, setValue } = formMethods\n\n  const formContent = render ? render(formMethods) : children\n\n  const props = {\n    formMethods,\n    handleSubmit,\n    onSubmit,\n    onError,\n    ...remainingProps\n  }\n\n  if (persist) {\n    return (\n      <PersistFormWrapper persist={persist} watch={watch} setValue={setValue}>\n        <FormContent {...props}>{formContent}</FormContent>\n      </PersistFormWrapper>\n    )\n  }\n\n  return <FormContent {...props}>{formContent}</FormContent>\n}\n\nForm.displayName = 'Form'\n"],"names":["StyledForm","styled","PersistFormWrapper","persist","watch","setValue","children","id","options","params","StorageEnum","exclude","rest","allValues","include","key","_a","useFormPersist","FormContent","formMethods","handleSubmit","onSubmit","onError","remainingProps","React","FormProvider","Form","defaultValues","validationMode","render","invariant","useForm","formContent","props"],"mappings":"6OAeA,MAAMA,EAAaC,EAAO,OAAQ,CAAA,CAAE,EAY9BC,EAAwD,CAAC,CAC7D,QAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,CACF,IAAM,CACJ,KAAM,CAAE,GAAAC,KAAOC,CAAQ,EAAIL,EAE3B,IAAIM,EAA4B,CAC9B,GAAGD,EACH,QACEA,EAAQ,UAAYE,EAAY,MAC5B,OAAO,aACP,OAAO,cACf,EAEA,GAAIF,EAAQ,QAAS,CAInB,KAAM,CAAE,QAAAG,KAAYC,CAAK,EAAIH,EACvBI,EAAYT,IACZU,EAAU,OAAO,KAAKD,CAAS,EAAE,OAAQE,GAAQ,CAjD3D,IAAAC,EAkDM,GAAI,GAACA,EAAAR,EAAQ,UAAR,MAAAQ,EAAiB,SAASD,CAAM,GAAA,OAAOA,CAC9C,CAAC,EACDN,EAAS,CAAE,GAAGG,EAAM,QAAAE,CAAQ,CAC9B,CAEA,OAAAG,EAAeV,EAAI,CAAE,MAAAH,EAAO,SAAAC,CAAS,EAAGI,CAAM,EAEvCH,CACT,EAEMY,EAA0C,CAAC,CAC/C,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,QAAAC,EACA,SAAAhB,KACGiB,CACL,IACEC,EAAA,cAACC,EAAA,CAAc,GAAGN,CAAAA,EAChBK,EAAA,cAACxB,EAAA,CACC,aAAW,OACV,GAAGuB,EACJ,SAAUH,EAAaC,EAAUC,CAAO,CAEvChB,EAAAA,CACH,CACF,EAGWoB,EAA4B,CAAC,CACxC,SAAApB,EACA,cAAAqB,EAAgB,CAAC,EACjB,SAAAN,EACA,QAAAC,EACA,eAAAM,EAAiB,SACjB,OAAAC,EACA,QAAA1B,KACGoB,CACL,IAAM,CACJO,EACE,EAAExB,GAAYuB,GACd,0IACF,EAEA,MAAMV,EAAcY,EAAQ,CAC1B,cAAAJ,EACA,KAAMC,CACR,CAAC,EACK,CAAE,aAAAR,EAAc,MAAAhB,EAAO,SAAAC,CAAS,EAAIc,EAEpCa,EAAcH,EAASA,EAAOV,CAAW,EAAIb,EAE7C2B,EAAQ,CACZ,YAAAd,EACA,aAAAC,EACA,SAAAC,EACA,QAAAC,EACA,GAAGC,CACL,EAEA,OAAIpB,EAEAqB,EAAA,cAACtB,EAAA,CAAmB,QAASC,EAAS,MAAOC,EAAO,SAAUC,CAAAA,EAC5DmB,EAAA,cAACN,EAAA,CAAa,GAAGe,CAAAA,EAAQD,CAAY,CACvC,EAIGR,EAAA,cAACN,EAAA,CAAa,GAAGe,CAAQD,EAAAA,CAAY,CAC9C,EAEAN,EAAK,YAAc"}

package/dist/components/form/Form.types.js

@@ -1 +1,2 @@
 var S=(o=>(o.LOCAL="local",o.SESSION="session",o))(S||{});export{S as StorageEnum};
+//# sourceMappingURL=Form.types.js.map

package/dist/components/form/Form.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.types.js","sources":["../../../src/components/form/Form.types.ts"],"sourcesContent":["import type { Mode, UseFormMethods } from 'react-hook-form'\n\nexport enum StorageEnum {\n  LOCAL = 'local',\n  SESSION = 'session'\n}\n\ntype ExcludeIncludeConfig = {\n  exclude?: string[]\n  include?: string[]\n}\n\nexport type PersistOptions = {\n  id: string\n  storage?: StorageEnum\n} & ExcludeIncludeConfig\n\nexport type FormPersistParams = {\n  storage: Storage\n} & ExcludeIncludeConfig\n\nexport type PersistFormWrapperValues = {\n  persist: PersistOptions\n  watch\n  setValue\n  children: React.ReactNode | any\n}\n\nexport type FormContentValues = {\n  formMethods\n  handleSubmit: (\n    submitHandler: (data: any) => void | any,\n    submitErrorHandler?: (errors: any) => void\n  ) => (e: any) => Promise<void>\n  onSubmit: (data: any) => void | any\n  onError?: (errors: any) => void\n  children: React.ReactNode | any\n}\n\nexport type FormValues = {\n  defaultValues?: { [key: string]: string | number }\n  onSubmit: (data: any) => void | any\n  onError?: (errors: any) => void\n  validationMode?: Mode\n  persist?: PersistOptions\n} & (\n  | { children: React.ReactNode; render?: never }\n  | { children?: never; render: (methods: UseFormMethods) => React.ReactNode }\n)\n"],"names":["StorageEnum"],"mappings":"AAEY,IAAAA,GAAAA,IACVA,EAAA,MAAQ,QACRA,EAAA,QAAU,UAFAA,IAAAA,GAAA,CAAA,CAAA"}

package/dist/components/form/useFieldError.js

@@ -1 +1,2 @@
 import s from"dlv";import{useFormContext as i}from"react-hook-form";const l=o=>{var r;const{errors:e}=i(),t=o.split(/[,[\].]+?/).filter(Boolean);return{error:(r=(()=>s(e,t))())==null?void 0:r.message}};export{l as useFieldError};
+//# sourceMappingURL=useFieldError.js.map

package/dist/components/form/useFieldError.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFieldError.js","sources":["../../../src/components/form/useFieldError.ts"],"sourcesContent":["import delve from 'dlv'\nimport { useFormContext } from 'react-hook-form'\n\nexport const useFieldError = (fieldName: string) => {\n  const { errors } = useFormContext()\n\n  // in case of migration to a newer version of react-hook-form the path needs to updated to account for dynamic fields naming convention\n  const fieldPath = fieldName.split(/[,[\\].]+?/).filter(Boolean)\n\n  const getErrors = () => delve(errors, fieldPath)\n\n  return {\n    error: getErrors()?.message\n  }\n}\n"],"names":["useFieldError","fieldName","_a","errors","useFormContext","fieldPath","delve"],"mappings":"0EAGaA,EAAiBC,GAAsB,CAHpD,IAAAC,EAIE,KAAM,CAAE,OAAAC,CAAO,EAAIC,EAGbC,EAAAA,EAAYJ,EAAU,MAAM,WAAW,EAAE,OAAO,OAAO,EAI7D,MAAO,CACL,OAAOC,GAHS,IAAMI,EAAMH,EAAQE,CAAS,OAGtC,KAAAH,OAAAA,EAAa,OACtB,CACF"}

package/dist/components/grid/Grid.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 declare const GridContainer: import("@stitches/react/types/styled-component").StyledComponent<"div", {
-    gap?: number | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | undefined;
+    gap?: number | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "24" | undefined;
 }, {
     sm: string;
     md: string;
@@ -24,6 +24,42 @@ declare const GridContainer: import("@stitches/react/types/styled-component").St
         textPlaceholder: any;
         background: any;
         backgroundAccent: any;
+        grey100: any;
+        grey200: any;
+        grey300: any;
+        grey400: any;
+        grey500: any;
+        grey600: any;
+        grey700: any;
+        grey800: any;
+        grey900: any;
+        grey1000: any;
+        grey1100: any;
+        grey1200: any;
+        blue100: any;
+        blue200: any;
+        blue300: any;
+        blue400: any;
+        blue500: any;
+        blue600: any;
+        blue700: any;
+        blue800: any;
+        blue900: any;
+        blue1000: any;
+        blue1100: any;
+        blue1200: any;
+        purple100: any;
+        purple200: any;
+        purple300: any;
+        purple400: any;
+        purple500: any;
+        purple600: any;
+        purple700: any;
+        purple800: any;
+        purple900: any;
+        purple1000: any;
+        purple1100: any;
+        purple1200: any;
         tonal50: any;
         tonal100: any;
         tonal200: any;
@@ -81,6 +117,7 @@ declare const GridContainer: import("@stitches/react/types/styled-component").St
         "7": any;
         "8": any;
         "9": any;
+        "24": any;
     };
     fontSizes: {
         xs: any;

package/dist/components/grid/Grid.js

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

package/dist/components/grid/Grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grid.js","sources":["../../../src/components/grid/Grid.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { createThemeVariants } from '~/utilities'\n\nconst GridContainer = styled('div', {\n  display: 'grid',\n  variants: {\n    gap: createThemeVariants('space', { gap: '$key' })\n  }\n})\n\ntype GridProps = React.ComponentProps<typeof GridContainer> & {\n  minItemSize?: string\n  maxItemSize?: string\n}\n\nexport const Grid: React.FC<GridProps> = ({\n  css,\n  gap = 2,\n  minItemSize,\n  maxItemSize = '1fr',\n  ...remainingProps\n}) => (\n  <GridContainer\n    css={{\n      ...(minItemSize && {\n        gridTemplateColumns: `repeat(auto-fit, minmax(${minItemSize}, ${maxItemSize}))`\n      }),\n      ...(css as any)\n    }}\n    gap={gap}\n    {...remainingProps}\n  />\n)\n\nGrid.displayName = 'Grid'\n"],"names":["GridContainer","styled","createThemeVariants","Grid","css","gap","minItemSize","maxItemSize","remainingProps","React"],"mappings":"sKAKA,MAAMA,EAAgBC,EAAO,MAAO,CAClC,QAAS,OACT,SAAU,CACR,IAAKC,EAAoB,QAAS,CAAE,IAAK,MAAO,CAAC,CACnD,CACF,CAAC,EAOYC,EAA4B,CAAC,CACxC,IAAAC,EACA,IAAAC,EAAM,EACN,YAAAC,EACA,YAAAC,EAAc,SACXC,CACL,IACEC,EAAA,cAACT,EAAA,CACC,IAAK,CACH,GAAIM,GAAe,CACjB,oBAAqB,2BAA2BA,MAAgBC,KAClE,EACA,GAAIH,CACN,EACA,IAAKC,EACJ,GAAGG,CACN,CAAA,EAGFL,EAAK,YAAc"}

package/dist/components/heading/Heading.d.ts

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

package/dist/components/heading/Heading.js

@@ -1 +1,2 @@
 import*as i from"react";import{styled as f}from"../../stitches.js";import{capsize as e}from"../../utilities/style/capsize.js";const t=f("h2",{fontFamily:"$display",fontWeight:700,m:0,variants:{size:{xs:{fontFamily:"$body",fontWeight:600,fontSize:"$md",lineHeight:1.5,...e(.3864)},sm:{fontSize:"$lg",lineHeight:1.14,...e(.2174,.2254)},md:{fontSize:"$xl",lineHeight:1.14,...e(.2174,.2254)},lg:{fontSize:"$2xl",lineHeight:1.08,...e(.1865,.1945)},xl:{fontSize:"$3xl",lineHeight:1.12,...e(.206,.214)},xxl:{fontSize:"$4xl",lineHeight:1.06,...e(.1793,.1873)}},noCapsize:{true:{"&::before, &::after":{display:"none !important"}}}}}),n=i.forwardRef(({size:o="md",...l},a)=>i.createElement(t,{ref:a,size:o,...l}));n.displayName="Heading";export{n as Heading,t as StyledHeading};
+//# sourceMappingURL=Heading.js.map

package/dist/components/heading/Heading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading.js","sources":["../../../src/components/heading/Heading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport type { Override } from '~/utilities'\nimport { capsize } from '~/utilities'\n\nexport const StyledHeading = styled('h2', {\n  fontFamily: '$display',\n  fontWeight: 700,\n  m: 0,\n  variants: {\n    size: {\n      xs: {\n        fontFamily: '$body',\n        fontWeight: 600,\n        fontSize: '$md',\n        lineHeight: 1.5,\n        ...capsize(0.3864)\n      },\n      sm: {\n        fontSize: '$lg',\n        lineHeight: 1.14,\n        ...capsize(0.2174, 0.2254)\n      },\n      md: {\n        fontSize: '$xl',\n        lineHeight: 1.14,\n        ...capsize(0.2174, 0.2254)\n      },\n      lg: {\n        fontSize: '$2xl',\n        lineHeight: 1.08,\n        ...capsize(0.1865, 0.1945)\n      },\n      xl: {\n        fontSize: '$3xl',\n        lineHeight: 1.12,\n        ...capsize(0.206, 0.214)\n      },\n      xxl: {\n        fontSize: '$4xl',\n        lineHeight: 1.06,\n        ...capsize(0.1793, 0.1873)\n      }\n    },\n    noCapsize: {\n      true: {\n        '&::before, &::after': { display: 'none !important' }\n      }\n    }\n  }\n})\n\nexport type HeadingProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledHeading>,\n  {\n    as?:\n      | 'h1'\n      | 'h2'\n      | 'h3'\n      | 'h4'\n      | 'h5'\n      | 'h6'\n      | React.ComponentType\n      | React.ElementType\n  }\n>\n\nexport const Heading: React.ForwardRefExoticComponent<HeadingProps> =\n  React.forwardRef(({ size = 'md', ...remainingProps }, ref) => (\n    <StyledHeading ref={ref} size={size} {...remainingProps} />\n  ))\n\nHeading.displayName = 'Heading'\n"],"names":["StyledHeading","styled","capsize","Heading","React","size","remainingProps","ref"],"mappings":"8HAMa,MAAAA,EAAgBC,EAAO,KAAM,CACxC,WAAY,WACZ,WAAY,IACZ,EAAG,EACH,SAAU,CACR,KAAM,CACJ,GAAI,CACF,WAAY,QACZ,WAAY,IACZ,SAAU,MACV,WAAY,IACZ,GAAGC,EAAQ,KAAM,CACnB,EACA,GAAI,CACF,SAAU,MACV,WAAY,KACZ,GAAGA,EAAQ,MAAQ,KAAM,CAC3B,EACA,GAAI,CACF,SAAU,MACV,WAAY,KACZ,GAAGA,EAAQ,MAAQ,KAAM,CAC3B,EACA,GAAI,CACF,SAAU,OACV,WAAY,KACZ,GAAGA,EAAQ,MAAQ,KAAM,CAC3B,EACA,GAAI,CACF,SAAU,OACV,WAAY,KACZ,GAAGA,EAAQ,KAAO,IAAK,CACzB,EACA,IAAK,CACH,SAAU,OACV,WAAY,KACZ,GAAGA,EAAQ,MAAQ,KAAM,CAC3B,CACF,EACA,UAAW,CACT,KAAM,CACJ,sBAAuB,CAAE,QAAS,iBAAkB,CACtD,CACF,CACF,CACF,CAAC,EAiBYC,EACXC,EAAM,WAAW,CAAC,CAAE,KAAAC,EAAO,QAASC,CAAe,EAAGC,IACpDH,EAAA,cAACJ,GAAc,IAAKO,EAAK,KAAMF,EAAO,GAAGC,CAAAA,CAAgB,CAC1D,EAEHH,EAAQ,YAAc"}

package/dist/components/icon/Icon.d.ts

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

package/dist/components/icon/Icon.js

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

package/dist/components/icon/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.js","sources":["../../../src/components/icon/Icon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { Override } from '~/utilities/types'\n\nexport const StyledIcon = styled('svg', {\n  display: 'inline-block',\n  fill: 'none',\n  stroke: 'currentcolor',\n  strokeLinecap: 'round',\n  strokeLinejoin: 'round',\n  verticalAlign: 'middle',\n  variants: {\n    size: {\n      sm: { size: '$1', strokeWidth: '1.5' },\n      md: { size: '$2', strokeWidth: '1.75' },\n      lg: { size: '$3', strokeWidth: '2' }\n    }\n  }\n})\n\ntype IconProps = Override<\n  React.ComponentProps<typeof StyledIcon>,\n  {\n    is: React.FC<React.SVGProps<SVGSVGElement>>\n    as?: never\n  }\n>\n\nexport const Icon: React.FC<IconProps> = React.forwardRef(\n  ({ is: SVG, size = 'md', ...remainingProps }, ref) => (\n    <StyledIcon\n      size={size}\n      aria-hidden=\"true\"\n      {...remainingProps}\n      as={SVG}\n      ref={ref}\n    />\n  )\n)\n"],"names":["StyledIcon","styled","Icon","React","SVG","size","remainingProps","ref"],"mappings":"mEAKa,MAAAA,EAAaC,EAAO,MAAO,CACtC,QAAS,eACT,KAAM,OACN,OAAQ,eACR,cAAe,QACf,eAAgB,QAChB,cAAe,SACf,SAAU,CACR,KAAM,CACJ,GAAI,CAAE,KAAM,KAAM,YAAa,KAAM,EACrC,GAAI,CAAE,KAAM,KAAM,YAAa,MAAO,EACtC,GAAI,CAAE,KAAM,KAAM,YAAa,GAAI,CACrC,CACF,CACF,CAAC,EAUYC,EAA4BC,EAAM,WAC7C,CAAC,CAAE,GAAIC,EAAK,KAAAC,EAAO,QAASC,CAAe,EAAGC,IAC5CJ,EAAA,cAACH,EACC,CAAA,KAAMK,EACN,cAAY,OACX,GAAGC,EACJ,GAAIF,EACJ,IAAKG,EACP,CAEJ"}

package/dist/components/image/Image.d.ts

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

package/dist/components/image/Image.js

@@ -1 +1,2 @@
 import{styled as e}from"../../stitches.js";const t=e("img",{verticalAlign:"middle",maxWidth:"100%",variants:{fluid:{true:{"&[width]":{width:"auto"},"&[width][height]":{height:"auto"},'&[src$=".svg"]':{width:"100%",height:"auto",maxWidth:"none"}}}}}),i=t;i.displayName="Image";export{i as Image,t as StyledImage};
+//# sourceMappingURL=Image.js.map

package/dist/components/image/Image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.js","sources":["../../../src/components/image/Image.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { Override } from '~/utilities/types'\n\n// default styling lifted from https://www.zachleat.com/web/fluid-images/#copy-and-paste\nexport const StyledImage = styled('img', {\n  verticalAlign: 'middle',\n  maxWidth: '100%',\n  variants: {\n    fluid: {\n      true: {\n        '&[width]': {\n          width: 'auto'\n        },\n        '&[width][height]': {\n          height: 'auto'\n        },\n        '&[src$=\".svg\"]': {\n          width: '100%',\n          height: 'auto',\n          maxWidth: 'none'\n        }\n      }\n    }\n  }\n})\n\ntype ImageProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledImage>,\n  {\n    as?: never\n  }\n>\n\nexport const Image: React.FC<ImageProps> = StyledImage\n\nImage.displayName = 'Image'\n"],"names":["StyledImage","styled","Image"],"mappings":"2CAMO,MAAMA,EAAcC,EAAO,MAAO,CACvC,cAAe,SACf,SAAU,OACV,SAAU,CACR,MAAO,CACL,KAAM,CACJ,WAAY,CACV,MAAO,MACT,EACA,mBAAoB,CAClB,OAAQ,MACV,EACA,iBAAkB,CAChB,MAAO,OACP,OAAQ,OACR,SAAU,MACZ,CACF,CACF,CACF,CACF,CAAC,EASYC,EAA8BF,EAE3CE,EAAM,YAAc"}

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

@@ -1 +1,2 @@
 import{OkCircle as o,Danger as n,Info as r,Error as c}from"@atom-learning/icons";const e={success:{color:"$success"},warning:{color:"$warningText","& svg":{color:"$warningDark"}},info:{color:"$primary"},neutral:{color:"$tonal400"},error:{color:"$danger"}},a={success:o,warning:n,info:r,neutral:r,error:c};export{a as INLINE_MESSAGE_ICONS,e as INLINE_MESSAGE_THEMES};
+//# sourceMappingURL=InlineMessage.config.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InlineMessage.config.js","sources":["../../../src/components/inline-message/InlineMessage.config.ts"],"sourcesContent":["import { Danger, Error, Info, OkCircle } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport type { CSS } from '~/stitches'\n\nimport { InlineMessageTheme } from './InlineMessage.types'\n\nexport const INLINE_MESSAGE_THEMES: Record<InlineMessageTheme, CSS> = {\n  success: { color: '$success' },\n  warning: { color: '$warningText', '& svg': { color: '$warningDark' } },\n  info: { color: '$primary' },\n  neutral: { color: '$tonal400' },\n  error: { color: '$danger' }\n}\n\nexport const INLINE_MESSAGE_ICONS: Record<\n  InlineMessageTheme,\n  React.FC<React.SVGProps<SVGSVGElement>>\n> = {\n  success: OkCircle,\n  warning: Danger,\n  info: Info,\n  neutral: Info,\n  error: Error\n}\n"],"names":["INLINE_MESSAGE_THEMES","INLINE_MESSAGE_ICONS","OkCircle","Danger","Info","Error"],"mappings":"iFAOO,MAAMA,EAAyD,CACpE,QAAS,CAAE,MAAO,UAAW,EAC7B,QAAS,CAAE,MAAO,eAAgB,QAAS,CAAE,MAAO,cAAe,CAAE,EACrE,KAAM,CAAE,MAAO,UAAW,EAC1B,QAAS,CAAE,MAAO,WAAY,EAC9B,MAAO,CAAE,MAAO,SAAU,CAC5B,EAEaC,EAGT,CACF,QAASC,EACT,QAASC,EACT,KAAMC,EACN,QAASA,EACT,MAAOC,CACT"}

package/dist/components/inline-message/InlineMessage.d.ts

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

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"InlineMessage.js","sources":["../../../src/components/inline-message/InlineMessage.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '~/components/flex'\nimport { Icon } from '~/components/icon'\nimport { Text } from '~/components/text'\nimport { styled } from '~/stitches'\n\nimport {\n  INLINE_MESSAGE_ICONS,\n  INLINE_MESSAGE_THEMES\n} from './InlineMessage.config'\nimport { InlineMessageTheme } from './InlineMessage.types'\n\nconst InlineMessageContainer = styled(Flex, {\n  variants: {\n    theme: INLINE_MESSAGE_THEMES\n  }\n})\n\nconst InlineMessageIcon = styled(Icon, {\n  flexShrink: '0',\n  mr: '$2'\n})\n\ntype TInlineMessageProps = React.ComponentProps<\n  typeof InlineMessageContainer\n> & {\n  showIcon?: boolean\n  size?: 'xs' | 'sm' | 'md'\n}\n\nexport const InlineMessage: React.FC<TInlineMessageProps> = ({\n  css,\n  showIcon = true,\n  theme = 'error',\n  size = 'sm',\n  children,\n  ...rest\n}) => (\n  <InlineMessageContainer theme={theme} css={css} {...rest}>\n    {showIcon && (\n      <InlineMessageIcon\n        size=\"sm\"\n        is={INLINE_MESSAGE_ICONS[theme as InlineMessageTheme]}\n      />\n    )}\n    <Text as=\"span\" size={size} css={{ transform: 'translateY($space$0)' }}>\n      {children}\n    </Text>\n  </InlineMessageContainer>\n)\n"],"names":["InlineMessageContainer","styled","Flex","INLINE_MESSAGE_THEMES","InlineMessageIcon","Icon","InlineMessage","css","showIcon","theme","size","children","rest","React","INLINE_MESSAGE_ICONS","Text"],"mappings":"oRAaA,MAAMA,EAAyBC,EAAOC,EAAM,CAC1C,SAAU,CACR,MAAOC,CACT,CACF,CAAC,EAEKC,EAAoBH,EAAOI,EAAM,CACrC,WAAY,IACZ,GAAI,IACN,CAAC,EASYC,EAA+C,CAAC,CAC3D,IAAAC,EACA,SAAAC,EAAW,GACX,MAAAC,EAAQ,QACR,KAAAC,EAAO,KACP,SAAAC,KACGC,CACL,IACEC,EAAA,cAACb,EAAA,CAAuB,MAAOS,EAAO,IAAKF,EAAM,GAAGK,CACjDJ,EAAAA,GACCK,EAAA,cAACT,EAAA,CACC,KAAK,KACL,GAAIU,EAAqBL,EAAAA,CAC3B,EAEFI,EAAA,cAACE,EAAA,CAAK,GAAG,OAAO,KAAML,EAAM,IAAK,CAAE,UAAW,sBAAuB,CAClEC,EAAAA,CACH,CACF"}

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

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

package/dist/components/input/Input.js

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

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

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

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

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

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

@@ -0,0 +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: React.FC<InputFieldProps> = ({\n  css,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  ...remainingProps\n}) => {\n  const { register } = useFormContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n\n  return (\n    <FieldWrapper\n      css={css}\n      description={description}\n      error={error}\n      fieldId={name}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n    >\n      <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","remainingProps","register","useFormContext","error","useFieldError","ref","React","FieldWrapper","Input"],"mappings":"mTAYa,MAAAA,EAAwC,CAAC,CACpD,IAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,KACGC,CACL,IAAM,CACJ,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9B,CAAE,MAAAC,CAAM,EAAIC,EAAcR,CAAI,EAC9BS,EAAMR,EAAaI,EAASJ,CAAU,EAAII,EAEhD,OACEK,EAAA,cAACC,EAAA,CACC,IAAKb,EACL,YAAaK,EACb,MAAOI,EACP,QAASP,EACT,MAAOD,EACP,OAAQG,EACR,SAAU,QAAQD,GAAA,KAAA,OAAAA,EAAY,QAAQ,CAAA,EAEtCS,EAAA,cAACE,EAAA,CACC,GAAIZ,EACJ,KAAMA,EACN,IAAKS,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGH,EACN,CACF,CAEJ,EAEAP,EAAW,YAAc"}