@atom-learning/components 6.0.0-beta.9 → 6.0.3

package/dist/components/pagination/PaginationPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaginationPopover.js","sources":["../../../src/components/pagination/PaginationPopover.tsx"],"sourcesContent":["import { Ellypsis } from '@atom-learning/icons'\nimport React from 'react'\n\nimport { ActionIcon, Flex, Icon, Popover } from '..'\nimport { PaginationPage } from './PaginationPage'\nimport { usePagination } from './usePagination'\n\nexport const PaginationPopover = ({\n  children\n}: React.PropsWithChildren<unknown>) => {\n  const { pagesCount, labels } = usePagination()\n  const paginationItems = Array.from(\n    { length: pagesCount },\n    (_, index) => index + 1\n  )\n\n  const [isOpen, setIsOpen] = React.useState<boolean>(false)\n\n  return (\n    <Popover open={isOpen} onOpenChange={setIsOpen} defaultOpen={false}>\n      <Popover.Trigger asChild>\n        {children || (\n          <ActionIcon\n            hasTooltip={false}\n            size=\"md\"\n            theme=\"neutral\"\n            label={labels?.popoverTriggerLabel || 'Open pagination popover'}\n            data-testid=\"pagination_popover_trigger\"\n          >\n            <Icon is={Ellypsis} />\n          </ActionIcon>\n        )}\n      </Popover.Trigger>\n      <Popover.Content size=\"md\" showCloseButton={false} className=\"p-0\">\n        <Flex className=\"flex flex-wrap justify-center gap-1 p-4\">\n          {paginationItems?.map((pageNumber) => {\n            return (\n              <PaginationPage\n                key={pageNumber}\n                pageNumber={pageNumber}\n                onClick={() => setIsOpen(false)}\n              />\n            )\n          })}\n        </Flex>\n      </Popover.Content>\n    </Popover>\n  )\n}\n"],"names":["PaginationPopover","children","pagesCount","labels","usePagination","paginationItems","_","index","isOpen","setIsOpen","React","Popover","ActionIcon","Icon","Ellypsis","Flex","pageNumber","PaginationPage"],"mappings":"goIAOO,MAAMA,EAAoB,CAAC,CAChC,SAAAC,CACF,IAAwC,CACtC,KAAM,CAAE,WAAAC,EAAY,OAAAC,CAAO,EAAIC,EAAc,EACvCC,EAAkB,MAAM,KAC5B,CAAE,OAAQH,CAAW,EACrB,CAACI,EAAGC,IAAUA,EAAQ,CACxB,EAEM,CAACC,EAAQC,CAAS,EAAIC,EAAM,SAAkB,EAAK,EAEzD,OACEA,EAAA,cAACC,EAAA,CAAQ,KAAMH,EAAQ,aAAcC,EAAW,YAAa,EAAA,EAC3DC,EAAA,cAACC,EAAQ,QAAR,CAAgB,QAAO,IACrBV,GACCS,EAAA,cAACE,EAAA,CACC,WAAY,GACZ,KAAK,KACL,MAAM,UACN,OAAOT,GAAA,KAAAA,OAAAA,EAAQ,sBAAuB,0BACtC,cAAY,4BAEZO,EAAAA,EAAA,cAACG,EAAA,CAAK,GAAIC,CAAAA,CAAU,CACtB,CAEJ,EACAJ,EAAA,cAACC,EAAQ,QAAR,CAAgB,KAAK,KAAK,gBAAiB,GAAO,UAAU,KAAA,EAC3DD,EAAA,cAACK,EAAA,CAAK,UAAU,yCACbV,EAAAA,GAAA,YAAAA,EAAiB,IAAKW,GAEnBN,EAAA,cAACO,EAAA,CACC,IAAKD,EACL,WAAYA,EACZ,QAAS,IAAMP,EAAU,EAAK,CAAA,CAChC,CAGN,CAAA,CACF,CACF,CAEJ"}
+{"version":3,"file":"PaginationPopover.js","sources":["../../../src/components/pagination/PaginationPopover.tsx"],"sourcesContent":["import { Ellypsis } from '@atom-learning/icons'\nimport React from 'react'\n\nimport { ActionIcon, Flex, Icon, Popover } from '..'\nimport { PaginationPage } from './PaginationPage'\nimport { usePagination } from './usePagination'\n\nexport const PaginationPopover = ({\n  children\n}: React.PropsWithChildren<unknown>) => {\n  const { pagesCount, labels } = usePagination()\n  const paginationItems = Array.from(\n    { length: pagesCount },\n    (_, index) => index + 1\n  )\n\n  const [isOpen, setIsOpen] = React.useState<boolean>(false)\n\n  return (\n    <Popover open={isOpen} onOpenChange={setIsOpen} defaultOpen={false}>\n      <Popover.Trigger asChild>\n        {children || (\n          <ActionIcon\n            hasTooltip={false}\n            size=\"md\"\n            theme=\"neutral\"\n            label={labels?.popoverTriggerLabel || 'Open pagination popover'}\n            data-testid=\"pagination_popover_trigger\"\n          >\n            <Icon is={Ellypsis} />\n          </ActionIcon>\n        )}\n      </Popover.Trigger>\n      <Popover.Content size=\"md\" showCloseButton={false} className=\"p-0\">\n        <Flex className=\"flex flex-wrap justify-center gap-1 p-4\">\n          {paginationItems?.map((pageNumber) => {\n            return (\n              <PaginationPage\n                key={pageNumber}\n                pageNumber={pageNumber}\n                onClick={() => setIsOpen(false)}\n              />\n            )\n          })}\n        </Flex>\n      </Popover.Content>\n    </Popover>\n  )\n}\n"],"names":["PaginationPopover","children","pagesCount","labels","usePagination","paginationItems","_","index","isOpen","setIsOpen","React","Popover","ActionIcon","Icon","Ellypsis","Flex","pageNumber","PaginationPage"],"mappings":"2tIAOO,MAAMA,EAAoB,CAAC,CAChC,SAAAC,CACF,IAAwC,CACtC,KAAM,CAAE,WAAAC,EAAY,OAAAC,CAAO,EAAIC,EAAc,EACvCC,EAAkB,MAAM,KAC5B,CAAE,OAAQH,CAAW,EACrB,CAACI,EAAGC,IAAUA,EAAQ,CACxB,EAEM,CAACC,EAAQC,CAAS,EAAIC,EAAM,SAAkB,EAAK,EAEzD,OACEA,EAAA,cAACC,EAAA,CAAQ,KAAMH,EAAQ,aAAcC,EAAW,YAAa,EAAA,EAC3DC,EAAA,cAACC,EAAQ,QAAR,CAAgB,QAAO,IACrBV,GACCS,EAAA,cAACE,EAAA,CACC,WAAY,GACZ,KAAK,KACL,MAAM,UACN,OAAOT,GAAA,KAAAA,OAAAA,EAAQ,sBAAuB,0BACtC,cAAY,4BAEZO,EAAAA,EAAA,cAACG,EAAA,CAAK,GAAIC,CAAAA,CAAU,CACtB,CAEJ,EACAJ,EAAA,cAACC,EAAQ,QAAR,CAAgB,KAAK,KAAK,gBAAiB,GAAO,UAAU,KAAA,EAC3DD,EAAA,cAACK,EAAA,CAAK,UAAU,yCACbV,EAAAA,GAAA,YAAAA,EAAiB,IAAKW,GAEnBN,EAAA,cAACO,EAAA,CACC,IAAKD,EACL,WAAYA,EACZ,QAAS,IAAMP,EAAU,EAAK,CAAA,CAChC,CAGN,CAAA,CACF,CACF,CAEJ"}

package/dist/components/pagination/PaginationPreviousButton.d.ts

@@ -1,19 +1,18 @@
 import * as React from 'react';
 declare const StyledActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-} & {
+}, "theme" | "size" | "appearance" | "isRounded"> & {
     theme?: ("warning" | "success" | "neutral" | "primary" | "white" | "primaryDark" | "danger" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "warning" | "success" | "neutral" | "primary" | "white" | "primaryDark" | "danger">>) | undefined;
     appearance?: ("simple" | "outline" | "solid" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "simple" | "outline" | "solid">>) | undefined;
     size?: ("sm" | "md" | "lg" | "xs" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs">>) | undefined;
     isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>, "children" | "label" | "as" | keyof import("../../types").NavigatorActions | "hasTooltip" | "tooltipSide"> & {
-    as?: string | React.ReactNode;
+}, "children" | "label" | keyof import("../../types").NavigatorActions | "hasTooltip" | "tooltipSide"> & {
     children: React.ReactNode;
     label: string;
-} & Omit<import("../../utilities/optional-tooltip-wrapper").TOptionalTooltipWrapperProps, "label"> & import("../../types").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement> & {
+} & Omit<import("../../utilities/optional-tooltip-wrapper").TOptionalTooltipWrapperProps, "label"> & import("../../types").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+}>;
 export declare const PaginationPreviousButton: (props: Partial<React.ComponentProps<typeof StyledActionIcon>>) => React.JSX.Element;
 export {};

package/dist/components/popover/Popover.d.ts

@@ -1,12 +1,13 @@
 export declare const Popover: import("react").FC<import("@radix-ui/react-popover").PopoverProps> & {
-    Content: ({ children, side, sideOffset, closePopoverText, showCloseButton, size, ...remainingProps }: Omit<import("@radix-ui/react-popover").PopoverContentProps & import("react").RefAttributes<HTMLDivElement> & {
-        size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+    Content: ({ children, side, sideOffset, closePopoverText, showCloseButton, size, ...remainingProps }: Omit<import("@radix-ui/react-popover").PopoverContentProps & import("react").RefAttributes<HTMLDivElement>, "size"> & {
+        size?: "sm" | "md" | "lg" | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLDivElement> & import("@radix-ui/react-popover").PopoverContentProps & {
+    } & import("@radix-ui/react-popover").PopoverContentProps & import("react").RefAttributes<HTMLDivElement> & {
         closePopoverText?: string;
         showCloseButton?: boolean;
     }) => import("react").JSX.Element;
     Portal: import("react").FC<import("@radix-ui/react-popover").PopoverPortalProps>;
+    Anchor: import("react").ForwardRefExoticComponent<import("@radix-ui/react-popover").PopoverAnchorProps & import("react").RefAttributes<HTMLDivElement>>;
     Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-popover").PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
 };

package/dist/components/popover/Popover.js

@@ -1,2 +1,2 @@
-import{Root as o,Portal as r,Trigger as t}from"@radix-ui/react-popover";import{PopoverContent as e}from"./PopoverContent.js";const p=Object.assign(o,{Content:e,Portal:r,Trigger:t});o.displayName="Popover";export{p as Popover};
+import{Root as o,Portal as r,Anchor as t,Trigger as e}from"@radix-ui/react-popover";import{PopoverContent as n}from"./PopoverContent.js";const p=Object.assign(o,{Content:n,Portal:r,Anchor:t,Trigger:e});o.displayName="Popover";export{p as Popover};
 //# sourceMappingURL=Popover.js.map

package/dist/components/popover/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../../src/components/popover/Popover.tsx"],"sourcesContent":["import { Portal, Root, Trigger } from '@radix-ui/react-popover'\n\nimport { PopoverContent } from './PopoverContent'\n\nexport const Popover = Object.assign(Root, {\n  Content: PopoverContent,\n  Portal: Portal,\n  Trigger: Trigger\n})\n\nRoot.displayName = 'Popover'\n"],"names":["Popover","Root","PopoverContent","Portal","Trigger"],"mappings":"6HAIa,MAAAA,EAAU,OAAO,OAAOC,EAAM,CACzC,QAASC,EACT,OAAQC,EACR,QAASC,CACX,CAAC,EAEDH,EAAK,YAAc"}
+{"version":3,"file":"Popover.js","sources":["../../../src/components/popover/Popover.tsx"],"sourcesContent":["import { Anchor, Portal, Root, Trigger } from '@radix-ui/react-popover'\n\nimport { PopoverContent } from './PopoverContent'\n\nexport const Popover = Object.assign(Root, {\n  Content: PopoverContent,\n  Portal,\n  Anchor,\n  Trigger\n})\n\nRoot.displayName = 'Popover'\n"],"names":["Popover","Root","PopoverContent","Portal","Anchor","Trigger"],"mappings":"yIAIa,MAAAA,EAAU,OAAO,OAAOC,EAAM,CACzC,QAASC,EACT,OAAAC,EACA,OAAAC,EACA,QAAAC,CACF,CAAC,EAEDJ,EAAK,YAAc"}

package/dist/components/popover/PopoverContent.d.ts

@@ -1,10 +1,10 @@
 import { Content } from '@radix-ui/react-popover';
 import * as React from 'react';
-declare const StyledContent: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-popover").PopoverContentProps & React.RefAttributes<HTMLDivElement> & {
-    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+declare const StyledContent: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-popover").PopoverContentProps & React.RefAttributes<HTMLDivElement>, "size"> & {
+    size?: "sm" | "md" | "lg" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type PopoverContentProps = React.ComponentProps<typeof StyledContent> & React.ComponentProps<typeof Content> & {
     closePopoverText?: string;
     showCloseButton?: boolean;

package/dist/components/popover/PopoverContent.js

@@ -1,2 +1,2 @@
-import{Close as l}from"@atom-learning/icons";import{Content as m,Arrow as p,Close as c}from"@radix-ui/react-popover";import*as e from"react";import{styled as t}from"../../styled.js";import{ActionIcon as x}from"../action-icon/ActionIcon.js";import{Icon as f}from"../icon/Icon.js";const h=t(m,{base:["bg-white","rounded-md","shadow-lg","max-w-[90vw]","p-6","pr-10","relative","z-10","will-change-transform","will-change-opacity","animation-duration-75","[--slide-opacity-out:0]","data-[side=top]:[--slide-direction-out-y:-4px]","data-[side=right]:[--slide-direction-out-x:4px]","data-[side=bottom]:[--slide-direction-out-y:4px]","data-[side=left]:[--slide-direction-out-x:-4px]","motion-safe:data-[state=open]:animate-slide-direction-in","motion-safe:data-[state=closed]:animate-slide-direction-out"],variants:{size:{sm:["max-w-200px"],md:["max-w-400px"],lg:["max-w-600px"]}}}),w=t(p,{base:["fill-white","z-1","in-data-[align=end]:mx-6"]}),u=({children:o,side:i="top",sideOffset:a=8,closePopoverText:s="Close popover",showCloseButton:d=!0,size:n="md",...r})=>e.createElement(h,{size:n,side:i,sideOffset:a,...r},d&&e.createElement(x,{as:c,label:s,size:"md",hasTooltip:!1,theme:"neutral",className:"absolute top-0.5 right-0.5"},e.createElement(f,{is:l})),o,e.createElement(w,{width:16,height:8}));export{u as PopoverContent};
+import{Close as l}from"@atom-learning/icons";import{Content as m,Arrow as p,Close as c}from"@radix-ui/react-popover";import*as e from"react";import{styled as t}from"../../styled.js";import{ActionIcon as f}from"../action-icon/ActionIcon.js";import{Icon as h}from"../icon/Icon.js";const w=t(m,{base:["bg-white","rounded-md","shadow-lg","max-w-[90vw]","p-6","pr-10","relative","z-10","will-change-transform","will-change-opacity","animation-duration-75","[--slide-opacity-out:0]","data-[side=top]:[--slide-direction-out-y:-4px]","data-[side=right]:[--slide-direction-out-x:4px]","data-[side=bottom]:[--slide-direction-out-y:4px]","data-[side=left]:[--slide-direction-out-x:-4px]","motion-safe:data-[state=open]:animate-slide-direction-in","motion-safe:data-[state=closed]:animate-slide-direction-out"],variants:{size:{sm:["max-w-50"],md:["max-w-100"],lg:["max-w-150"]}}}),x=t(p,{base:["fill-white","z-1","in-data-[align=end]:mx-6"]}),u=({children:o,side:i="top",sideOffset:a=8,closePopoverText:s="Close popover",showCloseButton:d=!0,size:n="md",...r})=>e.createElement(w,{size:n,side:i,sideOffset:a,...r},d&&e.createElement(f,{as:c,label:s,size:"md",hasTooltip:!1,theme:"neutral",className:"absolute top-0.5 right-0.5"},e.createElement(h,{is:l})),o,e.createElement(x,{width:16,height:8}));export{u as PopoverContent};
 //# sourceMappingURL=PopoverContent.js.map

package/dist/components/popover/PopoverContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"PopoverContent.js","sources":["../../../src/components/popover/PopoverContent.tsx"],"sourcesContent":["import { Close as CloseIcon } from '@atom-learning/icons'\nimport { Arrow, Close, Content } from '@radix-ui/react-popover'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\n\nconst StyledContent = styled(Content, {\n  base: [\n    'bg-white',\n    'rounded-md',\n    'shadow-lg',\n    'max-w-[90vw]',\n    'p-6',\n    'pr-10',\n    'relative',\n    'z-10',\n    'will-change-transform',\n    'will-change-opacity',\n    'animation-duration-75',\n    '[--slide-opacity-out:0]',\n    'data-[side=top]:[--slide-direction-out-y:-4px]',\n    'data-[side=right]:[--slide-direction-out-x:4px]',\n    'data-[side=bottom]:[--slide-direction-out-y:4px]',\n    'data-[side=left]:[--slide-direction-out-x:-4px]',\n    'motion-safe:data-[state=open]:animate-slide-direction-in',\n    'motion-safe:data-[state=closed]:animate-slide-direction-out'\n  ],\n  variants: {\n    size: {\n      sm: ['max-w-200px'],\n      md: ['max-w-400px'],\n      lg: ['max-w-600px']\n    }\n  }\n})\n\nconst StyledArrow = styled(Arrow, {\n  base: ['fill-white', 'z-1', 'in-data-[align=end]:mx-6']\n})\n\ntype PopoverContentProps = React.ComponentProps<typeof StyledContent> &\n  React.ComponentProps<typeof Content> & {\n    closePopoverText?: string\n    showCloseButton?: boolean\n  }\n\nexport const PopoverContent = ({\n  children,\n  side = 'top',\n  sideOffset = 8,\n  closePopoverText = 'Close popover',\n  showCloseButton = true,\n  size = 'md',\n  ...remainingProps\n}: PopoverContentProps) => (\n  <StyledContent\n    size={size}\n    side={side}\n    sideOffset={sideOffset}\n    {...remainingProps}\n  >\n    {showCloseButton && (\n      <ActionIcon\n        as={Close}\n        label={closePopoverText}\n        size=\"md\"\n        hasTooltip={false}\n        theme=\"neutral\"\n        className=\"absolute top-0.5 right-0.5\"\n      >\n        <Icon is={CloseIcon} />\n      </ActionIcon>\n    )}\n    {children}\n    <StyledArrow width={16} height={8} />\n  </StyledContent>\n)\n"],"names":["StyledContent","styled","Content","StyledArrow","Arrow","PopoverContent","children","side","sideOffset","closePopoverText","showCloseButton","size","remainingProps","React","ActionIcon","Close","Icon","CloseIcon"],"mappings":"uRASA,MAAMA,EAAgBC,EAAOC,EAAS,CACpC,KAAM,CACJ,WACA,aACA,YACA,eACA,MACA,QACA,WACA,OACA,wBACA,sBACA,wBACA,0BACA,iDACA,kDACA,mDACA,kDACA,2DACA,6DACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,aAAa,EAClB,GAAI,CAAC,aAAa,EAClB,GAAI,CAAC,aAAa,CACpB,CACF,CACF,CAAC,EAEKC,EAAcF,EAAOG,EAAO,CAChC,KAAM,CAAC,aAAc,MAAO,0BAA0B,CACxD,CAAC,EAQYC,EAAiB,CAAC,CAC7B,SAAAC,EACA,KAAAC,EAAO,MACP,WAAAC,EAAa,EACb,iBAAAC,EAAmB,gBACnB,gBAAAC,EAAkB,GAClB,KAAAC,EAAO,KACP,GAAGC,CACL,IACEC,EAAA,cAACb,EAAA,CACC,KAAMW,EACN,KAAMJ,EACN,WAAYC,EACX,GAAGI,CAEHF,EAAAA,GACCG,EAAA,cAACC,EAAA,CACC,GAAIC,EACJ,MAAON,EACP,KAAK,KACL,WAAY,GACZ,MAAM,UACN,UAAU,4BAEVI,EAAAA,EAAA,cAACG,EAAA,CAAK,GAAIC,CAAAA,CAAW,CACvB,EAEDX,EACDO,EAAA,cAACV,EAAA,CAAY,MAAO,GAAI,OAAQ,EAAG,CACrC"}
+{"version":3,"file":"PopoverContent.js","sources":["../../../src/components/popover/PopoverContent.tsx"],"sourcesContent":["import { Close as CloseIcon } from '@atom-learning/icons'\nimport { Arrow, Close, Content } from '@radix-ui/react-popover'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\n\nconst StyledContent = styled(Content, {\n  base: [\n    'bg-white',\n    'rounded-md',\n    'shadow-lg',\n    'max-w-[90vw]',\n    'p-6',\n    'pr-10',\n    'relative',\n    'z-10',\n    'will-change-transform',\n    'will-change-opacity',\n    'animation-duration-75',\n    '[--slide-opacity-out:0]',\n    'data-[side=top]:[--slide-direction-out-y:-4px]',\n    'data-[side=right]:[--slide-direction-out-x:4px]',\n    'data-[side=bottom]:[--slide-direction-out-y:4px]',\n    'data-[side=left]:[--slide-direction-out-x:-4px]',\n    'motion-safe:data-[state=open]:animate-slide-direction-in',\n    'motion-safe:data-[state=closed]:animate-slide-direction-out'\n  ],\n  variants: {\n    size: {\n      sm: ['max-w-50'],\n      md: ['max-w-100'],\n      lg: ['max-w-150']\n    }\n  }\n})\n\nconst StyledArrow = styled(Arrow, {\n  base: ['fill-white', 'z-1', 'in-data-[align=end]:mx-6']\n})\n\ntype PopoverContentProps = React.ComponentProps<typeof StyledContent> &\n  React.ComponentProps<typeof Content> & {\n    closePopoverText?: string\n    showCloseButton?: boolean\n  }\n\nexport const PopoverContent = ({\n  children,\n  side = 'top',\n  sideOffset = 8,\n  closePopoverText = 'Close popover',\n  showCloseButton = true,\n  size = 'md',\n  ...remainingProps\n}: PopoverContentProps) => (\n  <StyledContent\n    size={size}\n    side={side}\n    sideOffset={sideOffset}\n    {...remainingProps}\n  >\n    {showCloseButton && (\n      <ActionIcon\n        as={Close}\n        label={closePopoverText}\n        size=\"md\"\n        hasTooltip={false}\n        theme=\"neutral\"\n        className=\"absolute top-0.5 right-0.5\"\n      >\n        <Icon is={CloseIcon} />\n      </ActionIcon>\n    )}\n    {children}\n    <StyledArrow width={16} height={8} />\n  </StyledContent>\n)\n"],"names":["StyledContent","styled","Content","StyledArrow","Arrow","PopoverContent","children","side","sideOffset","closePopoverText","showCloseButton","size","remainingProps","React","ActionIcon","Close","Icon","CloseIcon"],"mappings":"uRASA,MAAMA,EAAgBC,EAAOC,EAAS,CACpC,KAAM,CACJ,WACA,aACA,YACA,eACA,MACA,QACA,WACA,OACA,wBACA,sBACA,wBACA,0BACA,iDACA,kDACA,mDACA,kDACA,2DACA,6DACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAU,EACf,GAAI,CAAC,WAAW,EAChB,GAAI,CAAC,WAAW,CAClB,CACF,CACF,CAAC,EAEKC,EAAcF,EAAOG,EAAO,CAChC,KAAM,CAAC,aAAc,MAAO,0BAA0B,CACxD,CAAC,EAQYC,EAAiB,CAAC,CAC7B,SAAAC,EACA,KAAAC,EAAO,MACP,WAAAC,EAAa,EACb,iBAAAC,EAAmB,gBACnB,gBAAAC,EAAkB,GAClB,KAAAC,EAAO,KACP,GAAGC,CACL,IACEC,EAAA,cAACb,EAAA,CACC,KAAMW,EACN,KAAMJ,EACN,WAAYC,EACX,GAAGI,CAEHF,EAAAA,GACCG,EAAA,cAACC,EAAA,CACC,GAAIC,EACJ,MAAON,EACP,KAAK,KACL,WAAY,GACZ,MAAM,UACN,UAAU,4BAEVI,EAAAA,EAAA,cAACG,EAAA,CAAK,GAAIC,CAAAA,CAAW,CACvB,EAEDX,EACDO,EAAA,cAACV,EAAA,CAAY,MAAO,GAAI,OAAQ,EAAG,CACrC"}

package/dist/components/progress-bar/ProgressBar.d.ts

@@ -1,11 +1,11 @@
 import * as Progress from '@radix-ui/react-progress';
 import * as React from 'react';
-declare const StyledProgressBar: React.ForwardRefExoticComponent<Omit<Progress.ProgressProps & React.RefAttributes<HTMLDivElement> & {
+declare const StyledProgressBar: React.ForwardRefExoticComponent<Omit<Progress.ProgressProps & React.RefAttributes<HTMLDivElement>, "theme" | "size"> & {
     size?: ("sm" | "md" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md">>) | undefined;
     theme?: ("warning" | "success" | "info" | "neutral" | "primary" | "danger" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "warning" | "success" | "info" | "neutral" | "primary" | "danger">>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type ProgressBarProps = React.ComponentPropsWithoutRef<typeof StyledProgressBar> & ({
     id: string;
     'aria-label'?: string;

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

@@ -1,2 +1,2 @@
-import*as t from"@radix-ui/react-progress";import*as a from"react";import{styled as s}from"../../styled.js";const m=s(t.Root,{base:["rounded-round","bg-grey-200","relative","overflow-hidden","w-full"],variants:{size:{sm:["h-1"],md:["h-2"]},theme:{primary:["text-primary-800"],info:["text-info"],success:["text-success"],warning:["text-warning"],danger:["text-danger"],neutral:["bg-grey-400","text-grey-800"]}}}),d=s(t.Indicator,{base:["bg-current","rounded-round","box-border","h-full","absolute","transition-all","duration-300","ease-out"]}),o=({value:e,max:r=100,size:n="md",theme:l="primary",...i})=>a.createElement(m,{value:e,max:r,theme:l,size:n,...i},a.createElement(d,{className:"w-full translate-x-(--progress)",style:{"--progress":"-".concat(100-(e||0)/r*100,"%")}}));o.displayName="ProgressBar";export{o as ProgressBar};
+import*as t from"@radix-ui/react-progress";import*as a from"react";import{styled as s}from"../../styled.js";const m=s(t.Root,{base:["rounded-full","bg-grey-200","relative","overflow-hidden","w-full"],variants:{size:{sm:["h-1"],md:["h-2"]},theme:{primary:["text-primary-800"],info:["text-info"],success:["text-success"],warning:["text-warning"],danger:["text-danger"],neutral:["bg-grey-400","text-grey-800"]}}},{enabledResponsiveVariants:!0}),d=s(t.Indicator,{base:["bg-current","rounded-full","box-border","h-full","absolute","transition-all","duration-300","ease-out"]}),o=({value:e,max:r=100,size:l="md",theme:n="primary",...i})=>a.createElement(m,{value:e,max:r,theme:n,size:l,...i},a.createElement(d,{className:"w-full translate-x-(--progress)",style:{"--progress":`-${100-(e||0)/r*100}%`}}));o.displayName="ProgressBar";export{o as ProgressBar};
 //# sourceMappingURL=ProgressBar.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.js","sources":["../../../src/components/progress-bar/ProgressBar.tsx"],"sourcesContent":["import * as Progress from '@radix-ui/react-progress'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledProgressBar = styled(Progress.Root, {\n  base: [\n    'rounded-round',\n    'bg-grey-200',\n    'relative',\n    'overflow-hidden',\n    'w-full'\n  ],\n  variants: {\n    size: {\n      sm: ['h-1'],\n      md: ['h-2']\n    },\n    theme: {\n      primary: ['text-primary-800'],\n      info: ['text-info'],\n      success: ['text-success'],\n      warning: ['text-warning'],\n      danger: ['text-danger'],\n      neutral: ['bg-grey-400', 'text-grey-800']\n    }\n  }\n})\n\nconst StyledIndicator = styled(Progress.Indicator, {\n  base: [\n    'bg-current',\n    'rounded-round',\n    'box-border',\n    'h-full',\n    'absolute',\n    'transition-all',\n    'duration-300',\n    'ease-out'\n  ]\n})\n\ntype ProgressBarProps = React.ComponentPropsWithoutRef<\n  typeof StyledProgressBar\n> &\n  (\n    | { id: string; 'aria-label'?: string }\n    | { 'aria-label': string; id?: string }\n  )\n\nexport const ProgressBar = ({\n  value,\n  max = 100,\n  size = 'md',\n  theme = 'primary',\n  ...remainingProps\n}: ProgressBarProps) => (\n  <StyledProgressBar\n    value={value}\n    max={max}\n    theme={theme}\n    size={size}\n    {...remainingProps}\n  >\n    <StyledIndicator\n      className=\"w-full translate-x-(--progress)\"\n      style={{\n        '--progress': `-${100 - ((value || 0) / max) * 100}%`\n      }}\n    />\n  </StyledProgressBar>\n)\n\nProgressBar.displayName = 'ProgressBar'\n"],"names":["StyledProgressBar","styled","Progress","StyledIndicator","ProgressBar","value","max","size","theme","remainingProps","React"],"mappings":"4GAKA,MAAMA,EAAoBC,EAAOC,EAAS,KAAM,CAC9C,KAAM,CACJ,gBACA,cACA,WACA,kBACA,QACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,KAAK,EACV,GAAI,CAAC,KAAK,CACZ,EACA,MAAO,CACL,QAAS,CAAC,kBAAkB,EAC5B,KAAM,CAAC,WAAW,EAClB,QAAS,CAAC,cAAc,EACxB,QAAS,CAAC,cAAc,EACxB,OAAQ,CAAC,aAAa,EACtB,QAAS,CAAC,cAAe,eAAe,CAC1C,CACF,CACF,CAAC,EAEKC,EAAkBF,EAAOC,EAAS,UAAW,CACjD,KAAM,CACJ,aACA,gBACA,aACA,SACA,WACA,iBACA,eACA,UACF,CACF,CAAC,EAUYE,EAAc,CAAC,CAC1B,MAAAC,EACA,IAAAC,EAAM,IACN,KAAAC,EAAO,KACP,MAAAC,EAAQ,UACR,GAAGC,CACL,IACEC,EAAA,cAACV,EAAA,CACC,MAAOK,EACP,IAAKC,EACL,MAAOE,EACP,KAAMD,EACL,GAAGE,CAEJC,EAAAA,EAAA,cAACP,EAAA,CACC,UAAU,kCACV,MAAO,CACL,aAAc,IAAI,YAAQE,GAAS,GAAKC,EAAO,IAAG,GACpD,CAAA,CAAA,CACF,CACF,EAGFF,EAAY,YAAc"}
+{"version":3,"file":"ProgressBar.js","sources":["../../../src/components/progress-bar/ProgressBar.tsx"],"sourcesContent":["import * as Progress from '@radix-ui/react-progress'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledProgressBar = styled(\n  Progress.Root,\n  {\n    base: [\n      'rounded-full',\n      'bg-grey-200',\n      'relative',\n      'overflow-hidden',\n      'w-full'\n    ],\n    variants: {\n      size: {\n        sm: ['h-1'],\n        md: ['h-2']\n      },\n      theme: {\n        primary: ['text-primary-800'],\n        info: ['text-info'],\n        success: ['text-success'],\n        warning: ['text-warning'],\n        danger: ['text-danger'],\n        neutral: ['bg-grey-400', 'text-grey-800']\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nconst StyledIndicator = styled(Progress.Indicator, {\n  base: [\n    'bg-current',\n    'rounded-full',\n    'box-border',\n    'h-full',\n    'absolute',\n    'transition-all',\n    'duration-300',\n    'ease-out'\n  ]\n})\n\ntype ProgressBarProps = React.ComponentPropsWithoutRef<\n  typeof StyledProgressBar\n> &\n  (\n    | { id: string; 'aria-label'?: string }\n    | { 'aria-label': string; id?: string }\n  )\n\nexport const ProgressBar = ({\n  value,\n  max = 100,\n  size = 'md',\n  theme = 'primary',\n  ...remainingProps\n}: ProgressBarProps) => (\n  <StyledProgressBar\n    value={value}\n    max={max}\n    theme={theme}\n    size={size}\n    {...remainingProps}\n  >\n    <StyledIndicator\n      className=\"w-full translate-x-(--progress)\"\n      style={{\n        '--progress': `-${100 - ((value || 0) / max) * 100}%`\n      }}\n    />\n  </StyledProgressBar>\n)\n\nProgressBar.displayName = 'ProgressBar'\n"],"names":["StyledProgressBar","styled","Progress","StyledIndicator","ProgressBar","value","max","size","theme","remainingProps","React"],"mappings":"4GAKA,MAAMA,EAAoBC,EACxBC,EAAS,KACT,CACE,KAAM,CACJ,eACA,cACA,WACA,kBACA,QACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,KAAK,EACV,GAAI,CAAC,KAAK,CACZ,EACA,MAAO,CACL,QAAS,CAAC,kBAAkB,EAC5B,KAAM,CAAC,WAAW,EAClB,QAAS,CAAC,cAAc,EACxB,QAAS,CAAC,cAAc,EACxB,OAAQ,CAAC,aAAa,EACtB,QAAS,CAAC,cAAe,eAAe,CAC1C,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAEMC,EAAkBF,EAAOC,EAAS,UAAW,CACjD,KAAM,CACJ,aACA,eACA,aACA,SACA,WACA,iBACA,eACA,UACF,CACF,CAAC,EAUYE,EAAc,CAAC,CAC1B,MAAAC,EACA,IAAAC,EAAM,IACN,KAAAC,EAAO,KACP,MAAAC,EAAQ,UACR,GAAGC,CACL,IACEC,EAAA,cAACV,EAAA,CACC,MAAOK,EACP,IAAKC,EACL,MAAOE,EACP,KAAMD,EACL,GAAGE,CAAAA,EAEJC,EAAA,cAACP,EAAA,CACC,UAAU,kCACV,MAAO,CACL,aAAc,IAAI,KAAQE,GAAS,GAAKC,EAAO,GAAG,GACpD,CAAA,CACF,CACF,EAGFF,EAAY,YAAc"}

package/dist/components/radio-button/RadioButton.d.ts

@@ -1,11 +1,11 @@
 import * as RadioGroup from '@radix-ui/react-radio-group';
 import * as React from 'react';
 import { Override } from '../../utilities/types';
-declare const StyledRadioButton: React.ForwardRefExoticComponent<Omit<RadioGroup.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement> & {
+declare const StyledRadioButton: React.ForwardRefExoticComponent<Omit<RadioGroup.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>, "size"> & {
     size?: ("md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "md" | "lg">>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+}>;
 type RadioButtonProps = Override<React.ComponentProps<typeof StyledRadioButton>, {
     as?: never;
 } & {

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

@@ -1,2 +1,2 @@
-import*as t from"@radix-ui/react-radio-group";import*as r from"react";import{styled as o}from"../../styled.js";const i=o(t.Item,{base:["items-center","appearance-none","bg-transparent","border","border-grey-800","rounded-round","text-white","cursor-pointer","flex","justify-center","p-0","size-4","transition-all","duration-50","ease-out","focus:outline-2","focus:outline-offset-1","focus:outline-primary-800","focus:outline-solid","data-[state=checked]:bg-primary-800","data-[state=checked]:border-primary-800","disabled:bg-grey-200","disabled:border-grey-800","disabled:cursor-not-allowed","disabled:text-grey-800"],variants:{size:{md:["size-4"],lg:["-mt-1","size-6"]}}}),d=o(t.Indicator,{base:["size-1.5","rounded-round","bg-current","absolute"],variants:{size:{md:["size-1.5"],lg:["size-3"]}}}),s=({size:e,...a})=>r.createElement(i,{...a,size:e},r.createElement(d,{size:e}));s.displayName="RadioButton";export{s as RadioButton};
+import*as t from"@radix-ui/react-radio-group";import*as a from"react";import{styled as r}from"../../styled.js";const o=r(t.Item,{base:["items-center","appearance-none","bg-transparent","border","border-grey-800","rounded-full","text-white","cursor-pointer","flex","justify-center","p-0","size-4","transition-all","duration-50","ease-out","focus:outline-2","focus:outline-offset-1","focus:outline-primary-800","focus:outline-solid","data-[state=checked]:bg-primary-800","data-[state=checked]:border-primary-800","disabled:bg-grey-200","disabled:border-grey-800","disabled:cursor-not-allowed","disabled:text-grey-800","disabled:data-[state=checked]:bg-grey-800","disabled:data-[state=checked]:border-grey-800"],variants:{size:{md:["size-4"],lg:["-mt-1","size-6"]}}},{enabledResponsiveVariants:!0}),d=r(t.Indicator,{base:["size-1.5","rounded-full","bg-current","absolute"],variants:{size:{md:["size-1.5"],lg:["size-3"]}}},{enabledResponsiveVariants:!0}),s=({size:e,...i})=>a.createElement(o,{...i,size:e},a.createElement(d,{size:e}));s.displayName="RadioButton";export{s as RadioButton};
 //# sourceMappingURL=RadioButton.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"RadioButton.js","sources":["../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { Override } from '~/utilities/types'\n\nconst StyledRadioButton = styled(RadioGroup.Item, {\n  base: [\n    'items-center',\n    'appearance-none',\n    'bg-transparent',\n    'border',\n    'border-grey-800',\n    'rounded-round',\n    'text-white',\n    'cursor-pointer',\n    'flex',\n    'justify-center',\n    'p-0',\n    'size-4',\n    'transition-all',\n    'duration-50',\n    'ease-out',\n    'focus:outline-2',\n    'focus:outline-offset-1',\n    'focus:outline-primary-800',\n    'focus:outline-solid',\n    'data-[state=checked]:bg-primary-800',\n    'data-[state=checked]:border-primary-800',\n    'disabled:bg-grey-200',\n    'disabled:border-grey-800',\n    'disabled:cursor-not-allowed',\n    'disabled:text-grey-800'\n  ],\n  variants: {\n    size: {\n      md: ['size-4'],\n      lg: ['-mt-1', 'size-6']\n    }\n  }\n})\n\nconst StyledIndicator = styled(RadioGroup.Indicator, {\n  base: ['size-1.5', 'rounded-round', 'bg-current', 'absolute'],\n  variants: {\n    size: {\n      md: ['size-1.5'],\n      lg: ['size-3']\n    }\n  }\n})\n\ntype RadioButtonProps = Override<\n  React.ComponentProps<typeof StyledRadioButton>,\n  {\n    as?: never\n  } & {\n    'aria-label'?: string\n  }\n>\n\nexport const RadioButton = ({ size, ...props }: RadioButtonProps) => {\n  return (\n    <StyledRadioButton {...props} size={size}>\n      <StyledIndicator size={size} />\n    </StyledRadioButton>\n  )\n}\n\nRadioButton.displayName = 'RadioButton'\n"],"names":["StyledRadioButton","styled","RadioGroup","StyledIndicator","RadioButton","size","props","React"],"mappings":"+GAMA,MAAMA,EAAoBC,EAAOC,EAAW,KAAM,CAChD,KAAM,CACJ,eACA,kBACA,iBACA,SACA,kBACA,gBACA,aACA,iBACA,OACA,iBACA,MACA,SACA,iBACA,cACA,WACA,kBACA,yBACA,4BACA,sBACA,sCACA,0CACA,uBACA,2BACA,8BACA,wBACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,QAAQ,EACb,GAAI,CAAC,QAAS,QAAQ,CACxB,CACF,CACF,CAAC,EAEKC,EAAkBF,EAAOC,EAAW,UAAW,CACnD,KAAM,CAAC,WAAY,gBAAiB,aAAc,UAAU,EAC5D,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAU,EACf,GAAI,CAAC,QAAQ,CACf,CACF,CACF,CAAC,EAWYE,EAAc,CAAC,CAAE,KAAAC,EAAM,GAAGC,CAAM,IAEzCC,EAAA,cAACP,EAAA,CAAmB,GAAGM,EAAO,KAAMD,CAClCE,EAAAA,EAAA,cAACJ,EAAA,CAAgB,KAAME,CAAM,CAAA,CAC/B,EAIJD,EAAY,YAAc"}
+{"version":3,"file":"RadioButton.js","sources":["../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { Override } from '~/utilities/types'\n\nconst StyledRadioButton = styled(\n  RadioGroup.Item,\n  {\n    base: [\n      'items-center',\n      'appearance-none',\n      'bg-transparent',\n      'border',\n      'border-grey-800',\n      'rounded-full',\n      'text-white',\n      'cursor-pointer',\n      'flex',\n      'justify-center',\n      'p-0',\n      'size-4',\n      'transition-all',\n      'duration-50',\n      'ease-out',\n      'focus:outline-2',\n      'focus:outline-offset-1',\n      'focus:outline-primary-800',\n      'focus:outline-solid',\n      'data-[state=checked]:bg-primary-800',\n      'data-[state=checked]:border-primary-800',\n      'disabled:bg-grey-200',\n      'disabled:border-grey-800',\n      'disabled:cursor-not-allowed',\n      'disabled:text-grey-800',\n      'disabled:data-[state=checked]:bg-grey-800',\n      'disabled:data-[state=checked]:border-grey-800'\n    ],\n    variants: {\n      size: {\n        md: ['size-4'],\n        lg: ['-mt-1', 'size-6']\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\nconst StyledIndicator = styled(\n  RadioGroup.Indicator,\n  {\n    base: ['size-1.5', 'rounded-full', 'bg-current', 'absolute'],\n    variants: {\n      size: {\n        md: ['size-1.5'],\n        lg: ['size-3']\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\ntype RadioButtonProps = Override<\n  React.ComponentProps<typeof StyledRadioButton>,\n  {\n    as?: never\n  } & {\n    'aria-label'?: string\n  }\n>\n\nexport const RadioButton = ({ size, ...props }: RadioButtonProps) => {\n  return (\n    <StyledRadioButton {...props} size={size}>\n      <StyledIndicator size={size} />\n    </StyledRadioButton>\n  )\n}\n\nRadioButton.displayName = 'RadioButton'\n"],"names":["StyledRadioButton","styled","RadioGroup","StyledIndicator","RadioButton","size","props","React"],"mappings":"+GAMA,MAAMA,EAAoBC,EACxBC,EAAW,KACX,CACE,KAAM,CACJ,eACA,kBACA,iBACA,SACA,kBACA,eACA,aACA,iBACA,OACA,iBACA,MACA,SACA,iBACA,cACA,WACA,kBACA,yBACA,4BACA,sBACA,sCACA,0CACA,uBACA,2BACA,8BACA,yBACA,4CACA,+CACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,QAAQ,EACb,GAAI,CAAC,QAAS,QAAQ,CACxB,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAEMC,EAAkBF,EACtBC,EAAW,UACX,CACE,KAAM,CAAC,WAAY,eAAgB,aAAc,UAAU,EAC3D,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAU,EACf,GAAI,CAAC,QAAQ,CACf,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAWaE,EAAc,CAAC,CAAE,KAAAC,EAAM,GAAGC,CAAM,IAEzCC,EAAA,cAACP,EAAA,CAAmB,GAAGM,EAAO,KAAMD,CAClCE,EAAAA,EAAA,cAACJ,EAAA,CAAgB,KAAME,CAAM,CAAA,CAC/B,EAIJD,EAAY,YAAc"}

package/dist/components/radio-button/RadioButtonGroup.d.ts

@@ -1,6 +1,6 @@
 import * as RadioGroup from '@radix-ui/react-radio-group';
-export declare const RadioButtonGroup: import("react").ForwardRefExoticComponent<Omit<RadioGroup.RadioGroupProps & import("react").RefAttributes<HTMLDivElement> & {
-    direction?: ("row" | "column" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "column">>) | undefined;
+export declare const RadioButtonGroup: import("react").ForwardRefExoticComponent<Omit<RadioGroup.RadioGroupProps & import("react").RefAttributes<HTMLDivElement>, "direction"> & {
+    direction?: "row" | "column" | undefined;
 } & {
     as?: import("react").ElementType;
-}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+}>;

package/dist/components/radio-button-field/RadioButtonField.d.ts

@@ -13,11 +13,11 @@ export declare const RadioButtonField: {
             error?: string;
             label: string;
             validation?: import("../../components/form").ValidationOptions;
-        } & Omit<Omit<import("@radix-ui/react-radio-group").RadioGroupItemProps & React.RefAttributes<HTMLButtonElement> & {
+        } & Omit<Omit<import("@radix-ui/react-radio-group").RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>, "size"> & {
             size?: ("md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "md" | "lg">>) | undefined;
         } & {
             as?: React.ElementType;
-        }, "ref"> & React.RefAttributes<HTMLButtonElement>, "aria-label" | "as"> & {
+        }, "aria-label" | "as"> & {
             as?: never;
         } & {
             'aria-label'?: string;

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"RadioButtonField.js","sources":["../../../src/components/radio-button-field/RadioButtonField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { FieldElementWrapperProps } from '~/components/field-wrapper'\nimport { Description as FieldDescription } from '~/components/field-wrapper/FieldDescription'\nimport { useFieldError } from '~/components/form'\nimport { InlineMessage } from '~/components/inline-message'\nimport { Label } from '~/components/label'\nimport { RadioButtonGroup } from '~/components/radio-button'\nimport { styled } from '~/styled'\n\nimport { RadioField } from './RadioField'\n\nconst Fieldset = styled('fieldset', {\n  base: ['[all:unset]']\n})\n\ntype RadioButtonFieldProps = React.ComponentProps<typeof RadioButtonGroup> &\n  FieldElementWrapperProps\n\nconst RadioButtonFieldComponent = ({\n  children,\n  className,\n  direction = 'column',\n  defaultValue,\n  value,\n  description,\n  label,\n  name,\n  validation,\n  onValueChange,\n  ...remainingProps\n}: RadioButtonFieldProps) => {\n  const { control } = useFormContext()\n  const {\n    field: { ref, onChange, value: innerValue, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue\n  })\n  const { error } = useFieldError(name)\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner value to match what is passed in.\n    if (typeof value !== 'undefined') onChange(value)\n  }, [value])\n\n  return (\n    <Fieldset className={className}>\n      <Label\n        as=\"legend\"\n        required={Boolean(validation?.required)}\n        className=\"mb-3 p-0\"\n      >\n        {label}\n      </Label>\n      {description && (\n        <FieldDescription className=\"mb-3\">{description}</FieldDescription>\n      )}\n\n      <RadioButtonGroup\n        ref={ref}\n        direction={direction}\n        defaultValue={defaultValue}\n        onValueChange={(newValue) => {\n          onChange(newValue)\n          onValueChange?.(newValue)\n        }}\n        value={innerValue}\n        {...remainingProps}\n      >\n        {children}\n      </RadioButtonGroup>\n\n      {error && <InlineMessage className=\"mt-2\">{error}</InlineMessage>}\n    </Fieldset>\n  )\n}\n\nexport const RadioButtonField = Object.assign(RadioButtonFieldComponent, {\n  Item: RadioField\n})\n\nRadioButtonFieldComponent.displayName = 'RadioButtonField'\n"],"names":["Fieldset","styled","RadioButtonFieldComponent","children","className","direction","defaultValue","value","description","label","name","validation","onValueChange","remainingProps","control","useFormContext","ref","onChange","innerValue","innerName","useController","error","useFieldError","React","Label","FieldDescription","RadioButtonGroup","newValue","InlineMessage","RadioButtonField","RadioField"],"mappings":"ykBAaA,MAAMA,EAAWC,EAAO,WAAY,CAClC,KAAM,CAAC,aAAa,CACtB,CAAC,EAKKC,EAA4B,CAAC,CACjC,SAAAC,EACA,UAAAC,EACA,UAAAC,EAAY,SACZ,aAAAC,EACA,MAAAC,EACA,YAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,cAAAC,EACA,GAAGC,CACL,IAA6B,CAC3B,KAAM,CAAE,QAAAC,CAAQ,EAAIC,IACd,CACJ,MAAO,CAAE,IAAAC,EAAK,SAAAC,EAAU,MAAOC,EAAY,KAAMC,CAAU,CAC7D,EAAIC,EAAc,CAChB,KAAAV,EACA,QAAAI,EACA,MAAOH,EACP,aAAAL,CACF,CAAC,EACK,CAAE,MAAAe,CAAM,EAAIC,EAAcZ,CAAI,EAEpC,OAAAa,EAAM,UAAU,IAAM,CAEhB,OAAOhB,EAAU,KAAaU,EAASV,CAAK,CAClD,EAAG,CAACA,CAAK,CAAC,EAGRgB,EAAA,cAACvB,EAAA,CAAS,UAAWI,CACnBmB,EAAAA,EAAA,cAACC,EAAA,CACC,GAAG,SACH,SAAU,CAAA,EAAQb,GAAA,MAAAA,EAAY,UAC9B,UAAU,UAETF,EAAAA,CACH,EACCD,GACCe,EAAA,cAACE,EAAA,CAAiB,UAAU,QAAQjB,CAAY,EAGlDe,EAAA,cAACG,EAAA,CACC,IAAKV,EACL,UAAWX,EACX,aAAcC,EACd,cAAgBqB,GAAa,CAC3BV,EAASU,CAAQ,EACjBf,GAAA,MAAAA,EAAgBe,CAAAA,CAClB,EACA,MAAOT,EACN,GAAGL,GAEHV,CACH,EAECkB,GAASE,EAAA,cAACK,EAAA,CAAc,UAAU,MAAQP,EAAAA,CAAM,CACnD,CAEJ,EAEaQ,EAAmB,OAAO,OAAO3B,EAA2B,CACvE,KAAM4B,CACR,CAAC,EAED5B,EAA0B,YAAc"}
+{"version":3,"file":"RadioButtonField.js","sources":["../../../src/components/radio-button-field/RadioButtonField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { FieldElementWrapperProps } from '~/components/field-wrapper'\nimport { Description as FieldDescription } from '~/components/field-wrapper/FieldDescription'\nimport { useFieldError } from '~/components/form'\nimport { InlineMessage } from '~/components/inline-message'\nimport { Label } from '~/components/label'\nimport { RadioButtonGroup } from '~/components/radio-button'\nimport { styled } from '~/styled'\n\nimport { RadioField } from './RadioField'\n\nconst Fieldset = styled('fieldset', {\n  base: ['border-0', 'p-0', 'm-0', 'min-w-0']\n})\n\ntype RadioButtonFieldProps = React.ComponentProps<typeof RadioButtonGroup> &\n  FieldElementWrapperProps\n\nconst RadioButtonFieldComponent = ({\n  children,\n  className,\n  direction = 'column',\n  defaultValue,\n  value,\n  description,\n  label,\n  name,\n  validation,\n  onValueChange,\n  ...remainingProps\n}: RadioButtonFieldProps) => {\n  const { control } = useFormContext()\n  const {\n    field: { ref, onChange, value: innerValue, name: innerName }\n  } = useController({\n    name,\n    control,\n    rules: validation,\n    defaultValue\n  })\n  const { error } = useFieldError(name)\n\n  React.useEffect(() => {\n    // Update the react-hook-form inner value to match what is passed in.\n    if (typeof value !== 'undefined') onChange(value)\n  }, [value])\n\n  return (\n    <Fieldset className={className}>\n      <Label\n        as=\"legend\"\n        required={Boolean(validation?.required)}\n        className=\"mb-3 p-0\"\n      >\n        {label}\n      </Label>\n      {description && (\n        <FieldDescription className=\"mb-3\">{description}</FieldDescription>\n      )}\n\n      <RadioButtonGroup\n        ref={ref}\n        direction={direction}\n        defaultValue={defaultValue}\n        onValueChange={(newValue) => {\n          onChange(newValue)\n          onValueChange?.(newValue)\n        }}\n        value={innerValue}\n        {...remainingProps}\n      >\n        {children}\n      </RadioButtonGroup>\n\n      {error && <InlineMessage className=\"mt-2\">{error}</InlineMessage>}\n    </Fieldset>\n  )\n}\n\nexport const RadioButtonField = Object.assign(RadioButtonFieldComponent, {\n  Item: RadioField\n})\n\nRadioButtonFieldComponent.displayName = 'RadioButtonField'\n"],"names":["Fieldset","styled","RadioButtonFieldComponent","children","className","direction","defaultValue","value","description","label","name","validation","onValueChange","remainingProps","control","useFormContext","ref","onChange","innerValue","innerName","useController","error","useFieldError","React","Label","FieldDescription","RadioButtonGroup","newValue","InlineMessage","RadioButtonField","RadioField"],"mappings":"ykBAaA,MAAMA,EAAWC,EAAO,WAAY,CAClC,KAAM,CAAC,WAAY,MAAO,MAAO,SAAS,CAC5C,CAAC,EAKKC,EAA4B,CAAC,CACjC,SAAAC,EACA,UAAAC,EACA,UAAAC,EAAY,SACZ,aAAAC,EACA,MAAAC,EACA,YAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,cAAAC,EACA,GAAGC,CACL,IAA6B,CAC3B,KAAM,CAAE,QAAAC,CAAQ,EAAIC,EAAe,EAC7B,CACJ,MAAO,CAAE,IAAAC,EAAK,SAAAC,EAAU,MAAOC,EAAY,KAAMC,CAAU,CAC7D,EAAIC,EAAc,CAChB,KAAAV,EACA,QAAAI,EACA,MAAOH,EACP,aAAAL,CACF,CAAC,EACK,CAAE,MAAAe,CAAM,EAAIC,EAAcZ,CAAI,EAEpC,OAAAa,EAAM,UAAU,IAAM,CAEhB,OAAOhB,EAAU,KAAaU,EAASV,CAAK,CAClD,EAAG,CAACA,CAAK,CAAC,EAGRgB,EAAA,cAACvB,EAAA,CAAS,UAAWI,CAAAA,EACnBmB,EAAA,cAACC,EAAA,CACC,GAAG,SACH,SAAU,GAAQb,GAAA,MAAAA,EAAY,UAC9B,UAAU,UAAA,EAETF,CACH,EACCD,GACCe,EAAA,cAACE,EAAA,CAAiB,UAAU,MAAQjB,EAAAA,CAAY,EAGlDe,EAAA,cAACG,EAAA,CACC,IAAKV,EACL,UAAWX,EACX,aAAcC,EACd,cAAgBqB,GAAa,CAC3BV,EAASU,CAAQ,EACjBf,GAAA,MAAAA,EAAgBe,CAClB,CAAA,EACA,MAAOT,EACN,GAAGL,CAEHV,EAAAA,CACH,EAECkB,GAASE,EAAA,cAACK,EAAA,CAAc,UAAU,MAAQP,EAAAA,CAAM,CACnD,CAEJ,EAEaQ,EAAmB,OAAO,OAAO3B,EAA2B,CACvE,KAAM4B,CACR,CAAC,EAED5B,EAA0B,YAAc"}

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

@@ -1,12 +1,12 @@
 import * as RadioGroup from '@radix-ui/react-radio-group';
 import * as React from 'react';
-declare const StyledRadioCard: React.ForwardRefExoticComponent<Omit<RadioGroup.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement> & {
-    align?: ("left" | "right" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "left" | "right">>) | undefined;
-    size?: ("md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "md" | "lg">>) | undefined;
-    isFullWidth?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+declare const StyledRadioCard: React.ForwardRefExoticComponent<Omit<RadioGroup.RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>, "size" | "align" | "isFullWidth"> & {
+    align?: "left" | "right" | undefined;
+    size?: "md" | "lg" | undefined;
+    isFullWidth?: boolean | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+}>;
 type RadioCardProps = React.ComponentProps<typeof StyledRadioCard>;
 export declare const RadioCard: ({ children, isFullWidth, size, align, ...rest }: RadioCardProps) => React.JSX.Element;
 export {};

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-round","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-round","absolute","size-1.5"]}),u=({children:l,isFullWidth:r=!1,size:n="md",align:a="left",...s})=>e.createElement(d,{...s,align:a,isFullWidth:r,size:n},e.createElement(o,{align:a,containerIsFullWidth:r},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","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};
 //# 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-round',\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-round', '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,gBACA,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,gBAAiB,WAAY,UAAU,CAC5D,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    '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"}

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

@@ -1,30 +1,32 @@
 import React from 'react';
 import { Flex } from '../flex';
-declare const StyledSectionMessage: React.ForwardRefExoticComponent<import("../dismissible/DismissibleRoot").IDismissibleRootInternalProps & import("../dismissible/DismissibleRoot").IDismissibleRootProps & {
+declare const StyledSectionMessage: React.ForwardRefExoticComponent<Omit<import("../dismissible/DismissibleRoot").IDismissibleRootInternalProps & import("../dismissible/DismissibleRoot").IDismissibleRootProps & {
     children?: React.ReactNode | undefined;
-} & {
-    theme?: ("warning" | "error" | "success" | "info" | "neutral" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "warning" | "error" | "success" | "info" | "neutral">>) | undefined;
-    hasIcon?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    hasDismiss?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+}, "theme" | "hasDismiss" | "hasIcon"> & {
+    theme?: "warning" | "error" | "success" | "info" | "neutral" | undefined;
+    hasIcon?: boolean | undefined;
+    hasDismiss?: boolean | undefined;
 } & {
     as?: React.ElementType;
-} & React.RefAttributes<never>>;
-declare const SectionMessageRoot: ({ children, ...rest }: React.ComponentProps<typeof StyledSectionMessage>) => JSX.Element;
+}>;
+declare const SectionMessageRoot: ({ children, ...rest }: React.ComponentProps<typeof StyledSectionMessage> & {
+    className?: string;
+}) => React.JSX.Element;
 export type SectionMessageTheme = 'success' | 'warning' | 'error' | 'neutral' | 'info';
-export interface SectionMessageProps extends React.ComponentProps<typeof SectionMessageRoot> {
+export type SectionMessageProps = React.ComponentProps<typeof SectionMessageRoot> & {
     theme?: SectionMessageTheme;
-}
+};
 export declare const SectionMessage: {
-    ({ theme, ...rest }: SectionMessageProps): JSX.Element;
+    ({ theme, ...rest }: SectionMessageProps): React.JSX.Element;
     Title: (props: React.ComponentProps<typeof import("..").Text>) => JSX.Element;
     Description: ({ className, ...rest }: React.ComponentProps<typeof import("..").Text>) => JSX.Element;
     Icon: ({ className, is, ...rest }: Partial<Omit<Omit<Omit<Omit<React.SVGProps<SVGSVGElement>, "ref"> & {
         ref?: ((instance: SVGSVGElement | null) => void) | React.RefObject<SVGSVGElement> | null | undefined;
-    } & {
+    }, "size"> & {
         size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
     } & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<SVGSVGElement>, "is" | "as"> & {
+    }, "is" | "as"> & {
         is: React.FC<React.SVGProps<SVGSVGElement>>;
         as?: never;
     }, "ref"> & React.RefAttributes<SVGSVGElement>>) => JSX.Element;

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

@@ -1,2 +1,2 @@
-import{TooltipProvider as m}from"@radix-ui/react-tooltip";import t from"react";import{styled as a}from"../../styled.js";import{Dismissible as c}from"../dismissible/index.js";import{Flex as g}from"../flex/Flex.js";import{SectionMessageProvider as l,useSectionMessageContext as p}from"./SectionMessageContext.js";import{SectionMessageDescription as f}from"./SectionMessageDescription.js";import{SectionMessageDismiss as h}from"./SectionMessageDismiss.js";import{SectionMessageIcon as d}from"./SectionMessageIcon.js";import{SectionMessageContent as u,SectionMessageActions as x}from"./SectionMessageLayout.js";import{SectionMessageTitle as b}from"./SectionMessageTitle.js";const M=a(c,{base:["relative","rounded-md","flex","min-h-12","p-4","border","border-white"],variants:{theme:{success:["bg-success-light","text-success-dark"],warning:["bg-warning-light","text-warning-text"],error:["bg-danger-light","text-danger-dark"],neutral:["bg-grey-100","text-grey-1000"],info:["bg-info-light","text-info-dark"]},hasIcon:{true:["pl-10"]},hasDismiss:{true:["pr-12"]}}}),S=({children:s,...r})=>{const{theme:i,hasIcon:o,hasDismiss:n}=p();return t.createElement(M,{...r,theme:i,hasIcon:o,hasDismiss:n},t.createElement(g,{gap:3,justify:"space-between",className:"grow"},s))},e=({theme:s="info",...r})=>t.createElement(m,null,t.createElement(l,{theme:s},t.createElement(S,{...r})));e.Title=b,e.Description=f,e.Icon=d,e.Dismiss=h,e.Content=u,e.Actions=x;export{e as SectionMessage};
+import{TooltipProvider as m}from"@radix-ui/react-tooltip";import t from"react";import{styled as a}from"../../styled.js";import{Dismissible as c}from"../dismissible/index.js";import{Flex as g}from"../flex/Flex.js";import{SectionMessageProvider as l,useSectionMessageContext as p}from"./SectionMessageContext.js";import{SectionMessageDescription as h}from"./SectionMessageDescription.js";import{SectionMessageDismiss as f}from"./SectionMessageDismiss.js";import{SectionMessageIcon as d}from"./SectionMessageIcon.js";import{SectionMessageContent as u,SectionMessageActions as x}from"./SectionMessageLayout.js";import{SectionMessageTitle as b}from"./SectionMessageTitle.js";const M=a(c,{base:["relative","rounded-md","flex","shrink-0","min-h-12","p-4","border","border-white"],variants:{theme:{success:["bg-success-light","text-success-dark"],warning:["bg-warning-light","text-warning-text"],error:["bg-danger-light","text-danger-dark"],neutral:["bg-grey-100","text-grey-1000"],info:["bg-info-light","text-info-dark"]},hasIcon:{true:["pl-10"]},hasDismiss:{true:["pr-12"]}}}),S=({children:s,...r})=>{const{theme:i,hasIcon:o,hasDismiss:n}=p();return t.createElement(M,{...r,theme:i,hasIcon:o,hasDismiss:n},t.createElement(g,{gap:3,justify:"space-between",className:"grow"},s))},e=({theme:s="info",...r})=>t.createElement(m,null,t.createElement(l,{theme:s},t.createElement(S,{...r})));e.Title=b,e.Description=h,e.Icon=d,e.Dismiss=f,e.Content=u,e.Actions=x;export{e as SectionMessage};
 //# sourceMappingURL=SectionMessage.js.map

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    '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>): JSX.Element => {\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 interface SectionMessageProps\n  extends React.ComponentProps<typeof SectionMessageRoot> {\n  theme?: SectionMessageTheme\n}\n\nexport const SectionMessage = ({\n  theme = 'info',\n  ...rest\n}: SectionMessageProps): JSX.Element => {\n  return (\n    <TooltipProvider>\n      <SectionMessageProvider theme={theme}>\n        <SectionMessageRoot {...rest} />\n      </SectionMessageProvider>\n    </TooltipProvider>\n  )\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,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,IAAsE,CACpE,KAAM,CAAE,MAAAC,EAAO,QAAAC,EAAS,WAAAC,CAAW,EAAIC,EAAyB,EAEhE,OACEC,EAAA,cAACV,EAAA,CACE,GAAGK,EACJ,MAAOC,EACP,QAASC,EACT,WAAYC,CAAAA,EAEZE,EAAA,cAACC,EAAA,CAAK,IAAK,EAAG,QAAQ,gBAAgB,UAAU,MAAA,EAC7CP,CACH,CACF,CAEJ,EAcaQ,EAAiB,CAAC,CAC7B,MAAAN,EAAQ,OACR,GAAGD,CACL,IAEIK,EAAA,cAACG,EAAA,KACCH,EAAA,cAACI,EAAA,CAAuB,MAAOR,CAC7BI,EAAAA,EAAA,cAACP,EAAA,CAAoB,GAAGE,CAAM,CAAA,CAChC,CACF,EAIJO,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'\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/segmented-control/SegmentedControl.d.ts

@@ -1,56 +1,56 @@
 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> & {
+    Item: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("@radix-ui/react-tabs").TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>, never> & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement> & {
+    } & {
         value: string;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement> & {
+    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "theme" | "size"> & {
         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;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "size">, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    }, "size">, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
     Heading: (props: Omit<React.ComponentProps<import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
         ref?: ((instance: HTMLParagraphElement | null) => void) | import("react").RefObject<HTMLParagraphElement> | null | undefined;
-    } & {
+    }, "size" | "noCapsize" | "weight" | "family"> & {
+        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;
-        size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
-        noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLParagraphElement>, "as"> & {
+    }, "as"> & {
         as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLParagraphElement> & {
+    }, "ref"> & import("react").RefAttributes<HTMLParagraphElement>, "size"> & {
         size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>>, "size">) => JSX.Element;
+    }>>, "size">) => JSX.Element;
     Description: (props: Omit<React.ComponentProps<import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
         ref?: ((instance: HTMLParagraphElement | null) => void) | import("react").RefObject<HTMLParagraphElement> | null | undefined;
-    } & {
+    }, "size" | "noCapsize" | "weight" | "family"> & {
+        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;
-        size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
-        noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLParagraphElement>, "as"> & {
+    }, "as"> & {
         as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLParagraphElement> & {
+    }, "ref"> & import("react").RefAttributes<HTMLParagraphElement>, "size"> & {
         size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>>, "size">) => JSX.Element;
+    }>>, "size">) => JSX.Element;
     Icon: (props: Omit<React.ComponentProps<typeof import("..").Icon>, "size">) => JSX.Element;
-    Content: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-tabs").TabsContentProps & import("react").RefAttributes<HTMLDivElement> & {
+    Content: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-tabs").TabsContentProps & import("react").RefAttributes<HTMLDivElement>, never> & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    }>;
     Badge: ({ className, ...props }: Omit<React.ComponentProps<typeof import("..").Badge>, "size">) => JSX.Element;
     ItemList: (props: React.ComponentProps<{
-        ({ children, colorScheme, ...rest }: React.ComponentProps<import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-tabs").TabsListProps & import("react").RefAttributes<HTMLDivElement> & {
+        ({ children, colorScheme, ...rest }: React.ComponentProps<import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-tabs").TabsListProps & import("react").RefAttributes<HTMLDivElement>, never> & {
             as?: import("react").ElementType;
-        }, "ref"> & import("react").RefAttributes<HTMLDivElement>>> & {
+        }>> & {
             colorScheme?: import("../..").TcolorScheme;
         }): import("react").JSX.Element;
         displayName: string;

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

@@ -1,4 +1,4 @@
 import * as React from 'react';
-export declare const SegmentedControlContent: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-tabs").TabsContentProps & React.RefAttributes<HTMLDivElement> & {
+export declare const SegmentedControlContent: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-tabs").TabsContentProps & React.RefAttributes<HTMLDivElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;

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

@@ -1,19 +1,19 @@
 import * as React from 'react';
 declare const StyledText: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
     ref?: ((instance: HTMLParagraphElement | null) => void) | React.RefObject<HTMLParagraphElement> | null | undefined;
-} & {
+}, "size" | "noCapsize" | "weight" | "family"> & {
+    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;
-    size?: ("sm" | "md" | "lg" | "xs" | "xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl">>) | undefined;
-    noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLParagraphElement>, "as"> & {
+}, "as"> & {
     as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLParagraphElement> & {
+}, "ref"> & React.RefAttributes<HTMLParagraphElement>, "size"> & {
     size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+}>;
 export declare const SegmentedControlDescription: (props: Omit<React.ComponentProps<typeof StyledText>, "size">) => JSX.Element;
 export {};

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

@@ -1,2 +1,2 @@
-import*as t from"react";import{styled as r}from"../../styled.js";import{Text as m}from"../text/Text.js";import{SegmentedControlContext as n}from"./SegmentedControlContext.js";const s=r(m,{base:["font-body","text-text-subtle","font-normal"],variants:{size:{sm:["text-xs"],md:["text-sm"],lg:["text-md"]}}}),i=e=>{const{size:o}=t.useContext(n);return t.createElement(s,{...e,size:o})};export{i as SegmentedControlDescription};
+import*as t from"react";import{styled as n}from"../../styled.js";import{Text as r}from"../text/Text.js";import{SegmentedControlContext as s}from"./SegmentedControlContext.js";const m=n(r,{base:["font-body","text-text-subtle","font-normal"],variants:{size:{sm:["text-xs","leading-[1.6]"],md:["text-sm","leading-[1.53]"],lg:["text-md","leading-normal"]}}},{enabledResponsiveVariants:!0}),i=e=>{const{size:o}=t.useContext(s);return t.createElement(m,{...e,size:o})};export{i as SegmentedControlDescription};
 //# sourceMappingURL=SegmentedControlDescription.js.map

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(Text, {\n  base: ['font-body', 'text-text-subtle', 'font-normal'],\n  variants: {\n    size: {\n      sm: ['text-xs'],\n      md: ['text-sm'],\n      lg: ['text-md']\n    }\n  }\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,EAAOC,EAAM,CAC9B,KAAM,CAAC,YAAa,mBAAoB,aAAa,EACrD,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,SAAS,EACd,GAAI,CAAC,SAAS,EACd,GAAI,CAAC,SAAS,CAChB,CACF,CACF,CAAC,EAEYC,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'\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"}