@atom-learning/components 8.0.2 → 9.0.0-beta.0

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

@@ -1,6 +1,6 @@
 import { styled } from "../../styled.js";
 import { Dismissible } from "../dismissible/index.js";
-import { SectionMessageProvider, useSectionMessageContext } from "./SectionMessageContext.js";
+import { SectionMessageProvider, useSectionMessageContext } from "./SectionMessage.context.js";
 import { SectionMessageDescription } from "./SectionMessageDescription.js";
 import { SectionMessageDismiss } from "./SectionMessageDismiss.js";
 import { SectionMessageIcon } from "./SectionMessageIcon.js";
@@ -46,16 +46,18 @@ var SectionMessageRoot = ({ children, ...rest }) => {
 		})
 	});
 };
-var SectionMessage = ({ theme = "info", ...rest }) => /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(SectionMessageProvider, {
+var SectionMessageComponent = ({ theme = "info", ...rest }) => /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(SectionMessageProvider, {
 	theme,
 	children: /* @__PURE__ */ jsx(SectionMessageRoot, { ...rest })
 }) });
-SectionMessage.Title = SectionMessageTitle;
-SectionMessage.Description = SectionMessageDescription;
-SectionMessage.Icon = SectionMessageIcon;
-SectionMessage.Dismiss = SectionMessageDismiss;
-SectionMessage.Content = SectionMessageContent;
-SectionMessage.Actions = SectionMessageActions;
+var SectionMessage = /* @__PURE__ */ Object.assign(SectionMessageComponent, {
+	Title: SectionMessageTitle,
+	Description: SectionMessageDescription,
+	Icon: SectionMessageIcon,
+	Dismiss: SectionMessageDismiss,
+	Content: SectionMessageContent,
+	Actions: SectionMessageActions
+});
 //#endregion
 export { SectionMessage };
 

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

@@ -1 +1 @@
-{"version":3,"file":"SectionMessage.js","names":[],"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 {\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      <div className=\"flex grow justify-between gap-3\">{children}</div>\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"],"mappings":";;;;;;;;;;;;AAmBA,IAAM,uBAAuB,OAAO,aAAa;CAC/C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS,CAAC,oBAAoB,oBAAoB;GAClD,SAAS,CAAC,oBAAoB,oBAAoB;GAClD,OAAO,CAAC,mBAAmB,mBAAmB;GAC9C,SAAS,CAAC,eAAe,iBAAiB;GAC1C,MAAM,CAAC,iBAAiB,iBAAiB;GAC1C;EACD,SAAS,EACP,MAAM,CAAC,QAAQ,EAChB;EACD,YAAY,EACV,MAAM,CAAC,QAAQ,EAChB;EACF;CACF,CAAC;AAEF,IAAM,sBAAsB,EAC1B,UACA,GAAG,WAGC;CACJ,MAAM,EAAE,OAAO,SAAS,eAAe,0BAA0B;AAEjE,QACE,oBAAC,sBAAD;EACE,GAAI;EACG;EACE;EACG;YAEZ,oBAAC,OAAD;GAAK,WAAU;GAAmC;GAAe,CAAA;EAC5C,CAAA;;AAiB3B,IAAa,kBAAkB,EAC7B,QAAQ,QACR,GAAG,WAEH,oBAAC,iBAAD,EAAA,UACE,oBAAC,wBAAD;CAA+B;WAC7B,oBAAC,oBAAD,EAAoB,GAAI,MAAQ,CAAA;CACT,CAAA,EACT,CAAA;AAGpB,eAAe,QAAQ;AACvB,eAAe,cAAc;AAC7B,eAAe,OAAO;AACtB,eAAe,UAAU;AACzB,eAAe,UAAU;AACzB,eAAe,UAAU"}
+{"version":3,"file":"SectionMessage.js","names":[],"sources":["../../../src/components/section-message/SectionMessage.tsx"],"sourcesContent":["import { TooltipProvider } from '@radix-ui/react-tooltip'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Dismissible } from '../dismissible'\nimport {\n  SectionMessageProvider,\n  useSectionMessageContext\n} from './SectionMessage.context'\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      <div className=\"flex grow justify-between gap-3\">{children}</div>\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\nconst SectionMessageComponent = ({\n  theme = 'info',\n  ...rest\n}: SectionMessageProps) => (\n  <TooltipProvider>\n    <SectionMessageProvider theme={theme}>\n      <SectionMessageRoot {...rest} />\n    </SectionMessageProvider>\n  </TooltipProvider>\n)\n\nexport const SectionMessage = /* @__PURE__ */ Object.assign(\n  SectionMessageComponent,\n  {\n    Title: SectionMessageTitle,\n    Description: SectionMessageDescription,\n    Icon: SectionMessageIcon,\n    Dismiss: SectionMessageDismiss,\n    Content: SectionMessageContent,\n    Actions: SectionMessageActions\n  }\n)\n"],"mappings":";;;;;;;;;;;;AAkBA,IAAM,uBAAuB,OAAO,aAAa;CAC/C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,OAAO;GACL,SAAS,CAAC,oBAAoB,mBAAmB;GACjD,SAAS,CAAC,oBAAoB,mBAAmB;GACjD,OAAO,CAAC,mBAAmB,kBAAkB;GAC7C,SAAS,CAAC,eAAe,gBAAgB;GACzC,MAAM,CAAC,iBAAiB,gBAAgB;EAC1C;EACA,SAAS,EACP,MAAM,CAAC,OAAO,EAChB;EACA,YAAY,EACV,MAAM,CAAC,OAAO,EAChB;CACF;AACF,CAAC;AAED,IAAM,sBAAsB,EAC1B,UACA,GAAG,WAGC;CACJ,MAAM,EAAE,OAAO,SAAS,eAAe,yBAAyB;CAEhE,OACE,oBAAC,sBAAD;EACE,GAAI;EACG;EACE;EACG;YAEZ,oBAAC,OAAD;GAAK,WAAU;GAAmC;EAAc,CAAA;CAC5C,CAAA;AAE1B;AAeA,IAAM,2BAA2B,EAC/B,QAAQ,QACR,GAAG,WAEH,oBAAC,iBAAD,EAAA,UACE,oBAAC,wBAAD;CAA+B;WAC7B,oBAAC,oBAAD,EAAoB,GAAI,KAAO,CAAA;AACT,CAAA,EACT,CAAA;AAGnB,IAAa,iBAAiC,uBAAO,OACnD,yBACA;CACE,OAAO;CACP,aAAa;CACb,MAAM;CACN,SAAS;CACT,SAAS;CACT,SAAS;AACX,CACF"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageDescription.js","names":[],"sources":["../../../src/components/section-message/SectionMessageDescription.tsx"],"sourcesContent":["import React from 'react'\n\nimport { cn } from '~/styled'\n\nimport { Text } from '../text/Text'\n\nexport const SectionMessageDescription = ({\n  className,\n  ...rest\n}: React.ComponentProps<typeof Text>): React.JSX.Element => (\n  <Text size=\"sm\" {...rest} className={cn('text-grey-900', className)} />\n)\n"],"mappings":";;;;;AAMA,IAAa,6BAA6B,EACxC,WACA,GAAG,WAEH,oBAAC,MAAD;CAAM,MAAK;CAAK,GAAI;CAAM,WAAW,GAAG,iBAAiB,UAAU;CAAI,CAAA"}
+{"version":3,"file":"SectionMessageDescription.js","names":[],"sources":["../../../src/components/section-message/SectionMessageDescription.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '../../styled'\nimport { Text } from '../text/Text'\n\nexport const SectionMessageDescription = ({\n  className,\n  ...rest\n}: React.ComponentProps<typeof Text>) => (\n  <Text size=\"sm\" {...rest} className={cn('text-grey-900', className)} />\n)\n"],"mappings":";;;;;AAKA,IAAa,6BAA6B,EACxC,WACA,GAAG,WAEH,oBAAC,MAAD;CAAM,MAAK;CAAK,GAAI;CAAM,WAAW,GAAG,iBAAiB,SAAS;AAAI,CAAA"}

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

@@ -2,7 +2,7 @@ import { cn } from "../../styled.js";
 import { Icon } from "../icon/Icon.js";
 import { ActionIcon } from "../action-icon/ActionIcon.js";
 import { Dismissible } from "../dismissible/index.js";
-import { useSectionMessageContext } from "./SectionMessageContext.js";
+import { useSectionMessageContext } from "./SectionMessage.context.js";
 import { useEffect } from "react";
 import { jsx } from "react/jsx-runtime";
 import { Close } from "@atom-learning/icons";

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

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageDismiss.js","names":[],"sources":["../../../src/components/section-message/SectionMessageDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport React, { useEffect } from 'react'\n\nimport { cn } from '~/styled'\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>): React.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={cn('m-auto', 'absolute', 'top-2', 'right-2', className)}\n      >\n        <Icon is={Close} />\n      </ActionIcon>\n    </Dismissible.Trigger>\n  )\n}\n"],"mappings":";;;;;;;;;AAUA,IAAa,yBAAyB,EACpC,QAAQ,WACR,WACA,GAAG,WAC6D;CAChE,MAAM,EAAE,kBAAkB,0BAA0B;AAEpD,iBAAgB;AACd,gBAAc,KAAK;AACnB,eAAa,cAAc,MAAM;IAChC,CAAC,cAAc,CAAC;AAEnB,QACE,oBAAC,YAAY,SAAb;EAAqB,SAAA;YACnB,oBAAC,YAAD;GACS;GACP,MAAK;GACL,YAAW;GACX,OAAM;GACN,GAAI;GACJ,WAAW,GAAG,UAAU,YAAY,SAAS,WAAW,UAAU;aAElE,oBAAC,MAAD,EAAM,IAAI,OAAS,CAAA;GACR,CAAA;EACO,CAAA"}
+{"version":3,"file":"SectionMessageDismiss.js","names":[],"sources":["../../../src/components/section-message/SectionMessageDismiss.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport React, { useEffect } from 'react'\n\nimport { cn } from '../../styled'\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Dismissible } from '../dismissible'\nimport { Icon } from '../icon/Icon'\nimport { useSectionMessageContext } from './SectionMessage.context'\n\nexport const SectionMessageDismiss = ({\n  label = 'Dismiss',\n  className,\n  ...rest\n}: React.ComponentProps<typeof ActionIcon>) => {\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={cn('m-auto', 'absolute', 'top-2', 'right-2', className)}\n      >\n        <Icon is={Close} />\n      </ActionIcon>\n    </Dismissible.Trigger>\n  )\n}\n"],"mappings":";;;;;;;;;AASA,IAAa,yBAAyB,EACpC,QAAQ,WACR,WACA,GAAG,WAC0C;CAC7C,MAAM,EAAE,kBAAkB,yBAAyB;CAEnD,gBAAgB;EACd,cAAc,IAAI;EAClB,aAAa,cAAc,KAAK;CAClC,GAAG,CAAC,aAAa,CAAC;CAElB,OACE,oBAAC,YAAY,SAAb;EAAqB,SAAA;YACnB,oBAAC,YAAD;GACS;GACP,MAAK;GACL,YAAW;GACX,OAAM;GACN,GAAI;GACJ,WAAW,GAAG,UAAU,YAAY,SAAS,WAAW,SAAS;aAEjE,oBAAC,MAAD,EAAM,IAAI,MAAQ,CAAA;EACR,CAAA;CACO,CAAA;AAEzB"}

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

@@ -1,6 +1,6 @@
 import { cn } from "../../styled.js";
 import { Icon } from "../icon/Icon.js";
-import { useSectionMessageContext } from "./SectionMessageContext.js";
+import { useSectionMessageContext } from "./SectionMessage.context.js";
 import { useEffect } from "react";
 import { jsx } from "react/jsx-runtime";
 import { Danger, Error, Info, OkCircle } from "@atom-learning/icons";

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

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageIcon.js","names":[],"sources":["../../../src/components/section-message/SectionMessageIcon.tsx"],"sourcesContent":["import { Danger, Error, Info, OkCircle } from '@atom-learning/icons'\nimport React, { useEffect } from 'react'\n\nimport { cn } from '~/styled'\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): React.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={cn(\n        'm-auto',\n        'absolute',\n        'left-4',\n        'top-4',\n        'text-current',\n        className\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;;;AAQA,IAAM,aAAa;CACjB,SAAS;CACT,SAAS;CACT,OAAO;CACP,SAAS;CACT,MAAM;CACP;AAID,IAAa,sBAAsB,EACjC,WACA,IACA,GAAG,WAC6C;CAChD,MAAM,EAAE,OAAO,eAAe,0BAA0B;AAExD,iBAAgB;AACd,aAAW,KAAK;AAChB,eAAa,WAAW,MAAM;IAC7B,CAAC,WAAW,CAAC;AAEhB,QACE,oBAAC,MAAD;EACE,IAAI,MAAM,WAAW;EACrB,MAAK;EACL,GAAI;EACJ,WAAW,GACT,UACA,YACA,UACA,SACA,gBACA,UACD;EACD,CAAA"}
+{"version":3,"file":"SectionMessageIcon.js","names":[],"sources":["../../../src/components/section-message/SectionMessageIcon.tsx"],"sourcesContent":["import { Danger, Error, Info, OkCircle } from '@atom-learning/icons'\nimport React, { useEffect } from 'react'\n\nimport { cn } from '../../styled'\nimport { Icon } from '../icon/Icon'\nimport { useSectionMessageContext } from './SectionMessage.context'\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) => {\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={cn(\n        'm-auto',\n        'absolute',\n        'left-4',\n        'top-4',\n        'text-current',\n        className\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;;;AAOA,IAAM,aAAa;CACjB,SAAS;CACT,SAAS;CACT,OAAO;CACP,SAAS;CACT,MAAM;AACR;AAIA,IAAa,sBAAsB,EACjC,WACA,IACA,GAAG,WAC0B;CAC7B,MAAM,EAAE,OAAO,eAAe,yBAAyB;CAEvD,gBAAgB;EACd,WAAW,IAAI;EACf,aAAa,WAAW,KAAK;CAC/B,GAAG,CAAC,UAAU,CAAC;CAEf,OACE,oBAAC,MAAD;EACE,IAAI,MAAM,WAAW;EACrB,MAAK;EACL,GAAI;EACJ,WAAW,GACT,UACA,YACA,UACA,SACA,gBACA,SACF;CACD,CAAA;AAEL"}

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

@@ -1,5 +1,3 @@
-import React from 'react';
-export declare const SectionMessageContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & {
-    as?: React.ElementType;
-}>;
-export declare const SectionMessageActions: ({ className, ...rest }: React.ComponentProps<"div">) => React.JSX.Element;
+import * as React from 'react';
+export declare const SectionMessageContent: import("../..").PolymorphicComponent<"div", unknown>;
+export declare const SectionMessageActions: ({ className, ...rest }: React.ComponentProps<'div'>) => React.JSX.Element;

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

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageLayout.js","names":[],"sources":["../../../src/components/section-message/SectionMessageLayout.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/styled'\nimport { cn } from '~/styled'\n\nexport const SectionMessageContent = styled('div', {\n  base: ['max-w-full', 'shrink-0', 'pt-0.5', '*:not-last:mb-2']\n})\n\nexport const SectionMessageActions = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => (\n  <div className={cn('max-w-full', 'shrink-0', className)}>\n    <div className=\"flex flex-wrap gap-3\" {...rest} />\n  </div>\n)\n"],"mappings":";;;;AAKA,IAAa,wBAAwB,OAAO,OAAO,EACjD,MAAM;CAAC;CAAc;CAAY;CAAU;CAAkB,EAC9D,CAAC;AAEF,IAAa,yBAAyB,EACpC,WACA,GAAG,WAEH,oBAAC,OAAD;CAAK,WAAW,GAAG,cAAc,YAAY,UAAU;WACrD,oBAAC,OAAD;EAAK,WAAU;EAAuB,GAAI;EAAQ,CAAA;CAC9C,CAAA"}
+{"version":3,"file":"SectionMessageLayout.js","names":[],"sources":["../../../src/components/section-message/SectionMessageLayout.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled, cn } from '../../styled'\n\nexport const SectionMessageContent = styled('div', {\n  base: ['max-w-full', 'shrink-0', 'pt-0.5', '*:not-last:mb-2']\n})\n\nexport const SectionMessageActions = ({\n  className,\n  ...rest\n}: React.ComponentProps<'div'>) => (\n  <div className={cn('max-w-full', 'shrink-0', className)}>\n    <div className=\"flex flex-wrap gap-3\" {...rest} />\n  </div>\n)\n"],"mappings":";;;;AAIA,IAAa,wBAAwB,OAAO,OAAO,EACjD,MAAM;CAAC;CAAc;CAAY;CAAU;AAAiB,EAC9D,CAAC;AAED,IAAa,yBAAyB,EACpC,WACA,GAAG,WAEH,oBAAC,OAAD;CAAK,WAAW,GAAG,cAAc,YAAY,SAAS;WACpD,oBAAC,OAAD;EAAK,WAAU;EAAuB,GAAI;CAAO,CAAA;AAC9C,CAAA"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"SectionMessageTitle.js","names":[],"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): React.JSX.Element => <Text size=\"md\" weight=\"bold\" {...props} />\n"],"mappings":";;;;AAIA,IAAa,uBACX,UACsB,oBAAC,MAAD;CAAM,MAAK;CAAK,QAAO;CAAO,GAAI;CAAS,CAAA"}
+{"version":3,"file":"SectionMessageTitle.js","names":[],"sources":["../../../src/components/section-message/SectionMessageTitle.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text, type TextProps } from '../text/Text'\n\nexport const SectionMessageTitle = (props: TextProps) => (\n  <Text size=\"md\" weight=\"bold\" {...props} />\n)\n"],"mappings":";;;;AAIA,IAAa,uBAAuB,UAClC,oBAAC,MAAD;CAAM,MAAK;CAAK,QAAO;CAAO,GAAI;AAAQ,CAAA"}

package/dist/components/segmented-control/{SegmentedControlContext.js → SegmentedControl.context.js}

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-//#region src/components/segmented-control/SegmentedControlContext.tsx
+//#region src/components/segmented-control/SegmentedControl.context.tsx
 var SegmentedControlContext = React$1.createContext({
 	size: "md",
 	theme: "primary",
@@ -10,4 +10,4 @@ var SegmentedControlContext = React$1.createContext({
 //#endregion
 export { SegmentedControlContext };
 
-//# sourceMappingURL=SegmentedControlContext.js.map
+//# sourceMappingURL=SegmentedControl.context.js.map

package/dist/components/segmented-control/SegmentedControl.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedControl.context.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControl.context.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"],"mappings":";;AAcA,IAAa,0BACX,QAAM,cAA4C;CAChD,MAAM;CACN,OAAO;CACP,cAAc;CACd,OAAO;CACP,qBAAqB;AACvB,CAAC"}

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

@@ -1,50 +1,32 @@
 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<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;
-    } & {
-        as?: import("react").ElementType;
-    }, "size">, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-    Heading: (props: Omit<React.ComponentProps<import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "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?: ("display" | "body" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "display" | "body" | "mono">>) | undefined;
-    } & {
-        as?: import("react").ElementType;
-    }, "as"> & {
-        as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
-    }, "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;
-    }>>, "size">) => React.JSX.Element;
-    Description: (props: Omit<React.ComponentProps<import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "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?: ("display" | "body" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "display" | "body" | "mono">>) | undefined;
-    } & {
-        as?: import("react").ElementType;
-    }, "as"> & {
-        as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
-    }, "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;
-    }>>, "size">) => React.JSX.Element;
-    Icon: (props: Omit<React.ComponentProps<typeof import("..").Icon>, "size">) => React.JSX.Element;
-    Content: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-tabs").TabsContentProps & import("react").RefAttributes<HTMLDivElement>, never> & {
-        as?: import("react").ElementType;
-    }>;
-    Badge: ({ className, ...props }: Omit<React.ComponentProps<typeof import("..").Badge>, "size">) => React.JSX.Element;
+    Root: ({ size, theme, defaultValue, children, value, onValueChange, ...rest }: React.PropsWithChildren<import("./SegmentedControlRoot").SegmentedControlRootProps>) => import("react").JSX.Element;
+    Item: ({ ref, children, ...rest }: Omit<React.ComponentProps<import("../..").PolymorphicComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-tabs").TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, {
+        theme?: ("marsh" | "primary" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "marsh" | "primary">>) | undefined;
+        size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
+    }>>, 'size'>) => import("react").JSX.Element;
+    Heading: (props: Omit<React.ComponentProps<import("../..").PolymorphicComponent<import("../..").PolymorphicComponent<"p", {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+    }>, {
+        size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
+    }>>, 'size'>) => import("react").JSX.Element;
+    Description: (props: Omit<React.ComponentProps<import("../..").PolymorphicComponent<import("../..").PolymorphicComponent<"p", {
+        size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+        noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+        weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+        family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+    }>, {
+        size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
+    }>>, 'size'>) => import("react").JSX.Element;
+    Icon: (props: Omit<React.ComponentProps<typeof import("..").Icon>, 'size'>) => import("react").JSX.Element;
+    Content: import("../..").PolymorphicComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-tabs").TabsContentProps & import("react").RefAttributes<HTMLDivElement>>, unknown>;
+    Badge: ({ className, ...rest }: Omit<React.ComponentProps<typeof import("..").Badge>, 'size'>) => import("react").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>, never> & {
-            as?: import("react").ElementType;
-        }>> & {
+        ({ children, colorScheme, ...rest }: React.ComponentProps<import("../..").PolymorphicComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-tabs").TabsListProps & import("react").RefAttributes<HTMLDivElement>>, unknown>> & {
             colorScheme?: import("../..").TcolorScheme;
         }): import("react").JSX.Element;
         displayName: string;
-    }>) => React.JSX.Element;
+    }>) => import("react").JSX.Element;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"sourcesContent":["import { SegmentedControlBadge } from './SegmentedControlBadge'\nimport { SegmentedControlContent } from './SegmentedControlContent'\nimport { SegmentedControlDescription } from './SegmentedControlDescription'\nimport { SegmentedControlHeading } from './SegmentedControlHeading'\nimport { SegmentedControlIcon } from './SegmentedControlIcon'\nimport { SegmentedControlItem } from './SegmentedControlItem'\nimport { SegmentedControlItemList } from './SegmentedControlItemList'\nimport { SegmentedControlRoot } from './SegmentedControlRoot'\n\nexport const SegmentedControl = {\n  Root: SegmentedControlRoot,\n  Item: SegmentedControlItem,\n  Heading: SegmentedControlHeading,\n  Description: SegmentedControlDescription,\n  Icon: SegmentedControlIcon,\n  Content: SegmentedControlContent,\n  Badge: SegmentedControlBadge,\n  ItemList: SegmentedControlItemList\n}\n"],"mappings":";;;;;;;;;AASA,IAAa,mBAAmB;CAC9B,MAAM;CACN,MAAM;CACN,SAAS;CACT,aAAa;CACb,MAAM;CACN,SAAS;CACT,OAAO;CACP,UAAU;CACX"}
+{"version":3,"file":"SegmentedControl.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"sourcesContent":["import { SegmentedControlBadge } from './SegmentedControlBadge'\nimport { SegmentedControlContent } from './SegmentedControlContent'\nimport { SegmentedControlDescription } from './SegmentedControlDescription'\nimport { SegmentedControlHeading } from './SegmentedControlHeading'\nimport { SegmentedControlIcon } from './SegmentedControlIcon'\nimport { SegmentedControlItem } from './SegmentedControlItem'\nimport { SegmentedControlItemList } from './SegmentedControlItemList'\nimport { SegmentedControlRoot } from './SegmentedControlRoot'\n\nexport const SegmentedControl = {\n  Root: SegmentedControlRoot,\n  Item: SegmentedControlItem,\n  Heading: SegmentedControlHeading,\n  Description: SegmentedControlDescription,\n  Icon: SegmentedControlIcon,\n  Content: SegmentedControlContent,\n  Badge: SegmentedControlBadge,\n  ItemList: SegmentedControlItemList\n}\n"],"mappings":";;;;;;;;;AASA,IAAa,mBAAmB;CAC9B,MAAM;CACN,MAAM;CACN,SAAS;CACT,aAAa;CACb,MAAM;CACN,SAAS;CACT,OAAO;CACP,UAAU;AACZ"}

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

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

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

@@ -1,6 +1,6 @@
 import { cn } from "../../styled.js";
 import { Badge } from "../badge/Badge.js";
-import { SegmentedControlContext } from "./SegmentedControlContext.js";
+import { SegmentedControlContext } from "./SegmentedControl.context.js";
 import * as React$1 from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/segmented-control/SegmentedControlBadge.tsx
@@ -9,10 +9,10 @@ var badgeSizeMap = {
 	md: "xs",
 	lg: "sm"
 };
-var SegmentedControlBadge = ({ className, ...props }) => {
+var SegmentedControlBadge = ({ className, ...rest }) => {
 	const { size } = React$1.useContext(SegmentedControlContext);
 	return /* @__PURE__ */ jsx(Badge, {
-		...props,
+		...rest,
 		size: badgeSizeMap[size],
 		className: cn("border-none", "font-normal", className)
 	});

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlBadge.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlBadge.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '~/styled'\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'>): React.JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return (\n    <Badge\n      {...props}\n      size={badgeSizeMap[size as string]}\n      className={cn('border-none', 'font-normal', className)}\n    />\n  )\n}\n"],"mappings":";;;;;;AAOA,IAAM,eAAe;CACnB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,IAAa,yBAAyB,EACpC,WACA,GAAG,YACsE;CACzE,MAAM,EAAE,SAAS,QAAM,WAAW,wBAAwB;AAE1D,QACE,oBAAC,OAAD;EACE,GAAI;EACJ,MAAM,aAAa;EACnB,WAAW,GAAG,eAAe,eAAe,UAAU;EACtD,CAAA"}
+{"version":3,"file":"SegmentedControlBadge.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlBadge.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '../../styled'\nimport { Badge } from '../badge/Badge'\nimport { SegmentedControlContext } from './SegmentedControl.context'\n\nconst badgeSizeMap = {\n  sm: 'xs',\n  md: 'xs',\n  lg: 'sm'\n}\n\nexport const SegmentedControlBadge = ({\n  className,\n  ...rest\n}: Omit<React.ComponentProps<typeof Badge>, 'size'>) => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return (\n    <Badge\n      {...rest}\n      size={badgeSizeMap[size as string]}\n      className={cn('border-none', 'font-normal', className)}\n    />\n  )\n}\n"],"mappings":";;;;;;AAMA,IAAM,eAAe;CACnB,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,yBAAyB,EACpC,WACA,GAAG,WACmD;CACtD,MAAM,EAAE,SAAS,QAAM,WAAW,uBAAuB;CAEzD,OACE,oBAAC,OAAD;EACE,GAAI;EACJ,MAAM,aAAa;EACnB,WAAW,GAAG,eAAe,eAAe,SAAS;CACtD,CAAA;AAEL"}

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

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

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

@@ -1,4 +1,5 @@
 import { Tabs } from "../tabs/Tabs.js";
+import "react";
 //#region src/components/segmented-control/SegmentedControlContent.tsx
 var SegmentedControlContent = Tabs.Content;
 //#endregion

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlContent.js","names":[],"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"],"mappings":";;AAIA,IAAa,0BAA0B,KAAK"}
+{"version":3,"file":"SegmentedControlContent.js","names":[],"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"],"mappings":";;;AAIA,IAAa,0BAA0B,KAAK"}

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

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

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

@@ -1,6 +1,6 @@
 import { styled } from "../../styled.js";
 import { Text } from "../text/Text.js";
-import { SegmentedControlContext } from "./SegmentedControlContext.js";
+import { SegmentedControlContext } from "./SegmentedControl.context.js";
 import * as React$1 from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/segmented-control/SegmentedControlDescription.tsx
@@ -15,7 +15,7 @@ var StyledText = styled(Text, {
 		md: ["text-sm", "leading-[1.53]"],
 		lg: ["text-md", "leading-normal"]
 	} }
-}, { enabledResponsiveVariants: true });
+}, { enableResponsiveVariants: true });
 var SegmentedControlDescription = (props) => {
 	const { size } = React$1.useContext(SegmentedControlContext);
 	return /* @__PURE__ */ jsx(StyledText, {

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlDescription.js","names":[],"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): React.JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <StyledText {...props} size={size} />\n}\n"],"mappings":";;;;;;AAOA,IAAM,aAAa,OACjB,MACA;CACE,MAAM;EAAC;EAAa;EAAoB;EAAc;CACtD,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,WAAW,gBAAgB;EAChC,IAAI,CAAC,WAAW,iBAAiB;EACjC,IAAI,CAAC,WAAW,iBAAiB;EAClC,EACF;CACF,EACD,EAAE,2BAA2B,MAAM,CACpC;AAED,IAAa,+BACX,UACsB;CACtB,MAAM,EAAE,SAAS,QAAM,WAAW,wBAAwB;AAE1D,QAAO,oBAAC,YAAD;EAAY,GAAI;EAAa;EAAQ,CAAA"}
+{"version":3,"file":"SegmentedControlDescription.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlDescription.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Text } from '../text/Text'\nimport { SegmentedControlContext } from './SegmentedControl.context'\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  { enableResponsiveVariants: true }\n)\n\nexport const SegmentedControlDescription = (\n  props: Omit<React.ComponentProps<typeof StyledText>, 'size'>\n) => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <StyledText {...props} size={size} />\n}\n"],"mappings":";;;;;;AAMA,IAAM,aAAa,OACjB,MACA;CACE,MAAM;EAAC;EAAa;EAAoB;CAAa;CACrD,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,WAAW,eAAe;EAC/B,IAAI,CAAC,WAAW,gBAAgB;EAChC,IAAI,CAAC,WAAW,gBAAgB;CAClC,EACF;AACF,GACA,EAAE,0BAA0B,KAAK,CACnC;AAEA,IAAa,+BACX,UACG;CACH,MAAM,EAAE,SAAS,QAAM,WAAW,uBAAuB;CAEzD,OAAO,oBAAC,YAAD;EAAY,GAAI;EAAa;CAAO,CAAA;AAC7C"}

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

@@ -1,17 +1,11 @@
 import * as React from 'react';
-declare const StyledHeading: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "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?: ("display" | "body" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "display" | "body" | "mono">>) | undefined;
-} & {
-    as?: React.ElementType;
-}, "as"> & {
-    as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLParagraphElement>, "size"> & {
-    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
-} & {
-    as?: React.ElementType;
+declare const StyledHeading: import("../..").PolymorphicComponent<import("../..").PolymorphicComponent<"p", {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
+}>, {
+    size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
 }>;
-export declare const SegmentedControlHeading: (props: Omit<React.ComponentProps<typeof StyledHeading>, "size">) => React.JSX.Element;
+export declare const SegmentedControlHeading: (props: Omit<React.ComponentProps<typeof StyledHeading>, 'size'>) => React.JSX.Element;
 export {};

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

@@ -1,6 +1,6 @@
 import { styled } from "../../styled.js";
 import { Text } from "../text/Text.js";
-import { SegmentedControlContext } from "./SegmentedControlContext.js";
+import { SegmentedControlContext } from "./SegmentedControl.context.js";
 import * as React$1 from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/segmented-control/SegmentedControlHeading.tsx
@@ -11,7 +11,7 @@ var StyledHeading = styled(Text, {
 		md: ["text-md", "leading-normal"],
 		lg: ["text-lg", "leading-[1.52]"]
 	} }
-}, { enabledResponsiveVariants: true });
+}, { enableResponsiveVariants: true });
 var SegmentedControlHeading = (props) => {
 	const { size } = React$1.useContext(SegmentedControlContext);
 	return /* @__PURE__ */ jsx(StyledHeading, {

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlHeading.js","names":[],"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): React.JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <StyledHeading {...props} size={size} />\n}\n"],"mappings":";;;;;;AAOA,IAAM,gBAAgB,OACpB,MACA;CACE,MAAM,CAAC,aAAa,oBAAoB;CACxC,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,WAAW,iBAAiB;EACjC,IAAI,CAAC,WAAW,iBAAiB;EACjC,IAAI,CAAC,WAAW,iBAAiB;EAClC,EACF;CACF,EACD,EAAE,2BAA2B,MAAM,CACpC;AAED,IAAa,2BACX,UACsB;CACtB,MAAM,EAAE,SAAS,QAAM,WAAW,wBAAwB;AAE1D,QAAO,oBAAC,eAAD;EAAe,GAAI;EAAa;EAAQ,CAAA"}
+{"version":3,"file":"SegmentedControlHeading.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlHeading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Text } from '../text/Text'\nimport { SegmentedControlContext } from './SegmentedControl.context'\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  { enableResponsiveVariants: true }\n)\n\nexport const SegmentedControlHeading = (\n  props: Omit<React.ComponentProps<typeof StyledHeading>, 'size'>\n) => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <StyledHeading {...props} size={size} />\n}\n"],"mappings":";;;;;;AAMA,IAAM,gBAAgB,OACpB,MACA;CACE,MAAM,CAAC,aAAa,mBAAmB;CACvC,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,WAAW,gBAAgB;EAChC,IAAI,CAAC,WAAW,gBAAgB;EAChC,IAAI,CAAC,WAAW,gBAAgB;CAClC,EACF;AACF,GACA,EAAE,0BAA0B,KAAK,CACnC;AAEA,IAAa,2BACX,UACG;CACH,MAAM,EAAE,SAAS,QAAM,WAAW,uBAAuB;CAEzD,OAAO,oBAAC,eAAD;EAAe,GAAI;EAAa;CAAO,CAAA;AAChD"}

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

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

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

@@ -1,5 +1,5 @@
 import { Icon } from "../icon/Icon.js";
-import { SegmentedControlContext } from "./SegmentedControlContext.js";
+import { SegmentedControlContext } from "./SegmentedControl.context.js";
 import * as React$1 from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/segmented-control/SegmentedControlIcon.tsx

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlIcon.js","names":[],"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): React.JSX.Element => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return <Icon {...props} size={sizeMap[size as string]} />\n}\n"],"mappings":";;;;;AAKA,IAAM,UAAU;CACd,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,IAAa,wBACX,UACsB;CACtB,MAAM,EAAE,SAAS,QAAM,WAAW,wBAAwB;AAE1D,QAAO,oBAAC,MAAD;EAAM,GAAI;EAAO,MAAM,QAAQ;EAAmB,CAAA"}
+{"version":3,"file":"SegmentedControlIcon.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlIcon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Icon } from '../icon/Icon'\nimport { SegmentedControlContext } from './SegmentedControl.context'\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) => {\n  const { size } = React.useContext(SegmentedControlContext)\n\n  return (\n    <Icon\n      {...(props as React.ComponentProps<typeof Icon>)}\n      size={sizeMap[size as string]}\n    />\n  )\n}\n"],"mappings":";;;;;AAKA,IAAM,UAAU;CACd,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,wBACX,UACG;CACH,MAAM,EAAE,SAAS,QAAM,WAAW,uBAAuB;CAEzD,OACE,oBAAC,MAAD;EACE,GAAK;EACL,MAAM,QAAQ;CACf,CAAA;AAEL"}

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
-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;
-} & {
-    as?: React.ElementType;
-}, "size">, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const StyledItem: import("../..").PolymorphicComponent<React.ForwardRefExoticComponent<import("@radix-ui/react-tabs").TabsTriggerProps & React.RefAttributes<HTMLButtonElement>>, {
+    theme?: ("marsh" | "primary" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "marsh" | "primary">>) | undefined;
+    size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
+}>;
+export declare const SegmentedControlItem: ({ ref, children, ...rest }: Omit<React.ComponentProps<typeof StyledItem>, 'size'>) => React.JSX.Element;
+export {};

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

@@ -1,5 +1,5 @@
 import { styled } from "../../styled.js";
-import { SegmentedControlContext } from "./SegmentedControlContext.js";
+import { SegmentedControlContext } from "./SegmentedControl.context.js";
 import * as React$1 from "react";
 import { jsx } from "react/jsx-runtime";
 import { Trigger } from "@radix-ui/react-tabs";
@@ -62,18 +62,17 @@ var StyledItem = styled(Trigger, {
 		size: "md",
 		theme: "primary"
 	}
-}, { enabledResponsiveVariants: true });
-var SegmentedControlItem = React$1.forwardRef(({ children, ...props }, ref) => {
+}, { enableResponsiveVariants: true });
+var SegmentedControlItem = ({ ref, children, ...rest }) => {
 	const { size, theme } = React$1.useContext(SegmentedControlContext);
 	return /* @__PURE__ */ jsx(StyledItem, {
-		...props,
+		...rest,
 		theme,
 		size,
 		ref,
 		children
 	});
-});
-SegmentedControlItem.displayName = "SegmentedControlItem";
+};
 //#endregion
 export { SegmentedControlItem };
 

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

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlItem.js","names":[],"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      'bg-transparent',\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      'justify-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-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    defaultVariants: {\n      size: 'md',\n      theme: 'primary'\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"],"mappings":";;;;;;AAOA,IAAM,aAAa,OACjB,SACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS,CACP,8CACA,mCACD;GACD,OAAO,CACL,4CACA,iCACD;GACF;EACD,MAAM;GACJ,IAAI;IAAC;IAAgB;IAAS;IAAQ;IAAO;GAC7C,IAAI;IAAC;IAAU;IAAS;IAAQ;IAAO;GACvC,IAAI;IAAC;IAAU;IAAS;IAAQ;IAAO;GACxC;EACF;CACD,iBAAiB;EACf,MAAM;EACN,OAAO;EACR;CACF,EACD,EAAE,2BAA2B,MAAM,CACpC;AAED,IAAa,uBAAuB,QAAM,YAGvC,EAAE,UAAU,GAAG,SAAS,QAAQ;CACjC,MAAM,EAAE,MAAM,UAAU,QAAM,WAAW,wBAAwB;AAEjE,QACE,oBAAC,YAAD;EAAY,GAAI;EAAc;EAAa;EAAW;EACnD;EACU,CAAA;EAEf;AAEF,qBAAqB,cAAc"}
+{"version":3,"file":"SegmentedControlItem.js","names":[],"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'\nimport { SegmentedControlContext } from './SegmentedControl.context'\n\nconst StyledItem = styled(\n  Trigger,\n  {\n    base: [\n      'relative',\n      'bg-transparent',\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      'justify-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-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    defaultVariants: {\n      size: 'md',\n      theme: 'primary'\n    }\n  },\n  { enableResponsiveVariants: true }\n)\n\nexport const SegmentedControlItem = ({\n  ref,\n  children,\n  ...rest\n}: Omit<React.ComponentProps<typeof StyledItem>, 'size'>) => {\n  const { size, theme } = React.useContext(SegmentedControlContext)\n\n  return (\n    <StyledItem {...rest} theme={theme} size={size} ref={ref}>\n      {children}\n    </StyledItem>\n  )\n}\n"],"mappings":";;;;;;AAMA,IAAM,aAAa,OACjB,SACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,OAAO;GACL,SAAS,CACP,8CACA,kCACF;GACA,OAAO,CACL,4CACA,gCACF;EACF;EACA,MAAM;GACJ,IAAI;IAAC;IAAgB;IAAS;IAAQ;GAAM;GAC5C,IAAI;IAAC;IAAU;IAAS;IAAQ;GAAM;GACtC,IAAI;IAAC;IAAU;IAAS;IAAQ;GAAM;EACxC;CACF;CACA,iBAAiB;EACf,MAAM;EACN,OAAO;CACT;AACF,GACA,EAAE,0BAA0B,KAAK,CACnC;AAEA,IAAa,wBAAwB,EACnC,KACA,UACA,GAAG,WACwD;CAC3D,MAAM,EAAE,MAAM,UAAU,QAAM,WAAW,uBAAuB;CAEhE,OACE,oBAAC,YAAD;EAAY,GAAI;EAAa;EAAa;EAAW;EAClD;CACS,CAAA;AAEhB"}

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

@@ -1,6 +1,6 @@
 import { styled } from "../../styled.js";
 import { Tabs } from "../tabs/Tabs.js";
-import { SegmentedControlContext } from "./SegmentedControlContext.js";
+import { SegmentedControlContext } from "./SegmentedControl.context.js";
 import * as React$1 from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/segmented-control/SegmentedControlItemList.tsx