@choco-vanille/ui 1.1.2 → 1.2.0

package/dist/utils/createIconChildUtils.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),c=o=>{const r=e=>n.isValidElement(e)&&e.type===o;return{hasIconChild:e=>n.Children.toArray(e).some(r),extractIconChild:e=>{let t=null;const i=n.Children.toArray(e).filter(l=>r(l)&&t===null?(t=l,!1):!0);return{node:t,remaining:i}}}};exports.createIconChildUtils=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react"),c=o=>{const n=e=>r.isValidElement(e)&&e.type===o;return{hasIconChild:e=>r.Children.toArray(e).some(n),extractIconChild:e=>{let t=null;const i=r.Children.toArray(e).filter(l=>n(l)&&t===null?(t=l,!1):!0);return{node:t,remaining:i}}}};exports.createIconChildUtils=c;
 //# sourceMappingURL=createIconChildUtils.cjs.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@choco-vanille/ui",
-  "version": "1.1.2",
+  "version": "1.2.0",
   "description": "A React 19 UI kit built with Vanilla Extract and Base UI primitives.",
   "type": "module",
   "license": "MIT",
@@ -45,6 +45,8 @@
     "lint:fix": "eslint . --fix",
     "format": "prettier --write \"**/*.{ts,tsx,css,md,json}\"",
     "format:check": "prettier --check \"**/*.{ts,tsx,css,md,json}\"",
+    "audit:design-system": "node --experimental-strip-types scripts/audit/audit-design-system.ts",
+    "audit:design-system:check": "node --experimental-strip-types scripts/audit/audit-design-system.ts --strict",
     "typecheck": "tsc --noEmit",
     "build-storybook": "storybook build",
     "build:lib": "vite build",
@@ -72,6 +74,7 @@
     "@storybook/react-vite": "10.4.6",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.2",
+    "@testing-library/user-event": "^14.6.1",
     "@types/node": "^26.0.1",
     "@types/react": "19.2.17",
     "@types/react-dom": "19.2.3",
@@ -98,6 +101,7 @@
     "react-dom": "19.2.7",
     "remark-gfm": "4.0.1",
     "storybook": "10.4.6",
+    "ts-morph": "^28.0.0",
     "typescript": "6.0.3",
     "typescript-eslint": "8.62.0",
     "vite": "7.3.6",

package/dist/components/actions/toggle-button/ToggleButton.cjs

@@ -1,2 +0,0 @@
-"use strict";const e=require("react/jsx-runtime"),E=require("@base-ui/react/toggle"),N=require("./styles/ToggleButton.css.cjs"),r=require("../_shared/buttons/styles/buttonShared.css.cjs"),B=require("../_shared/buttons/constants/index.cjs"),c=require("../../foundation/icon/Icon.cjs");require("../../foundation/icon/styles/Icon.css.cjs");const O=require("../../foundation/typography/Typography.cjs");require("../../foundation/typography/styles/Typography.css.cjs");const m=require("./constants/toggleButtonSizes.const.cjs"),x=require("../../../utils/cn.cjs"),d=require("../_shared/buttons/constants/buttonSizes.const.cjs"),u=({variant:T,color:S,size:o=d.BUTTON_SIZES.md,radius:_,className:g,label:s,startIcon:t,endIcon:n,ref:q,...a})=>{const i=B.buttonSizeToIconSize[o],l=m.TOGGLE_BUTTON_SIZE_TO_FONT_SIZE[o];return e.jsxs(E.Toggle,{ref:q,className:x.cn(N.TOGGLE_BUTTON_STYLES.recipe({variant:T,color:S,size:o,radius:_}),g),...a,children:[t&&e.jsx(c,{icon:t,size:i,className:r.BUTTON_SHARED_STYLES.icon}),s&&e.jsx(O,{as:"span",fontSize:l,fontWeight:"medium",children:s}),n&&e.jsx(c,{icon:n,size:i,className:r.BUTTON_SHARED_STYLES.icon})]})};u.displayName="ToggleButton";module.exports=u;
-//# sourceMappingURL=ToggleButton.cjs.map

package/dist/components/actions/toggle-button/ToggleButton.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleButton.cjs","sources":["../../../../src/components/actions/toggle-button/ToggleButton.tsx"],"sourcesContent":["import { Toggle as BaseToggle } from '@base-ui/react/toggle'\r\n\r\nimport { TOGGLE_BUTTON_STYLES } from '@components/actions/toggle-button/styles/ToggleButton.css.ts'\r\nimport { BUTTON_SHARED_STYLES } from '@components/actions/_shared/buttons/styles/buttonShared.css.ts'\r\nimport { BUTTON_SIZES } from '@components/actions/_shared/buttons/constants'\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { Typography } from '@components/foundation/typography'\r\nimport type { ToggleButtonProps } from '@components/actions/toggle-button/types/ToggleButton.props.ts'\r\nimport { buttonSizeToIconSize, TOGGLE_BUTTON_SIZE_TO_FONT_SIZE } from '@components/actions/toggle-button/constants'\r\nimport { cn } from '@utils/cn.ts'\r\nimport type { FC } from 'react'\r\n\r\nconst ToggleButton: FC<ToggleButtonProps> = ({\r\n    variant,\r\n    color,\r\n    size = BUTTON_SIZES.md,\r\n    radius,\r\n    className,\r\n    label,\r\n    startIcon,\r\n    endIcon,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    const iconSize = buttonSizeToIconSize[size]\r\n    const fontSize = TOGGLE_BUTTON_SIZE_TO_FONT_SIZE[size]\r\n\r\n    return (\r\n        <BaseToggle\r\n            ref={ref}\r\n            className={cn(TOGGLE_BUTTON_STYLES.recipe({ variant, color, size, radius }), className)}\r\n            {...props}\r\n        >\r\n            {startIcon && (\r\n                <Icon\r\n                    icon={startIcon}\r\n                    size={iconSize}\r\n                    className={BUTTON_SHARED_STYLES.icon}\r\n                />\r\n            )}\r\n            {label && (\r\n                <Typography\r\n                    as={'span'}\r\n                    fontSize={fontSize}\r\n                    fontWeight={'medium'}\r\n                >\r\n                    {label}\r\n                </Typography>\r\n            )}\r\n            {endIcon && (\r\n                <Icon\r\n                    icon={endIcon}\r\n                    size={iconSize}\r\n                    className={BUTTON_SHARED_STYLES.icon}\r\n                />\r\n            )}\r\n        </BaseToggle>\r\n    )\r\n}\r\n\r\nToggleButton.displayName = 'ToggleButton'\r\n\r\nexport default ToggleButton\r\n"],"names":["ToggleButton","variant","color","size","BUTTON_SIZES","radius","className","label","startIcon","endIcon","ref","props","iconSize","buttonSizeToIconSize","fontSize","TOGGLE_BUTTON_SIZE_TO_FONT_SIZE","jsxs","BaseToggle","cn","TOGGLE_BUTTON_STYLES","jsx","Icon","BUTTON_SHARED_STYLES","Typography"],"mappings":"8mBAYMA,EAAsC,CAAC,CACzC,QAAAC,EACA,MAAAC,EACA,KAAAC,EAAOC,EAAAA,aAAa,GACpB,OAAAC,EACA,UAAAC,EACA,MAAAC,EACA,UAAAC,EACA,QAAAC,EACA,IAAAC,EACA,GAAGC,CACP,IAAM,CACF,MAAMC,EAAWC,EAAAA,qBAAqBV,CAAI,EACpCW,EAAWC,EAAAA,gCAAgCZ,CAAI,EAErD,OACIa,EAAAA,KAACC,EAAAA,OAAA,CACG,IAAAP,EACA,UAAWQ,EAAAA,GAAGC,uBAAqB,OAAO,CAAE,QAAAlB,EAAS,MAAAC,EAAO,KAAAC,EAAM,OAAAE,EAAQ,EAAGC,CAAS,EACrF,GAAGK,EAEH,SAAA,CAAAH,GACGY,EAAAA,IAACC,EAAA,CACG,KAAMb,EACN,KAAMI,EACN,UAAWU,EAAAA,qBAAqB,IAAA,CAAA,EAGvCf,GACGa,EAAAA,IAACG,EAAA,CACG,GAAI,OACJ,SAAAT,EACA,WAAY,SAEX,SAAAP,CAAA,CAAA,EAGRE,GACGW,EAAAA,IAACC,EAAA,CACG,KAAMZ,EACN,KAAMG,EACN,UAAWU,EAAAA,qBAAqB,IAAA,CAAA,CACpC,CAAA,CAAA,CAIhB,EAEAtB,EAAa,YAAc"}

package/dist/components/actions/toggle-button/ToggleButton.d.ts

@@ -1,4 +0,0 @@
-import { ToggleButtonProps } from './types/ToggleButton.props.ts';
-import { FC } from 'react';
-declare const ToggleButton: FC<ToggleButtonProps>;
-export default ToggleButton;

package/dist/components/actions/toggle-button/ToggleButton.js

@@ -1,66 +0,0 @@
-import { jsxs as N, jsx as m } from "react/jsx-runtime";
-import { Toggle as g } from "@base-ui/react/toggle";
-import { TOGGLE_BUTTON_STYLES as l } from "./styles/ToggleButton.css.js";
-import { BUTTON_SHARED_STYLES as e } from "../_shared/buttons/styles/buttonShared.css.js";
-import { buttonSizeToIconSize as E } from "../_shared/buttons/constants/index.js";
-import p from "../../foundation/icon/Icon.js";
-import "../../foundation/icon/styles/Icon.css.js";
-import O from "../../foundation/typography/Typography.js";
-import "../../foundation/typography/styles/Typography.css.js";
-import { TOGGLE_BUTTON_SIZE_TO_FONT_SIZE as u } from "./constants/toggleButtonSizes.const.js";
-import { cn as B } from "../../../utils/cn.js";
-import { BUTTON_SIZES as d } from "../_shared/buttons/constants/buttonSizes.const.js";
-const h = ({
-  variant: n,
-  color: c,
-  size: o = d.md,
-  radius: s,
-  className: f,
-  label: r,
-  startIcon: i,
-  endIcon: t,
-  ref: S,
-  ...a
-}) => {
-  const T = E[o], _ = u[o];
-  return /* @__PURE__ */ N(
-    g,
-    {
-      ref: S,
-      className: B(l.recipe({ variant: n, color: c, size: o, radius: s }), f),
-      ...a,
-      children: [
-        i && /* @__PURE__ */ m(
-          p,
-          {
-            icon: i,
-            size: T,
-            className: e.icon
-          }
-        ),
-        r && /* @__PURE__ */ m(
-          O,
-          {
-            as: "span",
-            fontSize: _,
-            fontWeight: "medium",
-            children: r
-          }
-        ),
-        t && /* @__PURE__ */ m(
-          p,
-          {
-            icon: t,
-            size: T,
-            className: e.icon
-          }
-        )
-      ]
-    }
-  );
-};
-h.displayName = "ToggleButton";
-export {
-  h as default
-};
-//# sourceMappingURL=ToggleButton.js.map

package/dist/components/actions/toggle-button/ToggleButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleButton.js","sources":["../../../../src/components/actions/toggle-button/ToggleButton.tsx"],"sourcesContent":["import { Toggle as BaseToggle } from '@base-ui/react/toggle'\r\n\r\nimport { TOGGLE_BUTTON_STYLES } from '@components/actions/toggle-button/styles/ToggleButton.css.ts'\r\nimport { BUTTON_SHARED_STYLES } from '@components/actions/_shared/buttons/styles/buttonShared.css.ts'\r\nimport { BUTTON_SIZES } from '@components/actions/_shared/buttons/constants'\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { Typography } from '@components/foundation/typography'\r\nimport type { ToggleButtonProps } from '@components/actions/toggle-button/types/ToggleButton.props.ts'\r\nimport { buttonSizeToIconSize, TOGGLE_BUTTON_SIZE_TO_FONT_SIZE } from '@components/actions/toggle-button/constants'\r\nimport { cn } from '@utils/cn.ts'\r\nimport type { FC } from 'react'\r\n\r\nconst ToggleButton: FC<ToggleButtonProps> = ({\r\n    variant,\r\n    color,\r\n    size = BUTTON_SIZES.md,\r\n    radius,\r\n    className,\r\n    label,\r\n    startIcon,\r\n    endIcon,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    const iconSize = buttonSizeToIconSize[size]\r\n    const fontSize = TOGGLE_BUTTON_SIZE_TO_FONT_SIZE[size]\r\n\r\n    return (\r\n        <BaseToggle\r\n            ref={ref}\r\n            className={cn(TOGGLE_BUTTON_STYLES.recipe({ variant, color, size, radius }), className)}\r\n            {...props}\r\n        >\r\n            {startIcon && (\r\n                <Icon\r\n                    icon={startIcon}\r\n                    size={iconSize}\r\n                    className={BUTTON_SHARED_STYLES.icon}\r\n                />\r\n            )}\r\n            {label && (\r\n                <Typography\r\n                    as={'span'}\r\n                    fontSize={fontSize}\r\n                    fontWeight={'medium'}\r\n                >\r\n                    {label}\r\n                </Typography>\r\n            )}\r\n            {endIcon && (\r\n                <Icon\r\n                    icon={endIcon}\r\n                    size={iconSize}\r\n                    className={BUTTON_SHARED_STYLES.icon}\r\n                />\r\n            )}\r\n        </BaseToggle>\r\n    )\r\n}\r\n\r\nToggleButton.displayName = 'ToggleButton'\r\n\r\nexport default ToggleButton\r\n"],"names":["ToggleButton","variant","color","size","BUTTON_SIZES","radius","className","label","startIcon","endIcon","ref","props","iconSize","buttonSizeToIconSize","fontSize","TOGGLE_BUTTON_SIZE_TO_FONT_SIZE","jsxs","BaseToggle","cn","TOGGLE_BUTTON_STYLES","jsx","Icon","BUTTON_SHARED_STYLES","Typography"],"mappings":";;;;;;;;;;;;AAYA,MAAMA,IAAsC,CAAC;AAAA,EACzC,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC,IAAOC,EAAa;AAAA,EACpB,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,KAAAC;AAAA,EACA,GAAGC;AACP,MAAM;AACF,QAAMC,IAAWC,EAAqBV,CAAI,GACpCW,IAAWC,EAAgCZ,CAAI;AAErD,SACI,gBAAAa;AAAA,IAACC;AAAAA,IAAA;AAAA,MACG,KAAAP;AAAA,MACA,WAAWQ,EAAGC,EAAqB,OAAO,EAAE,SAAAlB,GAAS,OAAAC,GAAO,MAAAC,GAAM,QAAAE,GAAQ,GAAGC,CAAS;AAAA,MACrF,GAAGK;AAAA,MAEH,UAAA;AAAA,QAAAH,KACG,gBAAAY;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,MAAMb;AAAA,YACN,MAAMI;AAAA,YACN,WAAWU,EAAqB;AAAA,UAAA;AAAA,QAAA;AAAA,QAGvCf,KACG,gBAAAa;AAAA,UAACG;AAAA,UAAA;AAAA,YACG,IAAI;AAAA,YACJ,UAAAT;AAAA,YACA,YAAY;AAAA,YAEX,UAAAP;AAAA,UAAA;AAAA,QAAA;AAAA,QAGRE,KACG,gBAAAW;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,MAAMZ;AAAA,YACN,MAAMG;AAAA,YACN,WAAWU,EAAqB;AAAA,UAAA;AAAA,QAAA;AAAA,MACpC;AAAA,IAAA;AAAA,EAAA;AAIhB;AAEAtB,EAAa,cAAc;"}

package/dist/components/actions/toggle-button/constants/index.d.ts

@@ -1,2 +0,0 @@
-export { buttonSizeToIconSize } from '../../_shared/buttons/constants';
-export { TOGGLE_BUTTON_SIZE_TO_FONT_SIZE } from './toggleButtonSizes.const.ts';

package/dist/components/actions/toggle-button/constants/toggleButtonSizes.const.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("../../_shared/buttons/constants/buttonSizes.const.cjs"),_={[T.BUTTON_SIZES.sm]:"sm",[T.BUTTON_SIZES.md]:"md",[T.BUTTON_SIZES.lg]:"lg"};exports.TOGGLE_BUTTON_SIZE_TO_FONT_SIZE=_;
-//# sourceMappingURL=toggleButtonSizes.const.cjs.map

package/dist/components/actions/toggle-button/constants/toggleButtonSizes.const.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"toggleButtonSizes.const.cjs","sources":["../../../../../src/components/actions/toggle-button/constants/toggleButtonSizes.const.ts"],"sourcesContent":["import type { ToggleButtonSize } from '@components/actions/toggle-button/types/ToggleButton.types.ts'\r\nimport { BUTTON_SIZES } from '@components/actions/_shared/buttons/constants'\r\nimport type { TypographySize } from '@components/foundation/typography'\r\n\r\nexport const TOGGLE_BUTTON_SIZE_TO_FONT_SIZE: Record<NonNullable<ToggleButtonSize>, TypographySize> = {\r\n    [BUTTON_SIZES.sm]: 'sm',\r\n    [BUTTON_SIZES.md]: 'md',\r\n    [BUTTON_SIZES.lg]: 'lg',\r\n}\r\n"],"names":["TOGGLE_BUTTON_SIZE_TO_FONT_SIZE","BUTTON_SIZES"],"mappings":"yJAIaA,EAAyF,CAClG,CAACC,EAAAA,aAAa,EAAE,EAAG,KACnB,CAACA,EAAAA,aAAa,EAAE,EAAG,KACnB,CAACA,EAAAA,aAAa,EAAE,EAAG,IACvB"}

package/dist/components/actions/toggle-button/constants/toggleButtonSizes.const.d.ts

@@ -1,3 +0,0 @@
-import { ToggleButtonSize } from '../types/ToggleButton.types.ts';
-import { TypographySize } from '../../../foundation/typography';
-export declare const TOGGLE_BUTTON_SIZE_TO_FONT_SIZE: Record<NonNullable<ToggleButtonSize>, TypographySize>;

package/dist/components/actions/toggle-button/constants/toggleButtonSizes.const.js

@@ -1,10 +0,0 @@
-import { BUTTON_SIZES as T } from "../../_shared/buttons/constants/buttonSizes.const.js";
-const _ = {
-  [T.sm]: "sm",
-  [T.md]: "md",
-  [T.lg]: "lg"
-};
-export {
-  _ as TOGGLE_BUTTON_SIZE_TO_FONT_SIZE
-};
-//# sourceMappingURL=toggleButtonSizes.const.js.map

package/dist/components/actions/toggle-button/constants/toggleButtonSizes.const.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"toggleButtonSizes.const.js","sources":["../../../../../src/components/actions/toggle-button/constants/toggleButtonSizes.const.ts"],"sourcesContent":["import type { ToggleButtonSize } from '@components/actions/toggle-button/types/ToggleButton.types.ts'\r\nimport { BUTTON_SIZES } from '@components/actions/_shared/buttons/constants'\r\nimport type { TypographySize } from '@components/foundation/typography'\r\n\r\nexport const TOGGLE_BUTTON_SIZE_TO_FONT_SIZE: Record<NonNullable<ToggleButtonSize>, TypographySize> = {\r\n    [BUTTON_SIZES.sm]: 'sm',\r\n    [BUTTON_SIZES.md]: 'md',\r\n    [BUTTON_SIZES.lg]: 'lg',\r\n}\r\n"],"names":["TOGGLE_BUTTON_SIZE_TO_FONT_SIZE","BUTTON_SIZES"],"mappings":";AAIO,MAAMA,IAAyF;AAAA,EAClG,CAACC,EAAa,EAAE,GAAG;AAAA,EACnB,CAACA,EAAa,EAAE,GAAG;AAAA,EACnB,CAACA,EAAa,EAAE,GAAG;AACvB;"}

package/dist/components/actions/toggle-button/index.d.ts

@@ -1,4 +0,0 @@
-export { default as ToggleButton } from './ToggleButton.tsx';
-export { TOGGLE_BUTTON_STYLES } from './styles/ToggleButton.css.ts';
-export type { ToggleButtonProps } from './types/ToggleButton.props.ts';
-export type { ToggleButtonColor, ToggleButtonSize, ToggleButtonRadius, ToggleButtonVariant } from './types/ToggleButton.types.ts';

package/dist/components/actions/toggle-button/styles/ToggleButton.css.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                              */;/* empty css                                                             */;/* empty css                                  */const d=require("@vanilla-extract/recipes/createRuntimeFn");var u={recipe:d.createRuntimeFn({defaultClassName:"u8dd4f0",variantClassNames:{variant:{outlined:"u8dd4f1",ghost:"u8dd4f2"},color:{primary:"u8dd4f3",secondary:"u8dd4f4",tertiary:"u8dd4f5",destructive:"u8dd4f6",success:"u8dd4f7",warning:"u8dd4f8",info:"u8dd4f9"},size:{sm:"u8dd4fa",md:"u8dd4fb",lg:"u8dd4fc"},radius:{none:"u8dd4fd",xs:"u8dd4fe",sm:"u8dd4ff",md:"u8dd4fg",lg:"u8dd4fh",xl:"u8dd4fi","2xl":"u8dd4fj",full:"u8dd4fk"}},defaultVariants:{variant:"outlined",color:"primary",size:"md",radius:"sm"},compoundVariants:[]})};exports.TOGGLE_BUTTON_STYLES=u;
-//# sourceMappingURL=ToggleButton.css.cjs.map

package/dist/components/actions/toggle-button/styles/ToggleButton.css.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleButton.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/actions/toggle-button/styles/ToggleButton.css.js

@@ -1,9 +0,0 @@
-/* empty css                                            */
-/* empty css                                                           */
-/* empty css                                */
-import { createRuntimeFn as d } from "@vanilla-extract/recipes/createRuntimeFn";
-var i = { recipe: d({ defaultClassName: "u8dd4f0", variantClassNames: { variant: { outlined: "u8dd4f1", ghost: "u8dd4f2" }, color: { primary: "u8dd4f3", secondary: "u8dd4f4", tertiary: "u8dd4f5", destructive: "u8dd4f6", success: "u8dd4f7", warning: "u8dd4f8", info: "u8dd4f9" }, size: { sm: "u8dd4fa", md: "u8dd4fb", lg: "u8dd4fc" }, radius: { none: "u8dd4fd", xs: "u8dd4fe", sm: "u8dd4ff", md: "u8dd4fg", lg: "u8dd4fh", xl: "u8dd4fi", "2xl": "u8dd4fj", full: "u8dd4fk" } }, defaultVariants: { variant: "outlined", color: "primary", size: "md", radius: "sm" }, compoundVariants: [] }) };
-export {
-  i as TOGGLE_BUTTON_STYLES
-};
-//# sourceMappingURL=ToggleButton.css.js.map

package/dist/components/actions/toggle-button/styles/ToggleButton.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleButton.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/components/actions/toggle-button/types/ToggleButton.props.d.ts

@@ -1,13 +0,0 @@
-import { Toggle } from '@base-ui/react/toggle';
-import { ToggleButtonRecipeVariants } from '../styles/ToggleButton.css.ts';
-import type * as React from 'react';
-export type ToggleButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'color'> & ToggleButtonRecipeVariants & Pick<Toggle.Props, 'pressed' | 'defaultPressed' | 'onPressedChange' | 'value' | 'disabled'> & {
-    /** Ref forwarded to the underlying `<button>` element. */
-    ref?: React.Ref<HTMLButtonElement>;
-    /** The text content rendered inside the toggle button. */
-    label?: string;
-    /** Iconify icon name rendered before the label. Size and color are derived from the toggle button state and size. */
-    startIcon?: string;
-    /** Iconify icon name rendered after the label. Size and color are derived from the toggle button state and size. */
-    endIcon?: string;
-};

package/dist/components/actions/toggle-button/types/ToggleButton.types.d.ts

@@ -1,10 +0,0 @@
-import { ButtonColorShared, ButtonSizeShared } from '../../_shared/buttons/types';
-import { Radius } from '../../../../theme/tokens/radii.ts';
-/** Color variants for the ToggleButton component, mapped to theme colors. */
-export type ToggleButtonColor = ButtonColorShared;
-/** Size variants for the ToggleButton component. */
-export type ToggleButtonSize = ButtonSizeShared;
-/** Border radius variants for the ToggleButton component. */
-export type ToggleButtonRadius = keyof Radius;
-/** Visual style variants for the ToggleButton component. */
-export type ToggleButtonVariant = 'ghost' | 'outlined';

package/dist/components/actions/toggle-button-group/ToggleButtonGroup.cjs

@@ -1,2 +0,0 @@
-"use strict";const _=require("react/jsx-runtime"),I=require("react"),b=require("@base-ui/react/toggle-group"),j=require("./components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.cjs"),B=require("./components/toggle-button-group-item/ToggleButtonGroupItem.cjs"),h=require("./styles/ToggleButtonGroup.css.cjs"),S=require("../../../theme/contract.css.cjs"),y=require("../../../utils/cn.cjs");function N(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(o,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return o.default=e,Object.freeze(o)}const R=N(I),n=(({className:e,orientation:o="horizontal",backgroundColor:t,bordered:r=!0,requireSelection:a=!0,style:s,value:c,defaultValue:i,onValueChange:g,children:p,ref:f,...m})=>{const[T,G]=R.useState(i??c??[]),l=c!==void 0,d=l?c:T,q=(u,O)=>{a&&u.length===0||(l||G(u),g?.(u,O))};return _.jsx(b.ToggleGroup,{ref:f,className:y.cn(h.TOGGLE_BUTTON_GROUP_STYLES.recipe({orientation:o,bordered:r}),e),orientation:o,value:d,onValueChange:q,style:t?{...s,backgroundColor:S.vars.color[t]}:s,...m,children:p})});n.displayName="ToggleButtonGroup";n.Item=B;n.IconItem=j;module.exports=n;
-//# sourceMappingURL=ToggleButtonGroup.cjs.map

package/dist/components/actions/toggle-button-group/ToggleButtonGroup.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleButtonGroup.cjs","sources":["../../../../src/components/actions/toggle-button-group/ToggleButtonGroup.tsx"],"sourcesContent":["import * as React from 'react'\r\n\r\nimport {\r\n    ToggleGroup as BaseToggleGroup,\r\n    type ToggleGroup,\r\n} from '@base-ui/react/toggle-group'\r\n\r\nimport ToggleButtonGroupIconItem from '@components/actions/toggle-button-group/components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.tsx'\r\nimport ToggleButtonGroupItem from '@components/actions/toggle-button-group/components/toggle-button-group-item/ToggleButtonGroupItem.tsx'\r\nimport { TOGGLE_BUTTON_GROUP_STYLES } from '@components/actions/toggle-button-group/styles/ToggleButtonGroup.css.ts'\r\nimport type { ToggleButtonGroupCompound } from '@components/actions/toggle-button-group/types/ToggleButtonGroupCompound.ts'\r\nimport { vars } from '@theme/contract.css.ts'\r\nimport { cn } from '@utils/cn.ts'\r\n\r\n/**\r\n * A group of toggle buttons where one or many buttons can be pressed at a time.\r\n * Built on top of `@base-ui/react/toggle-group`.\r\n *\r\n * Use `ToggleButtonGroup.Item` for labelled options or `ToggleButtonGroup.IconItem`\r\n * for icon-only options so the styling is cohesive with the group container.\r\n *\r\n * @example\r\n * ```tsx\r\n * <ToggleButtonGroup value={value} onValueChange={setValue}>\r\n *   <ToggleButtonGroup.Item value=\"bold\" label=\"Bold\" />\r\n *   <ToggleButtonGroup.Item value=\"italic\" label=\"Italic\" />\r\n * </ToggleButtonGroup>\r\n * ```\r\n */\r\nconst ToggleButtonGroup = (({\r\n    className,\r\n    orientation = 'horizontal',\r\n    backgroundColor,\r\n    bordered = true,\r\n    requireSelection = true,\r\n    style,\r\n    value,\r\n    defaultValue,\r\n    onValueChange,\r\n    children,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    const [internalValue, setInternalValue] = React.useState<readonly string[]>(\r\n        defaultValue ?? value ?? [],\r\n    )\r\n    const isControlled = value !== undefined\r\n    const currentValue = isControlled ? value : internalValue\r\n\r\n    const handleValueChange = (\r\n        newValue: string[],\r\n        eventDetails: ToggleGroup.ChangeEventDetails,\r\n    ) => {\r\n        if (requireSelection && newValue.length === 0) {\r\n            return\r\n        }\r\n        if (!isControlled) {\r\n            setInternalValue(newValue)\r\n        }\r\n        onValueChange?.(newValue, eventDetails)\r\n    }\r\n\r\n    return (\r\n        <BaseToggleGroup\r\n            ref={ref}\r\n            className={cn(\r\n                TOGGLE_BUTTON_GROUP_STYLES.recipe({ orientation, bordered }),\r\n                className,\r\n            )}\r\n            orientation={orientation}\r\n            value={currentValue}\r\n            onValueChange={handleValueChange}\r\n            style={\r\n                backgroundColor\r\n                    ? { ...style, backgroundColor: vars.color[backgroundColor] }\r\n                    : style\r\n            }\r\n            {...props}\r\n        >\r\n            {children}\r\n        </BaseToggleGroup>\r\n    )\r\n}) as ToggleButtonGroupCompound\r\n\r\nToggleButtonGroup.displayName = 'ToggleButtonGroup'\r\nToggleButtonGroup.Item = ToggleButtonGroupItem\r\nToggleButtonGroup.IconItem = ToggleButtonGroupIconItem\r\n\r\nexport default ToggleButtonGroup\r\n"],"names":["ToggleButtonGroup","className","orientation","backgroundColor","bordered","requireSelection","style","value","defaultValue","onValueChange","children","ref","props","internalValue","setInternalValue","React","isControlled","currentValue","handleValueChange","newValue","eventDetails","jsx","BaseToggleGroup","cn","TOGGLE_BUTTON_GROUP_STYLES","vars","ToggleButtonGroupItem","ToggleButtonGroupIconItem"],"mappings":"2qBA6BMA,GAAqB,CAAC,CACxB,UAAAC,EACA,YAAAC,EAAc,aACd,gBAAAC,EACA,SAAAC,EAAW,GACX,iBAAAC,EAAmB,GACnB,MAAAC,EACA,MAAAC,EACA,aAAAC,EACA,cAAAC,EACA,SAAAC,EACA,IAAAC,EACA,GAAGC,CACP,IAAM,CACF,KAAM,CAACC,EAAeC,CAAgB,EAAIC,EAAM,SAC5CP,GAAgBD,GAAS,CAAA,CAAC,EAExBS,EAAeT,IAAU,OACzBU,EAAeD,EAAeT,EAAQM,EAEtCK,EAAoB,CACtBC,EACAC,IACC,CACGf,GAAoBc,EAAS,SAAW,IAGvCH,GACDF,EAAiBK,CAAQ,EAE7BV,IAAgBU,EAAUC,CAAY,EAC1C,EAEA,OACIC,EAAAA,IAACC,EAAAA,YAAA,CACG,IAAAX,EACA,UAAWY,EAAAA,GACPC,EAAAA,2BAA2B,OAAO,CAAE,YAAAtB,EAAa,SAAAE,EAAU,EAC3DH,CAAA,EAEJ,YAAAC,EACA,MAAOe,EACP,cAAeC,EACf,MACIf,EACM,CAAE,GAAGG,EAAO,gBAAiBmB,EAAAA,KAAK,MAAMtB,CAAe,CAAA,EACvDG,EAET,GAAGM,EAEH,SAAAF,CAAA,CAAA,CAGb,GAEAV,EAAkB,YAAc,oBAChCA,EAAkB,KAAO0B,EACzB1B,EAAkB,SAAW2B"}

package/dist/components/actions/toggle-button-group/ToggleButtonGroup.d.ts

@@ -1,18 +0,0 @@
-import { ToggleButtonGroupCompound } from './types/ToggleButtonGroupCompound.ts';
-/**
- * A group of toggle buttons where one or many buttons can be pressed at a time.
- * Built on top of `@base-ui/react/toggle-group`.
- *
- * Use `ToggleButtonGroup.Item` for labelled options or `ToggleButtonGroup.IconItem`
- * for icon-only options so the styling is cohesive with the group container.
- *
- * @example
- * ```tsx
- * <ToggleButtonGroup value={value} onValueChange={setValue}>
- *   <ToggleButtonGroup.Item value="bold" label="Bold" />
- *   <ToggleButtonGroup.Item value="italic" label="Italic" />
- * </ToggleButtonGroup>
- * ```
- */
-declare const ToggleButtonGroup: ToggleButtonGroupCompound;
-export default ToggleButtonGroup;

package/dist/components/actions/toggle-button-group/ToggleButtonGroup.js

@@ -1,51 +0,0 @@
-import { jsx as B } from "react/jsx-runtime";
-import * as C from "react";
-import { ToggleGroup as N } from "@base-ui/react/toggle-group";
-import O from "./components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.js";
-import S from "./components/toggle-button-group-item/ToggleButtonGroupItem.js";
-import { TOGGLE_BUTTON_GROUP_STYLES as V } from "./styles/ToggleButtonGroup.css.js";
-import { vars as _ } from "../../../theme/contract.css.js";
-import { cn as x } from "../../../utils/cn.js";
-const r = (({
-  className: u,
-  orientation: e = "horizontal",
-  backgroundColor: m,
-  bordered: a = !0,
-  requireSelection: p = !0,
-  style: n,
-  value: o,
-  defaultValue: s,
-  onValueChange: i,
-  children: c,
-  ref: g,
-  ...f
-}) => {
-  const [T, G] = C.useState(
-    s ?? o ?? []
-  ), l = o !== void 0, I = l ? o : T, d = (t, h) => {
-    p && t.length === 0 || (l || G(t), i?.(t, h));
-  };
-  return /* @__PURE__ */ B(
-    N,
-    {
-      ref: g,
-      className: x(
-        V.recipe({ orientation: e, bordered: a }),
-        u
-      ),
-      orientation: e,
-      value: I,
-      onValueChange: d,
-      style: m ? { ...n, backgroundColor: _.color[m] } : n,
-      ...f,
-      children: c
-    }
-  );
-});
-r.displayName = "ToggleButtonGroup";
-r.Item = S;
-r.IconItem = O;
-export {
-  r as default
-};
-//# sourceMappingURL=ToggleButtonGroup.js.map

package/dist/components/actions/toggle-button-group/ToggleButtonGroup.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleButtonGroup.js","sources":["../../../../src/components/actions/toggle-button-group/ToggleButtonGroup.tsx"],"sourcesContent":["import * as React from 'react'\r\n\r\nimport {\r\n    ToggleGroup as BaseToggleGroup,\r\n    type ToggleGroup,\r\n} from '@base-ui/react/toggle-group'\r\n\r\nimport ToggleButtonGroupIconItem from '@components/actions/toggle-button-group/components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.tsx'\r\nimport ToggleButtonGroupItem from '@components/actions/toggle-button-group/components/toggle-button-group-item/ToggleButtonGroupItem.tsx'\r\nimport { TOGGLE_BUTTON_GROUP_STYLES } from '@components/actions/toggle-button-group/styles/ToggleButtonGroup.css.ts'\r\nimport type { ToggleButtonGroupCompound } from '@components/actions/toggle-button-group/types/ToggleButtonGroupCompound.ts'\r\nimport { vars } from '@theme/contract.css.ts'\r\nimport { cn } from '@utils/cn.ts'\r\n\r\n/**\r\n * A group of toggle buttons where one or many buttons can be pressed at a time.\r\n * Built on top of `@base-ui/react/toggle-group`.\r\n *\r\n * Use `ToggleButtonGroup.Item` for labelled options or `ToggleButtonGroup.IconItem`\r\n * for icon-only options so the styling is cohesive with the group container.\r\n *\r\n * @example\r\n * ```tsx\r\n * <ToggleButtonGroup value={value} onValueChange={setValue}>\r\n *   <ToggleButtonGroup.Item value=\"bold\" label=\"Bold\" />\r\n *   <ToggleButtonGroup.Item value=\"italic\" label=\"Italic\" />\r\n * </ToggleButtonGroup>\r\n * ```\r\n */\r\nconst ToggleButtonGroup = (({\r\n    className,\r\n    orientation = 'horizontal',\r\n    backgroundColor,\r\n    bordered = true,\r\n    requireSelection = true,\r\n    style,\r\n    value,\r\n    defaultValue,\r\n    onValueChange,\r\n    children,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    const [internalValue, setInternalValue] = React.useState<readonly string[]>(\r\n        defaultValue ?? value ?? [],\r\n    )\r\n    const isControlled = value !== undefined\r\n    const currentValue = isControlled ? value : internalValue\r\n\r\n    const handleValueChange = (\r\n        newValue: string[],\r\n        eventDetails: ToggleGroup.ChangeEventDetails,\r\n    ) => {\r\n        if (requireSelection && newValue.length === 0) {\r\n            return\r\n        }\r\n        if (!isControlled) {\r\n            setInternalValue(newValue)\r\n        }\r\n        onValueChange?.(newValue, eventDetails)\r\n    }\r\n\r\n    return (\r\n        <BaseToggleGroup\r\n            ref={ref}\r\n            className={cn(\r\n                TOGGLE_BUTTON_GROUP_STYLES.recipe({ orientation, bordered }),\r\n                className,\r\n            )}\r\n            orientation={orientation}\r\n            value={currentValue}\r\n            onValueChange={handleValueChange}\r\n            style={\r\n                backgroundColor\r\n                    ? { ...style, backgroundColor: vars.color[backgroundColor] }\r\n                    : style\r\n            }\r\n            {...props}\r\n        >\r\n            {children}\r\n        </BaseToggleGroup>\r\n    )\r\n}) as ToggleButtonGroupCompound\r\n\r\nToggleButtonGroup.displayName = 'ToggleButtonGroup'\r\nToggleButtonGroup.Item = ToggleButtonGroupItem\r\nToggleButtonGroup.IconItem = ToggleButtonGroupIconItem\r\n\r\nexport default ToggleButtonGroup\r\n"],"names":["ToggleButtonGroup","className","orientation","backgroundColor","bordered","requireSelection","style","value","defaultValue","onValueChange","children","ref","props","internalValue","setInternalValue","React","isControlled","currentValue","handleValueChange","newValue","eventDetails","jsx","BaseToggleGroup","cn","TOGGLE_BUTTON_GROUP_STYLES","vars","ToggleButtonGroupItem","ToggleButtonGroupIconItem"],"mappings":";;;;;;;;AA6BA,MAAMA,KAAqB,CAAC;AAAA,EACxB,WAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,iBAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,kBAAAC,IAAmB;AAAA,EACnB,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,KAAAC;AAAA,EACA,GAAGC;AACP,MAAM;AACF,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAM;AAAA,IAC5CP,KAAgBD,KAAS,CAAA;AAAA,EAAC,GAExBS,IAAeT,MAAU,QACzBU,IAAeD,IAAeT,IAAQM,GAEtCK,IAAoB,CACtBC,GACAC,MACC;AACD,IAAIf,KAAoBc,EAAS,WAAW,MAGvCH,KACDF,EAAiBK,CAAQ,GAE7BV,IAAgBU,GAAUC,CAAY;AAAA,EAC1C;AAEA,SACI,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACG,KAAAX;AAAA,MACA,WAAWY;AAAA,QACPC,EAA2B,OAAO,EAAE,aAAAtB,GAAa,UAAAE,GAAU;AAAA,QAC3DH;AAAA,MAAA;AAAA,MAEJ,aAAAC;AAAA,MACA,OAAOe;AAAA,MACP,eAAeC;AAAA,MACf,OACIf,IACM,EAAE,GAAGG,GAAO,iBAAiBmB,EAAK,MAAMtB,CAAe,EAAA,IACvDG;AAAA,MAET,GAAGM;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGb;AAEAV,EAAkB,cAAc;AAChCA,EAAkB,OAAO0B;AACzB1B,EAAkB,WAAW2B;"}

package/dist/components/actions/toggle-button-group/components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.cjs

@@ -1,2 +0,0 @@
-"use strict";const o=require("react/jsx-runtime"),S=require("@base-ui/react/toggle"),I=require("../../../_shared/buttons/constants/index.cjs"),_=require("../../../_shared/buttons/styles/buttonShared.css.cjs"),g=require("./styles/ToggleButtonGroupIconItem.css.cjs"),l=require("../../../../foundation/icon/Icon.cjs");require("../../../../foundation/icon/styles/Icon.css.cjs");const q=require("../../../../../utils/cn.cjs"),m=require("../../../_shared/buttons/constants/buttonSizes.const.cjs"),t=({color:n,size:e=m.BUTTON_SIZES.md,radius:r,className:c,icon:s,ref:i,...u})=>{const T=I.buttonSizeToIconSize[e];return o.jsx(S.Toggle,{ref:i,className:q.cn(g.TOGGLE_BUTTON_GROUP_ICON_ITEM_STYLES.recipe({color:n,size:e,radius:r}),c),...u,children:o.jsx(l,{icon:s,size:T,className:_.BUTTON_SHARED_STYLES.icon})})};t.displayName="ToggleButtonGroup.IconItem";module.exports=t;
-//# sourceMappingURL=ToggleButtonGroupIconItem.cjs.map

package/dist/components/actions/toggle-button-group/components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleButtonGroupIconItem.cjs","sources":["../../../../../../src/components/actions/toggle-button-group/components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.tsx"],"sourcesContent":["import { Toggle as BaseToggle } from '@base-ui/react/toggle'\r\n\r\nimport { BUTTON_SIZES } from '@components/actions/_shared/buttons/constants'\r\nimport { BUTTON_SHARED_STYLES } from '@components/actions/_shared/buttons/styles/buttonShared.css.ts'\r\nimport { buttonSizeToIconSize } from '@components/actions/toggle-button/constants'\r\nimport { TOGGLE_BUTTON_GROUP_ICON_ITEM_STYLES } from '@components/actions/toggle-button-group/components/toggle-button-group-icon-item/styles/ToggleButtonGroupIconItem.css.ts'\r\nimport type { ToggleButtonGroupIconItemProps } from '@components/actions/toggle-button-group/components/toggle-button-group-icon-item/types/ToggleButtonGroupIconItem.props.ts'\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { cn } from '@utils/cn.ts'\r\nimport type { FC } from 'react'\r\n\r\n/**\r\n * A single icon-only toggle button inside a `ToggleButtonGroup`.\r\n * Renders a square button whose visual style is designed to sit inside the group\r\n * rather than to be used on its own.\r\n *\r\n * @example\r\n * ```tsx\r\n * <ToggleButtonGroup value={value} onValueChange={setValue}>\r\n *   <ToggleButtonGroup.IconItem value=\"bold\" icon=\"lucide:bold\" aria-label=\"Bold\" />\r\n *   <ToggleButtonGroup.IconItem value=\"italic\" icon=\"lucide:italic\" aria-label=\"Italic\" />\r\n * </ToggleButtonGroup>\r\n * ```\r\n */\r\nconst ToggleButtonGroupIconItem: FC<ToggleButtonGroupIconItemProps> = ({\r\n    color,\r\n    size = BUTTON_SIZES.md,\r\n    radius,\r\n    className,\r\n    icon,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    const iconSize = buttonSizeToIconSize[size]\r\n\r\n    return (\r\n        <BaseToggle\r\n            ref={ref}\r\n            className={cn(\r\n                TOGGLE_BUTTON_GROUP_ICON_ITEM_STYLES.recipe({ color, size, radius }),\r\n                className,\r\n            )}\r\n            {...props}\r\n        >\r\n            <Icon\r\n                icon={icon}\r\n                size={iconSize}\r\n                className={BUTTON_SHARED_STYLES.icon}\r\n            />\r\n        </BaseToggle>\r\n    )\r\n}\r\n\r\nToggleButtonGroupIconItem.displayName = 'ToggleButtonGroup.IconItem'\r\n\r\nexport default ToggleButtonGroupIconItem\r\n"],"names":["ToggleButtonGroupIconItem","color","size","BUTTON_SIZES","radius","className","icon","ref","props","iconSize","buttonSizeToIconSize","jsx","BaseToggle","cn","TOGGLE_BUTTON_GROUP_ICON_ITEM_STYLES","Icon","BUTTON_SHARED_STYLES"],"mappings":"2eAwBMA,EAAgE,CAAC,CACnE,MAAAC,EACA,KAAAC,EAAOC,EAAAA,aAAa,GACpB,OAAAC,EACA,UAAAC,EACA,KAAAC,EACA,IAAAC,EACA,GAAGC,CACP,IAAM,CACF,MAAMC,EAAWC,EAAAA,qBAAqBR,CAAI,EAE1C,OACIS,EAAAA,IAACC,EAAAA,OAAA,CACG,IAAAL,EACA,UAAWM,EAAAA,GACPC,EAAAA,qCAAqC,OAAO,CAAE,MAAAb,EAAO,KAAAC,EAAM,OAAAE,EAAQ,EACnEC,CAAA,EAEH,GAAGG,EAEJ,SAAAG,EAAAA,IAACI,EAAA,CACG,KAAAT,EACA,KAAMG,EACN,UAAWO,EAAAA,qBAAqB,IAAA,CAAA,CACpC,CAAA,CAGZ,EAEAhB,EAA0B,YAAc"}

package/dist/components/actions/toggle-button-group/components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.d.ts

@@ -1,17 +0,0 @@
-import { ToggleButtonGroupIconItemProps } from './types/ToggleButtonGroupIconItem.props.ts';
-import { FC } from 'react';
-/**
- * A single icon-only toggle button inside a `ToggleButtonGroup`.
- * Renders a square button whose visual style is designed to sit inside the group
- * rather than to be used on its own.
- *
- * @example
- * ```tsx
- * <ToggleButtonGroup value={value} onValueChange={setValue}>
- *   <ToggleButtonGroup.IconItem value="bold" icon="lucide:bold" aria-label="Bold" />
- *   <ToggleButtonGroup.IconItem value="italic" icon="lucide:italic" aria-label="Italic" />
- * </ToggleButtonGroup>
- * ```
- */
-declare const ToggleButtonGroupIconItem: FC<ToggleButtonGroupIconItemProps>;
-export default ToggleButtonGroupIconItem;

package/dist/components/actions/toggle-button-group/components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.js

@@ -1,44 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { Toggle as c } from "@base-ui/react/toggle";
-import { buttonSizeToIconSize as S } from "../../../_shared/buttons/constants/index.js";
-import { BUTTON_SHARED_STYLES as f } from "../../../_shared/buttons/styles/buttonShared.css.js";
-import { TOGGLE_BUTTON_GROUP_ICON_ITEM_STYLES as s } from "./styles/ToggleButtonGroupIconItem.css.js";
-import I from "../../../../foundation/icon/Icon.js";
-import "../../../../foundation/icon/styles/Icon.css.js";
-import { cn as a } from "../../../../../utils/cn.js";
-import { BUTTON_SIZES as l } from "../../../_shared/buttons/constants/buttonSizes.const.js";
-const _ = ({
-  color: m,
-  size: o = l.md,
-  radius: t,
-  className: e,
-  icon: i,
-  ref: n,
-  ...p
-}) => {
-  const T = S[o];
-  return /* @__PURE__ */ r(
-    c,
-    {
-      ref: n,
-      className: a(
-        s.recipe({ color: m, size: o, radius: t }),
-        e
-      ),
-      ...p,
-      children: /* @__PURE__ */ r(
-        I,
-        {
-          icon: i,
-          size: T,
-          className: f.icon
-        }
-      )
-    }
-  );
-};
-_.displayName = "ToggleButtonGroup.IconItem";
-export {
-  _ as default
-};
-//# sourceMappingURL=ToggleButtonGroupIconItem.js.map

package/dist/components/actions/toggle-button-group/components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleButtonGroupIconItem.js","sources":["../../../../../../src/components/actions/toggle-button-group/components/toggle-button-group-icon-item/ToggleButtonGroupIconItem.tsx"],"sourcesContent":["import { Toggle as BaseToggle } from '@base-ui/react/toggle'\r\n\r\nimport { BUTTON_SIZES } from '@components/actions/_shared/buttons/constants'\r\nimport { BUTTON_SHARED_STYLES } from '@components/actions/_shared/buttons/styles/buttonShared.css.ts'\r\nimport { buttonSizeToIconSize } from '@components/actions/toggle-button/constants'\r\nimport { TOGGLE_BUTTON_GROUP_ICON_ITEM_STYLES } from '@components/actions/toggle-button-group/components/toggle-button-group-icon-item/styles/ToggleButtonGroupIconItem.css.ts'\r\nimport type { ToggleButtonGroupIconItemProps } from '@components/actions/toggle-button-group/components/toggle-button-group-icon-item/types/ToggleButtonGroupIconItem.props.ts'\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { cn } from '@utils/cn.ts'\r\nimport type { FC } from 'react'\r\n\r\n/**\r\n * A single icon-only toggle button inside a `ToggleButtonGroup`.\r\n * Renders a square button whose visual style is designed to sit inside the group\r\n * rather than to be used on its own.\r\n *\r\n * @example\r\n * ```tsx\r\n * <ToggleButtonGroup value={value} onValueChange={setValue}>\r\n *   <ToggleButtonGroup.IconItem value=\"bold\" icon=\"lucide:bold\" aria-label=\"Bold\" />\r\n *   <ToggleButtonGroup.IconItem value=\"italic\" icon=\"lucide:italic\" aria-label=\"Italic\" />\r\n * </ToggleButtonGroup>\r\n * ```\r\n */\r\nconst ToggleButtonGroupIconItem: FC<ToggleButtonGroupIconItemProps> = ({\r\n    color,\r\n    size = BUTTON_SIZES.md,\r\n    radius,\r\n    className,\r\n    icon,\r\n    ref,\r\n    ...props\r\n}) => {\r\n    const iconSize = buttonSizeToIconSize[size]\r\n\r\n    return (\r\n        <BaseToggle\r\n            ref={ref}\r\n            className={cn(\r\n                TOGGLE_BUTTON_GROUP_ICON_ITEM_STYLES.recipe({ color, size, radius }),\r\n                className,\r\n            )}\r\n            {...props}\r\n        >\r\n            <Icon\r\n                icon={icon}\r\n                size={iconSize}\r\n                className={BUTTON_SHARED_STYLES.icon}\r\n            />\r\n        </BaseToggle>\r\n    )\r\n}\r\n\r\nToggleButtonGroupIconItem.displayName = 'ToggleButtonGroup.IconItem'\r\n\r\nexport default ToggleButtonGroupIconItem\r\n"],"names":["ToggleButtonGroupIconItem","color","size","BUTTON_SIZES","radius","className","icon","ref","props","iconSize","buttonSizeToIconSize","jsx","BaseToggle","cn","TOGGLE_BUTTON_GROUP_ICON_ITEM_STYLES","Icon","BUTTON_SHARED_STYLES"],"mappings":";;;;;;;;;AAwBA,MAAMA,IAAgE,CAAC;AAAA,EACnE,OAAAC;AAAA,EACA,MAAAC,IAAOC,EAAa;AAAA,EACpB,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,KAAAC;AAAA,EACA,GAAGC;AACP,MAAM;AACF,QAAMC,IAAWC,EAAqBR,CAAI;AAE1C,SACI,gBAAAS;AAAA,IAACC;AAAAA,IAAA;AAAA,MACG,KAAAL;AAAA,MACA,WAAWM;AAAA,QACPC,EAAqC,OAAO,EAAE,OAAAb,GAAO,MAAAC,GAAM,QAAAE,GAAQ;AAAA,QACnEC;AAAA,MAAA;AAAA,MAEH,GAAGG;AAAA,MAEJ,UAAA,gBAAAG;AAAA,QAACI;AAAA,QAAA;AAAA,UACG,MAAAT;AAAA,UACA,MAAMG;AAAA,UACN,WAAWO,EAAqB;AAAA,QAAA;AAAA,MAAA;AAAA,IACpC;AAAA,EAAA;AAGZ;AAEAhB,EAA0B,cAAc;"}

package/dist/components/actions/toggle-button-group/components/toggle-button-group-icon-item/styles/ToggleButtonGroupIconItem.css.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                                    */;/* empty css                                                                   */;/* empty css                                               */const r=require("@vanilla-extract/recipes/createRuntimeFn");var a={recipe:r.createRuntimeFn({defaultClassName:"rhwfa70",variantClassNames:{color:{primary:"rhwfa71",secondary:"rhwfa72",tertiary:"rhwfa73",destructive:"rhwfa74",success:"rhwfa75",warning:"rhwfa76",info:"rhwfa77"},size:{sm:"rhwfa78",md:"rhwfa79",lg:"rhwfa7a"},radius:{none:"rhwfa7b",xs:"rhwfa7c",sm:"rhwfa7d",md:"rhwfa7e",lg:"rhwfa7f",xl:"rhwfa7g","2xl":"rhwfa7h",full:"rhwfa7i"}},defaultVariants:{color:"primary",size:"md",radius:"sm"},compoundVariants:[]})};exports.TOGGLE_BUTTON_GROUP_ICON_ITEM_STYLES=a;
-//# sourceMappingURL=ToggleButtonGroupIconItem.css.cjs.map

package/dist/components/actions/toggle-button-group/components/toggle-button-group-icon-item/styles/ToggleButtonGroupIconItem.css.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ToggleButtonGroupIconItem.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}