@kushagradhawan/kookie-ui 0.1.28 → 0.1.30

package/dist/esm/components/badge.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/badge.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\nimport { Slot } from 'radix-ui';\n\nimport { badgePropDefs } from './badge.props.js';\nimport { extractProps } from '../helpers/extract-props.js';\nimport { marginPropDefs } from '../props/margin.props.js';\n\nimport type { MarginProps } from '../props/margin.props.js';\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../props/prop-def.js';\n\ntype BadgeElement = React.ElementRef<'span'>;\ntype BadgeOwnProps = GetPropDefTypes<typeof badgePropDefs>;\ninterface BadgeProps\n  extends ComponentPropsWithout<'span', RemovedProps>,\n    MarginProps,\n    BadgeOwnProps {}\nconst Badge = React.forwardRef<BadgeElement, BadgeProps>((props, forwardedRef) => {\n  const { asChild, className, color, radius, panelBackground, ...badgeProps } = extractProps(\n    props,\n    badgePropDefs,\n    marginPropDefs,\n  );\n  const Comp = asChild ? Slot.Root : 'span';\n  return (\n    <Comp\n      data-accent-color={color}\n      data-radius={radius}\n      data-panel-background={panelBackground}\n      {...badgeProps}\n      ref={forwardedRef}\n      className={classNames('rt-reset', 'rt-Badge', className)}\n    />\n  );\n});\nBadge.displayName = 'Badge';\n\nexport { Badge };\nexport type { BadgeProps };\n"],
-  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aACvB,OAAS,QAAAC,MAAY,WAErB,OAAS,iBAAAC,MAAqB,mBAC9B,OAAS,gBAAAC,MAAoB,8BAC7B,OAAS,kBAAAC,MAAsB,2BAY/B,MAAMC,EAAQN,EAAM,WAAqC,CAACO,EAAOC,IAAiB,CAChF,KAAM,CAAE,QAAAC,EAAS,UAAAC,EAAW,MAAAC,EAAO,OAAAC,EAAQ,gBAAAC,EAAiB,GAAGC,CAAW,EAAIV,EAC5EG,EACAJ,EACAE,CACF,EACMU,EAAON,EAAUP,EAAK,KAAO,OACnC,OACEF,EAAA,cAACe,EAAA,CACC,oBAAmBJ,EACnB,cAAaC,EACb,wBAAuBC,EACtB,GAAGC,EACJ,IAAKN,EACL,UAAWP,EAAW,WAAY,WAAYS,CAAS,EACzD,CAEJ,CAAC,EACDJ,EAAM,YAAc",
-  "names": ["React", "classNames", "Slot", "badgePropDefs", "extractProps", "marginPropDefs", "Badge", "props", "forwardedRef", "asChild", "className", "color", "radius", "panelBackground", "badgeProps", "Comp"]
+  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\nimport { Slot } from 'radix-ui';\n\nimport { badgePropDefs } from './badge.props.js';\nimport { extractProps } from '../helpers/extract-props.js';\nimport { marginPropDefs } from '../props/margin.props.js';\nimport { Tooltip } from './tooltip.js';\n\nimport type { MarginProps } from '../props/margin.props.js';\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../props/prop-def.js';\n\ntype BadgeElement = React.ElementRef<'span'>;\ntype BadgeOwnProps = GetPropDefTypes<typeof badgePropDefs>;\n\n// Tooltip props that can be passed to Badge\ninterface BadgeTooltipProps {\n  tooltip?: React.ReactNode;\n  tooltipSide?: 'top' | 'right' | 'bottom' | 'left';\n  tooltipAlign?: 'start' | 'center' | 'end';\n  tooltipDelayDuration?: number;\n  tooltipDisableHoverableContent?: boolean;\n}\n\ninterface BadgeProps\n  extends ComponentPropsWithout<'span', RemovedProps>,\n    MarginProps,\n    BadgeOwnProps,\n    BadgeTooltipProps {}\n\nconst Badge = React.forwardRef<BadgeElement, BadgeProps>((props, forwardedRef) => {\n  const {\n    asChild,\n    className,\n    children,\n    color,\n    radius,\n    material,\n    panelBackground,\n    tooltip,\n    tooltipSide = 'top',\n    tooltipAlign = 'center',\n    tooltipDelayDuration,\n    tooltipDisableHoverableContent,\n    ...badgeProps\n  } = extractProps(props, badgePropDefs, marginPropDefs);\n\n  // Memoize material calculation for performance\n  const effectiveMaterial = React.useMemo(\n    () => material ?? panelBackground,\n    [material, panelBackground],\n  );\n\n  // Show deprecation warning for panelBackground when used\n  React.useEffect(() => {\n    if (panelBackground !== undefined) {\n      console.warn(\n        'Warning: The `panelBackground` prop is deprecated and will be removed in a future version. Use `material` prop instead.',\n      );\n    }\n  }, [panelBackground]);\n\n  // Memoize component variable to prevent unnecessary re-renders\n  const Comp = React.useMemo(() => (asChild ? Slot.Root : 'span'), [asChild]);\n\n  const badge = (\n    <Comp\n      data-accent-color={color}\n      data-radius={radius}\n      data-material={effectiveMaterial}\n      data-panel-background={effectiveMaterial}\n      {...badgeProps}\n      ref={forwardedRef}\n      className={classNames('rt-reset', 'rt-Badge', className)}\n    >\n      {children}\n    </Comp>\n  );\n\n  // If no tooltip is provided, return the badge as-is\n  if (!tooltip) {\n    return badge;\n  }\n\n  // Wrap with Tooltip when tooltip content is provided\n  return (\n    <Tooltip\n      content={tooltip}\n      side={tooltipSide}\n      align={tooltipAlign}\n      delayDuration={tooltipDelayDuration}\n      disableHoverableContent={tooltipDisableHoverableContent}\n    >\n      {badge}\n    </Tooltip>\n  );\n});\nBadge.displayName = 'Badge';\n\nexport { Badge };\nexport type { BadgeProps };\n"],
+  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aACvB,OAAS,QAAAC,MAAY,WAErB,OAAS,iBAAAC,MAAqB,mBAC9B,OAAS,gBAAAC,MAAoB,8BAC7B,OAAS,kBAAAC,MAAsB,2BAC/B,OAAS,WAAAC,MAAe,eAwBxB,MAAMC,EAAQP,EAAM,WAAqC,CAACQ,EAAOC,IAAiB,CAChF,KAAM,CACJ,QAAAC,EACA,UAAAC,EACA,SAAAC,EACA,MAAAC,EACA,OAAAC,EACA,SAAAC,EACA,gBAAAC,EACA,QAAAC,EACA,YAAAC,EAAc,MACd,aAAAC,EAAe,SACf,qBAAAC,EACA,+BAAAC,EACA,GAAGC,CACL,EAAIlB,EAAaI,EAAOL,EAAeE,CAAc,EAG/CkB,EAAoBvB,EAAM,QAC9B,IAAMe,GAAYC,EAClB,CAACD,EAAUC,CAAe,CAC5B,EAGAhB,EAAM,UAAU,IAAM,CAChBgB,IAAoB,QACtB,QAAQ,KACN,yHACF,CAEJ,EAAG,CAACA,CAAe,CAAC,EAGpB,MAAMQ,EAAOxB,EAAM,QAAQ,IAAOU,EAAUR,EAAK,KAAO,OAAS,CAACQ,CAAO,CAAC,EAEpEe,EACJzB,EAAA,cAACwB,EAAA,CACC,oBAAmBX,EACnB,cAAaC,EACb,gBAAeS,EACf,wBAAuBA,EACtB,GAAGD,EACJ,IAAKb,EACL,UAAWR,EAAW,WAAY,WAAYU,CAAS,GAEtDC,CACH,EAIF,OAAKK,EAMHjB,EAAA,cAACM,EAAA,CACC,QAASW,EACT,KAAMC,EACN,MAAOC,EACP,cAAeC,EACf,wBAAyBC,GAExBI,CACH,EAbOA,CAeX,CAAC,EACDlB,EAAM,YAAc",
+  "names": ["React", "classNames", "Slot", "badgePropDefs", "extractProps", "marginPropDefs", "Tooltip", "Badge", "props", "forwardedRef", "asChild", "className", "children", "color", "radius", "material", "panelBackground", "tooltip", "tooltipSide", "tooltipAlign", "tooltipDelayDuration", "tooltipDisableHoverableContent", "badgeProps", "effectiveMaterial", "Comp", "badge"]
 }

package/dist/esm/components/badge.props.d.ts

@@ -1,4 +1,17 @@
 declare const badgePropDefs: {
+    material: {
+        type: "enum";
+        values: readonly ["solid", "translucent"];
+        default: undefined;
+    };
+    /**
+     * @deprecated Use `material` prop instead. This prop will be removed in a future version.
+     */
+    panelBackground: {
+        type: "enum";
+        values: readonly ["solid", "translucent"];
+        default: undefined;
+    };
     radius: {
         type: "enum";
         values: readonly ["none", "small", "medium", "large", "full"];
@@ -17,7 +30,7 @@ declare const badgePropDefs: {
     size: {
         type: "enum";
         className: string;
-        values: readonly ["1", "2", "3"];
+        values: readonly ["1", "2", "3", "4"];
         default: "1";
         responsive: true;
     };
@@ -27,11 +40,6 @@ declare const badgePropDefs: {
         values: readonly ["solid", "soft", "surface", "outline", "ghost", "classic"];
         default: "soft";
     };
-    panelBackground: {
-        type: "enum";
-        values: ("solid" | "translucent")[];
-        default: undefined;
-    };
     asChild: {
         type: "boolean";
     };

package/dist/esm/components/badge.props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"badge.props.d.ts","sourceRoot":"","sources":["../../../src/components/badge.props.tsx"],"names":[],"mappings":"AAUA,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAYlB,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"badge.props.d.ts","sourceRoot":"","sources":["../../../src/components/badge.props.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,aAAa;;;;;;IAQjB;;OAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOJ,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,CAAC"}

package/dist/esm/components/badge.props.js

@@ -1,2 +1,2 @@
-import{asChildPropDef as e}from"../props/as-child.prop.js";import{accentColorPropDef as s}from"../props/color.prop.js";import{highContrastPropDef as o}from"../props/high-contrast.prop.js";import{radiusPropDef as r}from"../props/radius.prop.js";const t=["1","2","3"],a=["solid","soft","surface","outline","ghost","classic"],n={...e,size:{type:"enum",className:"rt-r-size",values:t,default:"1",responsive:!0},variant:{type:"enum",className:"rt-variant",values:a,default:"soft"},panelBackground:{type:"enum",values:["solid","translucent"],default:void 0},...s,...o,...r};export{n as badgePropDefs};
+import{asChildPropDef as e}from"../props/as-child.prop.js";import{accentColorPropDef as s}from"../props/color.prop.js";import{highContrastPropDef as a}from"../props/high-contrast.prop.js";import{radiusPropDef as t}from"../props/radius.prop.js";const o=["1","2","3","4"],r=["solid","soft","surface","outline","ghost","classic"],n=["solid","translucent"],i=["solid","translucent"],p={...e,size:{type:"enum",className:"rt-r-size",values:o,default:"1",responsive:!0},variant:{type:"enum",className:"rt-variant",values:r,default:"soft"},...s,...a,...t,material:{type:"enum",values:i,default:void 0},panelBackground:{type:"enum",values:n,default:void 0}};export{p as badgePropDefs};
 //# sourceMappingURL=badge.props.js.map

package/dist/esm/components/badge.props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/badge.props.tsx"],
-  "sourcesContent": ["import { asChildPropDef } from '../props/as-child.prop.js';\nimport { accentColorPropDef } from '../props/color.prop.js';\nimport { highContrastPropDef } from '../props/high-contrast.prop.js';\nimport { radiusPropDef } from '../props/radius.prop.js';\n\nimport type { PropDef } from '../props/prop-def.js';\n\nconst sizes = ['1', '2', '3'] as const;\nconst variants = ['solid', 'soft', 'surface', 'outline', 'ghost', 'classic'] as const;\n\nconst badgePropDefs = {\n  ...asChildPropDef,\n  size: { type: 'enum', className: 'rt-r-size', values: sizes, default: '1', responsive: true },\n  variant: { type: 'enum', className: 'rt-variant', values: variants, default: 'soft' },\n  panelBackground: { type: 'enum', values: ['solid', 'translucent'], default: undefined },\n  ...accentColorPropDef,\n  ...highContrastPropDef,\n  ...radiusPropDef,\n} satisfies {\n  size: PropDef<(typeof sizes)[number]>;\n  variant: PropDef<(typeof variants)[number]>;\n  panelBackground: PropDef<'solid' | 'translucent'>;\n};\n\nexport { badgePropDefs };\n"],
-  "mappings": "AAAA,OAAS,kBAAAA,MAAsB,4BAC/B,OAAS,sBAAAC,MAA0B,yBACnC,OAAS,uBAAAC,MAA2B,iCACpC,OAAS,iBAAAC,MAAqB,0BAI9B,MAAMC,EAAQ,CAAC,IAAK,IAAK,GAAG,EACtBC,EAAW,CAAC,QAAS,OAAQ,UAAW,UAAW,QAAS,SAAS,EAErEC,EAAgB,CACpB,GAAGN,EACH,KAAM,CAAE,KAAM,OAAQ,UAAW,YAAa,OAAQI,EAAO,QAAS,IAAK,WAAY,EAAK,EAC5F,QAAS,CAAE,KAAM,OAAQ,UAAW,aAAc,OAAQC,EAAU,QAAS,MAAO,EACpF,gBAAiB,CAAE,KAAM,OAAQ,OAAQ,CAAC,QAAS,aAAa,EAAG,QAAS,MAAU,EACtF,GAAGJ,EACH,GAAGC,EACH,GAAGC,CACL",
-  "names": ["asChildPropDef", "accentColorPropDef", "highContrastPropDef", "radiusPropDef", "sizes", "variants", "badgePropDefs"]
+  "sourcesContent": ["import { asChildPropDef } from '../props/as-child.prop.js';\nimport { accentColorPropDef } from '../props/color.prop.js';\nimport { highContrastPropDef } from '../props/high-contrast.prop.js';\nimport { radiusPropDef } from '../props/radius.prop.js';\n\nimport type { PropDef } from '../props/prop-def.js';\n\nconst sizes = ['1', '2', '3', '4'] as const;\nconst variants = ['solid', 'soft', 'surface', 'outline', 'ghost', 'classic'] as const;\nconst panelBackgrounds = ['solid', 'translucent'] as const;\nconst materials = ['solid', 'translucent'] as const;\n\nconst badgePropDefs = {\n  ...asChildPropDef,\n  size: { type: 'enum', className: 'rt-r-size', values: sizes, default: '1', responsive: true },\n  variant: { type: 'enum', className: 'rt-variant', values: variants, default: 'soft' },\n  ...accentColorPropDef,\n  ...highContrastPropDef,\n  ...radiusPropDef,\n  material: { type: 'enum', values: materials, default: undefined },\n  /**\n   * @deprecated Use `material` prop instead. This prop will be removed in a future version.\n   */\n  panelBackground: { type: 'enum', values: panelBackgrounds, default: undefined },\n} satisfies {\n  size: PropDef<(typeof sizes)[number]>;\n  variant: PropDef<(typeof variants)[number]>;\n  material: PropDef<(typeof materials)[number] | undefined>;\n  panelBackground: PropDef<(typeof panelBackgrounds)[number] | undefined>;\n};\n\nexport { badgePropDefs };\n"],
+  "mappings": "AAAA,OAAS,kBAAAA,MAAsB,4BAC/B,OAAS,sBAAAC,MAA0B,yBACnC,OAAS,uBAAAC,MAA2B,iCACpC,OAAS,iBAAAC,MAAqB,0BAI9B,MAAMC,EAAQ,CAAC,IAAK,IAAK,IAAK,GAAG,EAC3BC,EAAW,CAAC,QAAS,OAAQ,UAAW,UAAW,QAAS,SAAS,EACrEC,EAAmB,CAAC,QAAS,aAAa,EAC1CC,EAAY,CAAC,QAAS,aAAa,EAEnCC,EAAgB,CACpB,GAAGR,EACH,KAAM,CAAE,KAAM,OAAQ,UAAW,YAAa,OAAQI,EAAO,QAAS,IAAK,WAAY,EAAK,EAC5F,QAAS,CAAE,KAAM,OAAQ,UAAW,aAAc,OAAQC,EAAU,QAAS,MAAO,EACpF,GAAGJ,EACH,GAAGC,EACH,GAAGC,EACH,SAAU,CAAE,KAAM,OAAQ,OAAQI,EAAW,QAAS,MAAU,EAIhE,gBAAiB,CAAE,KAAM,OAAQ,OAAQD,EAAkB,QAAS,MAAU,CAChF",
+  "names": ["asChildPropDef", "accentColorPropDef", "highContrastPropDef", "radiusPropDef", "sizes", "variants", "panelBackgrounds", "materials", "badgePropDefs"]
 }

package/dist/esm/components/blockquote.props.d.ts

@@ -22,7 +22,7 @@ declare const blockquotePropDefs: {
     weight: {
         type: "enum";
         className: string;
-        values: readonly ["light", "regular", "medium", "bold"];
+        values: readonly ["thin", "extralight", "light", "regular", "medium", "semibold", "bold", "extrabold"];
         responsive: true;
     };
     size: {

package/dist/esm/components/button.d.ts

@@ -2,13 +2,65 @@ import * as React from 'react';
 import { BaseButton } from './_internal/base-button.js';
 import type { BaseButtonProps } from './_internal/base-button.js';
 type ButtonElement = React.ElementRef<typeof BaseButton>;
-type ButtonOwnProps = Omit<BaseButtonProps, 'as'>;
+/**
+ * Tooltip configuration props that can be passed to Button
+ * These props are forwarded to the underlying Tooltip component
+ */
+interface ButtonTooltipProps {
+    /** Content to display in the tooltip on hover/focus */
+    tooltip?: React.ReactNode;
+    /** Side of the button where the tooltip should appear */
+    tooltipSide?: 'top' | 'right' | 'bottom' | 'left';
+    /** Alignment of the tooltip relative to the button */
+    tooltipAlign?: 'start' | 'center' | 'end';
+    /** Delay before showing the tooltip (in milliseconds) */
+    tooltipDelayDuration?: number;
+    /** Whether to disable hoverable content behavior */
+    tooltipDisableHoverableContent?: boolean;
+}
+/**
+ * Core Button props excluding the 'as' prop for polymorphic behavior
+ * Combines BaseButton props with tooltip functionality
+ */
+type ButtonOwnProps = Omit<BaseButtonProps, 'as'> & ButtonTooltipProps;
+/**
+ * Polymorphic Button props that support rendering as different HTML elements
+ * @template C - The element type to render as (defaults to 'button')
+ */
 type ButtonProps<C extends React.ElementType = 'button'> = ButtonOwnProps & {
+    /** Element type to render as (e.g., 'a', 'span', etc.) */
     as?: C;
 } & Omit<React.ComponentPropsWithoutRef<C>, keyof ButtonOwnProps>;
+/**
+ * Button component type that supports polymorphic rendering
+ * @template C - The element type to render as
+ */
 type ButtonComponent = <C extends React.ElementType = 'button'>(props: ButtonProps<C> & {
     ref?: React.ForwardedRef<ButtonElement>;
 }) => React.ReactElement | null;
+/**
+ * Button component for triggering actions throughout your interface
+ *
+ * The Button component is the primary interactive element in the Kookie User Interface.
+ * It provides six visual variants, four sizes, comprehensive color options, and built-in
+ * tooltip support. The component automatically handles icon sizing, supports responsive
+ * layouts, and provides accessibility compliance out of the box.
+ *
+ * @example
+ * ```tsx
+ * // Basic button
+ * <Button>Click me</Button>
+ *
+ * // Button with variant and size
+ * <Button variant="solid" size="3">Primary Action</Button>
+ *
+ * // Button with tooltip
+ * <Button tooltip="Save your progress">Save</Button>
+ *
+ * // Polymorphic button as link
+ * <Button as="a" href="/dashboard">Go to Dashboard</Button>
+ * ```
+ */
 declare const Button: ButtonComponent & {
     displayName?: string;
 };

package/dist/esm/components/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,KAAK,aAAa,GAAG,KAAK,CAAC,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAGzD,KAAK,cAAc,GAAG,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC;AAElD,KAAK,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,cAAc,GAAG;IAC1E,EAAE,CAAC,EAAE,CAAC,CAAC;CACR,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAElE,KAAK,eAAe,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAC5D,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,CAAA;CAAE,KAChE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B,QAAA,MAAM,MAAM,EAIP,eAAe,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAIhD,OAAO,EAAE,MAAM,EAAE,CAAC;AAClB,YAAY,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAExD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,KAAK,aAAa,GAAG,KAAK,CAAC,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAEzD;;;GAGG;AACH,UAAU,kBAAkB;IAC1B,uDAAuD;IACvD,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,yDAAyD;IACzD,WAAW,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAClD,sDAAsD;IACtD,YAAY,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC1C,yDAAyD;IACzD,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,oDAAoD;IACpD,8BAA8B,CAAC,EAAE,OAAO,CAAC;CAC1C;AAED;;;GAGG;AACH,KAAK,cAAc,GAAG,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,GAAG,kBAAkB,CAAC;AAEvE;;;GAGG;AACH,KAAK,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,cAAc,GAAG;IAC1E,0DAA0D;IAC1D,EAAE,CAAC,EAAE,CAAC,CAAC;CACR,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAElE;;;GAGG;AACH,KAAK,eAAe,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAC5D,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,CAAA;CAAE,KAChE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,QAAA,MAAM,MAAM,EAqDP,eAAe,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAIhD,OAAO,EAAE,MAAM,EAAE,CAAC;AAClB,YAAY,EAAE,WAAW,EAAE,CAAC"}

package/dist/esm/components/button.js

@@ -1,2 +1,2 @@
-import*as t from"react";import r from"classnames";import{BaseButton as s}from"./_internal/base-button.js";const e=t.forwardRef(({className:o,...n},p)=>t.createElement(s,{...n,ref:p,className:r("rt-Button",o)}));e.displayName="Button";export{e as Button};
+import*as t from"react";import d from"classnames";import{BaseButton as f}from"./_internal/base-button.js";import{Tooltip as y}from"./tooltip.js";const s=t.forwardRef(({className:p,tooltip:o,tooltipSide:a="top",tooltipAlign:i="center",tooltipDelayDuration:l,tooltipDisableHoverableContent:u,...m},B)=>{const e=t.useId(),n=!!o,c=t.useMemo(()=>n?{"aria-describedby":e}:{},[n,e]),r=t.createElement(f,{...m,...c,ref:B,className:d("rt-Button",p)});return o?t.createElement(y,{content:o,side:a,align:i,delayDuration:l,disableHoverableContent:u,id:e},r):r});s.displayName="Button";export{s as Button};
 //# sourceMappingURL=button.js.map

package/dist/esm/components/button.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/button.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\n\nimport { BaseButton } from './_internal/base-button.js';\nimport type { BaseButtonProps } from './_internal/base-button.js';\n\ntype ButtonElement = React.ElementRef<typeof BaseButton>;\n\n// Polymorphic Button props\ntype ButtonOwnProps = Omit<BaseButtonProps, 'as'>;\n\ntype ButtonProps<C extends React.ElementType = 'button'> = ButtonOwnProps & {\n  as?: C;\n} & Omit<React.ComponentPropsWithoutRef<C>, keyof ButtonOwnProps>;\n\ntype ButtonComponent = <C extends React.ElementType = 'button'>(\n  props: ButtonProps<C> & { ref?: React.ForwardedRef<ButtonElement> },\n) => React.ReactElement | null;\n\nconst Button = React.forwardRef(\n  ({ className, ...props }: ButtonProps, forwardedRef: React.ForwardedRef<ButtonElement>) => (\n    <BaseButton {...props} ref={forwardedRef} className={classNames('rt-Button', className)} />\n  ),\n) as ButtonComponent & { displayName?: string };\n\nButton.displayName = 'Button';\n\nexport { Button };\nexport type { ButtonProps };\n"],
-  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aAEvB,OAAS,cAAAC,MAAkB,6BAgB3B,MAAMC,EAASH,EAAM,WACnB,CAAC,CAAE,UAAAI,EAAW,GAAGC,CAAM,EAAgBC,IACrCN,EAAA,cAACE,EAAA,CAAY,GAAGG,EAAO,IAAKC,EAAc,UAAWL,EAAW,YAAaG,CAAS,EAAG,CAE7F,EAEAD,EAAO,YAAc",
-  "names": ["React", "classNames", "BaseButton", "Button", "className", "props", "forwardedRef"]
+  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\n\nimport { BaseButton } from './_internal/base-button.js';\nimport { Tooltip } from './tooltip.js';\nimport type { BaseButtonProps } from './_internal/base-button.js';\n\ntype ButtonElement = React.ElementRef<typeof BaseButton>;\n\n/**\n * Tooltip configuration props that can be passed to Button\n * These props are forwarded to the underlying Tooltip component\n */\ninterface ButtonTooltipProps {\n  /** Content to display in the tooltip on hover/focus */\n  tooltip?: React.ReactNode;\n  /** Side of the button where the tooltip should appear */\n  tooltipSide?: 'top' | 'right' | 'bottom' | 'left';\n  /** Alignment of the tooltip relative to the button */\n  tooltipAlign?: 'start' | 'center' | 'end';\n  /** Delay before showing the tooltip (in milliseconds) */\n  tooltipDelayDuration?: number;\n  /** Whether to disable hoverable content behavior */\n  tooltipDisableHoverableContent?: boolean;\n}\n\n/**\n * Core Button props excluding the 'as' prop for polymorphic behavior\n * Combines BaseButton props with tooltip functionality\n */\ntype ButtonOwnProps = Omit<BaseButtonProps, 'as'> & ButtonTooltipProps;\n\n/**\n * Polymorphic Button props that support rendering as different HTML elements\n * @template C - The element type to render as (defaults to 'button')\n */\ntype ButtonProps<C extends React.ElementType = 'button'> = ButtonOwnProps & {\n  /** Element type to render as (e.g., 'a', 'span', etc.) */\n  as?: C;\n} & Omit<React.ComponentPropsWithoutRef<C>, keyof ButtonOwnProps>;\n\n/**\n * Button component type that supports polymorphic rendering\n * @template C - The element type to render as\n */\ntype ButtonComponent = <C extends React.ElementType = 'button'>(\n  props: ButtonProps<C> & { ref?: React.ForwardedRef<ButtonElement> },\n) => React.ReactElement | null;\n\n/**\n * Button component for triggering actions throughout your interface\n *\n * The Button component is the primary interactive element in the Kookie User Interface.\n * It provides six visual variants, four sizes, comprehensive color options, and built-in\n * tooltip support. The component automatically handles icon sizing, supports responsive\n * layouts, and provides accessibility compliance out of the box.\n *\n * @example\n * ```tsx\n * // Basic button\n * <Button>Click me</Button>\n *\n * // Button with variant and size\n * <Button variant=\"solid\" size=\"3\">Primary Action</Button>\n *\n * // Button with tooltip\n * <Button tooltip=\"Save your progress\">Save</Button>\n *\n * // Polymorphic button as link\n * <Button as=\"a\" href=\"/dashboard\">Go to Dashboard</Button>\n * ```\n */\nconst Button = React.forwardRef(\n  (\n    {\n      className,\n      tooltip,\n      tooltipSide = 'top',\n      tooltipAlign = 'center',\n      tooltipDelayDuration,\n      tooltipDisableHoverableContent,\n      ...props\n    }: ButtonProps,\n    forwardedRef: React.ForwardedRef<ButtonElement>,\n  ) => {\n    // Generate unique ID for tooltip accessibility\n    const tooltipId = React.useId();\n    const hasTooltip = Boolean(tooltip);\n\n    // Prepare accessibility props for tooltip integration\n    const tooltipAccessibilityProps = React.useMemo(\n      () => (hasTooltip ? { 'aria-describedby': tooltipId } : {}),\n      [hasTooltip, tooltipId],\n    );\n\n    // Create the base button element with tooltip accessibility props\n    const button = (\n      <BaseButton\n        {...props}\n        {...tooltipAccessibilityProps}\n        ref={forwardedRef}\n        className={classNames('rt-Button', className)}\n      />\n    );\n\n    // If no tooltip is provided, return the button as-is for better performance\n    if (!tooltip) {\n      return button;\n    }\n\n    // Wrap with Tooltip when tooltip content is provided\n    // This creates a compound component that handles both button and tooltip functionality\n    return (\n      <Tooltip\n        content={tooltip}\n        side={tooltipSide}\n        align={tooltipAlign}\n        delayDuration={tooltipDelayDuration}\n        disableHoverableContent={tooltipDisableHoverableContent}\n        id={tooltipId}\n      >\n        {button}\n      </Tooltip>\n    );\n  },\n) as ButtonComponent & { displayName?: string };\n\nButton.displayName = 'Button';\n\nexport { Button };\nexport type { ButtonProps };\n"],
+  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aAEvB,OAAS,cAAAC,MAAkB,6BAC3B,OAAS,WAAAC,MAAe,eAoExB,MAAMC,EAASJ,EAAM,WACnB,CACE,CACE,UAAAK,EACA,QAAAC,EACA,YAAAC,EAAc,MACd,aAAAC,EAAe,SACf,qBAAAC,EACA,+BAAAC,EACA,GAAGC,CACL,EACAC,IACG,CAEH,MAAMC,EAAYb,EAAM,MAAM,EACxBc,EAAa,EAAQR,EAGrBS,EAA4Bf,EAAM,QACtC,IAAOc,EAAa,CAAE,mBAAoBD,CAAU,EAAI,CAAC,EACzD,CAACC,EAAYD,CAAS,CACxB,EAGMG,EACJhB,EAAA,cAACE,EAAA,CACE,GAAGS,EACH,GAAGI,EACJ,IAAKH,EACL,UAAWX,EAAW,YAAaI,CAAS,EAC9C,EAIF,OAAKC,EAOHN,EAAA,cAACG,EAAA,CACC,QAASG,EACT,KAAMC,EACN,MAAOC,EACP,cAAeC,EACf,wBAAyBC,EACzB,GAAIG,GAEHG,CACH,EAfOA,CAiBX,CACF,EAEAZ,EAAO,YAAc",
+  "names": ["React", "classNames", "BaseButton", "Tooltip", "Button", "className", "tooltip", "tooltipSide", "tooltipAlign", "tooltipDelayDuration", "tooltipDisableHoverableContent", "props", "forwardedRef", "tooltipId", "hasTooltip", "tooltipAccessibilityProps", "button"]
 }

package/dist/esm/components/button.props.d.ts

@@ -1,2 +1,19 @@
+/**
+ * Button prop definitions exported for external use
+ *
+ * This file re-exports the base button prop definitions to provide
+ * a clean API for the Button component. The base button props are
+ * defined in the _internal directory and used by all button variants
+ * to ensure consistency across the design system.
+ *
+ * @example
+ * ```tsx
+ * import { buttonPropDefs } from '@kushagradhawan/kookie-ui';
+ *
+ * // Access button prop definitions for type checking or validation
+ * type ButtonSize = typeof buttonPropDefs.size.values[number];
+ * type ButtonVariant = typeof buttonPropDefs.variant.values[number];
+ * ```
+ */
 export { baseButtonPropDefs as buttonPropDefs } from './_internal/base-button.props.js';
 //# sourceMappingURL=button.props.d.ts.map

package/dist/esm/components/button.props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.props.d.ts","sourceRoot":"","sources":["../../../src/components/button.props.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,IAAI,cAAc,EAAE,MAAM,kCAAkC,CAAC"}
+{"version":3,"file":"button.props.d.ts","sourceRoot":"","sources":["../../../src/components/button.props.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,kBAAkB,IAAI,cAAc,EAAE,MAAM,kCAAkC,CAAC"}

package/dist/esm/components/button.props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/button.props.tsx"],
-  "sourcesContent": ["export { baseButtonPropDefs as buttonPropDefs } from './_internal/base-button.props.js';\n"],
-  "mappings": "AAAA,OAA+B,sBAAtBA,MAA4C",
+  "sourcesContent": ["/**\n * Button prop definitions exported for external use\n *\n * This file re-exports the base button prop definitions to provide\n * a clean API for the Button component. The base button props are\n * defined in the _internal directory and used by all button variants\n * to ensure consistency across the design system.\n *\n * @example\n * ```tsx\n * import { buttonPropDefs } from '@kushagradhawan/kookie-ui';\n *\n * // Access button prop definitions for type checking or validation\n * type ButtonSize = typeof buttonPropDefs.size.values[number];\n * type ButtonVariant = typeof buttonPropDefs.variant.values[number];\n * ```\n */\nexport { baseButtonPropDefs as buttonPropDefs } from './_internal/base-button.props.js';\n"],
+  "mappings": "AAiBA,OAA+B,sBAAtBA,MAA4C",
   "names": ["baseButtonPropDefs"]
 }

package/dist/esm/components/callout.d.ts

@@ -6,6 +6,10 @@ import type { ComponentPropsWithout, RemovedProps, ComponentPropsAs } from '../h
 import type { GetPropDefTypes } from '../props/prop-def.js';
 type CalloutRootOwnProps = GetPropDefTypes<typeof calloutRootPropDefs>;
 interface CalloutRootProps extends ComponentPropsWithout<'div', RemovedProps>, MarginProps, CalloutRootOwnProps {
+    /** Controls the ARIA live region behavior for screen readers */
+    live?: 'off' | 'polite' | 'assertive';
+    /** Semantic role for the callout */
+    role?: 'alert' | 'status' | 'note';
 }
 declare const CalloutRoot: React.ForwardRefExoticComponent<CalloutRootProps & React.RefAttributes<HTMLDivElement>>;
 interface CalloutIconProps extends ComponentPropsWithout<'div', RemovedProps> {

package/dist/esm/components/callout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"callout.d.ts","sourceRoot":"","sources":["../../../src/components/callout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAKzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EACV,qBAAqB,EACrB,YAAY,EACZ,gBAAgB,EACjB,MAAM,+BAA+B,CAAC;AACvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5D,KAAK,mBAAmB,GAAG,eAAe,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAMvE,UAAU,gBACR,SAAQ,qBAAqB,CAAC,KAAK,EAAE,YAAY,CAAC,EAChD,WAAW,EACX,mBAAmB;CAAG;AAC1B,QAAA,MAAM,WAAW,yFAuBhB,CAAC;AAIF,UAAU,gBAAiB,SAAQ,qBAAqB,CAAC,KAAK,EAAE,YAAY,CAAC;CAAG;AAChF,QAAA,MAAM,WAAW,yFAMhB,CAAC;AAIF,KAAK,gBAAgB,GAAG,gBAAgB,CAAC,OAAO,IAAI,EAAE,GAAG,CAAC,CAAC;AAC3D,QAAA,MAAM,WAAW,+FAchB,CAAC;AAGF,OAAO,EAAE,WAAW,IAAI,IAAI,EAAE,WAAW,IAAI,IAAI,EAAE,WAAW,IAAI,IAAI,EAAE,CAAC;AACzE,YAAY,EACV,gBAAgB,IAAI,SAAS,EAC7B,gBAAgB,IAAI,SAAS,EAC7B,gBAAgB,IAAI,SAAS,GAC9B,CAAC"}
+{"version":3,"file":"callout.d.ts","sourceRoot":"","sources":["../../../src/components/callout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAKzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EACV,qBAAqB,EACrB,YAAY,EACZ,gBAAgB,EACjB,MAAM,+BAA+B,CAAC;AACvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAE5D,KAAK,mBAAmB,GAAG,eAAe,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAUvE,UAAU,gBACR,SAAQ,qBAAqB,CAAC,KAAK,EAAE,YAAY,CAAC,EAChD,WAAW,EACX,mBAAmB;IACrB,gEAAgE;IAChE,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,WAAW,CAAC;IACtC,oCAAoC;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;CACpC;AACD,QAAA,MAAM,WAAW,yFAqChB,CAAC;AAIF,UAAU,gBAAiB,SAAQ,qBAAqB,CAAC,KAAK,EAAE,YAAY,CAAC;CAAG;AAChF,QAAA,MAAM,WAAW,yFAMhB,CAAC;AAIF,KAAK,gBAAgB,GAAG,gBAAgB,CAAC,OAAO,IAAI,EAAE,GAAG,CAAC,CAAC;AAC3D,QAAA,MAAM,WAAW,+FAchB,CAAC;AAGF,OAAO,EAAE,WAAW,IAAI,IAAI,EAAE,WAAW,IAAI,IAAI,EAAE,WAAW,IAAI,IAAI,EAAE,CAAC;AACzE,YAAY,EACV,gBAAgB,IAAI,SAAS,EAC7B,gBAAgB,IAAI,SAAS,EAC7B,gBAAgB,IAAI,SAAS,GAC9B,CAAC"}

package/dist/esm/components/callout.js

@@ -1,2 +1,2 @@
-"use client";import*as o from"react";import p from"classnames";import{Slot as R}from"radix-ui";import{Text as x}from"./text.js";import{calloutRootPropDefs as a}from"./callout.props.js";import{extractProps as y}from"../helpers/extract-props.js";import{mapResponsiveProp as T,mapCalloutSizeToTextSize as v}from"../helpers/map-prop-values.js";import{marginPropDefs as I}from"../props/margin.props.js";const s=o.createContext({}),n=o.forwardRef((t,l)=>{const{size:e=a.size.default}=t,{asChild:r,children:C,className:i,color:c,panelBackground:f,...P}=y(t,a,I),d=r?R.Root:"div";return o.createElement(d,{"data-accent-color":c,"data-panel-background":f,...P,className:p("rt-CalloutRoot",i),ref:l},o.createElement(s.Provider,{value:o.useMemo(()=>({size:e}),[e])},C))});n.displayName="Callout.Root";const m=o.forwardRef(({className:t,...l},e)=>o.createElement("div",{...l,className:p("rt-CalloutIcon",t),ref:e}));m.displayName="Callout.Icon";const u=o.forwardRef(({className:t,...l},e)=>{const{size:r}=o.useContext(s);return o.createElement(x,{as:"p",size:T(r,v),...l,asChild:!1,ref:e,className:p("rt-CalloutText",t)})});u.displayName="Callout.Text";export{m as Icon,n as Root,u as Text};
+"use client";import*as o from"react";import s from"classnames";import{Slot as T}from"radix-ui";import{Text as I}from"./text.js";import{calloutRootPropDefs as n}from"./callout.props.js";import{extractProps as E}from"../helpers/extract-props.js";import{mapResponsiveProp as w,mapCalloutSizeToTextSize as z}from"../helpers/map-prop-values.js";import{marginPropDefs as N}from"../props/margin.props.js";const i=o.createContext({}),m=o.forwardRef((t,r)=>{const{size:e=n.size.default,live:l="polite",role:c="status",variant:p}=t,{asChild:P,children:f,className:d,color:a,panelBackground:R,material:x,...v}=E(t,n,N),y=P?T.Root:"div";return o.createElement(y,{"data-accent-color":a,"data-panel-background":R,"data-material":x,...v,...{role:c,"aria-live":l,"aria-atomic":!0},className:s("rt-CalloutRoot",d),ref:r},o.createElement(i.Provider,{value:o.useMemo(()=>({size:e,variant:p,color:a}),[e,p,a])},f))});m.displayName="Callout.Root";const u=o.forwardRef(({className:t,...r},e)=>o.createElement("div",{...r,className:s("rt-CalloutIcon",t),ref:e}));u.displayName="Callout.Icon";const C=o.forwardRef(({className:t,...r},e)=>{const{size:l}=o.useContext(i);return o.createElement(I,{as:"p",size:w(l,z),...r,asChild:!1,ref:e,className:s("rt-CalloutText",t)})});C.displayName="Callout.Text";export{u as Icon,m as Root,C as Text};
 //# sourceMappingURL=callout.js.map

package/dist/esm/components/callout.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/callout.tsx"],
-  "sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { Slot } from 'radix-ui';\n\nimport { Text } from './text.js';\nimport { calloutRootPropDefs } from './callout.props.js';\nimport { extractProps } from '../helpers/extract-props.js';\nimport { mapResponsiveProp, mapCalloutSizeToTextSize } from '../helpers/map-prop-values.js';\nimport { marginPropDefs } from '../props/margin.props.js';\n\nimport type { MarginProps } from '../props/margin.props.js';\nimport type {\n  ComponentPropsWithout,\n  RemovedProps,\n  ComponentPropsAs,\n} from '../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../props/prop-def.js';\n\ntype CalloutRootOwnProps = GetPropDefTypes<typeof calloutRootPropDefs>;\n\ntype CalloutContextValue = { size?: CalloutRootOwnProps['size'] };\nconst CalloutContext = React.createContext<CalloutContextValue>({});\n\ntype CalloutRootElement = React.ElementRef<'div'>;\ninterface CalloutRootProps\n  extends ComponentPropsWithout<'div', RemovedProps>,\n    MarginProps,\n    CalloutRootOwnProps {}\nconst CalloutRoot = React.forwardRef<CalloutRootElement, CalloutRootProps>(\n  (props, forwardedRef) => {\n    const { size = calloutRootPropDefs.size.default } = props;\n    const { asChild, children, className, color, panelBackground, ...rootProps } = extractProps(\n      props,\n      calloutRootPropDefs,\n      marginPropDefs,\n    );\n    const Comp = asChild ? Slot.Root : 'div';\n    return (\n      <Comp\n        data-accent-color={color}\n        data-panel-background={panelBackground}\n        {...rootProps}\n        className={classNames('rt-CalloutRoot', className)}\n        ref={forwardedRef}\n      >\n        <CalloutContext.Provider value={React.useMemo(() => ({ size }), [size])}>\n          {children}\n        </CalloutContext.Provider>\n      </Comp>\n    );\n  },\n);\nCalloutRoot.displayName = 'Callout.Root';\n\ntype CalloutIconElement = React.ElementRef<'div'>;\ninterface CalloutIconProps extends ComponentPropsWithout<'div', RemovedProps> {}\nconst CalloutIcon = React.forwardRef<CalloutIconElement, CalloutIconProps>(\n  ({ className, ...props }, forwardedRef) => {\n    return (\n      <div {...props} className={classNames('rt-CalloutIcon', className)} ref={forwardedRef} />\n    );\n  },\n);\nCalloutIcon.displayName = 'Callout.Icon';\n\ntype CalloutTextElement = React.ElementRef<'p'>;\ntype CalloutTextProps = ComponentPropsAs<typeof Text, 'p'>;\nconst CalloutText = React.forwardRef<CalloutTextElement, CalloutTextProps>(\n  ({ className, ...props }, forwardedRef) => {\n    const { size } = React.useContext(CalloutContext);\n    return (\n      <Text\n        as=\"p\"\n        size={mapResponsiveProp(size, mapCalloutSizeToTextSize)}\n        {...props}\n        asChild={false}\n        ref={forwardedRef}\n        className={classNames('rt-CalloutText', className)}\n      />\n    );\n  },\n);\nCalloutText.displayName = 'Callout.Text';\n\nexport { CalloutRoot as Root, CalloutIcon as Icon, CalloutText as Text };\nexport type {\n  CalloutRootProps as RootProps,\n  CalloutIconProps as IconProps,\n  CalloutTextProps as TextProps,\n};\n"],
-  "mappings": "aAEA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aACvB,OAAS,QAAAC,MAAY,WAErB,OAAS,QAAAC,MAAY,YACrB,OAAS,uBAAAC,MAA2B,qBACpC,OAAS,gBAAAC,MAAoB,8BAC7B,OAAS,qBAAAC,EAAmB,4BAAAC,MAAgC,gCAC5D,OAAS,kBAAAC,MAAsB,2BAa/B,MAAMC,EAAiBT,EAAM,cAAmC,CAAC,CAAC,EAO5DU,EAAcV,EAAM,WACxB,CAACW,EAAOC,IAAiB,CACvB,KAAM,CAAE,KAAAC,EAAOT,EAAoB,KAAK,OAAQ,EAAIO,EAC9C,CAAE,QAAAG,EAAS,SAAAC,EAAU,UAAAC,EAAW,MAAAC,EAAO,gBAAAC,EAAiB,GAAGC,CAAU,EAAId,EAC7EM,EACAP,EACAI,CACF,EACMY,EAAON,EAAUZ,EAAK,KAAO,MACnC,OACEF,EAAA,cAACoB,EAAA,CACC,oBAAmBH,EACnB,wBAAuBC,EACtB,GAAGC,EACJ,UAAWlB,EAAW,iBAAkBe,CAAS,EACjD,IAAKJ,GAELZ,EAAA,cAACS,EAAe,SAAf,CAAwB,MAAOT,EAAM,QAAQ,KAAO,CAAE,KAAAa,CAAK,GAAI,CAACA,CAAI,CAAC,GACnEE,CACH,CACF,CAEJ,CACF,EACAL,EAAY,YAAc,eAI1B,MAAMW,EAAcrB,EAAM,WACxB,CAAC,CAAE,UAAAgB,EAAW,GAAGL,CAAM,EAAGC,IAEtBZ,EAAA,cAAC,OAAK,GAAGW,EAAO,UAAWV,EAAW,iBAAkBe,CAAS,EAAG,IAAKJ,EAAc,CAG7F,EACAS,EAAY,YAAc,eAI1B,MAAMC,EAActB,EAAM,WACxB,CAAC,CAAE,UAAAgB,EAAW,GAAGL,CAAM,EAAGC,IAAiB,CACzC,KAAM,CAAE,KAAAC,CAAK,EAAIb,EAAM,WAAWS,CAAc,EAChD,OACET,EAAA,cAACG,EAAA,CACC,GAAG,IACH,KAAMG,EAAkBO,EAAMN,CAAwB,EACrD,GAAGI,EACJ,QAAS,GACT,IAAKC,EACL,UAAWX,EAAW,iBAAkBe,CAAS,EACnD,CAEJ,CACF,EACAM,EAAY,YAAc",
-  "names": ["React", "classNames", "Slot", "Text", "calloutRootPropDefs", "extractProps", "mapResponsiveProp", "mapCalloutSizeToTextSize", "marginPropDefs", "CalloutContext", "CalloutRoot", "props", "forwardedRef", "size", "asChild", "children", "className", "color", "panelBackground", "rootProps", "Comp", "CalloutIcon", "CalloutText"]
+  "sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { Slot } from 'radix-ui';\n\nimport { Text } from './text.js';\nimport { calloutRootPropDefs } from './callout.props.js';\nimport { extractProps } from '../helpers/extract-props.js';\nimport { mapResponsiveProp, mapCalloutSizeToTextSize } from '../helpers/map-prop-values.js';\nimport { marginPropDefs } from '../props/margin.props.js';\n\nimport type { MarginProps } from '../props/margin.props.js';\nimport type {\n  ComponentPropsWithout,\n  RemovedProps,\n  ComponentPropsAs,\n} from '../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../props/prop-def.js';\n\ntype CalloutRootOwnProps = GetPropDefTypes<typeof calloutRootPropDefs>;\n\ntype CalloutContextValue = {\n  size?: CalloutRootOwnProps['size'];\n  variant?: CalloutRootOwnProps['variant'];\n  color?: CalloutRootOwnProps['color'];\n};\nconst CalloutContext = React.createContext<CalloutContextValue>({});\n\ntype CalloutRootElement = React.ElementRef<'div'>;\ninterface CalloutRootProps\n  extends ComponentPropsWithout<'div', RemovedProps>,\n    MarginProps,\n    CalloutRootOwnProps {\n  /** Controls the ARIA live region behavior for screen readers */\n  live?: 'off' | 'polite' | 'assertive';\n  /** Semantic role for the callout */\n  role?: 'alert' | 'status' | 'note';\n}\nconst CalloutRoot = React.forwardRef<CalloutRootElement, CalloutRootProps>(\n  (props, forwardedRef) => {\n    const {\n      size = calloutRootPropDefs.size.default,\n      live = 'polite',\n      role = 'status',\n      variant,\n    } = props;\n    const { asChild, children, className, color, panelBackground, material, ...rootProps } =\n      extractProps(props, calloutRootPropDefs, marginPropDefs);\n    const Comp = asChild ? Slot.Root : 'div';\n\n    // Determine appropriate ARIA attributes based on role and live\n    const ariaProps = {\n      role,\n      'aria-live': live,\n      'aria-atomic': true,\n    };\n\n    return (\n      <Comp\n        data-accent-color={color}\n        data-panel-background={panelBackground}\n        data-material={material}\n        {...rootProps}\n        {...ariaProps}\n        className={classNames('rt-CalloutRoot', className)}\n        ref={forwardedRef}\n      >\n        <CalloutContext.Provider\n          value={React.useMemo(() => ({ size, variant, color }), [size, variant, color])}\n        >\n          {children}\n        </CalloutContext.Provider>\n      </Comp>\n    );\n  },\n);\nCalloutRoot.displayName = 'Callout.Root';\n\ntype CalloutIconElement = React.ElementRef<'div'>;\ninterface CalloutIconProps extends ComponentPropsWithout<'div', RemovedProps> {}\nconst CalloutIcon = React.forwardRef<CalloutIconElement, CalloutIconProps>(\n  ({ className, ...props }, forwardedRef) => {\n    return (\n      <div {...props} className={classNames('rt-CalloutIcon', className)} ref={forwardedRef} />\n    );\n  },\n);\nCalloutIcon.displayName = 'Callout.Icon';\n\ntype CalloutTextElement = React.ElementRef<'p'>;\ntype CalloutTextProps = ComponentPropsAs<typeof Text, 'p'>;\nconst CalloutText = React.forwardRef<CalloutTextElement, CalloutTextProps>(\n  ({ className, ...props }, forwardedRef) => {\n    const { size } = React.useContext(CalloutContext);\n    return (\n      <Text\n        as=\"p\"\n        size={mapResponsiveProp(size, mapCalloutSizeToTextSize)}\n        {...props}\n        asChild={false}\n        ref={forwardedRef}\n        className={classNames('rt-CalloutText', className)}\n      />\n    );\n  },\n);\nCalloutText.displayName = 'Callout.Text';\n\nexport { CalloutRoot as Root, CalloutIcon as Icon, CalloutText as Text };\nexport type {\n  CalloutRootProps as RootProps,\n  CalloutIconProps as IconProps,\n  CalloutTextProps as TextProps,\n};\n"],
+  "mappings": "aAEA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aACvB,OAAS,QAAAC,MAAY,WAErB,OAAS,QAAAC,MAAY,YACrB,OAAS,uBAAAC,MAA2B,qBACpC,OAAS,gBAAAC,MAAoB,8BAC7B,OAAS,qBAAAC,EAAmB,4BAAAC,MAAgC,gCAC5D,OAAS,kBAAAC,MAAsB,2BAiB/B,MAAMC,EAAiBT,EAAM,cAAmC,CAAC,CAAC,EAY5DU,EAAcV,EAAM,WACxB,CAACW,EAAOC,IAAiB,CACvB,KAAM,CACJ,KAAAC,EAAOT,EAAoB,KAAK,QAChC,KAAAU,EAAO,SACP,KAAAC,EAAO,SACP,QAAAC,CACF,EAAIL,EACE,CAAE,QAAAM,EAAS,SAAAC,EAAU,UAAAC,EAAW,MAAAC,EAAO,gBAAAC,EAAiB,SAAAC,EAAU,GAAGC,CAAU,EACnFlB,EAAaM,EAAOP,EAAqBI,CAAc,EACnDgB,EAAOP,EAAUf,EAAK,KAAO,MASnC,OACEF,EAAA,cAACwB,EAAA,CACC,oBAAmBJ,EACnB,wBAAuBC,EACvB,gBAAeC,EACd,GAAGC,EACH,GAZa,CAChB,KAAAR,EACA,YAAaD,EACb,cAAe,EACjB,EASI,UAAWb,EAAW,iBAAkBkB,CAAS,EACjD,IAAKP,GAELZ,EAAA,cAACS,EAAe,SAAf,CACC,MAAOT,EAAM,QAAQ,KAAO,CAAE,KAAAa,EAAM,QAAAG,EAAS,MAAAI,CAAM,GAAI,CAACP,EAAMG,EAASI,CAAK,CAAC,GAE5EF,CACH,CACF,CAEJ,CACF,EACAR,EAAY,YAAc,eAI1B,MAAMe,EAAczB,EAAM,WACxB,CAAC,CAAE,UAAAmB,EAAW,GAAGR,CAAM,EAAGC,IAEtBZ,EAAA,cAAC,OAAK,GAAGW,EAAO,UAAWV,EAAW,iBAAkBkB,CAAS,EAAG,IAAKP,EAAc,CAG7F,EACAa,EAAY,YAAc,eAI1B,MAAMC,EAAc1B,EAAM,WACxB,CAAC,CAAE,UAAAmB,EAAW,GAAGR,CAAM,EAAGC,IAAiB,CACzC,KAAM,CAAE,KAAAC,CAAK,EAAIb,EAAM,WAAWS,CAAc,EAChD,OACET,EAAA,cAACG,EAAA,CACC,GAAG,IACH,KAAMG,EAAkBO,EAAMN,CAAwB,EACrD,GAAGI,EACJ,QAAS,GACT,IAAKC,EACL,UAAWX,EAAW,iBAAkBkB,CAAS,EACnD,CAEJ,CACF,EACAO,EAAY,YAAc",
+  "names": ["React", "classNames", "Slot", "Text", "calloutRootPropDefs", "extractProps", "mapResponsiveProp", "mapCalloutSizeToTextSize", "marginPropDefs", "CalloutContext", "CalloutRoot", "props", "forwardedRef", "size", "live", "role", "variant", "asChild", "children", "className", "color", "panelBackground", "material", "rootProps", "Comp", "CalloutIcon", "CalloutText"]
 }

package/dist/esm/components/callout.props.d.ts

@@ -1,4 +1,12 @@
 declare const calloutRootPropDefs: {
+    material: {
+        type: "enum";
+        values: readonly ["solid", "translucent"];
+        default: undefined;
+    };
+    /**
+     * @deprecated Use `material` prop instead. This prop will be removed in a future version.
+     */
     panelBackground: {
         type: "enum";
         values: readonly ["solid", "translucent"];
@@ -24,7 +32,7 @@ declare const calloutRootPropDefs: {
     variant: {
         type: "enum";
         className: string;
-        values: readonly ["soft", "surface", "outline"];
+        values: readonly ["soft", "surface", "outline", "classic"];
         default: "soft";
     };
     asChild: {

package/dist/esm/components/callout.props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"callout.props.d.ts","sourceRoot":"","sources":["../../../src/components/callout.props.tsx"],"names":[],"mappings":"AAUA,QAAA,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAWxB,CAAC;AAEF,OAAO,EAAE,mBAAmB,EAAE,CAAC"}
+{"version":3,"file":"callout.props.d.ts","sourceRoot":"","sources":["../../../src/components/callout.props.tsx"],"names":[],"mappings":"AAWA,QAAA,MAAM,mBAAmB;;;;;;IAOvB;;OAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOJ,CAAC;AAEF,OAAO,EAAE,mBAAmB,EAAE,CAAC"}

package/dist/esm/components/callout.props.js

@@ -1,2 +1,2 @@
-import{asChildPropDef as e}from"../props/as-child.prop.js";import{accentColorPropDef as o}from"../props/color.prop.js";import{highContrastPropDef as s}from"../props/high-contrast.prop.js";const t=["1","2","3"],r=["soft","surface","outline"],a=["solid","translucent"],n={...e,size:{type:"enum",className:"rt-r-size",values:t,default:"2",responsive:!0},variant:{type:"enum",className:"rt-variant",values:r,default:"soft"},...o,...s,panelBackground:{type:"enum",values:a,default:void 0}};export{n as calloutRootPropDefs};
+import{asChildPropDef as e}from"../props/as-child.prop.js";import{accentColorPropDef as s}from"../props/color.prop.js";import{highContrastPropDef as t}from"../props/high-contrast.prop.js";const a=["1","2","3"],o=["soft","surface","outline","classic"],r=["solid","translucent"],n=["solid","translucent"],p={...e,size:{type:"enum",className:"rt-r-size",values:a,default:"2",responsive:!0},variant:{type:"enum",className:"rt-variant",values:o,default:"soft"},...s,...t,material:{type:"enum",values:n,default:void 0},panelBackground:{type:"enum",values:r,default:void 0}};export{p as calloutRootPropDefs};
 //# sourceMappingURL=callout.props.js.map

package/dist/esm/components/callout.props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/callout.props.tsx"],
-  "sourcesContent": ["import { asChildPropDef } from '../props/as-child.prop.js';\nimport { accentColorPropDef } from '../props/color.prop.js';\nimport { highContrastPropDef } from '../props/high-contrast.prop.js';\n\nimport type { PropDef } from '../props/prop-def.js';\n\nconst sizes = ['1', '2', '3'] as const;\nconst variants = ['soft', 'surface', 'outline'] as const;\nconst panelBackgrounds = ['solid', 'translucent'] as const;\n\nconst calloutRootPropDefs = {\n  ...asChildPropDef,\n  size: { type: 'enum', className: 'rt-r-size', values: sizes, default: '2', responsive: true },\n  variant: { type: 'enum', className: 'rt-variant', values: variants, default: 'soft' },\n  ...accentColorPropDef,\n  ...highContrastPropDef,\n  panelBackground: { type: 'enum', values: panelBackgrounds, default: undefined },\n} satisfies {\n  size: PropDef<(typeof sizes)[number]>;\n  variant: PropDef<(typeof variants)[number]>;\n  panelBackground: PropDef<(typeof panelBackgrounds)[number] | undefined>;\n};\n\nexport { calloutRootPropDefs };\n"],
-  "mappings": "AAAA,OAAS,kBAAAA,MAAsB,4BAC/B,OAAS,sBAAAC,MAA0B,yBACnC,OAAS,uBAAAC,MAA2B,iCAIpC,MAAMC,EAAQ,CAAC,IAAK,IAAK,GAAG,EACtBC,EAAW,CAAC,OAAQ,UAAW,SAAS,EACxCC,EAAmB,CAAC,QAAS,aAAa,EAE1CC,EAAsB,CAC1B,GAAGN,EACH,KAAM,CAAE,KAAM,OAAQ,UAAW,YAAa,OAAQG,EAAO,QAAS,IAAK,WAAY,EAAK,EAC5F,QAAS,CAAE,KAAM,OAAQ,UAAW,aAAc,OAAQC,EAAU,QAAS,MAAO,EACpF,GAAGH,EACH,GAAGC,EACH,gBAAiB,CAAE,KAAM,OAAQ,OAAQG,EAAkB,QAAS,MAAU,CAChF",
-  "names": ["asChildPropDef", "accentColorPropDef", "highContrastPropDef", "sizes", "variants", "panelBackgrounds", "calloutRootPropDefs"]
+  "sourcesContent": ["import { asChildPropDef } from '../props/as-child.prop.js';\nimport { accentColorPropDef } from '../props/color.prop.js';\nimport { highContrastPropDef } from '../props/high-contrast.prop.js';\n\nimport type { PropDef } from '../props/prop-def.js';\n\nconst sizes = ['1', '2', '3'] as const;\nconst variants = ['soft', 'surface', 'outline', 'classic'] as const;\nconst panelBackgrounds = ['solid', 'translucent'] as const;\nconst materials = ['solid', 'translucent'] as const;\n\nconst calloutRootPropDefs = {\n  ...asChildPropDef,\n  size: { type: 'enum', className: 'rt-r-size', values: sizes, default: '2', responsive: true },\n  variant: { type: 'enum', className: 'rt-variant', values: variants, default: 'soft' },\n  ...accentColorPropDef,\n  ...highContrastPropDef,\n  material: { type: 'enum', values: materials, default: undefined },\n  /**\n   * @deprecated Use `material` prop instead. This prop will be removed in a future version.\n   */\n  panelBackground: { type: 'enum', values: panelBackgrounds, default: undefined },\n} satisfies {\n  size: PropDef<(typeof sizes)[number]>;\n  variant: PropDef<(typeof variants)[number]>;\n  material: PropDef<(typeof materials)[number] | undefined>;\n  panelBackground: PropDef<(typeof panelBackgrounds)[number] | undefined>;\n};\n\nexport { calloutRootPropDefs };\n"],
+  "mappings": "AAAA,OAAS,kBAAAA,MAAsB,4BAC/B,OAAS,sBAAAC,MAA0B,yBACnC,OAAS,uBAAAC,MAA2B,iCAIpC,MAAMC,EAAQ,CAAC,IAAK,IAAK,GAAG,EACtBC,EAAW,CAAC,OAAQ,UAAW,UAAW,SAAS,EACnDC,EAAmB,CAAC,QAAS,aAAa,EAC1CC,EAAY,CAAC,QAAS,aAAa,EAEnCC,EAAsB,CAC1B,GAAGP,EACH,KAAM,CAAE,KAAM,OAAQ,UAAW,YAAa,OAAQG,EAAO,QAAS,IAAK,WAAY,EAAK,EAC5F,QAAS,CAAE,KAAM,OAAQ,UAAW,aAAc,OAAQC,EAAU,QAAS,MAAO,EACpF,GAAGH,EACH,GAAGC,EACH,SAAU,CAAE,KAAM,OAAQ,OAAQI,EAAW,QAAS,MAAU,EAIhE,gBAAiB,CAAE,KAAM,OAAQ,OAAQD,EAAkB,QAAS,MAAU,CAChF",
+  "names": ["asChildPropDef", "accentColorPropDef", "highContrastPropDef", "sizes", "variants", "panelBackgrounds", "materials", "calloutRootPropDefs"]
 }

package/dist/esm/components/card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/components/card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAI/C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACzF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAG5D,KAAK,YAAY,GAAG,eAAe,CAAC,OAAO,YAAY,CAAC,CAAC;AACzD,UAAU,SAAU,SAAQ,qBAAqB,CAAC,KAAK,EAAE,YAAY,CAAC,EAAE,WAAW,EAAE,YAAY;CAAG;AACpG,QAAA,MAAM,IAAI,kFAgBR,CAAC;AAGH,OAAO,EAAE,IAAI,EAAE,CAAC;AAChB,YAAY,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/components/card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAI/C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACzF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAG5D,KAAK,YAAY,GAAG,eAAe,CAAC,OAAO,YAAY,CAAC,CAAC;AACzD,UAAU,SAAU,SAAQ,qBAAqB,CAAC,KAAK,EAAE,YAAY,CAAC,EAAE,WAAW,EAAE,YAAY;CAAG;AACpG,QAAA,MAAM,IAAI,kFAkBR,CAAC;AAGH,OAAO,EAAE,IAAI,EAAE,CAAC;AAChB,YAAY,EAAE,SAAS,EAAE,CAAC"}

package/dist/esm/components/card.js

@@ -1,2 +1,2 @@
-import*as r from"react";import f from"classnames";import{Slot as i}from"radix-ui";import{cardPropDefs as P}from"./card.props.js";import{extractProps as c}from"../helpers/extract-props.js";import{marginPropDefs as C}from"../props/margin.props.js";const o=r.forwardRef((e,p)=>{const{asChild:t,className:s,panelBackground:a,flush:m,...d}=c(e,P,C),n=t?i.Root:"div";return r.createElement(n,{ref:p,...d,"data-panel-background":a,"data-flush":m?"true":void 0,className:f("rt-reset","rt-BaseCard","rt-Card",s)})});o.displayName="Card";export{o as Card};
+import*as o from"react";import P from"classnames";import{Slot as c}from"radix-ui";import{cardPropDefs as l}from"./card.props.js";import{extractProps as C}from"../helpers/extract-props.js";import{marginPropDefs as y}from"../props/margin.props.js";const e=o.forwardRef((p,t)=>{const{asChild:a,className:s,panelBackground:m,material:d,flush:n,...f}=C(p,l,y),r=d||m,i=a?c.Root:"div";return o.createElement(i,{ref:t,...f,"data-panel-background":r,"data-material":r,"data-flush":n?"true":void 0,className:P("rt-reset","rt-BaseCard","rt-Card",s)})});e.displayName="Card";export{e as Card};
 //# sourceMappingURL=card.js.map

package/dist/esm/components/card.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/card.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\nimport { Slot } from 'radix-ui';\n\nimport { cardPropDefs } from './card.props.js';\nimport { extractProps } from '../helpers/extract-props.js';\nimport { marginPropDefs } from '../props/margin.props.js';\n\nimport type { MarginProps } from '../props/margin.props.js';\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../props/prop-def.js';\n\ntype CardElement = React.ElementRef<'div'>;\ntype CardOwnProps = GetPropDefTypes<typeof cardPropDefs>;\ninterface CardProps extends ComponentPropsWithout<'div', RemovedProps>, MarginProps, CardOwnProps {}\nconst Card = React.forwardRef<CardElement, CardProps>((props, forwardedRef) => {\n  const { asChild, className, panelBackground, flush, ...cardProps } = extractProps(\n    props,\n    cardPropDefs,\n    marginPropDefs,\n  );\n  const Comp = asChild ? Slot.Root : 'div';\n  return (\n    <Comp\n      ref={forwardedRef}\n      {...cardProps}\n      data-panel-background={panelBackground}\n      data-flush={flush ? 'true' : undefined}\n      className={classNames('rt-reset', 'rt-BaseCard', 'rt-Card', className)}\n    />\n  );\n});\nCard.displayName = 'Card';\n\nexport { Card };\nexport type { CardProps };\n"],
-  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aACvB,OAAS,QAAAC,MAAY,WAErB,OAAS,gBAAAC,MAAoB,kBAC7B,OAAS,gBAAAC,MAAoB,8BAC7B,OAAS,kBAAAC,MAAsB,2BAS/B,MAAMC,EAAON,EAAM,WAAmC,CAACO,EAAOC,IAAiB,CAC7E,KAAM,CAAE,QAAAC,EAAS,UAAAC,EAAW,gBAAAC,EAAiB,MAAAC,EAAO,GAAGC,CAAU,EAAIT,EACnEG,EACAJ,EACAE,CACF,EACMS,EAAOL,EAAUP,EAAK,KAAO,MACnC,OACEF,EAAA,cAACc,EAAA,CACC,IAAKN,EACJ,GAAGK,EACJ,wBAAuBF,EACvB,aAAYC,EAAQ,OAAS,OAC7B,UAAWX,EAAW,WAAY,cAAe,UAAWS,CAAS,EACvE,CAEJ,CAAC,EACDJ,EAAK,YAAc",
-  "names": ["React", "classNames", "Slot", "cardPropDefs", "extractProps", "marginPropDefs", "Card", "props", "forwardedRef", "asChild", "className", "panelBackground", "flush", "cardProps", "Comp"]
+  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\nimport { Slot } from 'radix-ui';\n\nimport { cardPropDefs } from './card.props.js';\nimport { extractProps } from '../helpers/extract-props.js';\nimport { marginPropDefs } from '../props/margin.props.js';\n\nimport type { MarginProps } from '../props/margin.props.js';\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../props/prop-def.js';\n\ntype CardElement = React.ElementRef<'div'>;\ntype CardOwnProps = GetPropDefTypes<typeof cardPropDefs>;\ninterface CardProps extends ComponentPropsWithout<'div', RemovedProps>, MarginProps, CardOwnProps {}\nconst Card = React.forwardRef<CardElement, CardProps>((props, forwardedRef) => {\n  const { asChild, className, panelBackground, material, flush, ...cardProps } = extractProps(\n    props,\n    cardPropDefs,\n    marginPropDefs,\n  );\n  const effectiveMaterial = material || panelBackground;\n  const Comp = asChild ? Slot.Root : 'div';\n  return (\n    <Comp\n      ref={forwardedRef}\n      {...cardProps}\n      data-panel-background={effectiveMaterial}\n      data-material={effectiveMaterial}\n      data-flush={flush ? 'true' : undefined}\n      className={classNames('rt-reset', 'rt-BaseCard', 'rt-Card', className)}\n    />\n  );\n});\nCard.displayName = 'Card';\n\nexport { Card };\nexport type { CardProps };\n"],
+  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aACvB,OAAS,QAAAC,MAAY,WAErB,OAAS,gBAAAC,MAAoB,kBAC7B,OAAS,gBAAAC,MAAoB,8BAC7B,OAAS,kBAAAC,MAAsB,2BAS/B,MAAMC,EAAON,EAAM,WAAmC,CAACO,EAAOC,IAAiB,CAC7E,KAAM,CAAE,QAAAC,EAAS,UAAAC,EAAW,gBAAAC,EAAiB,SAAAC,EAAU,MAAAC,EAAO,GAAGC,CAAU,EAAIV,EAC7EG,EACAJ,EACAE,CACF,EACMU,EAAoBH,GAAYD,EAChCK,EAAOP,EAAUP,EAAK,KAAO,MACnC,OACEF,EAAA,cAACgB,EAAA,CACC,IAAKR,EACJ,GAAGM,EACJ,wBAAuBC,EACvB,gBAAeA,EACf,aAAYF,EAAQ,OAAS,OAC7B,UAAWZ,EAAW,WAAY,cAAe,UAAWS,CAAS,EACvE,CAEJ,CAAC,EACDJ,EAAK,YAAc",
+  "names": ["React", "classNames", "Slot", "cardPropDefs", "extractProps", "marginPropDefs", "Card", "props", "forwardedRef", "asChild", "className", "panelBackground", "material", "flush", "cardProps", "effectiveMaterial", "Comp"]
 }

package/dist/esm/components/card.props.d.ts

@@ -17,6 +17,11 @@ declare const cardPropDefs: {
         values: readonly ["solid", "translucent"];
         default: undefined;
     };
+    material: {
+        type: "enum";
+        values: readonly ["solid", "translucent"];
+        default: undefined;
+    };
     flush: {
         type: "boolean";
         default: false;

package/dist/esm/components/card.props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"card.props.d.ts","sourceRoot":"","sources":["../../../src/components/card.props.tsx"],"names":[],"mappings":"AAQA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;CAWjB,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"card.props.d.ts","sourceRoot":"","sources":["../../../src/components/card.props.tsx"],"names":[],"mappings":"AASA,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAajB,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/esm/components/card.props.js

@@ -1,2 +1,2 @@
-import{asChildPropDef as e}from"../props/as-child.prop.js";const s=["1","2","3","4","5"],a=["surface","outline","classic","ghost","soft"],o=["solid","translucent"],n={...e,size:{type:"enum",className:"rt-r-size",values:s,default:"1",responsive:!0},variant:{type:"enum",className:"rt-variant",values:a,default:"outline"},panelBackground:{type:"enum",values:o,default:void 0},flush:{type:"boolean",default:!1}};export{n as cardPropDefs};
+import{asChildPropDef as e}from"../props/as-child.prop.js";const s=["1","2","3","4","5"],a=["surface","outline","classic","ghost","soft"],t=["solid","translucent"],n=["solid","translucent"],o={...e,size:{type:"enum",className:"rt-r-size",values:s,default:"1",responsive:!0},variant:{type:"enum",className:"rt-variant",values:a,default:"outline"},panelBackground:{type:"enum",values:t,default:void 0},material:{type:"enum",values:n,default:void 0},flush:{type:"boolean",default:!1}};export{o as cardPropDefs};
 //# sourceMappingURL=card.props.js.map

package/dist/esm/components/card.props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/card.props.tsx"],
-  "sourcesContent": ["import { asChildPropDef } from '../props/as-child.prop.js';\n\nimport type { PropDef } from '../props/prop-def.js';\n\nconst sizes = ['1', '2', '3', '4', '5'] as const;\nconst variants = ['surface', 'outline', 'classic', 'ghost', 'soft'] as const;\nconst panelBackgrounds = ['solid', 'translucent'] as const;\n\nconst cardPropDefs = {\n  ...asChildPropDef,\n  size: { type: 'enum', className: 'rt-r-size', values: sizes, default: '1', responsive: true },\n  variant: { type: 'enum', className: 'rt-variant', values: variants, default: 'outline' },\n  panelBackground: { type: 'enum', values: panelBackgrounds, default: undefined },\n  flush: { type: 'boolean', default: false },\n} satisfies {\n  size: PropDef<(typeof sizes)[number]>;\n  variant: PropDef<(typeof variants)[number]>;\n  panelBackground: PropDef<(typeof panelBackgrounds)[number] | undefined>;\n  flush: PropDef<boolean>;\n};\n\nexport { cardPropDefs };\n"],
-  "mappings": "AAAA,OAAS,kBAAAA,MAAsB,4BAI/B,MAAMC,EAAQ,CAAC,IAAK,IAAK,IAAK,IAAK,GAAG,EAChCC,EAAW,CAAC,UAAW,UAAW,UAAW,QAAS,MAAM,EAC5DC,EAAmB,CAAC,QAAS,aAAa,EAE1CC,EAAe,CACnB,GAAGJ,EACH,KAAM,CAAE,KAAM,OAAQ,UAAW,YAAa,OAAQC,EAAO,QAAS,IAAK,WAAY,EAAK,EAC5F,QAAS,CAAE,KAAM,OAAQ,UAAW,aAAc,OAAQC,EAAU,QAAS,SAAU,EACvF,gBAAiB,CAAE,KAAM,OAAQ,OAAQC,EAAkB,QAAS,MAAU,EAC9E,MAAO,CAAE,KAAM,UAAW,QAAS,EAAM,CAC3C",
-  "names": ["asChildPropDef", "sizes", "variants", "panelBackgrounds", "cardPropDefs"]
+  "sourcesContent": ["import { asChildPropDef } from '../props/as-child.prop.js';\n\nimport type { PropDef } from '../props/prop-def.js';\n\nconst sizes = ['1', '2', '3', '4', '5'] as const;\nconst variants = ['surface', 'outline', 'classic', 'ghost', 'soft'] as const;\nconst panelBackgrounds = ['solid', 'translucent'] as const;\nconst materials = ['solid', 'translucent'] as const;\n\nconst cardPropDefs = {\n  ...asChildPropDef,\n  size: { type: 'enum', className: 'rt-r-size', values: sizes, default: '1', responsive: true },\n  variant: { type: 'enum', className: 'rt-variant', values: variants, default: 'outline' },\n  panelBackground: { type: 'enum', values: panelBackgrounds, default: undefined },\n  material: { type: 'enum', values: materials, default: undefined },\n  flush: { type: 'boolean', default: false },\n} satisfies {\n  size: PropDef<(typeof sizes)[number]>;\n  variant: PropDef<(typeof variants)[number]>;\n  panelBackground: PropDef<(typeof panelBackgrounds)[number] | undefined>;\n  material: PropDef<(typeof materials)[number] | undefined>;\n  flush: PropDef<boolean>;\n};\n\nexport { cardPropDefs };\n"],
+  "mappings": "AAAA,OAAS,kBAAAA,MAAsB,4BAI/B,MAAMC,EAAQ,CAAC,IAAK,IAAK,IAAK,IAAK,GAAG,EAChCC,EAAW,CAAC,UAAW,UAAW,UAAW,QAAS,MAAM,EAC5DC,EAAmB,CAAC,QAAS,aAAa,EAC1CC,EAAY,CAAC,QAAS,aAAa,EAEnCC,EAAe,CACnB,GAAGL,EACH,KAAM,CAAE,KAAM,OAAQ,UAAW,YAAa,OAAQC,EAAO,QAAS,IAAK,WAAY,EAAK,EAC5F,QAAS,CAAE,KAAM,OAAQ,UAAW,aAAc,OAAQC,EAAU,QAAS,SAAU,EACvF,gBAAiB,CAAE,KAAM,OAAQ,OAAQC,EAAkB,QAAS,MAAU,EAC9E,SAAU,CAAE,KAAM,OAAQ,OAAQC,EAAW,QAAS,MAAU,EAChE,MAAO,CAAE,KAAM,UAAW,QAAS,EAAM,CAC3C",
+  "names": ["asChildPropDef", "sizes", "variants", "panelBackgrounds", "materials", "cardPropDefs"]
 }

package/dist/esm/components/checkbox-cards.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-cards.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox-cards.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAE5C,OAAO,KAAK,sBAAsB,MAAM,+BAA+B,CAAC;AAExE,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AAQtE,OAAO,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACzF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAc,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAmBxE,KAAK,yBAAyB,GAAG,eAAe,CAAC,OAAO,yBAAyB,CAAC,CAAC;AACnF,UAAU,sBACR,SAAQ,qBAAqB,CACzB,OAAO,sBAAsB,CAAC,IAAI,EAClC,SAAS,GAAG,OAAO,GAAG,gBAAgB,CACvC,EACD,WAAW,EACX,yBAAyB;CAAG;AAChC,QAAA,MAAM,iBAAiB,+FA+BtB,CAAC;AAIF,UAAU,sBACR,SAAQ,qBAAqB,CAAC,OAAO,sBAAsB,CAAC,IAAI,EAAE,YAAY,CAAC,EAC7E,WAAW;CAAG;AAClB,QAAA,MAAM,iBAAiB;2BA7D4B,OAAO,CAAC,KAAK;2CAkG9D,CAAC;AAGH,OAAO,EAAE,iBAAiB,IAAI,IAAI,EAAE,iBAAiB,IAAI,IAAI,EAAE,CAAC;AAChE,YAAY,EAAE,sBAAsB,IAAI,SAAS,EAAE,sBAAsB,IAAI,SAAS,EAAE,CAAC"}
+{"version":3,"file":"checkbox-cards.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox-cards.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAE5C,OAAO,KAAK,sBAAsB,MAAM,+BAA+B,CAAC;AAExE,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AAQtE,OAAO,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACzF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAc,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAoBxE,KAAK,yBAAyB,GAAG,eAAe,CAAC,OAAO,yBAAyB,CAAC,CAAC;AACnF,UAAU,sBACR,SAAQ,qBAAqB,CACzB,OAAO,sBAAsB,CAAC,IAAI,EAClC,SAAS,GAAG,OAAO,GAAG,gBAAgB,CACvC,EACD,WAAW,EACX,yBAAyB;CAAG;AAChC,QAAA,MAAM,iBAAiB,+FAgCtB,CAAC;AAIF,UAAU,sBACR,SAAQ,qBAAqB,CAAC,OAAO,sBAAsB,CAAC,IAAI,EAAE,YAAY,CAAC,EAC7E,WAAW;CAAG;AAClB,QAAA,MAAM,iBAAiB;2BA/D4B,OAAO,CAAC,KAAK;2CAoH9D,CAAC;AAGH,OAAO,EAAE,iBAAiB,IAAI,IAAI,EAAE,iBAAiB,IAAI,IAAI,EAAE,CAAC;AAChE,YAAY,EAAE,sBAAsB,IAAI,SAAS,EAAE,sBAAsB,IAAI,SAAS,EAAE,CAAC"}

package/dist/esm/components/checkbox-cards.js

@@ -1,2 +1,2 @@
-"use client";import*as o from"react";import n from"classnames";import{Context as l}from"radix-ui/internal";import*as i from"./checkbox-group.primitive.js";import{createCheckboxGroupScope as h}from"./checkbox-group.primitive.js";import{checkboxCardsRootPropDefs as u}from"./checkbox-cards.props.js";import{baseCheckboxPropDefs as R}from"./_internal/base-checkbox.props.js";import{Grid as y}from"./grid.js";import{ThickCheckIcon as I}from"./icons.js";import{extractProps as d}from"../helpers/extract-props.js";import{marginPropDefs as G}from"../props/margin.props.js";import{useThemeContext as g}from"./theme.js";const x="CheckboxCards",[v]=l.createContextScope(x,[h]),k=h(),[N,S]=v(x),b=o.forwardRef((e,s)=>{const a=g(),c=e.panelBackground??a.panelBackground,{__scopeCheckboxCards:r,className:p,color:t,panelBackground:C,...m}=d(e,u,G),f=k(r);return o.createElement(N,{scope:r,size:e.size,highContrast:e.highContrast},o.createElement(y,{asChild:!0},o.createElement(i.Root,{...f,"data-accent-color":t,"data-panel-background":c,...m,ref:s,className:n("rt-CheckboxCardsRoot",p)})))});b.displayName="CheckboxCards.Root";const P=o.forwardRef(({__scopeCheckboxCards:e,children:s,className:a,style:c,...r},p)=>{const t=S("CheckboxCardsItem",e),C=k(e),{className:m}=d({size:t?.size,variant:"solid",highContrast:t?.highContrast},R);return o.createElement("label",{className:n("rt-BaseCard","rt-CheckboxCardsItem",a),style:c},s,o.createElement(i.Item,{...C,...r,ref:p,className:n("rt-reset","rt-BaseCheckboxRoot","rt-CheckboxCardCheckbox",m)},o.createElement(i.Indicator,{...C,asChild:!0,className:"rt-BaseCheckboxIndicator"},o.createElement(I,null))))});P.displayName="CheckboxCards.Item";export{P as Item,b as Root};
+"use client";import*as e from"react";import m from"classnames";import{Context as u}from"radix-ui/internal";import*as h from"./checkbox-group.primitive.js";import{createCheckboxGroupScope as d}from"./checkbox-group.primitive.js";import{checkboxCardsRootPropDefs as R}from"./checkbox-cards.props.js";import{baseCheckboxPropDefs as v}from"./_internal/base-checkbox.props.js";import{Grid as y}from"./grid.js";import{ThickCheckIcon as I}from"./icons.js";import{extractProps as x}from"../helpers/extract-props.js";import{marginPropDefs as G}from"../props/margin.props.js";import{useThemeContext as g}from"./theme.js";const k="CheckboxCards",[N]=u.createContextScope(k,[d]),b=d(),[z,D]=N(k),f=e.forwardRef((r,s)=>{const a=g(),c=r.panelBackground??a.panelBackground,{__scopeCheckboxCards:t,className:p,color:o,panelBackground:C,...n}=x(r,R,G),i=b(t);return e.createElement(z,{scope:t,size:r.size,variant:r.variant,highContrast:r.highContrast},e.createElement(y,{asChild:!0},e.createElement(h.Root,{...i,"data-accent-color":o,"data-panel-background":c,...n,ref:s,className:m("rt-CheckboxCardsRoot",p)})))});f.displayName="CheckboxCards.Root";const P=e.forwardRef(({__scopeCheckboxCards:r,children:s,className:a,style:c,...t},p)=>{const o=D("CheckboxCardsItem",r),C=b(r),{className:n}=x({size:o?.size,variant:o?.variant||"solid",highContrast:o?.highContrast},v),i=o?.variant?`rt-variant-${o.variant}`:void 0,l=o?.size?`rt-r-size-${o.size}`:void 0;return e.createElement("label",{className:m("rt-BaseCard","rt-CheckboxCardsItem",i,l,a),style:c},s,e.createElement(h.Item,{...C,...t,ref:p,className:m("rt-reset","rt-BaseCheckboxRoot","rt-CheckboxCardCheckbox",n)},e.createElement(h.Indicator,{...C,asChild:!0,className:"rt-BaseCheckboxIndicator"},e.createElement(I,null))))});P.displayName="CheckboxCards.Item";export{P as Item,f as Root};
 //# sourceMappingURL=checkbox-cards.js.map

package/dist/esm/components/checkbox-cards.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/checkbox-cards.tsx"],
-  "sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { Context } from 'radix-ui/internal';\n\nimport * as CheckboxGroupPrimitive from './checkbox-group.primitive.js';\nimport { createCheckboxGroupScope } from './checkbox-group.primitive.js';\nimport { checkboxCardsRootPropDefs } from './checkbox-cards.props.js';\nimport { baseCheckboxPropDefs } from './_internal/base-checkbox.props.js';\nimport { Grid } from './grid.js';\nimport { ThickCheckIcon } from './icons.js';\nimport { extractProps } from '../helpers/extract-props.js';\nimport { marginPropDefs } from '../props/margin.props.js';\nimport { useThemeContext } from './theme.js';\n\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\nimport type { MarginProps } from '../props/margin.props.js';\nimport type { Responsive, GetPropDefTypes } from '../props/prop-def.js';\n\nconst CHECKBOX_CARD_GROUP_NAME = 'CheckboxCards';\n\ntype ScopedProps<P> = P & { __scopeCheckboxCards?: Context.Scope };\nconst [createCheckboxCardsContext] = Context.createContextScope(CHECKBOX_CARD_GROUP_NAME, [\n  createCheckboxGroupScope,\n]);\nconst useCheckboxGroupScope = createCheckboxGroupScope();\n\ntype CheckboxCardsContextValue = {\n  size?: Responsive<(typeof checkboxCardsRootPropDefs.size.values)[number]>;\n  highContrast?: boolean;\n};\n\nconst [CheckboxCardsProvider, useCheckboxCardsContext] =\n  createCheckboxCardsContext<CheckboxCardsContextValue>(CHECKBOX_CARD_GROUP_NAME);\n\ntype CheckboxCardsRootElement = React.ElementRef<typeof CheckboxGroupPrimitive.Root>;\ntype CheckboxCardsRootOwnProps = GetPropDefTypes<typeof checkboxCardsRootPropDefs>;\ninterface CheckboxCardsRootProps\n  extends ComponentPropsWithout<\n      typeof CheckboxGroupPrimitive.Root,\n      'asChild' | 'color' | 'defaultChecked'\n    >,\n    MarginProps,\n    CheckboxCardsRootOwnProps {}\nconst CheckboxCardsRoot = React.forwardRef<CheckboxCardsRootElement, CheckboxCardsRootProps>(\n  (props: ScopedProps<CheckboxCardsRootProps>, forwardedRef) => {\n    const themeContext = useThemeContext();\n    const panelBackground = props.panelBackground ?? themeContext.panelBackground;\n    const {\n      __scopeCheckboxCards,\n      className,\n      color,\n      panelBackground: _,\n      ...rootProps\n    } = extractProps(props, checkboxCardsRootPropDefs, marginPropDefs);\n    const checkboxGroupScope = useCheckboxGroupScope(__scopeCheckboxCards);\n    return (\n      <CheckboxCardsProvider\n        scope={__scopeCheckboxCards}\n        size={props.size}\n        highContrast={props.highContrast}\n      >\n        <Grid asChild>\n          <CheckboxGroupPrimitive.Root\n            {...checkboxGroupScope}\n            data-accent-color={color}\n            data-panel-background={panelBackground}\n            {...rootProps}\n            ref={forwardedRef}\n            className={classNames('rt-CheckboxCardsRoot', className)}\n          />\n        </Grid>\n      </CheckboxCardsProvider>\n    );\n  },\n);\nCheckboxCardsRoot.displayName = 'CheckboxCards.Root';\n\ntype CheckboxCardsItemElement = React.ElementRef<typeof CheckboxGroupPrimitive.Item>;\ninterface CheckboxCardsItemProps\n  extends ComponentPropsWithout<typeof CheckboxGroupPrimitive.Item, RemovedProps>,\n    MarginProps {}\nconst CheckboxCardsItem = React.forwardRef<\n  CheckboxCardsItemElement,\n  ScopedProps<CheckboxCardsItemProps>\n>(({ __scopeCheckboxCards, children, className, style, ...props }, forwardedRef) => {\n  const context = useCheckboxCardsContext('CheckboxCardsItem', __scopeCheckboxCards);\n  const checkboxGroupScope = useCheckboxGroupScope(__scopeCheckboxCards);\n\n  const { className: checkboxClassName } = extractProps(\n    // Pass size / highContrast values from the context and static variant to generate styles\n    { size: context?.size, variant: 'solid', highContrast: context?.highContrast },\n    // Pass size & variant prop defs to allow it to be extracted\n    baseCheckboxPropDefs,\n  );\n  return (\n    <label className={classNames('rt-BaseCard', 'rt-CheckboxCardsItem', className)} style={style}>\n      {children}\n      <CheckboxGroupPrimitive.Item\n        {...checkboxGroupScope}\n        {...props}\n        ref={forwardedRef}\n        className={classNames(\n          'rt-reset',\n          'rt-BaseCheckboxRoot',\n          'rt-CheckboxCardCheckbox',\n          checkboxClassName,\n        )}\n      >\n        <CheckboxGroupPrimitive.Indicator\n          {...checkboxGroupScope}\n          asChild\n          className=\"rt-BaseCheckboxIndicator\"\n        >\n          <ThickCheckIcon />\n        </CheckboxGroupPrimitive.Indicator>\n      </CheckboxGroupPrimitive.Item>\n    </label>\n  );\n});\nCheckboxCardsItem.displayName = 'CheckboxCards.Item';\n\nexport { CheckboxCardsRoot as Root, CheckboxCardsItem as Item };\nexport type { CheckboxCardsRootProps as RootProps, CheckboxCardsItemProps as ItemProps };\n"],
-  "mappings": "aAEA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aACvB,OAAS,WAAAC,MAAe,oBAExB,UAAYC,MAA4B,gCACxC,OAAS,4BAAAC,MAAgC,gCACzC,OAAS,6BAAAC,MAAiC,4BAC1C,OAAS,wBAAAC,MAA4B,qCACrC,OAAS,QAAAC,MAAY,YACrB,OAAS,kBAAAC,MAAsB,aAC/B,OAAS,gBAAAC,MAAoB,8BAC7B,OAAS,kBAAAC,MAAsB,2BAC/B,OAAS,mBAAAC,MAAuB,aAMhC,MAAMC,EAA2B,gBAG3B,CAACC,CAA0B,EAAIX,EAAQ,mBAAmBU,EAA0B,CACxFR,CACF,CAAC,EACKU,EAAwBV,EAAyB,EAOjD,CAACW,EAAuBC,CAAuB,EACnDH,EAAsDD,CAAwB,EAW1EK,EAAoBjB,EAAM,WAC9B,CAACkB,EAA4CC,IAAiB,CAC5D,MAAMC,EAAeT,EAAgB,EAC/BU,EAAkBH,EAAM,iBAAmBE,EAAa,gBACxD,CACJ,qBAAAE,EACA,UAAAC,EACA,MAAAC,EACA,gBAAiBC,EACjB,GAAGC,CACL,EAAIjB,EAAaS,EAAOb,EAA2BK,CAAc,EAC3DiB,EAAqBb,EAAsBQ,CAAoB,EACrE,OACEtB,EAAA,cAACe,EAAA,CACC,MAAOO,EACP,KAAMJ,EAAM,KACZ,aAAcA,EAAM,cAEpBlB,EAAA,cAACO,EAAA,CAAK,QAAO,IACXP,EAAA,cAACG,EAAuB,KAAvB,CACE,GAAGwB,EACJ,oBAAmBH,EACnB,wBAAuBH,EACtB,GAAGK,EACJ,IAAKP,EACL,UAAWlB,EAAW,uBAAwBsB,CAAS,EACzD,CACF,CACF,CAEJ,CACF,EACAN,EAAkB,YAAc,qBAMhC,MAAMW,EAAoB5B,EAAM,WAG9B,CAAC,CAAE,qBAAAsB,EAAsB,SAAAO,EAAU,UAAAN,EAAW,MAAAO,EAAO,GAAGZ,CAAM,EAAGC,IAAiB,CAClF,MAAMY,EAAUf,EAAwB,oBAAqBM,CAAoB,EAC3EK,EAAqBb,EAAsBQ,CAAoB,EAE/D,CAAE,UAAWU,CAAkB,EAAIvB,EAEvC,CAAE,KAAMsB,GAAS,KAAM,QAAS,QAAS,aAAcA,GAAS,YAAa,EAE7EzB,CACF,EACA,OACEN,EAAA,cAAC,SAAM,UAAWC,EAAW,cAAe,uBAAwBsB,CAAS,EAAG,MAAOO,GACpFD,EACD7B,EAAA,cAACG,EAAuB,KAAvB,CACE,GAAGwB,EACH,GAAGT,EACJ,IAAKC,EACL,UAAWlB,EACT,WACA,sBACA,0BACA+B,CACF,GAEAhC,EAAA,cAACG,EAAuB,UAAvB,CACE,GAAGwB,EACJ,QAAO,GACP,UAAU,4BAEV3B,EAAA,cAACQ,EAAA,IAAe,CAClB,CACF,CACF,CAEJ,CAAC,EACDoB,EAAkB,YAAc",
-  "names": ["React", "classNames", "Context", "CheckboxGroupPrimitive", "createCheckboxGroupScope", "checkboxCardsRootPropDefs", "baseCheckboxPropDefs", "Grid", "ThickCheckIcon", "extractProps", "marginPropDefs", "useThemeContext", "CHECKBOX_CARD_GROUP_NAME", "createCheckboxCardsContext", "useCheckboxGroupScope", "CheckboxCardsProvider", "useCheckboxCardsContext", "CheckboxCardsRoot", "props", "forwardedRef", "themeContext", "panelBackground", "__scopeCheckboxCards", "className", "color", "_", "rootProps", "checkboxGroupScope", "CheckboxCardsItem", "children", "style", "context", "checkboxClassName"]
+  "sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { Context } from 'radix-ui/internal';\n\nimport * as CheckboxGroupPrimitive from './checkbox-group.primitive.js';\nimport { createCheckboxGroupScope } from './checkbox-group.primitive.js';\nimport { checkboxCardsRootPropDefs } from './checkbox-cards.props.js';\nimport { baseCheckboxPropDefs } from './_internal/base-checkbox.props.js';\nimport { Grid } from './grid.js';\nimport { ThickCheckIcon } from './icons.js';\nimport { extractProps } from '../helpers/extract-props.js';\nimport { marginPropDefs } from '../props/margin.props.js';\nimport { useThemeContext } from './theme.js';\n\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\nimport type { MarginProps } from '../props/margin.props.js';\nimport type { Responsive, GetPropDefTypes } from '../props/prop-def.js';\n\nconst CHECKBOX_CARD_GROUP_NAME = 'CheckboxCards';\n\ntype ScopedProps<P> = P & { __scopeCheckboxCards?: Context.Scope };\nconst [createCheckboxCardsContext] = Context.createContextScope(CHECKBOX_CARD_GROUP_NAME, [\n  createCheckboxGroupScope,\n]);\nconst useCheckboxGroupScope = createCheckboxGroupScope();\n\ntype CheckboxCardsContextValue = {\n  size?: Responsive<(typeof checkboxCardsRootPropDefs.size.values)[number]>;\n  variant?: (typeof checkboxCardsRootPropDefs.variant.values)[number];\n  highContrast?: boolean;\n};\n\nconst [CheckboxCardsProvider, useCheckboxCardsContext] =\n  createCheckboxCardsContext<CheckboxCardsContextValue>(CHECKBOX_CARD_GROUP_NAME);\n\ntype CheckboxCardsRootElement = React.ElementRef<typeof CheckboxGroupPrimitive.Root>;\ntype CheckboxCardsRootOwnProps = GetPropDefTypes<typeof checkboxCardsRootPropDefs>;\ninterface CheckboxCardsRootProps\n  extends ComponentPropsWithout<\n      typeof CheckboxGroupPrimitive.Root,\n      'asChild' | 'color' | 'defaultChecked'\n    >,\n    MarginProps,\n    CheckboxCardsRootOwnProps {}\nconst CheckboxCardsRoot = React.forwardRef<CheckboxCardsRootElement, CheckboxCardsRootProps>(\n  (props: ScopedProps<CheckboxCardsRootProps>, forwardedRef) => {\n    const themeContext = useThemeContext();\n    const panelBackground = props.panelBackground ?? themeContext.panelBackground;\n    const {\n      __scopeCheckboxCards,\n      className,\n      color,\n      panelBackground: _,\n      ...rootProps\n    } = extractProps(props, checkboxCardsRootPropDefs, marginPropDefs);\n    const checkboxGroupScope = useCheckboxGroupScope(__scopeCheckboxCards);\n    return (\n      <CheckboxCardsProvider\n        scope={__scopeCheckboxCards}\n        size={props.size}\n        variant={props.variant}\n        highContrast={props.highContrast}\n      >\n        <Grid asChild>\n          <CheckboxGroupPrimitive.Root\n            {...checkboxGroupScope}\n            data-accent-color={color}\n            data-panel-background={panelBackground}\n            {...rootProps}\n            ref={forwardedRef}\n            className={classNames('rt-CheckboxCardsRoot', className)}\n          />\n        </Grid>\n      </CheckboxCardsProvider>\n    );\n  },\n);\nCheckboxCardsRoot.displayName = 'CheckboxCards.Root';\n\ntype CheckboxCardsItemElement = React.ElementRef<typeof CheckboxGroupPrimitive.Item>;\ninterface CheckboxCardsItemProps\n  extends ComponentPropsWithout<typeof CheckboxGroupPrimitive.Item, RemovedProps>,\n    MarginProps {}\nconst CheckboxCardsItem = React.forwardRef<\n  CheckboxCardsItemElement,\n  ScopedProps<CheckboxCardsItemProps>\n>(({ __scopeCheckboxCards, children, className, style, ...props }, forwardedRef) => {\n  const context = useCheckboxCardsContext('CheckboxCardsItem', __scopeCheckboxCards);\n  const checkboxGroupScope = useCheckboxGroupScope(__scopeCheckboxCards);\n\n  const { className: checkboxClassName } = extractProps(\n    // Pass size / highContrast values from the context and variant to generate styles\n    {\n      size: context?.size,\n      variant: context?.variant || 'solid',\n      highContrast: context?.highContrast,\n    },\n    // Pass size & variant prop defs to allow it to be extracted\n    baseCheckboxPropDefs,\n  );\n  const variantClass = context?.variant ? `rt-variant-${context.variant}` : undefined;\n  const sizeClass = context?.size ? `rt-r-size-${context.size}` : undefined;\n\n  return (\n    <label\n      className={classNames(\n        'rt-BaseCard',\n        'rt-CheckboxCardsItem',\n        variantClass,\n        sizeClass,\n        className,\n      )}\n      style={style}\n    >\n      {children}\n      <CheckboxGroupPrimitive.Item\n        {...checkboxGroupScope}\n        {...props}\n        ref={forwardedRef}\n        className={classNames(\n          'rt-reset',\n          'rt-BaseCheckboxRoot',\n          'rt-CheckboxCardCheckbox',\n          checkboxClassName,\n        )}\n      >\n        <CheckboxGroupPrimitive.Indicator\n          {...checkboxGroupScope}\n          asChild\n          className=\"rt-BaseCheckboxIndicator\"\n        >\n          <ThickCheckIcon />\n        </CheckboxGroupPrimitive.Indicator>\n      </CheckboxGroupPrimitive.Item>\n    </label>\n  );\n});\nCheckboxCardsItem.displayName = 'CheckboxCards.Item';\n\nexport { CheckboxCardsRoot as Root, CheckboxCardsItem as Item };\nexport type { CheckboxCardsRootProps as RootProps, CheckboxCardsItemProps as ItemProps };\n"],
+  "mappings": "aAEA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aACvB,OAAS,WAAAC,MAAe,oBAExB,UAAYC,MAA4B,gCACxC,OAAS,4BAAAC,MAAgC,gCACzC,OAAS,6BAAAC,MAAiC,4BAC1C,OAAS,wBAAAC,MAA4B,qCACrC,OAAS,QAAAC,MAAY,YACrB,OAAS,kBAAAC,MAAsB,aAC/B,OAAS,gBAAAC,MAAoB,8BAC7B,OAAS,kBAAAC,MAAsB,2BAC/B,OAAS,mBAAAC,MAAuB,aAMhC,MAAMC,EAA2B,gBAG3B,CAACC,CAA0B,EAAIX,EAAQ,mBAAmBU,EAA0B,CACxFR,CACF,CAAC,EACKU,EAAwBV,EAAyB,EAQjD,CAACW,EAAuBC,CAAuB,EACnDH,EAAsDD,CAAwB,EAW1EK,EAAoBjB,EAAM,WAC9B,CAACkB,EAA4CC,IAAiB,CAC5D,MAAMC,EAAeT,EAAgB,EAC/BU,EAAkBH,EAAM,iBAAmBE,EAAa,gBACxD,CACJ,qBAAAE,EACA,UAAAC,EACA,MAAAC,EACA,gBAAiBC,EACjB,GAAGC,CACL,EAAIjB,EAAaS,EAAOb,EAA2BK,CAAc,EAC3DiB,EAAqBb,EAAsBQ,CAAoB,EACrE,OACEtB,EAAA,cAACe,EAAA,CACC,MAAOO,EACP,KAAMJ,EAAM,KACZ,QAASA,EAAM,QACf,aAAcA,EAAM,cAEpBlB,EAAA,cAACO,EAAA,CAAK,QAAO,IACXP,EAAA,cAACG,EAAuB,KAAvB,CACE,GAAGwB,EACJ,oBAAmBH,EACnB,wBAAuBH,EACtB,GAAGK,EACJ,IAAKP,EACL,UAAWlB,EAAW,uBAAwBsB,CAAS,EACzD,CACF,CACF,CAEJ,CACF,EACAN,EAAkB,YAAc,qBAMhC,MAAMW,EAAoB5B,EAAM,WAG9B,CAAC,CAAE,qBAAAsB,EAAsB,SAAAO,EAAU,UAAAN,EAAW,MAAAO,EAAO,GAAGZ,CAAM,EAAGC,IAAiB,CAClF,MAAMY,EAAUf,EAAwB,oBAAqBM,CAAoB,EAC3EK,EAAqBb,EAAsBQ,CAAoB,EAE/D,CAAE,UAAWU,CAAkB,EAAIvB,EAEvC,CACE,KAAMsB,GAAS,KACf,QAASA,GAAS,SAAW,QAC7B,aAAcA,GAAS,YACzB,EAEAzB,CACF,EACM2B,EAAeF,GAAS,QAAU,cAAcA,EAAQ,OAAO,GAAK,OACpEG,EAAYH,GAAS,KAAO,aAAaA,EAAQ,IAAI,GAAK,OAEhE,OACE/B,EAAA,cAAC,SACC,UAAWC,EACT,cACA,uBACAgC,EACAC,EACAX,CACF,EACA,MAAOO,GAEND,EACD7B,EAAA,cAACG,EAAuB,KAAvB,CACE,GAAGwB,EACH,GAAGT,EACJ,IAAKC,EACL,UAAWlB,EACT,WACA,sBACA,0BACA+B,CACF,GAEAhC,EAAA,cAACG,EAAuB,UAAvB,CACE,GAAGwB,EACJ,QAAO,GACP,UAAU,4BAEV3B,EAAA,cAACQ,EAAA,IAAe,CAClB,CACF,CACF,CAEJ,CAAC,EACDoB,EAAkB,YAAc",
+  "names": ["React", "classNames", "Context", "CheckboxGroupPrimitive", "createCheckboxGroupScope", "checkboxCardsRootPropDefs", "baseCheckboxPropDefs", "Grid", "ThickCheckIcon", "extractProps", "marginPropDefs", "useThemeContext", "CHECKBOX_CARD_GROUP_NAME", "createCheckboxCardsContext", "useCheckboxGroupScope", "CheckboxCardsProvider", "useCheckboxCardsContext", "CheckboxCardsRoot", "props", "forwardedRef", "themeContext", "panelBackground", "__scopeCheckboxCards", "className", "color", "_", "rootProps", "checkboxGroupScope", "CheckboxCardsItem", "children", "style", "context", "checkboxClassName", "variantClass", "sizeClass"]
 }

package/dist/esm/components/checkbox-cards.props.d.ts

@@ -29,14 +29,14 @@ declare const checkboxCardsRootPropDefs: {
     size: {
         type: "enum";
         className: string;
-        values: readonly ["1", "2", "3"];
+        values: readonly ["1", "2", "3", "4", "5"];
         default: "2";
         responsive: true;
     };
     variant: {
         type: "enum";
         className: string;
-        values: readonly ["surface", "classic"];
+        values: readonly ["outline", "classic", "ghost", "soft", "surface"];
         default: "surface";
     };
     panelBackground: {

package/dist/esm/components/checkbox-cards.props.js

@@ -1,2 +1,2 @@
-import{asChildPropDef as r}from"../props/as-child.prop.js";import{colorPropDef as o}from"../props/color.prop.js";import{highContrastPropDef as s}from"../props/high-contrast.prop.js";import{gridPropDefs as e}from"./grid.props.js";const a=["1","2","3"],t=["surface","classic"],p=["solid","translucent"],n={...r,size:{type:"enum",className:"rt-r-size",values:a,default:"2",responsive:!0},variant:{type:"enum",className:"rt-variant",values:t,default:"surface"},panelBackground:{type:"enum",values:p,default:void 0},...o,...s,columns:{...e.columns,default:"repeat(auto-fit, minmax(200px, 1fr))"},gap:{...e.gap,default:"4"}};export{n as checkboxCardsRootPropDefs};
+import{asChildPropDef as o}from"../props/as-child.prop.js";import{colorPropDef as r}from"../props/color.prop.js";import{highContrastPropDef as s}from"../props/high-contrast.prop.js";import{gridPropDefs as e}from"./grid.props.js";const a=["1","2","3","4","5"],t=["outline","classic","ghost","soft","surface"],p=["solid","translucent"],n={...o,size:{type:"enum",className:"rt-r-size",values:a,default:"2",responsive:!0},variant:{type:"enum",className:"rt-variant",values:t,default:"surface"},panelBackground:{type:"enum",values:p,default:void 0},...r,...s,columns:{...e.columns,default:"repeat(auto-fit, minmax(200px, 1fr))"},gap:{...e.gap,default:"4"}};export{n as checkboxCardsRootPropDefs};
 //# sourceMappingURL=checkbox-cards.props.js.map