@atom-learning/components 6.2.1 → 6.3.1

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"RadioField.js","sources":["../../../src/components/radio-button-field/RadioField.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { InlineFieldWrapper } from '~/components/field-wrapper'\nimport { ValidationOptions } from '~/components/form'\nimport { RadioButton } from '~/components/radio-button'\n\ntype RadioFieldProps = {\n  className?: string\n  defaultChecked?: boolean\n  error?: string\n  label: string\n  validation?: ValidationOptions\n} & React.ComponentProps<typeof RadioButton>\n\nexport const RadioField = ({\n  className,\n  label,\n  value,\n  ...remainingProps\n}: RadioFieldProps) => (\n  <InlineFieldWrapper className={className} label={label}>\n    <RadioButton value={value} {...remainingProps} />\n  </InlineFieldWrapper>\n)\n\nRadioField.displayName = 'RadioField'\n"],"names":["RadioField","className","label","value","remainingProps","React","InlineFieldWrapper","RadioButton"],"mappings":"sPAca,MAAAA,EAAa,CAAC,CACzB,UAAAC,EACA,MAAAC,EACA,MAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAmB,UAAWL,EAAW,MAAOC,CAC/CG,EAAAA,EAAA,cAACE,EAAA,CAAY,MAAOJ,EAAQ,GAAGC,EAAgB,CACjD,EAGFJ,EAAW,YAAc"}
+{"version":3,"file":"RadioField.js","sources":["../../../src/components/radio-button-field/RadioField.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { InlineFieldWrapper } from '~/components/field-wrapper/InlineFieldWrapper'\nimport { ValidationOptions } from '~/components/form/validation'\nimport { RadioButton } from '~/components/radio-button/RadioButton'\n\ntype RadioFieldProps = {\n  className?: string\n  defaultChecked?: boolean\n  error?: string\n  label: string\n  validation?: ValidationOptions\n} & React.ComponentProps<typeof RadioButton>\n\nexport const RadioField = ({\n  className,\n  label,\n  value,\n  ...remainingProps\n}: RadioFieldProps) => (\n  <InlineFieldWrapper className={className} label={label}>\n    <RadioButton value={value} {...remainingProps} />\n  </InlineFieldWrapper>\n)\n\nRadioField.displayName = 'RadioField'\n"],"names":["RadioField","className","label","value","remainingProps","React","InlineFieldWrapper","RadioButton"],"mappings":"iKAca,MAAAA,EAAa,CAAC,CACzB,UAAAC,EACA,MAAAC,EACA,MAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAmB,UAAWL,EAAW,MAAOC,CAC/CG,EAAAA,EAAA,cAACE,EAAA,CAAY,MAAOJ,EAAQ,GAAGC,EAAgB,CACjD,EAGFJ,EAAW,YAAc"}

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

@@ -1,2 +1,2 @@
-import*as i from"@radix-ui/react-radio-group";import*as e from"react";import{styled as t}from"../../styled.js";const d=t(i.Item,{base:["items-center","bg-white","border","border-grey-600","rounded-sm","cursor-pointer","flex","text-left","data-[state=checked]:-outline-offset-2","data-[state=checked]:outline-2","data-[state=checked]:outline-primary-800","data-[state=checked]:outline-solid"],variants:{align:{left:["flex-row"],right:["flex-row-reverse"]},size:{md:["px-4","py-3"],lg:["px-8","py-4"]},isFullWidth:{true:["w-full"],false:["w-max"]}}}),o=t("div",{base:["items-center","appearance-none","bg-transparent","border","border-grey-900","rounded-full","flex","shrink-0","justify-center","p-0","size-4","transition-all","duration-50","ease-out","in-data-[state=checked]:bg-primary-800","in-data-[state=checked]:border-primary-800"],variants:{containerIsFullWidth:{true:[],false:[]},align:{left:["mr-4"],right:[]}},compoundVariants:[{containerIsFullWidth:!0,align:"right",class:["ml-auto"]},{containerIsFullWidth:!1,align:"right",class:["ml-4"]}]}),c=t(i.Indicator,{base:["bg-white","rounded-full","absolute","size-1.5"]}),u=({children:l,isFullWidth:a=!1,size:n="md",align:r="left",...s})=>e.createElement(d,{...s,align:r,isFullWidth:a,size:n},e.createElement(o,{align:r,containerIsFullWidth:a},e.createElement(c,null)),e.createElement("div",null,l));export{u as RadioCard};
+import*as i from"@radix-ui/react-radio-group";import*as e from"react";import{styled as t}from"../../styled.js";const d=t(i.Item,{base:["items-center","bg-white","border","border-grey-600","rounded-sm","cursor-pointer","flex","text-left","data-[state=checked]:-outline-offset-2","data-[state=checked]:outline-2","data-[state=checked]:outline-primary-800","data-[state=checked]:outline-solid"],variants:{align:{left:["flex-row"],right:["flex-row-reverse"]},size:{md:["px-4","py-3"],lg:["px-8","py-4"]},isFullWidth:{true:["w-full"],false:["w-max"]}}}),o=t("div",{base:["items-center","appearance-none","border","border-grey-900","rounded-full","flex","shrink-0","justify-center","size-4","transition-all","duration-50","ease-out","in-data-[state=checked]:bg-primary-800","in-data-[state=checked]:border-primary-800"],variants:{containerIsFullWidth:{true:[],false:[]},align:{left:["mr-4"],right:[]}},compoundVariants:[{containerIsFullWidth:!0,align:"right",class:["ml-auto"]},{containerIsFullWidth:!1,align:"right",class:["ml-4"]}]}),c=t(i.Indicator,{base:["bg-white","rounded-full","absolute","size-1.5"]}),u=({children:l,isFullWidth:a=!1,size:n="md",align:r="left",...s})=>e.createElement(d,{...s,align:r,isFullWidth:a,size:n},e.createElement(o,{align:r,containerIsFullWidth:a},e.createElement(c,null)),e.createElement("div",null,l));export{u as RadioCard};
 //# sourceMappingURL=RadioCard.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"RadioCard.js","sources":["../../../src/components/radio-card/RadioCard.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledRadioCard = styled(RadioGroup.Item, {\n  base: [\n    'items-center',\n    'bg-white',\n    'border',\n    'border-grey-600',\n    'rounded-sm',\n    'cursor-pointer',\n    'flex',\n    'text-left',\n    'data-[state=checked]:-outline-offset-2',\n    'data-[state=checked]:outline-2',\n    'data-[state=checked]:outline-primary-800',\n    'data-[state=checked]:outline-solid'\n  ],\n  variants: {\n    align: {\n      left: ['flex-row'],\n      right: ['flex-row-reverse']\n    },\n    size: {\n      md: ['px-4', 'py-3'],\n      lg: ['px-8', 'py-4']\n    },\n    isFullWidth: {\n      true: ['w-full'],\n      false: ['w-max']\n    }\n  }\n})\n\nconst RadioButton = styled('div', {\n  base: [\n    'items-center',\n    'appearance-none',\n    'bg-transparent',\n    'border',\n    'border-grey-900',\n    'rounded-full',\n    'flex',\n    'shrink-0',\n    'justify-center',\n    'p-0',\n    'size-4',\n    'transition-all',\n    'duration-50',\n    'ease-out',\n    'in-data-[state=checked]:bg-primary-800',\n    'in-data-[state=checked]:border-primary-800'\n  ],\n  variants: {\n    containerIsFullWidth: {\n      true: [],\n      false: []\n    },\n    align: {\n      left: ['mr-4'],\n      right: []\n    }\n  },\n  compoundVariants: [\n    {\n      containerIsFullWidth: true,\n      align: 'right',\n      class: ['ml-auto']\n    },\n    {\n      containerIsFullWidth: false,\n      align: 'right',\n      class: ['ml-4']\n    }\n  ]\n})\n\nconst Indicator = styled(RadioGroup.Indicator, {\n  base: ['bg-white', 'rounded-full', 'absolute', 'size-1.5']\n})\n\ntype RadioCardProps = React.ComponentProps<typeof StyledRadioCard>\n\nexport const RadioCard = ({\n  children,\n  isFullWidth = false,\n  size = 'md',\n  align = 'left',\n  ...rest\n}: RadioCardProps) => (\n  <StyledRadioCard\n    {...rest}\n    align={align}\n    isFullWidth={isFullWidth}\n    size={size}\n  >\n    <RadioButton align={align} containerIsFullWidth={isFullWidth}>\n      <Indicator />\n    </RadioButton>\n    <div>{children}</div>\n  </StyledRadioCard>\n)\n"],"names":["StyledRadioCard","styled","RadioGroup","RadioButton","Indicator","RadioCard","children","isFullWidth","size","align","rest","React"],"mappings":"+GAKA,MAAMA,EAAkBC,EAAOC,EAAW,KAAM,CAC9C,KAAM,CACJ,eACA,WACA,SACA,kBACA,aACA,iBACA,OACA,YACA,yCACA,iCACA,2CACA,oCACF,EACA,SAAU,CACR,MAAO,CACL,KAAM,CAAC,UAAU,EACjB,MAAO,CAAC,kBAAkB,CAC5B,EACA,KAAM,CACJ,GAAI,CAAC,OAAQ,MAAM,EACnB,GAAI,CAAC,OAAQ,MAAM,CACrB,EACA,YAAa,CACX,KAAM,CAAC,QAAQ,EACf,MAAO,CAAC,OAAO,CACjB,CACF,CACF,CAAC,EAEKC,EAAcF,EAAO,MAAO,CAChC,KAAM,CACJ,eACA,kBACA,iBACA,SACA,kBACA,eACA,OACA,WACA,iBACA,MACA,SACA,iBACA,cACA,WACA,yCACA,4CACF,EACA,SAAU,CACR,qBAAsB,CACpB,KAAM,GACN,MAAO,CAAA,CACT,EACA,MAAO,CACL,KAAM,CAAC,MAAM,EACb,MAAO,CAAA,CACT,CACF,EACA,iBAAkB,CAChB,CACE,qBAAsB,GACtB,MAAO,QACP,MAAO,CAAC,SAAS,CACnB,EACA,CACE,qBAAsB,GACtB,MAAO,QACP,MAAO,CAAC,MAAM,CAChB,CACF,CACF,CAAC,EAEKG,EAAYH,EAAOC,EAAW,UAAW,CAC7C,KAAM,CAAC,WAAY,eAAgB,WAAY,UAAU,CAC3D,CAAC,EAIYG,EAAY,CAAC,CACxB,SAAAC,EACA,YAAAC,EAAc,GACd,KAAAC,EAAO,KACP,MAAAC,EAAQ,OACR,GAAGC,CACL,IACEC,EAAA,cAACX,EAAA,CACE,GAAGU,EACJ,MAAOD,EACP,YAAaF,EACb,KAAMC,CAAAA,EAENG,EAAA,cAACR,EAAA,CAAY,MAAOM,EAAO,qBAAsBF,GAC/CI,EAAA,cAACP,EAAA,IAAU,CACb,EACAO,EAAA,cAAC,MAAKL,KAAAA,CAAS,CACjB"}
+{"version":3,"file":"RadioCard.js","sources":["../../../src/components/radio-card/RadioCard.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledRadioCard = styled(RadioGroup.Item, {\n  base: [\n    'items-center',\n    'bg-white',\n    'border',\n    'border-grey-600',\n    'rounded-sm',\n    'cursor-pointer',\n    'flex',\n    'text-left',\n    'data-[state=checked]:-outline-offset-2',\n    'data-[state=checked]:outline-2',\n    'data-[state=checked]:outline-primary-800',\n    'data-[state=checked]:outline-solid'\n  ],\n  variants: {\n    align: {\n      left: ['flex-row'],\n      right: ['flex-row-reverse']\n    },\n    size: {\n      md: ['px-4', 'py-3'],\n      lg: ['px-8', 'py-4']\n    },\n    isFullWidth: {\n      true: ['w-full'],\n      false: ['w-max']\n    }\n  }\n})\n\nconst RadioButton = styled('div', {\n  base: [\n    'items-center',\n    'appearance-none',\n    'border',\n    'border-grey-900',\n    'rounded-full',\n    'flex',\n    'shrink-0',\n    'justify-center',\n    'size-4',\n    'transition-all',\n    'duration-50',\n    'ease-out',\n    'in-data-[state=checked]:bg-primary-800',\n    'in-data-[state=checked]:border-primary-800'\n  ],\n  variants: {\n    containerIsFullWidth: {\n      true: [],\n      false: []\n    },\n    align: {\n      left: ['mr-4'],\n      right: []\n    }\n  },\n  compoundVariants: [\n    {\n      containerIsFullWidth: true,\n      align: 'right',\n      class: ['ml-auto']\n    },\n    {\n      containerIsFullWidth: false,\n      align: 'right',\n      class: ['ml-4']\n    }\n  ]\n})\n\nconst Indicator = styled(RadioGroup.Indicator, {\n  base: ['bg-white', 'rounded-full', 'absolute', 'size-1.5']\n})\n\ntype RadioCardProps = React.ComponentProps<typeof StyledRadioCard>\n\nexport const RadioCard = ({\n  children,\n  isFullWidth = false,\n  size = 'md',\n  align = 'left',\n  ...rest\n}: RadioCardProps) => (\n  <StyledRadioCard\n    {...rest}\n    align={align}\n    isFullWidth={isFullWidth}\n    size={size}\n  >\n    <RadioButton align={align} containerIsFullWidth={isFullWidth}>\n      <Indicator />\n    </RadioButton>\n    <div>{children}</div>\n  </StyledRadioCard>\n)\n"],"names":["StyledRadioCard","styled","RadioGroup","RadioButton","Indicator","RadioCard","children","isFullWidth","size","align","rest","React"],"mappings":"+GAKA,MAAMA,EAAkBC,EAAOC,EAAW,KAAM,CAC9C,KAAM,CACJ,eACA,WACA,SACA,kBACA,aACA,iBACA,OACA,YACA,yCACA,iCACA,2CACA,oCACF,EACA,SAAU,CACR,MAAO,CACL,KAAM,CAAC,UAAU,EACjB,MAAO,CAAC,kBAAkB,CAC5B,EACA,KAAM,CACJ,GAAI,CAAC,OAAQ,MAAM,EACnB,GAAI,CAAC,OAAQ,MAAM,CACrB,EACA,YAAa,CACX,KAAM,CAAC,QAAQ,EACf,MAAO,CAAC,OAAO,CACjB,CACF,CACF,CAAC,EAEKC,EAAcF,EAAO,MAAO,CAChC,KAAM,CACJ,eACA,kBACA,SACA,kBACA,eACA,OACA,WACA,iBACA,SACA,iBACA,cACA,WACA,yCACA,4CACF,EACA,SAAU,CACR,qBAAsB,CACpB,KAAM,CAAA,EACN,MAAO,CACT,CAAA,EACA,MAAO,CACL,KAAM,CAAC,MAAM,EACb,MAAO,EACT,CACF,EACA,iBAAkB,CAChB,CACE,qBAAsB,GACtB,MAAO,QACP,MAAO,CAAC,SAAS,CACnB,EACA,CACE,qBAAsB,GACtB,MAAO,QACP,MAAO,CAAC,MAAM,CAChB,CACF,CACF,CAAC,EAEKG,EAAYH,EAAOC,EAAW,UAAW,CAC7C,KAAM,CAAC,WAAY,eAAgB,WAAY,UAAU,CAC3D,CAAC,EAIYG,EAAY,CAAC,CACxB,SAAAC,EACA,YAAAC,EAAc,GACd,KAAAC,EAAO,KACP,MAAAC,EAAQ,OACR,GAAGC,CACL,IACEC,EAAA,cAACX,EAAA,CACE,GAAGU,EACJ,MAAOD,EACP,YAAaF,EACb,KAAMC,CAAAA,EAENG,EAAA,cAACR,EAAA,CAAY,MAAOM,EAAO,qBAAsBF,GAC/CI,EAAA,cAACP,EAAA,IAAU,CACb,EACAO,EAAA,cAAC,MAAKL,KAAAA,CAAS,CACjB"}

package/dist/components/radio-card/RadioCardGroup.d.ts

@@ -1,7 +1,7 @@
 import * as RadioGroup from '@radix-ui/react-radio-group';
 import * as React from 'react';
-import type { Override } from '../../utilities';
-import { Flex } from '../flex';
+import type { Override } from '../../utilities/types';
+import { Flex } from '../flex/Flex';
 import { RadioCard } from './RadioCard';
 type RadioCardGroupProps = Override<Pick<React.ComponentProps<typeof Flex>, 'justify' | 'gap'> & React.ComponentProps<typeof RadioCard>, React.ComponentProps<typeof RadioGroup.Root>>;
 export declare const RadioCardGroup: ({ className, children, size, isFullWidth, align, gap, justify, ...rest }: RadioCardGroupProps) => React.JSX.Element;

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

@@ -1 +1 @@
-{"version":3,"file":"RadioCardGroup.js","sources":["../../../src/components/radio-card/RadioCardGroup.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport type { Override } from '~/utilities'\n\nimport { Flex } from '../flex'\nimport { RadioCard } from './RadioCard'\n\ntype RadioCardGroupProps = Override<\n  Pick<React.ComponentProps<typeof Flex>, 'justify' | 'gap'> &\n    React.ComponentProps<typeof RadioCard>,\n  React.ComponentProps<typeof RadioGroup.Root>\n>\n\nexport const RadioCardGroup = ({\n  className,\n  children,\n  size,\n  isFullWidth,\n  align,\n  gap = '3',\n  justify,\n  ...rest\n}: RadioCardGroupProps) => (\n  <RadioGroup.Root {...rest}>\n    <Flex\n      direction=\"row\"\n      justify={justify}\n      gap={gap}\n      wrap=\"wrap\"\n      className={className}\n    >\n      {React.Children.map(children, (child) => {\n        if (React.isValidElement(child) && child?.type === RadioCard) {\n          return React.cloneElement(\n            child as React.ReactElement<React.ComponentProps<typeof RadioCard>>,\n            { size, isFullWidth, align }\n          )\n        }\n        return child\n      })}\n    </Flex>\n  </RadioGroup.Root>\n)\n"],"names":["RadioCardGroup","className","children","size","isFullWidth","align","gap","justify","rest","React","RadioGroup","Flex","child","RadioCard"],"mappings":"wJAcO,MAAMA,EAAiB,CAAC,CAC7B,UAAAC,EACA,SAAAC,EACA,KAAAC,EACA,YAAAC,EACA,MAAAC,EACA,IAAAC,EAAM,IACN,QAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAW,KAAX,CAAiB,GAAGF,CAAAA,EACnBC,EAAA,cAACE,EAAA,CACC,UAAU,MACV,QAASJ,EACT,IAAKD,EACL,KAAK,OACL,UAAWL,GAEVQ,EAAM,SAAS,IAAIP,EAAWU,GACzBH,EAAM,eAAeG,CAAK,IAAKA,GAAA,YAAAA,EAAO,QAASC,EAC1CJ,EAAM,aACXG,EACA,CAAE,KAAAT,EAAM,YAAAC,EAAa,MAAAC,CAAM,CAC7B,EAEKO,CACR,CACH,CACF"}
+{"version":3,"file":"RadioCardGroup.js","sources":["../../../src/components/radio-card/RadioCardGroup.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport type { Override } from '~/utilities/types'\n\nimport { Flex } from '../flex/Flex'\nimport { RadioCard } from './RadioCard'\n\ntype RadioCardGroupProps = Override<\n  Pick<React.ComponentProps<typeof Flex>, 'justify' | 'gap'> &\n    React.ComponentProps<typeof RadioCard>,\n  React.ComponentProps<typeof RadioGroup.Root>\n>\n\nexport const RadioCardGroup = ({\n  className,\n  children,\n  size,\n  isFullWidth,\n  align,\n  gap = '3',\n  justify,\n  ...rest\n}: RadioCardGroupProps) => (\n  <RadioGroup.Root {...rest}>\n    <Flex\n      direction=\"row\"\n      justify={justify}\n      gap={gap}\n      wrap=\"wrap\"\n      className={className}\n    >\n      {React.Children.map(children, (child) => {\n        if (React.isValidElement(child) && child?.type === RadioCard) {\n          return React.cloneElement(\n            child as React.ReactElement<React.ComponentProps<typeof RadioCard>>,\n            { size, isFullWidth, align }\n          )\n        }\n        return child\n      })}\n    </Flex>\n  </RadioGroup.Root>\n)\n"],"names":["RadioCardGroup","className","children","size","isFullWidth","align","gap","justify","rest","React","RadioGroup","Flex","child","RadioCard"],"mappings":"wJAcO,MAAMA,EAAiB,CAAC,CAC7B,UAAAC,EACA,SAAAC,EACA,KAAAC,EACA,YAAAC,EACA,MAAAC,EACA,IAAAC,EAAM,IACN,QAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAW,KAAX,CAAiB,GAAGF,CAAAA,EACnBC,EAAA,cAACE,EAAA,CACC,UAAU,MACV,QAASJ,EACT,IAAKD,EACL,KAAK,OACL,UAAWL,GAEVQ,EAAM,SAAS,IAAIP,EAAWU,GACzBH,EAAM,eAAeG,CAAK,IAAKA,GAAA,YAAAA,EAAO,QAASC,EAC1CJ,EAAM,aACXG,EACA,CAAE,KAAAT,EAAM,YAAAC,EAAa,MAAAC,CAAM,CAC7B,EAEKO,CACR,CACH,CACF"}

package/dist/components/search-field/SearchField.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { FieldElementWrapperProps } from '../../components/field-wrapper';
-import { SearchInputProps } from '../../components/search-input';
+import { FieldElementWrapperProps } from '../../components/field-wrapper/FieldWrapper';
+import { SearchInputProps } from '../../components/search-input/SearchInput';
 type SearchFieldProps = SearchInputProps & FieldElementWrapperProps;
 export declare const SearchField: {
     ({ className, hideLabel, label, name, validation, prompt, description, appearance, ...remainingProps }: SearchFieldProps): React.JSX.Element;

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"SearchField.js","sources":["../../../src/components/search-field/SearchField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper'\nimport { useFieldError, useFormCustomContext } from '~/components/form'\nimport { SearchInput, SearchInputProps } from '~/components/search-input'\n\ntype SearchFieldProps = SearchInputProps & FieldElementWrapperProps\n\nexport const SearchField = ({\n  className,\n  hideLabel,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  appearance,\n  ...remainingProps\n}: SearchFieldProps) => {\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      className={className}\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      <SearchInput\n        id={name}\n        name={name}\n        ref={ref}\n        appearance={formAppearance}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nSearchField.displayName = 'SearchField'\n"],"names":["SearchField","className","hideLabel","label","name","validation","prompt","description","appearance","remainingProps","register","useFormContext","context","useFormCustomContext","error","useFieldError","ref","formAppearance","React","FieldWrapper","SearchInput"],"mappings":"6YAYa,MAAAA,EAAc,CAAC,CAC1B,UAAAC,EACA,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,WAAAC,EACA,GAAGC,CACL,IAAwB,CACtB,KAAM,CAAE,SAAAC,CAAS,EAAIC,IACfC,EAAUC,EAAqB,EAC/B,CAAE,MAAAC,CAAM,EAAIC,EAAcX,CAAI,EAE9BY,EAAMX,EAAaK,EAASL,CAAU,EAAIK,EAC1CO,GAAiBL,GAAA,KAAA,OAAAA,EAAS,aAAcJ,EAE9C,OACEU,EAAA,cAACC,EAAA,CACC,UAAWlB,EACX,YAAaM,EACb,MAAOO,EACP,QAASV,EACT,UAAWF,EACX,MAAOC,EACP,OAAQG,EACR,SAAU,CAAA,EAAQD,GAAA,MAAAA,EAAY,UAC9B,WAAYY,CAAAA,EAEZC,EAAA,cAACE,EAAA,CACC,GAAIhB,EACJ,KAAMA,EACN,IAAKY,EACL,WAAYC,EACX,GAAIH,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGL,CAAAA,CACN,CACF,CAEJ,EAEAT,EAAY,YAAc"}
+{"version":3,"file":"SearchField.js","sources":["../../../src/components/search-field/SearchField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper/FieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\nimport { useFormCustomContext } from '~/components/form/useFormCustomContext'\nimport {\n  SearchInput,\n  SearchInputProps\n} from '~/components/search-input/SearchInput'\n\ntype SearchFieldProps = SearchInputProps & FieldElementWrapperProps\n\nexport const SearchField = ({\n  className,\n  hideLabel,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  appearance,\n  ...remainingProps\n}: SearchFieldProps) => {\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      className={className}\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      <SearchInput\n        id={name}\n        name={name}\n        ref={ref}\n        appearance={formAppearance}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nSearchField.displayName = 'SearchField'\n"],"names":["SearchField","className","hideLabel","label","name","validation","prompt","description","appearance","remainingProps","register","useFormContext","context","useFormCustomContext","error","useFieldError","ref","formAppearance","React","FieldWrapper","SearchInput"],"mappings":"sUAgBa,MAAAA,EAAc,CAAC,CAC1B,UAAAC,EACA,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,WAAAC,EACA,GAAGC,CACL,IAAwB,CACtB,KAAM,CAAE,SAAAC,CAAS,EAAIC,IACfC,EAAUC,EAAqB,EAC/B,CAAE,MAAAC,CAAM,EAAIC,EAAcX,CAAI,EAE9BY,EAAMX,EAAaK,EAASL,CAAU,EAAIK,EAC1CO,GAAiBL,GAAA,KAAAA,OAAAA,EAAS,aAAcJ,EAE9C,OACEU,EAAA,cAACC,EAAA,CACC,UAAWlB,EACX,YAAaM,EACb,MAAOO,EACP,QAASV,EACT,UAAWF,EACX,MAAOC,EACP,OAAQG,EACR,SAAU,CAAQD,EAAAA,GAAA,MAAAA,EAAY,UAC9B,WAAYY,CAEZC,EAAAA,EAAA,cAACE,EAAA,CACC,GAAIhB,EACJ,KAAMA,EACN,IAAKY,EACL,WAAYC,EACX,GAAIH,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGL,CACN,CAAA,CACF,CAEJ,EAEAT,EAAY,YAAc"}

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Input } from '../../components/input';
+import { Input } from '../../components/input/Input';
 export type SearchInputProps = React.ComponentProps<typeof Input> & {
     size?: 'sm' | 'md' | 'lg';
     className?: string;

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

@@ -1,2 +1,2 @@
-import{Search as k,Close as L}from"@atom-learning/icons";import i from"clsx";import*as t from"react";import{ActionIcon as N}from"../action-icon/ActionIcon.js";import{Icon as h}from"../icon/Icon.js";import{InputBackground as x,InputText as T}from"../input/Input.js";import{styled as M}from"../../styled.js";import"../../utilities/css-wrapper/CSSWrapper.js";import{getFieldIconSize as O}from"../../utilities/style/get-icon-size.js";import"../../utilities/no-overflow-wrapper/NoOverflowWrapper.js";import{useCallbackRef as V}from"../../utilities/hooks/useCallbackRef.js";var j=(e=>(e.SEARCH="SEARCH",e.CLEAR="CLEAR",e))(j||{});const B=M(h,{base:["text-grey-700","absolute","pointer-events-none"],variants:{size:{sm:["right-2","size-4"],md:["right-2.5","size-5"],lg:["right-2.5","size-5"]}}}),E=t.forwardRef(({size:e="md",appearance:f="standard",className:C,value:n,defaultValue:c="",onValueChange:s,clearText:b="Clear",onChange:m,...g},v)=>{const[u,R]=V(),[A,p]=t.useState(c),[S,d]=t.useState(c?"CLEAR":"SEARCH");t.useEffect(()=>{typeof n>"u"||(p(n),d(n?"CLEAR":"SEARCH"))},[n]);const z=t.useMemo(()=>O(e),[e]);t.useImperativeHandle(v,()=>u.current);const y=()=>{var r,a;const o=u.current;if(!o)return;const l=(r=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value"))==null?void 0:r.set;(a=l==null?void 0:l.call)==null||a.call(l,o,"");const H=new Event("input",{bubbles:!0});o.dispatchEvent(H),o.focus(),s==null||s("")},I=r=>{m==null||m(r);const a=r.target.value;p(a),s==null||s(a),d(a?"CLEAR":"SEARCH")},w=()=>S==="SEARCH"?t.createElement(B,{is:k,size:e,className:i(e=="sm"?"size-4":"size-5","top-1/2","-translate-y-1/2")}):t.createElement(N,{label:b,theme:"neutral",size:z,onClick:y,className:"absolute top-1/2 right-1 -translate-y-1/2"},t.createElement(h,{is:L}));return t.createElement(x,{size:e,appearance:f,className:i("relative","w-auto",C)},t.createElement(T,{ref:R,size:e,type:"search",...g,value:A,onChange:I,className:i(e==="sm"?"pr-8":"pr-10","[-webkit-search-decoration:hidden]","[-webkit-search-cancel-button:hidden]","[-webkit-search-results-button:hidden]")}),w())});E.displayName="SearchInput";export{E as SearchInput};
+import{Search as k,Close as L}from"@atom-learning/icons";import i from"clsx";import*as t from"react";import{ActionIcon as N}from"../action-icon/ActionIcon.js";import{Icon as h}from"../icon/Icon.js";import{InputBackground as x,InputText as T}from"../input/Input.js";import{styled as M}from"../../styled.js";import{useCallbackRef as O}from"../../utilities/hooks/useCallbackRef.js";import{getFieldIconSize as V}from"../../utilities/style/get-icon-size.js";var j=(e=>(e.SEARCH="SEARCH",e.CLEAR="CLEAR",e))(j||{});const B=M(h,{base:["text-grey-700","absolute","pointer-events-none"],variants:{size:{sm:["right-2","size-4"],md:["right-2.5","size-5"],lg:["right-2.5","size-5"]}}}),E=t.forwardRef(({size:e="md",appearance:f="standard",className:C,value:r,defaultValue:c="",onValueChange:s,clearText:b="Clear",onChange:u,...g},v)=>{const[m,R]=O(),[A,p]=t.useState(c),[S,d]=t.useState(c?"CLEAR":"SEARCH");t.useEffect(()=>{typeof r>"u"||(p(r),d(r?"CLEAR":"SEARCH"))},[r]);const z=t.useMemo(()=>V(e),[e]);t.useImperativeHandle(v,()=>m.current);const y=()=>{var n,a;const o=m.current;if(!o)return;const l=(n=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value"))==null?void 0:n.set;(a=l==null?void 0:l.call)==null||a.call(l,o,"");const H=new Event("input",{bubbles:!0});o.dispatchEvent(H),o.focus(),s==null||s("")},I=n=>{u==null||u(n);const a=n.target.value;p(a),s==null||s(a),d(a?"CLEAR":"SEARCH")},w=()=>S==="SEARCH"?t.createElement(B,{is:k,size:e,className:i(e=="sm"?"size-4":"size-5","top-1/2","-translate-y-1/2")}):t.createElement(N,{label:b,theme:"neutral",size:z,onClick:y,className:"absolute top-1/2 right-1 -translate-y-1/2"},t.createElement(h,{is:L}));return t.createElement(x,{size:e,appearance:f,className:i("relative","w-auto",C)},t.createElement(T,{ref:R,size:e,type:"search",...g,value:A,onChange:I,className:i(e==="sm"?"pr-8":"pr-10","[-webkit-search-decoration:hidden]","[-webkit-search-cancel-button:hidden]","[-webkit-search-results-button:hidden]")}),w())});E.displayName="SearchInput";export{E as SearchInput};
 //# sourceMappingURL=SearchInput.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.js","sources":["../../../src/components/search-input/SearchInput.tsx"],"sourcesContent":["import { Close, Search } from '@atom-learning/icons'\nimport clsx from 'clsx'\nimport * as React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon'\nimport { Icon } from '~/components/icon'\nimport { Input, InputBackground, InputText } from '~/components/input'\nimport { styled } from '~/styled'\nimport { getFieldIconSize } from '~/utilities'\nimport { useCallbackRef } from '~/utilities/hooks/useCallbackRef'\n\nexport type SearchInputProps = React.ComponentProps<typeof Input> & {\n  size?: 'sm' | 'md' | 'lg'\n  className?: string\n  value?: string\n  defaultValue?: string\n  onValueChange?: (newValue: string) => void\n  clearText?: string\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void\n}\n\nenum INPUT_ICON {\n  SEARCH = 'SEARCH',\n  CLEAR = 'CLEAR'\n}\n\nconst StyledIcon = styled(Icon, {\n  base: ['text-grey-700', 'absolute', 'pointer-events-none'],\n  variants: {\n    size: {\n      sm: ['right-2', 'size-4'],\n      md: ['right-2.5', 'size-5'],\n      lg: ['right-2.5', 'size-5']\n    }\n  }\n})\n\nexport const SearchInput = React.forwardRef<HTMLInputElement, SearchInputProps>(\n  (\n    {\n      size = 'md',\n      appearance = 'standard',\n      className,\n      value,\n      defaultValue = '',\n      onValueChange,\n      clearText = 'Clear',\n      onChange,\n      ...remainingProps\n    },\n    ref\n  ) => {\n    const [inputElRef, setInputElRef] = useCallbackRef()\n    const [innerValue, setInnerValue] = React.useState(defaultValue)\n    const [activeIcon, setActiveIcon] = React.useState<INPUT_ICON>(\n      defaultValue ? INPUT_ICON.CLEAR : INPUT_ICON.SEARCH\n    )\n    React.useEffect(() => {\n      if (typeof value === 'undefined') return\n      setInnerValue(value)\n      setActiveIcon(value ? INPUT_ICON.CLEAR : INPUT_ICON.SEARCH)\n    }, [value])\n\n    const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n    React.useImperativeHandle(ref, () => inputElRef.current as HTMLInputElement)\n\n    const handleClear = () => {\n      const inputEl = inputElRef.current\n      if (!inputEl) return\n\n      // https://stackoverflow.com/a/46012210\n      const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n        window.HTMLInputElement.prototype,\n        'value'\n      )?.set\n      nativeInputValueSetter?.call?.(inputEl, '')\n      const ev2 = new Event('input', {\n        bubbles: true\n      })\n      inputEl.dispatchEvent(ev2)\n      inputEl.focus()\n      onValueChange?.('')\n    }\n\n    const handleOnChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n      onChange?.(event)\n\n      const newValue = event.target.value\n      setInnerValue(newValue)\n      onValueChange?.(newValue)\n      setActiveIcon(newValue ? INPUT_ICON.CLEAR : INPUT_ICON.SEARCH)\n    }\n\n    const getIcon = () => {\n      if (activeIcon === INPUT_ICON.SEARCH)\n        return (\n          <StyledIcon\n            is={Search}\n            size={size}\n            className={clsx(\n              size == 'sm' ? 'size-4' : 'size-5',\n              'top-1/2',\n              '-translate-y-1/2'\n            )}\n          />\n        )\n\n      return (\n        <ActionIcon\n          label={clearText}\n          theme=\"neutral\"\n          size={iconSize}\n          onClick={handleClear}\n          className=\"absolute top-1/2 right-1 -translate-y-1/2\"\n        >\n          <Icon is={Close} />\n        </ActionIcon>\n      )\n    }\n\n    return (\n      <InputBackground\n        size={size}\n        appearance={appearance}\n        className={clsx('relative', 'w-auto', className)}\n      >\n        <InputText\n          ref={setInputElRef}\n          size={size}\n          type=\"search\"\n          {...remainingProps}\n          value={innerValue}\n          onChange={handleOnChange}\n          className={clsx(\n            size === 'sm' ? 'pr-8' : 'pr-10',\n            '[-webkit-search-decoration:hidden]',\n            '[-webkit-search-cancel-button:hidden]',\n            '[-webkit-search-results-button:hidden]'\n          )}\n        />\n        {getIcon()}\n      </InputBackground>\n    )\n  }\n)\n\nSearchInput.displayName = 'SearchInput'\n"],"names":["INPUT_ICON","M","StyledIcon","styled","Icon","SearchInput","React","size","appearance","className","value","defaultValue","onValueChange","clearText","onChange","remainingProps","ref","inputElRef","setInputElRef","useCallbackRef","innerValue","setInnerValue","activeIcon","setActiveIcon","iconSize","getFieldIconSize","handleClear","_a","_b","inputEl","nativeInputValueSetter","ev2","handleOnChange","event","newValue","getIcon","Search","clsx","ActionIcon","Close","InputBackground","InputText"],"mappings":"wjBAqBA,IAAKA,GAAAA,IACHA,EAAA,OAAS,SACTA,EAAA,MAAQ,QAFLA,IAAAC,GAAA,CAAA,CAAA,EAKL,MAAMC,EAAaC,EAAOC,EAAM,CAC9B,KAAM,CAAC,gBAAiB,WAAY,qBAAqB,EACzD,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAW,QAAQ,EACxB,GAAI,CAAC,YAAa,QAAQ,EAC1B,GAAI,CAAC,YAAa,QAAQ,CAC5B,CACF,CACF,CAAC,EAEYC,EAAcC,EAAM,WAC/B,CACE,CACE,KAAAC,EAAO,KACP,WAAAC,EAAa,WACb,UAAAC,EACA,MAAAC,EACA,aAAAC,EAAe,GACf,cAAAC,EACA,UAAAC,EAAY,QACZ,SAAAC,EACA,GAAGC,CACL,EACAC,IACG,CACH,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAC9B,EAAA,CAACC,EAAYC,CAAa,EAAIf,EAAM,SAASK,CAAY,EACzD,CAACW,EAAYC,CAAa,EAAIjB,EAAM,SACxCK,EAAe,QAAmB,QACpC,EACAL,EAAM,UAAU,IAAM,CAChB,OAAOI,EAAU,MACrBW,EAAcX,CAAK,EACnBa,EAAcb,EAAQ,QAAmB,QAAiB,EAC5D,EAAG,CAACA,CAAK,CAAC,EAEV,MAAMc,EAAWlB,EAAM,QAAQ,IAAMmB,EAAiBlB,CAAI,EAAG,CAACA,CAAI,CAAC,EAEnED,EAAM,oBAAoBU,EAAK,IAAMC,EAAW,OAA2B,EAE3E,MAAMS,EAAc,IAAM,CAnE9B,IAAAC,EAAAC,EAoEM,MAAMC,EAAUZ,EAAW,QAC3B,GAAI,CAACY,EAAS,OAGd,MAAMC,GAAyBH,EAAA,OAAO,yBACpC,OAAO,iBAAiB,UACxB,OACF,IAH+B,YAAAA,EAG5B,KACHC,EAAAE,GAAA,KAAA,OAAAA,EAAwB,OAAxB,MAAAF,EAAA,KAAAE,EAA+BD,EAAS,EAAA,EACxC,MAAME,EAAM,IAAI,MAAM,QAAS,CAC7B,QAAS,EACX,CAAC,EACDF,EAAQ,cAAcE,CAAG,EACzBF,EAAQ,MAAM,EACdjB,GAAA,MAAAA,EAAgB,EAClB,CAAA,EAEMoB,EAAkBC,GAA+C,CACrEnB,GAAA,MAAAA,EAAWmB,CAEX,EAAA,MAAMC,EAAWD,EAAM,OAAO,MAC9BZ,EAAca,CAAQ,EACtBtB,GAAA,MAAAA,EAAgBsB,CAChBX,EAAAA,EAAcW,EAAW,QAAmB,QAAiB,CAC/D,EAEMC,EAAU,IACVb,IAAe,SAEfhB,EAAA,cAACJ,EAAA,CACC,GAAIkC,EACJ,KAAM7B,EACN,UAAW8B,EACT9B,GAAQ,KAAO,SAAW,SAC1B,UACA,kBACF,EACF,EAIFD,EAAA,cAACgC,EAAA,CACC,MAAOzB,EACP,MAAM,UACN,KAAMW,EACN,QAASE,EACT,UAAU,2CAEVpB,EAAAA,EAAA,cAACF,EAAA,CAAK,GAAImC,CAAO,CAAA,CACnB,EAIJ,OACEjC,EAAA,cAACkC,EAAA,CACC,KAAMjC,EACN,WAAYC,EACZ,UAAW6B,EAAK,WAAY,SAAU5B,CAAS,CAE/CH,EAAAA,EAAA,cAACmC,EAAA,CACC,IAAKvB,EACL,KAAMX,EACN,KAAK,SACJ,GAAGQ,EACJ,MAAOK,EACP,SAAUY,EACV,UAAWK,EACT9B,IAAS,KAAO,OAAS,QACzB,qCACA,wCACA,wCACF,CAAA,CACF,EACC4B,EAAQ,CACX,CAEJ,CACF,EAEA9B,EAAY,YAAc"}
+{"version":3,"file":"SearchInput.js","sources":["../../../src/components/search-input/SearchInput.tsx"],"sourcesContent":["import { Close, Search } from '@atom-learning/icons'\nimport clsx from 'clsx'\nimport * as React from 'react'\n\nimport { ActionIcon } from '~/components/action-icon/ActionIcon'\nimport { Icon } from '~/components/icon/Icon'\nimport { Input, InputBackground, InputText } from '~/components/input/Input'\nimport { styled } from '~/styled'\nimport { useCallbackRef } from '~/utilities/hooks/useCallbackRef'\nimport { getFieldIconSize } from '~/utilities/style/get-icon-size'\n\nexport type SearchInputProps = React.ComponentProps<typeof Input> & {\n  size?: 'sm' | 'md' | 'lg'\n  className?: string\n  value?: string\n  defaultValue?: string\n  onValueChange?: (newValue: string) => void\n  clearText?: string\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void\n}\n\nenum INPUT_ICON {\n  SEARCH = 'SEARCH',\n  CLEAR = 'CLEAR'\n}\n\nconst StyledIcon = styled(Icon, {\n  base: ['text-grey-700', 'absolute', 'pointer-events-none'],\n  variants: {\n    size: {\n      sm: ['right-2', 'size-4'],\n      md: ['right-2.5', 'size-5'],\n      lg: ['right-2.5', 'size-5']\n    }\n  }\n})\n\nexport const SearchInput = React.forwardRef<HTMLInputElement, SearchInputProps>(\n  (\n    {\n      size = 'md',\n      appearance = 'standard',\n      className,\n      value,\n      defaultValue = '',\n      onValueChange,\n      clearText = 'Clear',\n      onChange,\n      ...remainingProps\n    },\n    ref\n  ) => {\n    const [inputElRef, setInputElRef] = useCallbackRef()\n    const [innerValue, setInnerValue] = React.useState(defaultValue)\n    const [activeIcon, setActiveIcon] = React.useState<INPUT_ICON>(\n      defaultValue ? INPUT_ICON.CLEAR : INPUT_ICON.SEARCH\n    )\n    React.useEffect(() => {\n      if (typeof value === 'undefined') return\n      setInnerValue(value)\n      setActiveIcon(value ? INPUT_ICON.CLEAR : INPUT_ICON.SEARCH)\n    }, [value])\n\n    const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n    React.useImperativeHandle(ref, () => inputElRef.current as HTMLInputElement)\n\n    const handleClear = () => {\n      const inputEl = inputElRef.current\n      if (!inputEl) return\n\n      // https://stackoverflow.com/a/46012210\n      const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n        window.HTMLInputElement.prototype,\n        'value'\n      )?.set\n      nativeInputValueSetter?.call?.(inputEl, '')\n      const ev2 = new Event('input', {\n        bubbles: true\n      })\n      inputEl.dispatchEvent(ev2)\n      inputEl.focus()\n      onValueChange?.('')\n    }\n\n    const handleOnChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n      onChange?.(event)\n\n      const newValue = event.target.value\n      setInnerValue(newValue)\n      onValueChange?.(newValue)\n      setActiveIcon(newValue ? INPUT_ICON.CLEAR : INPUT_ICON.SEARCH)\n    }\n\n    const getIcon = () => {\n      if (activeIcon === INPUT_ICON.SEARCH)\n        return (\n          <StyledIcon\n            is={Search}\n            size={size}\n            className={clsx(\n              size == 'sm' ? 'size-4' : 'size-5',\n              'top-1/2',\n              '-translate-y-1/2'\n            )}\n          />\n        )\n\n      return (\n        <ActionIcon\n          label={clearText}\n          theme=\"neutral\"\n          size={iconSize}\n          onClick={handleClear}\n          className=\"absolute top-1/2 right-1 -translate-y-1/2\"\n        >\n          <Icon is={Close} />\n        </ActionIcon>\n      )\n    }\n\n    return (\n      <InputBackground\n        size={size}\n        appearance={appearance}\n        className={clsx('relative', 'w-auto', className)}\n      >\n        <InputText\n          ref={setInputElRef}\n          size={size}\n          type=\"search\"\n          {...remainingProps}\n          value={innerValue}\n          onChange={handleOnChange}\n          className={clsx(\n            size === 'sm' ? 'pr-8' : 'pr-10',\n            '[-webkit-search-decoration:hidden]',\n            '[-webkit-search-cancel-button:hidden]',\n            '[-webkit-search-results-button:hidden]'\n          )}\n        />\n        {getIcon()}\n      </InputBackground>\n    )\n  }\n)\n\nSearchInput.displayName = 'SearchInput'\n"],"names":["INPUT_ICON","M","StyledIcon","styled","Icon","SearchInput","React","size","appearance","className","value","defaultValue","onValueChange","clearText","onChange","remainingProps","ref","inputElRef","setInputElRef","useCallbackRef","innerValue","setInnerValue","activeIcon","setActiveIcon","iconSize","getFieldIconSize","handleClear","_a","_b","inputEl","nativeInputValueSetter","ev2","handleOnChange","event","newValue","getIcon","Search","clsx","ActionIcon","Close","InputBackground","InputText"],"mappings":"qcAqBA,IAAKA,GAAAA,IACHA,EAAA,OAAS,SACTA,EAAA,MAAQ,QAFLA,IAAAC,GAAA,CAAA,CAAA,EAKL,MAAMC,EAAaC,EAAOC,EAAM,CAC9B,KAAM,CAAC,gBAAiB,WAAY,qBAAqB,EACzD,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAW,QAAQ,EACxB,GAAI,CAAC,YAAa,QAAQ,EAC1B,GAAI,CAAC,YAAa,QAAQ,CAC5B,CACF,CACF,CAAC,EAEYC,EAAcC,EAAM,WAC/B,CACE,CACE,KAAAC,EAAO,KACP,WAAAC,EAAa,WACb,UAAAC,EACA,MAAAC,EACA,aAAAC,EAAe,GACf,cAAAC,EACA,UAAAC,EAAY,QACZ,SAAAC,EACA,GAAGC,CACL,EACAC,IACG,CACH,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAC9B,EAAA,CAACC,EAAYC,CAAa,EAAIf,EAAM,SAASK,CAAY,EACzD,CAACW,EAAYC,CAAa,EAAIjB,EAAM,SACxCK,EAAe,QAAmB,QACpC,EACAL,EAAM,UAAU,IAAM,CAChB,OAAOI,EAAU,MACrBW,EAAcX,CAAK,EACnBa,EAAcb,EAAQ,QAAmB,QAAiB,EAC5D,EAAG,CAACA,CAAK,CAAC,EAEV,MAAMc,EAAWlB,EAAM,QAAQ,IAAMmB,EAAiBlB,CAAI,EAAG,CAACA,CAAI,CAAC,EAEnED,EAAM,oBAAoBU,EAAK,IAAMC,EAAW,OAA2B,EAE3E,MAAMS,EAAc,IAAM,CAnE9B,IAAAC,EAAAC,EAoEM,MAAMC,EAAUZ,EAAW,QAC3B,GAAI,CAACY,EAAS,OAGd,MAAMC,GAAyBH,EAAA,OAAO,yBACpC,OAAO,iBAAiB,UACxB,OACF,IAH+B,YAAAA,EAG5B,KACHC,EAAAE,GAAA,KAAA,OAAAA,EAAwB,OAAxB,MAAAF,EAAA,KAAAE,EAA+BD,EAAS,EAAA,EACxC,MAAME,EAAM,IAAI,MAAM,QAAS,CAC7B,QAAS,EACX,CAAC,EACDF,EAAQ,cAAcE,CAAG,EACzBF,EAAQ,MAAM,EACdjB,GAAA,MAAAA,EAAgB,EAClB,CAAA,EAEMoB,EAAkBC,GAA+C,CACrEnB,GAAA,MAAAA,EAAWmB,CAEX,EAAA,MAAMC,EAAWD,EAAM,OAAO,MAC9BZ,EAAca,CAAQ,EACtBtB,GAAA,MAAAA,EAAgBsB,CAChBX,EAAAA,EAAcW,EAAW,QAAmB,QAAiB,CAC/D,EAEMC,EAAU,IACVb,IAAe,SAEfhB,EAAA,cAACJ,EAAA,CACC,GAAIkC,EACJ,KAAM7B,EACN,UAAW8B,EACT9B,GAAQ,KAAO,SAAW,SAC1B,UACA,kBACF,EACF,EAIFD,EAAA,cAACgC,EAAA,CACC,MAAOzB,EACP,MAAM,UACN,KAAMW,EACN,QAASE,EACT,UAAU,2CAEVpB,EAAAA,EAAA,cAACF,EAAA,CAAK,GAAImC,CAAO,CAAA,CACnB,EAIJ,OACEjC,EAAA,cAACkC,EAAA,CACC,KAAMjC,EACN,WAAYC,EACZ,UAAW6B,EAAK,WAAY,SAAU5B,CAAS,CAE/CH,EAAAA,EAAA,cAACmC,EAAA,CACC,IAAKvB,EACL,KAAMX,EACN,KAAK,SACJ,GAAGQ,EACJ,MAAOK,EACP,SAAUY,EACV,UAAWK,EACT9B,IAAS,KAAO,OAAS,QACzB,qCACA,wCACA,wCACF,CAAA,CACF,EACC4B,EAAQ,CACX,CAEJ,CACF,EAEA9B,EAAY,YAAc"}

package/dist/components/section-message/SectionMessage.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import { Flex } from '../flex';
+import { Flex } from '../flex/Flex';
 declare const StyledSectionMessage: React.ForwardRefExoticComponent<Omit<import("../dismissible/DismissibleRoot").IDismissibleRootInternalProps & import("../dismissible/DismissibleRoot").IDismissibleRootProps & {
     children?: React.ReactNode | undefined;
 }, "theme" | "hasDismiss" | "hasIcon"> & {
-    theme?: "warning" | "error" | "success" | "info" | "neutral" | undefined;
+    theme?: "neutral" | "success" | "warning" | "info" | "error" | undefined;
     hasIcon?: boolean | undefined;
     hasDismiss?: boolean | undefined;
 } & {

package/dist/components/section-message/SectionMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionMessage.js","sources":["../../../src/components/section-message/SectionMessage.tsx"],"sourcesContent":["import { TooltipProvider } from '@radix-ui/react-tooltip'\nimport React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Dismissible } from '../dismissible'\nimport { Flex } from '../flex'\nimport {\n  SectionMessageProvider,\n  useSectionMessageContext\n} from './SectionMessageContext'\nimport { SectionMessageDescription } from './SectionMessageDescription'\nimport { SectionMessageDismiss } from './SectionMessageDismiss'\nimport { SectionMessageIcon } from './SectionMessageIcon'\nimport {\n  SectionMessageActions,\n  SectionMessageContent\n} from './SectionMessageLayout'\nimport { SectionMessageTitle } from './SectionMessageTitle'\n\nconst StyledSectionMessage = styled(Dismissible, {\n  base: [\n    'relative',\n    'rounded-md',\n    'flex',\n    'shrink-0',\n    'min-h-12',\n    'p-4',\n    'border',\n    'border-white'\n  ],\n  variants: {\n    theme: {\n      success: ['bg-success-light', 'text-success-dark'],\n      warning: ['bg-warning-light', 'text-warning-text'],\n      error: ['bg-danger-light', 'text-danger-dark'],\n      neutral: ['bg-grey-100', 'text-grey-1000'],\n      info: ['bg-info-light', 'text-info-dark']\n    },\n    hasIcon: {\n      true: ['pl-10']\n    },\n    hasDismiss: {\n      true: ['pr-12']\n    }\n  }\n})\n\nconst SectionMessageRoot = ({\n  children,\n  ...rest\n}: React.ComponentProps<typeof StyledSectionMessage> & {\n  className?: string\n}) => {\n  const { theme, hasIcon, hasDismiss } = useSectionMessageContext()\n\n  return (\n    <StyledSectionMessage\n      {...rest}\n      theme={theme}\n      hasIcon={hasIcon}\n      hasDismiss={hasDismiss}\n    >\n      <Flex gap={3} justify=\"space-between\" className=\"grow\">\n        {children}\n      </Flex>\n    </StyledSectionMessage>\n  )\n}\n\nexport type SectionMessageTheme =\n  | 'success'\n  | 'warning'\n  | 'error'\n  | 'neutral'\n  | 'info'\n\nexport type SectionMessageProps = React.ComponentProps<\n  typeof SectionMessageRoot\n> & {\n  theme?: SectionMessageTheme\n}\n\nexport const SectionMessage = ({\n  theme = 'info',\n  ...rest\n}: SectionMessageProps) => (\n  <TooltipProvider>\n    <SectionMessageProvider theme={theme}>\n      <SectionMessageRoot {...rest} />\n    </SectionMessageProvider>\n  </TooltipProvider>\n)\n\nSectionMessage.Title = SectionMessageTitle\nSectionMessage.Description = SectionMessageDescription\nSectionMessage.Icon = SectionMessageIcon\nSectionMessage.Dismiss = SectionMessageDismiss\nSectionMessage.Content = SectionMessageContent\nSectionMessage.Actions = SectionMessageActions\n"],"names":["StyledSectionMessage","styled","Dismissible","SectionMessageRoot","children","rest","theme","hasIcon","hasDismiss","useSectionMessageContext","React","Flex","SectionMessage","TooltipProvider","SectionMessageProvider","SectionMessageTitle","SectionMessageDescription","SectionMessageIcon","SectionMessageDismiss","SectionMessageContent","SectionMessageActions"],"mappings":"8pBAoBA,MAAMA,EAAuBC,EAAOC,EAAa,CAC/C,KAAM,CACJ,WACA,aACA,OACA,WACA,WACA,MACA,SACA,cACF,EACA,SAAU,CACR,MAAO,CACL,QAAS,CAAC,mBAAoB,mBAAmB,EACjD,QAAS,CAAC,mBAAoB,mBAAmB,EACjD,MAAO,CAAC,kBAAmB,kBAAkB,EAC7C,QAAS,CAAC,cAAe,gBAAgB,EACzC,KAAM,CAAC,gBAAiB,gBAAgB,CAC1C,EACA,QAAS,CACP,KAAM,CAAC,OAAO,CAChB,EACA,WAAY,CACV,KAAM,CAAC,OAAO,CAChB,CACF,CACF,CAAC,EAEKC,EAAqB,CAAC,CAC1B,SAAAC,EACA,GAAGC,CACL,IAEM,CACJ,KAAM,CAAE,MAAAC,EAAO,QAAAC,EAAS,WAAAC,CAAW,EAAIC,IAEvC,OACEC,EAAA,cAACV,EAAA,CACE,GAAGK,EACJ,MAAOC,EACP,QAASC,EACT,WAAYC,GAEZE,EAAA,cAACC,EAAA,CAAK,IAAK,EAAG,QAAQ,gBAAgB,UAAU,QAC7CP,CACH,CACF,CAEJ,EAeaQ,EAAiB,CAAC,CAC7B,MAAAN,EAAQ,OACR,GAAGD,CACL,IACEK,EAAA,cAACG,EAAA,KACCH,EAAA,cAACI,EAAA,CAAuB,MAAOR,CAC7BI,EAAAA,EAAA,cAACP,EAAA,CAAoB,GAAGE,CAAM,CAAA,CAChC,CACF,EAGFO,EAAe,MAAQG,EACvBH,EAAe,YAAcI,EAC7BJ,EAAe,KAAOK,EACtBL,EAAe,QAAUM,EACzBN,EAAe,QAAUO,EACzBP,EAAe,QAAUQ"}
+{"version":3,"file":"SectionMessage.js","sources":["../../../src/components/section-message/SectionMessage.tsx"],"sourcesContent":["import { TooltipProvider } from '@radix-ui/react-tooltip'\nimport React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Dismissible } from '../dismissible'\nimport { Flex } from '../flex/Flex'\nimport {\n  SectionMessageProvider,\n  useSectionMessageContext\n} from './SectionMessageContext'\nimport { SectionMessageDescription } from './SectionMessageDescription'\nimport { SectionMessageDismiss } from './SectionMessageDismiss'\nimport { SectionMessageIcon } from './SectionMessageIcon'\nimport {\n  SectionMessageActions,\n  SectionMessageContent\n} from './SectionMessageLayout'\nimport { SectionMessageTitle } from './SectionMessageTitle'\n\nconst StyledSectionMessage = styled(Dismissible, {\n  base: [\n    'relative',\n    'rounded-md',\n    'flex',\n    'shrink-0',\n    'min-h-12',\n    'p-4',\n    'border',\n    'border-white'\n  ],\n  variants: {\n    theme: {\n      success: ['bg-success-light', 'text-success-dark'],\n      warning: ['bg-warning-light', 'text-warning-text'],\n      error: ['bg-danger-light', 'text-danger-dark'],\n      neutral: ['bg-grey-100', 'text-grey-1000'],\n      info: ['bg-info-light', 'text-info-dark']\n    },\n    hasIcon: {\n      true: ['pl-10']\n    },\n    hasDismiss: {\n      true: ['pr-12']\n    }\n  }\n})\n\nconst SectionMessageRoot = ({\n  children,\n  ...rest\n}: React.ComponentProps<typeof StyledSectionMessage> & {\n  className?: string\n}) => {\n  const { theme, hasIcon, hasDismiss } = useSectionMessageContext()\n\n  return (\n    <StyledSectionMessage\n      {...rest}\n      theme={theme}\n      hasIcon={hasIcon}\n      hasDismiss={hasDismiss}\n    >\n      <Flex gap={3} justify=\"space-between\" className=\"grow\">\n        {children}\n      </Flex>\n    </StyledSectionMessage>\n  )\n}\n\nexport type SectionMessageTheme =\n  | 'success'\n  | 'warning'\n  | 'error'\n  | 'neutral'\n  | 'info'\n\nexport type SectionMessageProps = React.ComponentProps<\n  typeof SectionMessageRoot\n> & {\n  theme?: SectionMessageTheme\n}\n\nexport const SectionMessage = ({\n  theme = 'info',\n  ...rest\n}: SectionMessageProps) => (\n  <TooltipProvider>\n    <SectionMessageProvider theme={theme}>\n      <SectionMessageRoot {...rest} />\n    </SectionMessageProvider>\n  </TooltipProvider>\n)\n\nSectionMessage.Title = SectionMessageTitle\nSectionMessage.Description = SectionMessageDescription\nSectionMessage.Icon = SectionMessageIcon\nSectionMessage.Dismiss = SectionMessageDismiss\nSectionMessage.Content = SectionMessageContent\nSectionMessage.Actions = SectionMessageActions\n"],"names":["StyledSectionMessage","styled","Dismissible","SectionMessageRoot","children","rest","theme","hasIcon","hasDismiss","useSectionMessageContext","React","Flex","SectionMessage","TooltipProvider","SectionMessageProvider","SectionMessageTitle","SectionMessageDescription","SectionMessageIcon","SectionMessageDismiss","SectionMessageContent","SectionMessageActions"],"mappings":"8pBAoBA,MAAMA,EAAuBC,EAAOC,EAAa,CAC/C,KAAM,CACJ,WACA,aACA,OACA,WACA,WACA,MACA,SACA,cACF,EACA,SAAU,CACR,MAAO,CACL,QAAS,CAAC,mBAAoB,mBAAmB,EACjD,QAAS,CAAC,mBAAoB,mBAAmB,EACjD,MAAO,CAAC,kBAAmB,kBAAkB,EAC7C,QAAS,CAAC,cAAe,gBAAgB,EACzC,KAAM,CAAC,gBAAiB,gBAAgB,CAC1C,EACA,QAAS,CACP,KAAM,CAAC,OAAO,CAChB,EACA,WAAY,CACV,KAAM,CAAC,OAAO,CAChB,CACF,CACF,CAAC,EAEKC,EAAqB,CAAC,CAC1B,SAAAC,EACA,GAAGC,CACL,IAEM,CACJ,KAAM,CAAE,MAAAC,EAAO,QAAAC,EAAS,WAAAC,CAAW,EAAIC,IAEvC,OACEC,EAAA,cAACV,EAAA,CACE,GAAGK,EACJ,MAAOC,EACP,QAASC,EACT,WAAYC,GAEZE,EAAA,cAACC,EAAA,CAAK,IAAK,EAAG,QAAQ,gBAAgB,UAAU,QAC7CP,CACH,CACF,CAEJ,EAeaQ,EAAiB,CAAC,CAC7B,MAAAN,EAAQ,OACR,GAAGD,CACL,IACEK,EAAA,cAACG,EAAA,KACCH,EAAA,cAACI,EAAA,CAAuB,MAAOR,CAC7BI,EAAAA,EAAA,cAACP,EAAA,CAAoB,GAAGE,CAAM,CAAA,CAChC,CACF,EAGFO,EAAe,MAAQG,EACvBH,EAAe,YAAcI,EAC7BJ,EAAe,KAAOK,EACtBL,EAAe,QAAUM,EACzBN,EAAe,QAAUO,EACzBP,EAAe,QAAUQ"}

package/dist/components/section-message/SectionMessageDescription.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { Text } from '../text';
+import { Text } from '../text/Text';
 export declare const SectionMessageDescription: ({ className, ...rest }: React.ComponentProps<typeof Text>) => JSX.Element;

package/dist/components/section-message/SectionMessageDescription.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageDescription.js","sources":["../../../src/components/section-message/SectionMessageDescription.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { Text } from '../text'\n\nexport const SectionMessageDescription = ({\n  className,\n  ...rest\n}: React.ComponentProps<typeof Text>): JSX.Element => (\n  <Text size=\"sm\" {...rest} className={clsx('text-grey-900', className)} />\n)\n"],"names":["SectionMessageDescription","className","rest","React","Text","clsx"],"mappings":"gFAKO,MAAMA,EAA4B,CAAC,CACxC,UAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAK,KAAK,KAAM,GAAGF,EAAM,UAAWG,EAAK,gBAAiBJ,CAAS,CAAG,CAAA"}
+{"version":3,"file":"SectionMessageDescription.js","sources":["../../../src/components/section-message/SectionMessageDescription.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { Text } from '../text/Text'\n\nexport const SectionMessageDescription = ({\n  className,\n  ...rest\n}: React.ComponentProps<typeof Text>): JSX.Element => (\n  <Text size=\"sm\" {...rest} className={clsx('text-grey-900', className)} />\n)\n"],"names":["SectionMessageDescription","className","rest","React","Text","clsx"],"mappings":"gFAKO,MAAMA,EAA4B,CAAC,CACxC,UAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAA,CAAK,KAAK,KAAM,GAAGF,EAAM,UAAWG,EAAK,gBAAiBJ,CAAS,CAAG,CAAA"}

package/dist/components/section-message/SectionMessageDismiss.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { ActionIcon } from '../action-icon';
+import { ActionIcon } from '../action-icon/ActionIcon';
 export declare const SectionMessageDismiss: ({ label, className, ...rest }: React.ComponentProps<typeof ActionIcon>) => JSX.Element;

package/dist/components/section-message/SectionMessageDismiss.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageDismiss.js","sources":["../../../src/components/section-message/SectionMessageDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport clsx from 'clsx'\nimport React, { useEffect } from 'react'\n\nimport { ActionIcon } from '../action-icon'\nimport { Dismissible } from '../dismissible'\nimport { Icon } from '../icon'\nimport { useSectionMessageContext } from './SectionMessageContext'\n\nexport const SectionMessageDismiss = ({\n  label = 'Dismiss',\n  className,\n  ...rest\n}: React.ComponentProps<typeof ActionIcon>): JSX.Element => {\n  const { setHasDismiss } = useSectionMessageContext()\n\n  useEffect(() => {\n    setHasDismiss(true)\n    return () => setHasDismiss(false)\n  }, [setHasDismiss])\n\n  return (\n    <Dismissible.Trigger asChild>\n      <ActionIcon\n        label={label}\n        size=\"sm\"\n        appearance=\"simple\"\n        theme=\"neutral\"\n        {...rest}\n        className={clsx('m-auto', 'absolute', 'top-2', 'right-2', className)}\n      >\n        <Icon is={Close} />\n      </ActionIcon>\n    </Dismissible.Trigger>\n  )\n}\n"],"names":["SectionMessageDismiss","label","className","rest","setHasDismiss","useSectionMessageContext","useEffect","React","Dismissible","ActionIcon","clsx","Icon","Close"],"mappings":"mUASa,MAAAA,EAAwB,CAAC,CACpC,MAAAC,EAAQ,UACR,UAAAC,EACA,GAAGC,CACL,IAA4D,CAC1D,KAAM,CAAE,cAAAC,CAAc,EAAIC,EAAyB,EAEnD,OAAAC,EAAU,KACRF,EAAc,EAAI,EACX,IAAMA,EAAc,EAAK,GAC/B,CAACA,CAAa,CAAC,EAGhBG,EAAA,cAACC,EAAY,QAAZ,CAAoB,QAAO,IAC1BD,EAAA,cAACE,EAAA,CACC,MAAOR,EACP,KAAK,KACL,WAAW,SACX,MAAM,UACL,GAAGE,EACJ,UAAWO,EAAK,SAAU,WAAY,QAAS,UAAWR,CAAS,CAAA,EAEnEK,EAAA,cAACI,EAAA,CAAK,GAAIC,CAAAA,CAAO,CACnB,CACF,CAEJ"}
+{"version":3,"file":"SectionMessageDismiss.js","sources":["../../../src/components/section-message/SectionMessageDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport clsx from 'clsx'\nimport React, { useEffect } from 'react'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Dismissible } from '../dismissible'\nimport { Icon } from '../icon/Icon'\nimport { useSectionMessageContext } from './SectionMessageContext'\n\nexport const SectionMessageDismiss = ({\n  label = 'Dismiss',\n  className,\n  ...rest\n}: React.ComponentProps<typeof ActionIcon>): JSX.Element => {\n  const { setHasDismiss } = useSectionMessageContext()\n\n  useEffect(() => {\n    setHasDismiss(true)\n    return () => setHasDismiss(false)\n  }, [setHasDismiss])\n\n  return (\n    <Dismissible.Trigger asChild>\n      <ActionIcon\n        label={label}\n        size=\"sm\"\n        appearance=\"simple\"\n        theme=\"neutral\"\n        {...rest}\n        className={clsx('m-auto', 'absolute', 'top-2', 'right-2', className)}\n      >\n        <Icon is={Close} />\n      </ActionIcon>\n    </Dismissible.Trigger>\n  )\n}\n"],"names":["SectionMessageDismiss","label","className","rest","setHasDismiss","useSectionMessageContext","useEffect","React","Dismissible","ActionIcon","clsx","Icon","Close"],"mappings":"mUASa,MAAAA,EAAwB,CAAC,CACpC,MAAAC,EAAQ,UACR,UAAAC,EACA,GAAGC,CACL,IAA4D,CAC1D,KAAM,CAAE,cAAAC,CAAc,EAAIC,EAAyB,EAEnD,OAAAC,EAAU,KACRF,EAAc,EAAI,EACX,IAAMA,EAAc,EAAK,GAC/B,CAACA,CAAa,CAAC,EAGhBG,EAAA,cAACC,EAAY,QAAZ,CAAoB,QAAO,IAC1BD,EAAA,cAACE,EAAA,CACC,MAAOR,EACP,KAAK,KACL,WAAW,SACX,MAAM,UACL,GAAGE,EACJ,UAAWO,EAAK,SAAU,WAAY,QAAS,UAAWR,CAAS,CAAA,EAEnEK,EAAA,cAACI,EAAA,CAAK,GAAIC,CAAAA,CAAO,CACnB,CACF,CAEJ"}

package/dist/components/section-message/SectionMessageIcon.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Icon } from '../icon';
+import { Icon } from '../icon/Icon';
 type SectionMessageIconProps = Partial<React.ComponentProps<typeof Icon>>;
 export declare const SectionMessageIcon: ({ className, is, ...rest }: SectionMessageIconProps) => JSX.Element;
 export {};

package/dist/components/section-message/SectionMessageIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageIcon.js","sources":["../../../src/components/section-message/SectionMessageIcon.tsx"],"sourcesContent":["import { Danger, Error, Info, OkCircle } from '@atom-learning/icons'\nimport clsx from 'clsx'\nimport React, { useEffect } from 'react'\n\nimport { Icon } from '../icon'\nimport { useSectionMessageContext } from './SectionMessageContext'\n\nconst themeIcons = {\n  success: OkCircle,\n  warning: Danger,\n  error: Error,\n  neutral: Info,\n  info: Info\n}\n\ntype SectionMessageIconProps = Partial<React.ComponentProps<typeof Icon>>\n\nexport const SectionMessageIcon = ({\n  className,\n  is,\n  ...rest\n}: SectionMessageIconProps): JSX.Element => {\n  const { theme, setHasIcon } = useSectionMessageContext()\n\n  useEffect(() => {\n    setHasIcon(true)\n    return () => setHasIcon(false)\n  }, [setHasIcon])\n\n  return (\n    <Icon\n      is={is || themeIcons[theme]}\n      size=\"sm\"\n      {...rest}\n      className={clsx(\n        'm-auto',\n        'absolute',\n        'left-4',\n        'top-4',\n        'text-current',\n        className\n      )}\n    />\n  )\n}\n"],"names":["themeIcons","OkCircle","Danger","Error","Info","SectionMessageIcon","className","is","rest","theme","setHasIcon","useSectionMessageContext","useEffect","React","Icon","clsx"],"mappings":"uPAOA,MAAMA,EAAa,CACjB,QAASC,EACT,QAASC,EACT,MAAOC,EACP,QAASC,EACT,KAAMA,CACR,EAIaC,EAAqB,CAAC,CACjC,UAAAC,EACA,GAAAC,EACA,GAAGC,CACL,IAA4C,CAC1C,KAAM,CAAE,MAAAC,EAAO,WAAAC,CAAW,EAAIC,EAAyB,EAEvD,OAAAC,EAAU,KACRF,EAAW,EAAI,EACR,IAAMA,EAAW,EAAK,GAC5B,CAACA,CAAU,CAAC,EAGbG,EAAA,cAACC,EAAA,CACC,GAAIP,GAAMP,EAAWS,CAAK,EAC1B,KAAK,KACJ,GAAGD,EACJ,UAAWO,EACT,SACA,WACA,SACA,QACA,eACAT,CACF,CAAA,CACF,CAEJ"}
+{"version":3,"file":"SectionMessageIcon.js","sources":["../../../src/components/section-message/SectionMessageIcon.tsx"],"sourcesContent":["import { Danger, Error, Info, OkCircle } from '@atom-learning/icons'\nimport clsx from 'clsx'\nimport React, { useEffect } from 'react'\n\nimport { Icon } from '../icon/Icon'\nimport { useSectionMessageContext } from './SectionMessageContext'\n\nconst themeIcons = {\n  success: OkCircle,\n  warning: Danger,\n  error: Error,\n  neutral: Info,\n  info: Info\n}\n\ntype SectionMessageIconProps = Partial<React.ComponentProps<typeof Icon>>\n\nexport const SectionMessageIcon = ({\n  className,\n  is,\n  ...rest\n}: SectionMessageIconProps): JSX.Element => {\n  const { theme, setHasIcon } = useSectionMessageContext()\n\n  useEffect(() => {\n    setHasIcon(true)\n    return () => setHasIcon(false)\n  }, [setHasIcon])\n\n  return (\n    <Icon\n      is={is || themeIcons[theme]}\n      size=\"sm\"\n      {...rest}\n      className={clsx(\n        'm-auto',\n        'absolute',\n        'left-4',\n        'top-4',\n        'text-current',\n        className\n      )}\n    />\n  )\n}\n"],"names":["themeIcons","OkCircle","Danger","Error","Info","SectionMessageIcon","className","is","rest","theme","setHasIcon","useSectionMessageContext","useEffect","React","Icon","clsx"],"mappings":"uPAOA,MAAMA,EAAa,CACjB,QAASC,EACT,QAASC,EACT,MAAOC,EACP,QAASC,EACT,KAAMA,CACR,EAIaC,EAAqB,CAAC,CACjC,UAAAC,EACA,GAAAC,EACA,GAAGC,CACL,IAA4C,CAC1C,KAAM,CAAE,MAAAC,EAAO,WAAAC,CAAW,EAAIC,EAAyB,EAEvD,OAAAC,EAAU,KACRF,EAAW,EAAI,EACR,IAAMA,EAAW,EAAK,GAC5B,CAACA,CAAU,CAAC,EAGbG,EAAA,cAACC,EAAA,CACC,GAAIP,GAAMP,EAAWS,CAAK,EAC1B,KAAK,KACJ,GAAGD,EACJ,UAAWO,EACT,SACA,WACA,SACA,QACA,eACAT,CACF,CAAA,CACF,CAEJ"}

package/dist/components/section-message/SectionMessageLayout.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Flex } from '../flex';
+import { Flex } from '../flex/Flex';
 export declare const SectionMessageContent: ({ className, ...rest }: React.HTMLAttributes<HTMLDivElement> & {
     className?: string;
 }) => JSX.Element;

package/dist/components/section-message/SectionMessageLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageLayout.js","sources":["../../../src/components/section-message/SectionMessageLayout.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { Flex } from '../flex'\n\nexport const SectionMessageContent = ({\n  className,\n  ...rest\n}: React.HTMLAttributes<HTMLDivElement> & {\n  className?: string\n}): JSX.Element => (\n  <div\n    {...rest}\n    className={clsx(\n      'max-w-full',\n      'shrink-0',\n      'pt-0.5',\n      '*:not-last:mb-2',\n      className\n    )}\n  />\n)\n\nexport const SectionMessageActions = ({\n  className,\n  ...rest\n}: React.ComponentProps<typeof Flex> & { className?: string }): JSX.Element => (\n  <div className={clsx('max-w-full', 'shrink-0', className)}>\n    <Flex wrap=\"wrap\" gap={3} {...rest} />\n  </div>\n)\n"],"names":["SectionMessageContent","className","rest","React","clsx","SectionMessageActions","Flex"],"mappings":"gFAKa,MAAAA,EAAwB,CAAC,CACpC,UAAAC,EACA,GAAGC,CACL,IAGEC,EAAA,cAAC,MAAA,CACE,GAAGD,EACJ,UAAWE,EACT,aACA,WACA,SACA,kBACAH,CACF,CAAA,CACF,EAGWI,EAAwB,CAAC,CACpC,UAAAJ,EACA,GAAGC,CACL,IACEC,EAAA,cAAC,MAAA,CAAI,UAAWC,EAAK,aAAc,WAAYH,CAAS,CAAA,EACtDE,EAAA,cAACG,EAAA,CAAK,KAAK,OAAO,IAAK,EAAI,GAAGJ,CAAAA,CAAM,CACtC"}
+{"version":3,"file":"SectionMessageLayout.js","sources":["../../../src/components/section-message/SectionMessageLayout.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { Flex } from '../flex/Flex'\n\nexport const SectionMessageContent = ({\n  className,\n  ...rest\n}: React.HTMLAttributes<HTMLDivElement> & {\n  className?: string\n}): JSX.Element => (\n  <div\n    {...rest}\n    className={clsx(\n      'max-w-full',\n      'shrink-0',\n      'pt-0.5',\n      '*:not-last:mb-2',\n      className\n    )}\n  />\n)\n\nexport const SectionMessageActions = ({\n  className,\n  ...rest\n}: React.ComponentProps<typeof Flex> & { className?: string }): JSX.Element => (\n  <div className={clsx('max-w-full', 'shrink-0', className)}>\n    <Flex wrap=\"wrap\" gap={3} {...rest} />\n  </div>\n)\n"],"names":["SectionMessageContent","className","rest","React","clsx","SectionMessageActions","Flex"],"mappings":"gFAKa,MAAAA,EAAwB,CAAC,CACpC,UAAAC,EACA,GAAGC,CACL,IAGEC,EAAA,cAAC,MAAA,CACE,GAAGD,EACJ,UAAWE,EACT,aACA,WACA,SACA,kBACAH,CACF,CAAA,CACF,EAGWI,EAAwB,CAAC,CACpC,UAAAJ,EACA,GAAGC,CACL,IACEC,EAAA,cAAC,MAAA,CAAI,UAAWC,EAAK,aAAc,WAAYH,CAAS,CAAA,EACtDE,EAAA,cAACG,EAAA,CAAK,KAAK,OAAO,IAAK,EAAI,GAAGJ,CAAAA,CAAM,CACtC"}

package/dist/components/section-message/SectionMessageTitle.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { Text } from '../text';
+import { Text } from '../text/Text';
 export declare const SectionMessageTitle: (props: React.ComponentProps<typeof Text>) => JSX.Element;

package/dist/components/section-message/SectionMessageTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageTitle.js","sources":["../../../src/components/section-message/SectionMessageTitle.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Text } from '../text'\n\nexport const SectionMessageTitle = (\n  props: React.ComponentProps<typeof Text>\n): JSX.Element => <Text size=\"md\" weight=\"bold\" {...props} />\n"],"names":["SectionMessageTitle","props","React","Text"],"mappings":"kEAIaA,EACXC,GACgBC,EAAA,cAACC,EAAA,CAAK,KAAK,KAAK,OAAO,OAAQ,GAAGF,CAAO,CAAA"}
+{"version":3,"file":"SectionMessageTitle.js","sources":["../../../src/components/section-message/SectionMessageTitle.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Text } from '../text/Text'\n\nexport const SectionMessageTitle = (\n  props: React.ComponentProps<typeof Text>\n): JSX.Element => <Text size=\"md\" weight=\"bold\" {...props} />\n"],"names":["SectionMessageTitle","props","React","Text"],"mappings":"kEAIaA,EACXC,GACgBC,EAAA,cAACC,EAAA,CAAK,KAAK,KAAK,OAAO,OAAQ,GAAGF,CAAO,CAAA"}

package/dist/components/segmented-control/SegmentedControl.d.ts

@@ -1,10 +1,6 @@
 export declare const SegmentedControl: {
     Root: ({ size, theme, defaultValue, children, ...props }: React.PropsWithChildren<import("./SegmentedControlRoot").SegmentedControlRootProps>) => React.JSX.Element;
-    Item: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("@radix-ui/react-tabs").TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>, never> & {
-        as?: import("react").ElementType;
-    } & {
-        value: string;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "theme" | "size"> & {
+    Item: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@radix-ui/react-tabs").TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "size" | "theme"> & {
         theme?: ("primary" | "marsh" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "primary" | "marsh">>) | undefined;
         size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
     } & {
@@ -16,7 +12,7 @@ export declare const SegmentedControl: {
         size?: ("sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl">>) | undefined;
         noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
         weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
-        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "body" | "display" | "mono">>) | undefined;
+        family?: ("display" | "body" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "display" | "body" | "mono">>) | undefined;
     } & {
         as?: import("react").ElementType;
     }, "as"> & {
@@ -32,7 +28,7 @@ export declare const SegmentedControl: {
         size?: ("sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl">>) | undefined;
         noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
         weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
-        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "body" | "display" | "mono">>) | undefined;
+        family?: ("display" | "body" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "display" | "body" | "mono">>) | undefined;
     } & {
         as?: import("react").ElementType;
     }, "as"> & {

package/dist/components/segmented-control/SegmentedControlBadge.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-import { Badge } from '../badge';
+import { Badge } from '../badge/Badge';
 export declare const SegmentedControlBadge: ({ className, ...props }: Omit<React.ComponentProps<typeof Badge>, "size">) => JSX.Element;

package/dist/components/segmented-control/SegmentedControlBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlBadge.js","sources":["../../../src/components/segmented-control/SegmentedControlBadge.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Badge } from '../badge'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst badgeSizeMap = {\n  sm: 'xs',\n  md: 'xs',\n  lg: 'sm'\n}\n\nexport const SegmentedControlBadge = ({\n  className,\n  ...props\n}: Omit<React.ComponentProps<typeof Badge>, 'size'>): JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return (\n    <Badge\n      {...props}\n      size={badgeSizeMap[size as string]}\n      className={clsx('border-none', className, 'font-normal')}\n    />\n  )\n}\n"],"names":["badgeSizeMap","SegmentedControlBadge","className","props","size","React","SegmentedControlContext","Badge","clsx"],"mappings":"6JAMA,MAAMA,EAAe,CACnB,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EAAwB,CAAC,CACpC,UAAAC,EACA,GAAGC,CACL,IAAqE,CACnE,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OACED,EAAA,cAACE,EAAA,CACE,GAAGJ,EACJ,KAAMH,EAAaI,CAAc,EACjC,UAAWI,EAAK,cAAeN,EAAW,aAAa,CAAA,CACzD,CAEJ"}
+{"version":3,"file":"SegmentedControlBadge.js","sources":["../../../src/components/segmented-control/SegmentedControlBadge.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Badge } from '../badge/Badge'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst badgeSizeMap = {\n  sm: 'xs',\n  md: 'xs',\n  lg: 'sm'\n}\n\nexport const SegmentedControlBadge = ({\n  className,\n  ...props\n}: Omit<React.ComponentProps<typeof Badge>, 'size'>): JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return (\n    <Badge\n      {...props}\n      size={badgeSizeMap[size as string]}\n      className={clsx('border-none', className, 'font-normal')}\n    />\n  )\n}\n"],"names":["badgeSizeMap","SegmentedControlBadge","className","props","size","React","SegmentedControlContext","Badge","clsx"],"mappings":"6JAMA,MAAMA,EAAe,CACnB,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EAAwB,CAAC,CACpC,UAAAC,EACA,GAAGC,CACL,IAAqE,CACnE,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OACED,EAAA,cAACE,EAAA,CACE,GAAGJ,EACJ,KAAMH,EAAaI,CAAc,EACjC,UAAWI,EAAK,cAAeN,EAAW,aAAa,CAAA,CACzD,CAEJ"}

package/dist/components/segmented-control/SegmentedControlContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlContent.js","sources":["../../../src/components/segmented-control/SegmentedControlContent.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Tabs } from '../tabs'\n\nexport const SegmentedControlContent = Tabs.Content\n"],"names":["SegmentedControlContent","Tabs"],"mappings":"uCAIO,MAAMA,EAA0BC,EAAK"}
+{"version":3,"file":"SegmentedControlContent.js","sources":["../../../src/components/segmented-control/SegmentedControlContent.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Tabs } from '../tabs/Tabs'\n\nexport const SegmentedControlContent = Tabs.Content\n"],"names":["SegmentedControlContent","Tabs"],"mappings":"uCAIO,MAAMA,EAA0BC,EAAK"}

package/dist/components/segmented-control/SegmentedControlContext.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Tabs } from '../tabs';
+import { Tabs } from '../tabs/Tabs';
 import type { SegmentedControlTheme } from './SegmentedControl.types';
 import type { SegmentedControlRootProps } from './SegmentedControlRoot';
 export interface SegmentedControlContextValue extends Pick<React.ComponentProps<typeof Tabs>, 'defaultValue' | 'value' | 'onValueChange'> {

package/dist/components/segmented-control/SegmentedControlContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlContext.js","sources":["../../../src/components/segmented-control/SegmentedControlContext.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Tabs } from '../tabs'\nimport type { SegmentedControlTheme } from './SegmentedControl.types'\nimport type { SegmentedControlRootProps } from './SegmentedControlRoot'\n\nexport interface SegmentedControlContextValue\n  extends Pick<\n    React.ComponentProps<typeof Tabs>,\n    'defaultValue' | 'value' | 'onValueChange'\n  > {\n  size: SegmentedControlRootProps['size']\n  theme: SegmentedControlTheme\n}\n\nexport const SegmentedControlContext =\n  React.createContext<SegmentedControlContextValue>({\n    size: 'md',\n    theme: 'primary',\n    defaultValue: '',\n    value: '',\n    onValueChange: () => null\n  })\n"],"names":["SegmentedControlContext","React"],"mappings":"wBAeO,MAAMA,EACXC,EAAM,cAA4C,CAChD,KAAM,KACN,MAAO,UACP,aAAc,GACd,MAAO,GACP,cAAe,IAAM,IACvB,CAAC"}
+{"version":3,"file":"SegmentedControlContext.js","sources":["../../../src/components/segmented-control/SegmentedControlContext.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Tabs } from '../tabs/Tabs'\nimport type { SegmentedControlTheme } from './SegmentedControl.types'\nimport type { SegmentedControlRootProps } from './SegmentedControlRoot'\n\nexport interface SegmentedControlContextValue extends Pick<\n  React.ComponentProps<typeof Tabs>,\n  'defaultValue' | 'value' | 'onValueChange'\n> {\n  size: SegmentedControlRootProps['size']\n  theme: SegmentedControlTheme\n}\n\nexport const SegmentedControlContext =\n  React.createContext<SegmentedControlContextValue>({\n    size: 'md',\n    theme: 'primary',\n    defaultValue: '',\n    value: '',\n    onValueChange: () => null\n  })\n"],"names":["SegmentedControlContext","React"],"mappings":"wBAcO,MAAMA,EACXC,EAAM,cAA4C,CAChD,KAAM,KACN,MAAO,UACP,aAAc,GACd,MAAO,GACP,cAAe,IAAM,IACvB,CAAC"}

package/dist/components/segmented-control/SegmentedControlDescription.d.ts

@@ -5,7 +5,7 @@ declare const StyledText: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Om
     size?: ("sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl">>) | undefined;
     noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
-    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "body" | "display" | "mono">>) | undefined;
+    family?: ("display" | "body" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "display" | "body" | "mono">>) | undefined;
 } & {
     as?: React.ElementType;
 }, "as"> & {

package/dist/components/segmented-control/SegmentedControlDescription.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlDescription.js","sources":["../../../src/components/segmented-control/SegmentedControlDescription.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Text } from '../text'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledText = styled(\n  Text,\n  {\n    base: ['font-body', 'text-text-subtle', 'font-normal'],\n    variants: {\n      size: {\n        sm: ['text-xs', 'leading-[1.6]'],\n        md: ['text-sm', 'leading-[1.53]'],\n        lg: ['text-md', 'leading-normal']\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport const SegmentedControlDescription = (\n  props: Omit<React.ComponentProps<typeof StyledText>, 'size'>\n): JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <StyledText {...props} size={size} />\n}\n"],"names":["StyledText","styled","Text","SegmentedControlDescription","props","size","React","SegmentedControlContext"],"mappings":"+KAOA,MAAMA,EAAaC,EACjBC,EACA,CACE,KAAM,CAAC,YAAa,mBAAoB,aAAa,EACrD,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAW,eAAe,EAC/B,GAAI,CAAC,UAAW,gBAAgB,EAChC,GAAI,CAAC,UAAW,gBAAgB,CAClC,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAEaC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OAAOD,EAAA,cAACN,EAAA,CAAY,GAAGI,EAAO,KAAMC,EAAM,CAC5C"}
+{"version":3,"file":"SegmentedControlDescription.js","sources":["../../../src/components/segmented-control/SegmentedControlDescription.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Text } from '../text/Text'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledText = styled(\n  Text,\n  {\n    base: ['font-body', 'text-text-subtle', 'font-normal'],\n    variants: {\n      size: {\n        sm: ['text-xs', 'leading-[1.6]'],\n        md: ['text-sm', 'leading-[1.53]'],\n        lg: ['text-md', 'leading-normal']\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport const SegmentedControlDescription = (\n  props: Omit<React.ComponentProps<typeof StyledText>, 'size'>\n): JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <StyledText {...props} size={size} />\n}\n"],"names":["StyledText","styled","Text","SegmentedControlDescription","props","size","React","SegmentedControlContext"],"mappings":"+KAOA,MAAMA,EAAaC,EACjBC,EACA,CACE,KAAM,CAAC,YAAa,mBAAoB,aAAa,EACrD,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAW,eAAe,EAC/B,GAAI,CAAC,UAAW,gBAAgB,EAChC,GAAI,CAAC,UAAW,gBAAgB,CAClC,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAEaC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OAAOD,EAAA,cAACN,EAAA,CAAY,GAAGI,EAAO,KAAMC,EAAM,CAC5C"}

package/dist/components/segmented-control/SegmentedControlHeading.d.ts

@@ -5,7 +5,7 @@ declare const StyledHeading: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit
     size?: ("sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl">>) | undefined;
     noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
-    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "body" | "display" | "mono">>) | undefined;
+    family?: ("display" | "body" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "display" | "body" | "mono">>) | undefined;
 } & {
     as?: React.ElementType;
 }, "as"> & {

package/dist/components/segmented-control/SegmentedControlHeading.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlHeading.js","sources":["../../../src/components/segmented-control/SegmentedControlHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Text } from '../text'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledHeading = styled(\n  Text,\n  {\n    base: ['font-body', 'text-text-regular'],\n    variants: {\n      size: {\n        sm: ['text-sm', 'leading-[1.53]'],\n        md: ['text-md', 'leading-normal'],\n        lg: ['text-lg', 'leading-[1.52]']\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport const SegmentedControlHeading = (\n  props: Omit<React.ComponentProps<typeof StyledHeading>, 'size'>\n): JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <StyledHeading {...props} size={size} />\n}\n"],"names":["StyledHeading","styled","Text","SegmentedControlHeading","props","size","React","SegmentedControlContext"],"mappings":"+KAOA,MAAMA,EAAgBC,EACpBC,EACA,CACE,KAAM,CAAC,YAAa,mBAAmB,EACvC,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAW,gBAAgB,EAChC,GAAI,CAAC,UAAW,gBAAgB,EAChC,GAAI,CAAC,UAAW,gBAAgB,CAClC,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAEaC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OAAOD,EAAA,cAACN,EAAA,CAAe,GAAGI,EAAO,KAAMC,EAAM,CAC/C"}
+{"version":3,"file":"SegmentedControlHeading.js","sources":["../../../src/components/segmented-control/SegmentedControlHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Text } from '../text/Text'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledHeading = styled(\n  Text,\n  {\n    base: ['font-body', 'text-text-regular'],\n    variants: {\n      size: {\n        sm: ['text-sm', 'leading-[1.53]'],\n        md: ['text-md', 'leading-normal'],\n        lg: ['text-lg', 'leading-[1.52]']\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport const SegmentedControlHeading = (\n  props: Omit<React.ComponentProps<typeof StyledHeading>, 'size'>\n): JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <StyledHeading {...props} size={size} />\n}\n"],"names":["StyledHeading","styled","Text","SegmentedControlHeading","props","size","React","SegmentedControlContext"],"mappings":"+KAOA,MAAMA,EAAgBC,EACpBC,EACA,CACE,KAAM,CAAC,YAAa,mBAAmB,EACvC,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAW,gBAAgB,EAChC,GAAI,CAAC,UAAW,gBAAgB,EAChC,GAAI,CAAC,UAAW,gBAAgB,CAClC,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAEaC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OAAOD,EAAA,cAACN,EAAA,CAAe,GAAGI,EAAO,KAAMC,EAAM,CAC/C"}

package/dist/components/segmented-control/SegmentedControlIcon.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-import { Icon } from '../icon';
+import { Icon } from '../icon/Icon';
 export declare const SegmentedControlIcon: (props: Omit<React.ComponentProps<typeof Icon>, "size">) => JSX.Element;

package/dist/components/segmented-control/SegmentedControlIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlIcon.js","sources":["../../../src/components/segmented-control/SegmentedControlIcon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '../icon'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst sizeMap = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'md'\n}\n\nexport const SegmentedControlIcon = (\n  props: Omit<React.ComponentProps<typeof Icon>, 'size'>\n): JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <Icon {...props} size={sizeMap[size as string]} />\n}\n"],"names":["sizeMap","SegmentedControlIcon","props","size","React","SegmentedControlContext","Icon"],"mappings":"sIAKA,MAAMA,EAAU,CACd,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OAAOD,EAAA,cAACE,EAAA,CAAM,GAAGJ,EAAO,KAAMF,EAAQG,CAAc,EAAG,CACzD"}
+{"version":3,"file":"SegmentedControlIcon.js","sources":["../../../src/components/segmented-control/SegmentedControlIcon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '../icon/Icon'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst sizeMap = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'md'\n}\n\nexport const SegmentedControlIcon = (\n  props: Omit<React.ComponentProps<typeof Icon>, 'size'>\n): JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <Icon {...props} size={sizeMap[size as string]} />\n}\n"],"names":["sizeMap","SegmentedControlIcon","props","size","React","SegmentedControlContext","Icon"],"mappings":"sIAKA,MAAMA,EAAU,CACd,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EACXC,GACgB,CAChB,KAAM,CAAE,KAAAC,CAAK,EAAIC,EAAM,WAAWC,CAAuB,EAEzD,OAAOD,EAAA,cAACE,EAAA,CAAM,GAAGJ,EAAO,KAAMF,EAAQG,CAAc,EAAG,CACzD"}

package/dist/components/segmented-control/SegmentedControlItem.d.ts

@@ -1,9 +1,5 @@
 import * as React from 'react';
-export declare const SegmentedControlItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("@radix-ui/react-tabs").TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, never> & {
-    as?: React.ElementType;
-} & {
-    value: string;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>, "theme" | "size"> & {
+export declare const SegmentedControlItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@radix-ui/react-tabs").TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "size" | "theme"> & {
     theme?: ("primary" | "marsh" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "primary" | "marsh">>) | undefined;
     size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
 } & {

package/dist/components/segmented-control/SegmentedControlItem.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as n}from"../../styled.js";import{Tabs as d}from"../tabs/Tabs.js";import{SegmentedControlContext as m}from"./SegmentedControlContext.js";const p=n(d.Trigger,{base:["relative","bg-transparent","rounded-md","p-0","z-2","min-w-35","border-2","border-transparent","[&>div]:hidden","[&>span]:flex","[&>span]:flex-col","[&>span]:items-center","data-[state=active]:border-2","data-[state=active]:border-transparent","data-[state=active]:focus-visible:border-primary-800","data-[state=active]:focus-visible:shadow-none","data-[state=active]:font-semibold","data-[state=active]:shadow-none","data-[state=active]:text-(--text-bold)","data-[state=inactive]:font-normal","data-[state=inactive]:text-grey-900","disabled:opacity-30"],variants:{theme:{primary:["data-[state=inactive]:hover:bg-primary-300","focus-visible:border-primary-800"],marsh:["data-[state=inactive]:hover:bg-marsh-300","focus-visible:border-marsh-800"]},size:{sm:["flex-[unset]","gap-3","px-6","py-4"],md:["flex-1","gap-4","px-4","py-6"],lg:["flex-1","gap-4","px-4","py-6"]}}},{enabledResponsiveVariants:!0}),t=e.forwardRef(({children:a,...r},s)=>{const{size:i,theme:o}=e.useContext(m);return e.createElement(p,{...r,theme:o,size:i,ref:s},a)});t.displayName="SegmentedControlItem";export{t as SegmentedControlItem};
+import{Trigger as n}from"@radix-ui/react-tabs";import*as e from"react";import{styled as d}from"../../styled.js";import{SegmentedControlContext as m}from"./SegmentedControlContext.js";const l=d(n,{base:["relative","rounded-md","z-2","min-w-35","border-2","border-transparent","cursor-pointer","select-none","flex","flex-col","items-center","data-[state=active]:border-2","data-[state=active]:border-transparent","data-[state=active]:focus-visible:border-primary-800","data-[state=active]:focus-visible:shadow-none","data-[state=active]:font-semibold","data-[state=active]:shadow-none","data-[state=active]:text-(--text-bold)","data-[state=inactive]:font-normal","data-[state=inactive]:text-grey-900","disabled:cursor-not-allowed","disabled:opacity-30","focus-visible:outline-none"],variants:{theme:{primary:["data-[state=inactive]:hover:bg-primary-300","focus-visible:border-primary-800"],marsh:["data-[state=inactive]:hover:bg-marsh-300","focus-visible:border-marsh-800"]},size:{sm:["flex-[unset]","gap-2","px-6","py-4"],md:["flex-1","gap-3","px-4","py-6"],lg:["flex-1","gap-4","px-4","py-6"]}}},{enabledResponsiveVariants:!0}),t=e.forwardRef(({children:a,...r},o)=>{const{size:s,theme:i}=e.useContext(m);return e.createElement(l,{...r,theme:i,size:s,ref:o},a)});t.displayName="SegmentedControlItem";export{t as SegmentedControlItem};
 //# sourceMappingURL=SegmentedControlItem.js.map

package/dist/components/segmented-control/SegmentedControlItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlItem.js","sources":["../../../src/components/segmented-control/SegmentedControlItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Tabs } from '../tabs'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledItem = styled(\n  Tabs.Trigger,\n  {\n    base: [\n      'relative',\n      'bg-transparent',\n      'rounded-md',\n      'p-0',\n      'z-2',\n      'min-w-35',\n      'border-2',\n      'border-transparent',\n      '[&>div]:hidden',\n      '[&>span]:flex',\n      '[&>span]:flex-col',\n      '[&>span]:items-center',\n      'data-[state=active]:border-2',\n      'data-[state=active]:border-transparent',\n      'data-[state=active]:focus-visible:border-primary-800',\n      'data-[state=active]:focus-visible:shadow-none',\n      'data-[state=active]:font-semibold',\n      'data-[state=active]:shadow-none',\n      'data-[state=active]:text-(--text-bold)',\n      'data-[state=inactive]:font-normal',\n      'data-[state=inactive]:text-grey-900',\n      'disabled:opacity-30'\n    ],\n    variants: {\n      theme: {\n        primary: [\n          'data-[state=inactive]:hover:bg-primary-300',\n          'focus-visible:border-primary-800'\n        ],\n        marsh: [\n          'data-[state=inactive]:hover:bg-marsh-300',\n          'focus-visible:border-marsh-800'\n        ]\n      },\n      size: {\n        sm: ['flex-[unset]', 'gap-3', 'px-6', 'py-4'],\n        md: ['flex-1', 'gap-4', 'px-4', 'py-6'],\n        lg: ['flex-1', 'gap-4', 'px-4', 'py-6']\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport const SegmentedControlItem = React.forwardRef<\n  HTMLButtonElement,\n  Omit<React.ComponentProps<typeof StyledItem>, 'size'>\n>(({ children, ...props }, ref) => {\n  const { size, theme } = React.useContext(SegmentedControlContext)\n\n  return (\n    <StyledItem {...props} theme={theme} size={size} ref={ref}>\n      {children}\n    </StyledItem>\n  )\n})\n\nSegmentedControlItem.displayName = 'SegmentedControlItem'\n"],"names":["StyledItem","styled","Tabs","SegmentedControlItem","React","children","props","ref","size","theme","SegmentedControlContext"],"mappings":"+KAOA,MAAMA,EAAaC,EACjBC,EAAK,QACL,CACE,KAAM,CACJ,WACA,iBACA,aACA,MACA,MACA,WACA,WACA,qBACA,iBACA,gBACA,oBACA,wBACA,+BACA,yCACA,uDACA,gDACA,oCACA,kCACA,yCACA,oCACA,sCACA,qBACF,EACA,SAAU,CACR,MAAO,CACL,QAAS,CACP,6CACA,kCACF,EACA,MAAO,CACL,2CACA,gCACF,CACF,EACA,KAAM,CACJ,GAAI,CAAC,eAAgB,QAAS,OAAQ,MAAM,EAC5C,GAAI,CAAC,SAAU,QAAS,OAAQ,MAAM,EACtC,GAAI,CAAC,SAAU,QAAS,OAAQ,MAAM,CACxC,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAEaC,EAAuBC,EAAM,WAGxC,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAM,EAAGC,IAAQ,CACjC,KAAM,CAAE,KAAAC,EAAM,MAAAC,CAAM,EAAIL,EAAM,WAAWM,CAAuB,EAEhE,OACEN,EAAA,cAACJ,EAAA,CAAY,GAAGM,EAAO,MAAOG,EAAO,KAAMD,EAAM,IAAKD,CAAAA,EACnDF,CACH,CAEJ,CAAC,EAEDF,EAAqB,YAAc"}
+{"version":3,"file":"SegmentedControlItem.js","sources":["../../../src/components/segmented-control/SegmentedControlItem.tsx"],"sourcesContent":["import { Trigger } from '@radix-ui/react-tabs'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledItem = styled(\n  Trigger,\n  {\n    base: [\n      'relative',\n      'rounded-md',\n      'z-2',\n      'min-w-35',\n      'border-2',\n      'border-transparent',\n      'cursor-pointer',\n      'select-none',\n      'flex',\n      'flex-col',\n      'items-center',\n      'data-[state=active]:border-2',\n      'data-[state=active]:border-transparent',\n      'data-[state=active]:focus-visible:border-primary-800',\n      'data-[state=active]:focus-visible:shadow-none',\n      'data-[state=active]:font-semibold',\n      'data-[state=active]:shadow-none',\n      'data-[state=active]:text-(--text-bold)',\n      'data-[state=inactive]:font-normal',\n      'data-[state=inactive]:text-grey-900',\n      'disabled:cursor-not-allowed',\n      'disabled:opacity-30',\n      'focus-visible:outline-none'\n    ],\n    variants: {\n      theme: {\n        primary: [\n          'data-[state=inactive]:hover:bg-primary-300',\n          'focus-visible:border-primary-800'\n        ],\n        marsh: [\n          'data-[state=inactive]:hover:bg-marsh-300',\n          'focus-visible:border-marsh-800'\n        ]\n      },\n      size: {\n        sm: ['flex-[unset]', 'gap-2', 'px-6', 'py-4'],\n        md: ['flex-1', 'gap-3', 'px-4', 'py-6'],\n        lg: ['flex-1', 'gap-4', 'px-4', 'py-6']\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport const SegmentedControlItem = React.forwardRef<\n  HTMLButtonElement,\n  Omit<React.ComponentProps<typeof StyledItem>, 'size'>\n>(({ children, ...props }, ref) => {\n  const { size, theme } = React.useContext(SegmentedControlContext)\n\n  return (\n    <StyledItem {...props} theme={theme} size={size} ref={ref}>\n      {children}\n    </StyledItem>\n  )\n})\n\nSegmentedControlItem.displayName = 'SegmentedControlItem'\n"],"names":["StyledItem","styled","Trigger","SegmentedControlItem","React","children","props","ref","size","theme","SegmentedControlContext"],"mappings":"uLAOA,MAAMA,EAAaC,EACjBC,EACA,CACE,KAAM,CACJ,WACA,aACA,MACA,WACA,WACA,qBACA,iBACA,cACA,OACA,WACA,eACA,+BACA,yCACA,uDACA,gDACA,oCACA,kCACA,yCACA,oCACA,sCACA,8BACA,sBACA,4BACF,EACA,SAAU,CACR,MAAO,CACL,QAAS,CACP,6CACA,kCACF,EACA,MAAO,CACL,2CACA,gCACF,CACF,EACA,KAAM,CACJ,GAAI,CAAC,eAAgB,QAAS,OAAQ,MAAM,EAC5C,GAAI,CAAC,SAAU,QAAS,OAAQ,MAAM,EACtC,GAAI,CAAC,SAAU,QAAS,OAAQ,MAAM,CACxC,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAEaC,EAAuBC,EAAM,WAGxC,CAAC,CAAE,SAAAC,EAAU,GAAGC,CAAM,EAAGC,IAAQ,CACjC,KAAM,CAAE,KAAAC,EAAM,MAAAC,CAAM,EAAIL,EAAM,WAAWM,CAAuB,EAEhE,OACEN,EAAA,cAACJ,EAAA,CAAY,GAAGM,EAAO,MAAOG,EAAO,KAAMD,EAAM,IAAKD,CAAAA,EACnDF,CACH,CAEJ,CAAC,EAEDF,EAAqB,YAAc"}

package/dist/components/segmented-control/SegmentedControlItemList.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-import { Tabs } from '../tabs';
+import { Tabs } from '../tabs/Tabs';
 export declare const SegmentedControlItemList: (props: React.ComponentProps<typeof Tabs.TriggerList>) => JSX.Element;

package/dist/components/segmented-control/SegmentedControlItemList.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlItemList.js","sources":["../../../src/components/segmented-control/SegmentedControlItemList.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Tabs } from '../tabs'\nimport { SegmentedControlContext } from './SegmentedControlContext'\nimport { SegmentedControlItem } from './SegmentedControlItem'\n\nconst StyledTriggerList = styled(Tabs.TriggerList, {\n  base: [\n    'relative',\n    'p-1',\n    'rounded-lg',\n    'overflow-hidden',\n    '[&>div[role=tablist]]:relative',\n    '[&>button]:z-2'\n  ],\n  variants: {\n    theme: {\n      primary: ['bg-primary-200'],\n      marsh: ['bg-marsh-200']\n    }\n  }\n})\n\nconst SelectionIndicator = styled('div', {\n  base: ['absolute', 'bg-white', 'rounded-md'],\n  variants: {\n    interacted: {\n      true: ['duration-300', 'ease-in', 'transition-all'],\n      false: ['transition-none']\n    }\n  }\n})\n\nexport const SegmentedControlItemList = (\n  props: React.ComponentProps<typeof Tabs.TriggerList>\n): JSX.Element => {\n  const { theme, defaultValue, value } = React.useContext(\n    SegmentedControlContext\n  )\n\n  const tabsRef = React.useRef<(HTMLElement | null)[]>([])\n\n  const selectedIndex = React.Children.toArray(props.children).findIndex(\n    (child) => (child as React.ReactElement)?.props.value === value\n  )\n\n  const [indicatorStyles, setIndicatorStyles] = React.useState({\n    left: 0,\n    height: 0,\n    width: 0\n  })\n  const [hasInteracted, setHasInteracted] = React.useState(false)\n\n  const updateIndicatorPosition = React.useCallback(() => {\n    const currentTab = tabsRef.current[selectedIndex]\n    if (!currentTab) return\n\n    const { width, height } = currentTab.getBoundingClientRect()\n    setIndicatorStyles({\n      left: Math.round(currentTab.offsetLeft),\n      height: Math.round(height),\n      width: Math.round(width)\n    })\n  }, [selectedIndex])\n\n  React.useEffect(() => {\n    const resizeObserver = new ResizeObserver(updateIndicatorPosition)\n    const currentTabs = tabsRef.current\n    currentTabs.forEach((tab) => {\n      if (tab) resizeObserver.observe(tab)\n    })\n\n    return () => {\n      currentTabs.forEach((tab) => {\n        if (tab) resizeObserver.unobserve(tab)\n      })\n      resizeObserver.disconnect()\n    }\n  }, [selectedIndex, updateIndicatorPosition])\n\n  React.useEffect(() => {\n    window.addEventListener('resize', updateIndicatorPosition)\n    return () => {\n      window.removeEventListener('resize', updateIndicatorPosition)\n    }\n  }, [updateIndicatorPosition])\n\n  React.useEffect(() => {\n    updateIndicatorPosition()\n  }, [selectedIndex, updateIndicatorPosition])\n\n  return (\n    <StyledTriggerList theme={theme} defaultValue={defaultValue} {...props}>\n      <SelectionIndicator interacted={hasInteracted} style={indicatorStyles} />\n      {React.Children.map(props.children, (child, index) => {\n        if (!React.isValidElement(child)) {\n          throw new Error(\n            `Child passed to SegmentedControlItemList is not a valid element`\n          )\n        }\n\n        return React.cloneElement(\n          child as React.ReactElement<\n            React.ComponentProps<typeof SegmentedControlItem>\n          >,\n          {\n            onClick: (e) => {\n              setHasInteracted(true)\n              if (child.props.onClick) child.props.onClick(e)\n            },\n            ref: (el) => (tabsRef.current[index] = el)\n          }\n        )\n      })}\n    </StyledTriggerList>\n  )\n}\n"],"names":["StyledTriggerList","styled","Tabs","SelectionIndicator","SegmentedControlItemList","props","theme","defaultValue","value","React","SegmentedControlContext","tabsRef","selectedIndex","child","indicatorStyles","setIndicatorStyles","hasInteracted","setHasInteracted","updateIndicatorPosition","currentTab","width","height","resizeObserver","currentTabs","tab","index","e","el"],"mappings":"+KAQA,MAAMA,EAAoBC,EAAOC,EAAK,YAAa,CACjD,KAAM,CACJ,WACA,MACA,aACA,kBACA,iCACA,gBACF,EACA,SAAU,CACR,MAAO,CACL,QAAS,CAAC,gBAAgB,EAC1B,MAAO,CAAC,cAAc,CACxB,CACF,CACF,CAAC,EAEKC,EAAqBF,EAAO,MAAO,CACvC,KAAM,CAAC,WAAY,WAAY,YAAY,EAC3C,SAAU,CACR,WAAY,CACV,KAAM,CAAC,eAAgB,UAAW,gBAAgB,EAClD,MAAO,CAAC,iBAAiB,CAC3B,CACF,CACF,CAAC,EAEYG,EACXC,GACgB,CAChB,KAAM,CAAE,MAAAC,EAAO,aAAAC,EAAc,MAAAC,CAAM,EAAIC,EAAM,WAC3CC,CACF,EAEMC,EAAUF,EAAM,OAA+B,CAAE,CAAA,EAEjDG,EAAgBH,EAAM,SAAS,QAAQJ,EAAM,QAAQ,EAAE,UAC1DQ,IAAWA,GAAA,YAAAA,EAA8B,MAAM,SAAUL,CAC5D,EAEM,CAACM,EAAiBC,CAAkB,EAAIN,EAAM,SAAS,CAC3D,KAAM,EACN,OAAQ,EACR,MAAO,CACT,CAAC,EACK,CAACO,EAAeC,CAAgB,EAAIR,EAAM,SAAS,EAAK,EAExDS,EAA0BT,EAAM,YAAY,IAAM,CACtD,MAAMU,EAAaR,EAAQ,QAAQC,CAAa,EAChD,GAAI,CAACO,EAAY,OAEjB,KAAM,CAAE,MAAAC,EAAO,OAAAC,CAAO,EAAIF,EAAW,sBAAA,EACrCJ,EAAmB,CACjB,KAAM,KAAK,MAAMI,EAAW,UAAU,EACtC,OAAQ,KAAK,MAAME,CAAM,EACzB,MAAO,KAAK,MAAMD,CAAK,CACzB,CAAC,CACH,EAAG,CAACR,CAAa,CAAC,EAElB,OAAAH,EAAM,UAAU,IAAM,CACpB,MAAMa,EAAiB,IAAI,eAAeJ,CAAuB,EAC3DK,EAAcZ,EAAQ,QAC5B,OAAAY,EAAY,QAASC,GAAQ,CACvBA,GAAKF,EAAe,QAAQE,CAAG,CACrC,CAAC,EAEM,IAAM,CACXD,EAAY,QAASC,GAAQ,CACvBA,GAAKF,EAAe,UAAUE,CAAG,CACvC,CAAC,EACDF,EAAe,YACjB,CACF,EAAG,CAACV,EAAeM,CAAuB,CAAC,EAE3CT,EAAM,UAAU,KACd,OAAO,iBAAiB,SAAUS,CAAuB,EAClD,IAAM,CACX,OAAO,oBAAoB,SAAUA,CAAuB,CAC9D,GACC,CAACA,CAAuB,CAAC,EAE5BT,EAAM,UAAU,IAAM,CACpBS,EAAwB,CAC1B,EAAG,CAACN,EAAeM,CAAuB,CAAC,EAGzCT,EAAA,cAACT,EAAA,CAAkB,MAAOM,EAAO,aAAcC,EAAe,GAAGF,CAAAA,EAC/DI,EAAA,cAACN,EAAA,CAAmB,WAAYa,EAAe,MAAOF,CAAAA,CAAiB,EACtEL,EAAM,SAAS,IAAIJ,EAAM,SAAU,CAACQ,EAAOY,IAAU,CACpD,GAAI,CAAChB,EAAM,eAAeI,CAAK,EAC7B,MAAM,IAAI,MACR,iEACF,EAGF,OAAOJ,EAAM,aACXI,EAGA,CACE,QAAUa,GAAM,CACdT,EAAiB,EAAI,EACjBJ,EAAM,MAAM,SAASA,EAAM,MAAM,QAAQa,CAAC,CAChD,EACA,IAAMC,GAAQhB,EAAQ,QAAQc,CAAK,EAAIE,CACzC,CACF,CACF,CAAC,CACH,CAEJ"}
+{"version":3,"file":"SegmentedControlItemList.js","sources":["../../../src/components/segmented-control/SegmentedControlItemList.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Tabs } from '../tabs/Tabs'\nimport { SegmentedControlContext } from './SegmentedControlContext'\nimport { SegmentedControlItem } from './SegmentedControlItem'\n\nconst StyledTriggerList = styled(Tabs.TriggerList, {\n  base: [\n    'relative',\n    'p-1',\n    'rounded-lg',\n    'overflow-hidden',\n    '[&>div[role=tablist]]:relative',\n    '[&>button]:z-2'\n  ],\n  variants: {\n    theme: {\n      primary: ['bg-primary-200'],\n      marsh: ['bg-marsh-200']\n    }\n  }\n})\n\nconst SelectionIndicator = styled('div', {\n  base: ['absolute', 'bg-white', 'rounded-md'],\n  variants: {\n    interacted: {\n      true: ['duration-300', 'ease-in', 'transition-all'],\n      false: ['transition-none']\n    }\n  }\n})\n\nexport const SegmentedControlItemList = (\n  props: React.ComponentProps<typeof Tabs.TriggerList>\n): JSX.Element => {\n  const { theme, defaultValue, value } = React.useContext(\n    SegmentedControlContext\n  )\n\n  const tabsRef = React.useRef<(HTMLElement | null)[]>([])\n\n  const selectedIndex = React.Children.toArray(props.children).findIndex(\n    (child) => (child as React.ReactElement)?.props.value === value\n  )\n\n  const [indicatorStyles, setIndicatorStyles] = React.useState({\n    left: 0,\n    height: 0,\n    width: 0\n  })\n  const [hasInteracted, setHasInteracted] = React.useState(false)\n\n  const updateIndicatorPosition = React.useCallback(() => {\n    const currentTab = tabsRef.current[selectedIndex]\n    if (!currentTab) return\n\n    const { width, height } = currentTab.getBoundingClientRect()\n    setIndicatorStyles({\n      left: Math.round(currentTab.offsetLeft),\n      height: Math.round(height),\n      width: Math.round(width)\n    })\n  }, [selectedIndex])\n\n  React.useEffect(() => {\n    const resizeObserver = new ResizeObserver(updateIndicatorPosition)\n    const currentTabs = tabsRef.current\n    currentTabs.forEach((tab) => {\n      if (tab) resizeObserver.observe(tab)\n    })\n\n    return () => {\n      currentTabs.forEach((tab) => {\n        if (tab) resizeObserver.unobserve(tab)\n      })\n      resizeObserver.disconnect()\n    }\n  }, [selectedIndex, updateIndicatorPosition])\n\n  React.useEffect(() => {\n    window.addEventListener('resize', updateIndicatorPosition)\n    return () => {\n      window.removeEventListener('resize', updateIndicatorPosition)\n    }\n  }, [updateIndicatorPosition])\n\n  React.useEffect(() => {\n    updateIndicatorPosition()\n  }, [selectedIndex, updateIndicatorPosition])\n\n  return (\n    <StyledTriggerList theme={theme} defaultValue={defaultValue} {...props}>\n      <SelectionIndicator interacted={hasInteracted} style={indicatorStyles} />\n      {React.Children.map(props.children, (child, index) => {\n        if (!React.isValidElement(child)) {\n          throw new Error(\n            `Child passed to SegmentedControlItemList is not a valid element`\n          )\n        }\n\n        return React.cloneElement(\n          child as React.ReactElement<\n            React.ComponentProps<typeof SegmentedControlItem>\n          >,\n          {\n            onClick: (e) => {\n              setHasInteracted(true)\n              if (child.props.onClick) child.props.onClick(e)\n            },\n            ref: (el) => (tabsRef.current[index] = el)\n          }\n        )\n      })}\n    </StyledTriggerList>\n  )\n}\n"],"names":["StyledTriggerList","styled","Tabs","SelectionIndicator","SegmentedControlItemList","props","theme","defaultValue","value","React","SegmentedControlContext","tabsRef","selectedIndex","child","indicatorStyles","setIndicatorStyles","hasInteracted","setHasInteracted","updateIndicatorPosition","currentTab","width","height","resizeObserver","currentTabs","tab","index","e","el"],"mappings":"+KAQA,MAAMA,EAAoBC,EAAOC,EAAK,YAAa,CACjD,KAAM,CACJ,WACA,MACA,aACA,kBACA,iCACA,gBACF,EACA,SAAU,CACR,MAAO,CACL,QAAS,CAAC,gBAAgB,EAC1B,MAAO,CAAC,cAAc,CACxB,CACF,CACF,CAAC,EAEKC,EAAqBF,EAAO,MAAO,CACvC,KAAM,CAAC,WAAY,WAAY,YAAY,EAC3C,SAAU,CACR,WAAY,CACV,KAAM,CAAC,eAAgB,UAAW,gBAAgB,EAClD,MAAO,CAAC,iBAAiB,CAC3B,CACF,CACF,CAAC,EAEYG,EACXC,GACgB,CAChB,KAAM,CAAE,MAAAC,EAAO,aAAAC,EAAc,MAAAC,CAAM,EAAIC,EAAM,WAC3CC,CACF,EAEMC,EAAUF,EAAM,OAA+B,CAAE,CAAA,EAEjDG,EAAgBH,EAAM,SAAS,QAAQJ,EAAM,QAAQ,EAAE,UAC1DQ,IAAWA,GAAA,YAAAA,EAA8B,MAAM,SAAUL,CAC5D,EAEM,CAACM,EAAiBC,CAAkB,EAAIN,EAAM,SAAS,CAC3D,KAAM,EACN,OAAQ,EACR,MAAO,CACT,CAAC,EACK,CAACO,EAAeC,CAAgB,EAAIR,EAAM,SAAS,EAAK,EAExDS,EAA0BT,EAAM,YAAY,IAAM,CACtD,MAAMU,EAAaR,EAAQ,QAAQC,CAAa,EAChD,GAAI,CAACO,EAAY,OAEjB,KAAM,CAAE,MAAAC,EAAO,OAAAC,CAAO,EAAIF,EAAW,sBAAA,EACrCJ,EAAmB,CACjB,KAAM,KAAK,MAAMI,EAAW,UAAU,EACtC,OAAQ,KAAK,MAAME,CAAM,EACzB,MAAO,KAAK,MAAMD,CAAK,CACzB,CAAC,CACH,EAAG,CAACR,CAAa,CAAC,EAElB,OAAAH,EAAM,UAAU,IAAM,CACpB,MAAMa,EAAiB,IAAI,eAAeJ,CAAuB,EAC3DK,EAAcZ,EAAQ,QAC5B,OAAAY,EAAY,QAASC,GAAQ,CACvBA,GAAKF,EAAe,QAAQE,CAAG,CACrC,CAAC,EAEM,IAAM,CACXD,EAAY,QAASC,GAAQ,CACvBA,GAAKF,EAAe,UAAUE,CAAG,CACvC,CAAC,EACDF,EAAe,YACjB,CACF,EAAG,CAACV,EAAeM,CAAuB,CAAC,EAE3CT,EAAM,UAAU,KACd,OAAO,iBAAiB,SAAUS,CAAuB,EAClD,IAAM,CACX,OAAO,oBAAoB,SAAUA,CAAuB,CAC9D,GACC,CAACA,CAAuB,CAAC,EAE5BT,EAAM,UAAU,IAAM,CACpBS,EAAwB,CAC1B,EAAG,CAACN,EAAeM,CAAuB,CAAC,EAGzCT,EAAA,cAACT,EAAA,CAAkB,MAAOM,EAAO,aAAcC,EAAe,GAAGF,CAAAA,EAC/DI,EAAA,cAACN,EAAA,CAAmB,WAAYa,EAAe,MAAOF,CAAAA,CAAiB,EACtEL,EAAM,SAAS,IAAIJ,EAAM,SAAU,CAACQ,EAAOY,IAAU,CACpD,GAAI,CAAChB,EAAM,eAAeI,CAAK,EAC7B,MAAM,IAAI,MACR,iEACF,EAGF,OAAOJ,EAAM,aACXI,EAGA,CACE,QAAUa,GAAM,CACdT,EAAiB,EAAI,EACjBJ,EAAM,MAAM,SAASA,EAAM,MAAM,QAAQa,CAAC,CAChD,EACA,IAAMC,GAAQhB,EAAQ,QAAQc,CAAK,EAAIE,CACzC,CACF,CACF,CAAC,CACH,CAEJ"}

package/dist/components/segmented-control/SegmentedControlRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlRoot.js","sources":["../../../src/components/segmented-control/SegmentedControlRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Tabs } from '../tabs'\nimport type { SegmentedControlTheme } from './SegmentedControl.types'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledSegmentedControlRoot = styled(\n  Tabs,\n  {\n    base: ['[&>div]:border-none'],\n    variants: {\n      size: {\n        sm: ['w-[unset]!'],\n        md: [],\n        lg: []\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport interface SegmentedControlRootProps\n  extends React.ComponentProps<typeof StyledSegmentedControlRoot> {\n  theme?: SegmentedControlTheme\n}\n\nexport const SegmentedControlRoot = ({\n  size,\n  theme = 'primary',\n  defaultValue,\n  children,\n  ...props\n}: React.PropsWithChildren<SegmentedControlRootProps>): React.JSX.Element => {\n  const isControlled = props.value !== undefined\n\n  const [internalValue, setInternalValue] = React.useState(defaultValue)\n\n  const currentValue = isControlled ? props.value : internalValue\n  const handleValueChange = isControlled\n    ? props.onValueChange\n    : setInternalValue\n\n  React.useEffect(() => {\n    if (!isControlled && defaultValue) {\n      setInternalValue(defaultValue)\n    }\n  }, [defaultValue, isControlled])\n\n  const value = React.useMemo(\n    () => ({\n      size,\n      theme,\n      defaultValue,\n      onValueChange: handleValueChange,\n      value: currentValue\n    }),\n    [size, theme, defaultValue, handleValueChange, currentValue]\n  )\n\n  return (\n    <SegmentedControlContext.Provider value={value}>\n      <StyledSegmentedControlRoot\n        size={size}\n        value={currentValue}\n        onValueChange={handleValueChange}\n        {...props}\n      >\n        {children}\n      </StyledSegmentedControlRoot>\n    </SegmentedControlContext.Provider>\n  )\n}\n"],"names":["StyledSegmentedControlRoot","styled","Tabs","SegmentedControlRoot","size","theme","defaultValue","children","props","isControlled","internalValue","setInternalValue","React","currentValue","handleValueChange","value","SegmentedControlContext"],"mappings":"+KAQA,MAAMA,EAA6BC,EACjCC,EACA,CACE,KAAM,CAAC,qBAAqB,EAC5B,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,YAAY,EACjB,GAAI,GACJ,GAAI,CACN,CAAA,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAOaC,EAAuB,CAAC,CACnC,KAAAC,EACA,MAAAC,EAAQ,UACR,aAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAA6E,CAC3E,MAAMC,EAAeD,EAAM,QAAU,OAE/B,CAACE,EAAeC,CAAgB,EAAIC,EAAM,SAASN,CAAY,EAE/DO,EAAeJ,EAAeD,EAAM,MAAQE,EAC5CI,EAAoBL,EACtBD,EAAM,cACNG,EAEJC,EAAM,UAAU,IAAM,CAChB,CAACH,GAAgBH,GACnBK,EAAiBL,CAAY,CAEjC,EAAG,CAACA,EAAcG,CAAY,CAAC,EAE/B,MAAMM,EAAQH,EAAM,QAClB,KAAO,CACL,KAAAR,EACA,MAAAC,EACA,aAAAC,EACA,cAAeQ,EACf,MAAOD,CACT,GACA,CAACT,EAAMC,EAAOC,EAAcQ,EAAmBD,CAAY,CAC7D,EAEA,OACED,EAAA,cAACI,EAAwB,SAAxB,CAAiC,MAAOD,CACvCH,EAAAA,EAAA,cAACZ,EAAA,CACC,KAAMI,EACN,MAAOS,EACP,cAAeC,EACd,GAAGN,CAEHD,EAAAA,CACH,CACF,CAEJ"}
+{"version":3,"file":"SegmentedControlRoot.js","sources":["../../../src/components/segmented-control/SegmentedControlRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Tabs } from '../tabs/Tabs'\nimport type { SegmentedControlTheme } from './SegmentedControl.types'\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledSegmentedControlRoot = styled(\n  Tabs,\n  {\n    base: ['[&>div]:border-none'],\n    variants: {\n      size: {\n        sm: ['w-[unset]!'],\n        md: [],\n        lg: []\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport interface SegmentedControlRootProps extends React.ComponentProps<\n  typeof StyledSegmentedControlRoot\n> {\n  theme?: SegmentedControlTheme\n}\n\nexport const SegmentedControlRoot = ({\n  size,\n  theme = 'primary',\n  defaultValue,\n  children,\n  ...props\n}: React.PropsWithChildren<SegmentedControlRootProps>): React.JSX.Element => {\n  const isControlled = props.value !== undefined\n\n  const [internalValue, setInternalValue] = React.useState(defaultValue)\n\n  const currentValue = isControlled ? props.value : internalValue\n  const handleValueChange = isControlled\n    ? props.onValueChange\n    : setInternalValue\n\n  React.useEffect(() => {\n    if (!isControlled && defaultValue) {\n      setInternalValue(defaultValue)\n    }\n  }, [defaultValue, isControlled])\n\n  const value = React.useMemo(\n    () => ({\n      size,\n      theme,\n      defaultValue,\n      onValueChange: handleValueChange,\n      value: currentValue\n    }),\n    [size, theme, defaultValue, handleValueChange, currentValue]\n  )\n\n  return (\n    <SegmentedControlContext.Provider value={value}>\n      <StyledSegmentedControlRoot\n        size={size}\n        value={currentValue}\n        onValueChange={handleValueChange}\n        {...props}\n      >\n        {children}\n      </StyledSegmentedControlRoot>\n    </SegmentedControlContext.Provider>\n  )\n}\n"],"names":["StyledSegmentedControlRoot","styled","Tabs","SegmentedControlRoot","size","theme","defaultValue","children","props","isControlled","internalValue","setInternalValue","React","currentValue","handleValueChange","value","SegmentedControlContext"],"mappings":"+KAQA,MAAMA,EAA6BC,EACjCC,EACA,CACE,KAAM,CAAC,qBAAqB,EAC5B,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,YAAY,EACjB,GAAI,GACJ,GAAI,CACN,CAAA,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAQaC,EAAuB,CAAC,CACnC,KAAAC,EACA,MAAAC,EAAQ,UACR,aAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAA6E,CAC3E,MAAMC,EAAeD,EAAM,QAAU,OAE/B,CAACE,EAAeC,CAAgB,EAAIC,EAAM,SAASN,CAAY,EAE/DO,EAAeJ,EAAeD,EAAM,MAAQE,EAC5CI,EAAoBL,EACtBD,EAAM,cACNG,EAEJC,EAAM,UAAU,IAAM,CAChB,CAACH,GAAgBH,GACnBK,EAAiBL,CAAY,CAEjC,EAAG,CAACA,EAAcG,CAAY,CAAC,EAE/B,MAAMM,EAAQH,EAAM,QAClB,KAAO,CACL,KAAAR,EACA,MAAAC,EACA,aAAAC,EACA,cAAeQ,EACf,MAAOD,CACT,GACA,CAACT,EAAMC,EAAOC,EAAcQ,EAAmBD,CAAY,CAC7D,EAEA,OACED,EAAA,cAACI,EAAwB,SAAxB,CAAiC,MAAOD,CACvCH,EAAAA,EAAA,cAACZ,EAAA,CACC,KAAMI,EACN,MAAOS,EACP,cAAeC,EACd,GAAGN,CAEHD,EAAAA,CACH,CACF,CAEJ"}

package/dist/components/select/Select.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Override } from '../../utilities/types';
 declare const StyledSelect: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref"> & {
     ref?: ((instance: HTMLSelectElement | null) => void) | React.RefObject<HTMLSelectElement> | null | undefined;
-}, "size" | "appearance" | "state"> & {
+}, "appearance" | "size" | "state"> & {
     size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
     state?: ("error" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "error">>) | undefined;
     appearance?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;