@metamask-previews/design-system-react 0.0.0-preview.7df341a → 0.0.0-preview.85a0952

package/dist/components/ButtonBase/ButtonBase.types.d.mts

@@ -0,0 +1,92 @@
+import type { ComponentProps } from "react";
+import type { ButtonBaseSize } from "../../types/index.mjs";
+import type { IconName, IconProps } from "../Icon/index.mjs";
+import type { TextProps } from "../Text/index.mjs";
+export type ButtonBaseProps = ComponentProps<'button'> & {
+    /**
+     * Required prop for the content to be rendered within the ButtonBase
+     */
+    children: React.ReactNode;
+    /**
+     * Optional prop for additional CSS classes to be applied to the ButtonBase component.
+     * These classes will be merged with the component's default classes using twMerge.
+     */
+    className?: string;
+    /**
+     * Optional prop to control the size of the ButtonBase
+     *
+     * @default ButtonBaseSize.Lg
+     */
+    size?: ButtonBaseSize;
+    /**
+     * Optional props to be passed to the Text component when children is a string
+     */
+    textProps?: Partial<TextProps>;
+    /**
+     * Optional prop that when true, makes the button take up the full width of its container
+     *
+     * @default false
+     */
+    isFullWidth?: boolean;
+    /**
+     * Optional boolean that determines if the component should merge its props onto its immediate child
+     * instead of rendering a button element
+     *
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Optional prop that when true, shows a loading spinner
+     *
+     * @default false
+     */
+    isLoading?: boolean;
+    /**
+     * Optional prop for text to display when button is in loading state
+     */
+    loadingText?: string;
+    /**
+     * Optional props to be passed to the loading Text component
+     */
+    loadingTextProps?: Partial<TextProps>;
+    /**
+     * Optional prop to specify an icon to show at the start of the button
+     */
+    startIconName?: IconName;
+    /**
+     * Optional prop to pass additional properties to the start icon
+     */
+    startIconProps?: Partial<IconProps>;
+    /**
+     * Optional prop for a custom element to show at the start of the button
+     */
+    startAccessory?: React.ReactNode;
+    /**
+     * Optional prop to specify an icon to show at the end of the button
+     */
+    endIconName?: IconName;
+    /**
+     * Optional prop to pass additional properties to the end icon
+     */
+    endIconProps?: Partial<IconProps>;
+    /**
+     * Optional prop for a custom element to show at the end of the button
+     */
+    endAccessory?: React.ReactNode;
+    /**
+     * Optional prop that when true, disables the button
+     *
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Optional prop to pass additional properties to the loading icon
+     */
+    loadingIconProps?: Partial<IconProps>;
+    /**
+     * Optional CSS styles to be applied to the component.
+     * Should be used sparingly and only for dynamic styles that can't be achieved with className.
+     */
+    style?: React.CSSProperties;
+};
+//# sourceMappingURL=ButtonBase.types.d.mts.map

package/dist/components/ButtonBase/ButtonBase.types.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.types.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAoB;AAClD,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACvD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/B;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACtC;;OAEG;IACH,aAAa,CAAC,EAAE,QAAQ,CAAC;IACzB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;OAEG;IACH,WAAW,CAAC,EAAE,QAAQ,CAAC;IACvB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACtC;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}

package/dist/components/ButtonBase/ButtonBase.types.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=ButtonBase.types.mjs.map

package/dist/components/ButtonBase/ButtonBase.types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.types.mjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport type { ButtonBaseSize } from '../../types';\nimport type { IconName, IconProps } from '../Icon';\nimport type { TextProps } from '../Text';\n\nexport type ButtonBaseProps = ComponentProps<'button'> & {\n  /**\n   * Required prop for the content to be rendered within the ButtonBase\n   */\n  children: React.ReactNode;\n  /**\n   * Optional prop for additional CSS classes to be applied to the ButtonBase component.\n   * These classes will be merged with the component's default classes using twMerge.\n   */\n  className?: string;\n  /**\n   * Optional prop to control the size of the ButtonBase\n   *\n   * @default ButtonBaseSize.Lg\n   */\n  size?: ButtonBaseSize;\n  /**\n   * Optional props to be passed to the Text component when children is a string\n   */\n  textProps?: Partial<TextProps>;\n  /**\n   * Optional prop that when true, makes the button take up the full width of its container\n   *\n   * @default false\n   */\n  isFullWidth?: boolean;\n  /**\n   * Optional boolean that determines if the component should merge its props onto its immediate child\n   * instead of rendering a button element\n   *\n   * @default false\n   */\n  asChild?: boolean;\n  /**\n   * Optional prop that when true, shows a loading spinner\n   *\n   * @default false\n   */\n  isLoading?: boolean;\n  /**\n   * Optional prop for text to display when button is in loading state\n   */\n  loadingText?: string;\n  /**\n   * Optional props to be passed to the loading Text component\n   */\n  loadingTextProps?: Partial<TextProps>;\n  /**\n   * Optional prop to specify an icon to show at the start of the button\n   */\n  startIconName?: IconName;\n  /**\n   * Optional prop to pass additional properties to the start icon\n   */\n  startIconProps?: Partial<IconProps>;\n  /**\n   * Optional prop for a custom element to show at the start of the button\n   */\n  startAccessory?: React.ReactNode;\n  /**\n   * Optional prop to specify an icon to show at the end of the button\n   */\n  endIconName?: IconName;\n  /**\n   * Optional prop to pass additional properties to the end icon\n   */\n  endIconProps?: Partial<IconProps>;\n  /**\n   * Optional prop for a custom element to show at the end of the button\n   */\n  endAccessory?: React.ReactNode;\n  /**\n   * Optional prop that when true, disables the button\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Optional prop to pass additional properties to the loading icon\n   */\n  loadingIconProps?: Partial<IconProps>;\n  /**\n   * Optional CSS styles to be applied to the component.\n   * Should be used sparingly and only for dynamic styles that can't be achieved with className.\n   */\n  style?: React.CSSProperties;\n};\n"]}

package/dist/components/ButtonBase/index.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonBase = exports.ButtonBaseSize = void 0;
+var types_1 = require("../../types/index.cjs");
+Object.defineProperty(exports, "ButtonBaseSize", { enumerable: true, get: function () { return types_1.ButtonBaseSize; } });
+var ButtonBase_1 = require("./ButtonBase.cjs");
+Object.defineProperty(exports, "ButtonBase", { enumerable: true, get: function () { return ButtonBase_1.ButtonBase; } });
+//# sourceMappingURL=index.cjs.map

package/dist/components/ButtonBase/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":";;;AAAA,+CAA6C;AAApC,uGAAA,cAAc,OAAA;AACvB,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export { ButtonBaseSize } from '../../types';\nexport { ButtonBase } from './ButtonBase';\nexport type { ButtonBaseProps } from './ButtonBase.types';\n"]}

package/dist/components/ButtonBase/index.d.cts

@@ -0,0 +1,4 @@
+export { ButtonBaseSize } from "../../types/index.cjs";
+export { ButtonBase } from "./ButtonBase.cjs";
+export type { ButtonBaseProps } from "./ButtonBase.types.cjs";
+//# sourceMappingURL=index.d.cts.map

package/dist/components/ButtonBase/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}

package/dist/components/ButtonBase/index.d.mts

@@ -0,0 +1,4 @@
+export { ButtonBaseSize } from "../../types/index.mjs";
+export { ButtonBase } from "./ButtonBase.mjs";
+export type { ButtonBaseProps } from "./ButtonBase.types.mjs";
+//# sourceMappingURL=index.d.mts.map

package/dist/components/ButtonBase/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}

package/dist/components/ButtonBase/index.mjs

@@ -0,0 +1,3 @@
+export { ButtonBaseSize } from "../../types/index.mjs";
+export { ButtonBase } from "./ButtonBase.mjs";
+//# sourceMappingURL=index.mjs.map

package/dist/components/ButtonBase/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB","sourcesContent":["export { ButtonBaseSize } from '../../types';\nexport { ButtonBase } from './ButtonBase';\nexport type { ButtonBaseProps } from './ButtonBase.types';\n"]}

package/dist/components/ButtonIcon/ButtonIcon.cjs

@@ -0,0 +1,59 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonIcon = void 0;
+const react_1 = __importStar(require("react"));
+const types_1 = require("../../types/index.cjs");
+const tw_merge_1 = require("../../utils/tw-merge.cjs");
+const Icon_1 = require("../Icon/index.cjs");
+const ButtonIcon_constants_1 = require("./ButtonIcon.constants.cjs");
+exports.ButtonIcon = (0, react_1.forwardRef)(({ className, iconName, iconProps, ariaLabel, isDisabled = false, isInverse = false, isFloating = false, size = types_1.ButtonIconSize.Md, style, ...props }, ref) => {
+    const isInteractive = !isDisabled;
+    const mergedClassName = (0, tw_merge_1.twMerge)(
+    // Base styles
+    'inline-flex items-center justify-center p-0', 
+    // Size styles
+    ButtonIcon_constants_1.TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size], 
+    // Floating styles
+    isFloating && [
+        'rounded-full',
+        !isInverse && 'bg-icon-default text-background-default',
+        isInverse && 'bg-icon-default text-background-default',
+    ], 
+    // Non-floating styles
+    !isFloating && [
+        'bg-transparent rounded',
+        // Only apply hover/active styles when interactive
+        isInteractive && 'hover:bg-hover active:bg-pressed',
+        !isInverse && 'text-icon-default',
+        isInverse && 'text-background-default',
+    ], 
+    // Disabled state
+    isDisabled && 'cursor-not-allowed opacity-50', className);
+    return (react_1.default.createElement("button", { ref: ref, className: mergedClassName, disabled: isDisabled, "aria-label": ariaLabel, style: style, ...props },
+        react_1.default.createElement(Icon_1.Icon, { name: iconName, size: ButtonIcon_constants_1.MAP_BUTTONICON_SIZE_ICONSIZE[size], className: (0, tw_merge_1.twMerge)('text-inherit', iconProps?.className), ...iconProps })));
+});
+exports.ButtonIcon.displayName = 'ButtonIcon';
+//# sourceMappingURL=ButtonIcon.cjs.map

package/dist/components/ButtonIcon/ButtonIcon.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.cjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,iDAA6C;AAC7C,uDAA+C;AAC/C,4CAA+B;AAE/B,qEAGgC;AAGnB,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CACE,EACE,SAAS,EACT,QAAQ,EACR,SAAS,EACT,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,sBAAc,CAAC,EAAE,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,aAAa,GAAG,CAAC,UAAU,CAAC;IAElC,MAAM,eAAe,GAAG,IAAA,kBAAO;IAC7B,cAAc;IACd,6CAA6C;IAC7C,cAAc;IACd,2DAAoC,CAAC,IAAI,CAAC;IAC1C,kBAAkB;IAClB,UAAU,IAAI;QACZ,cAAc;QACd,CAAC,SAAS,IAAI,yCAAyC;QACvD,SAAS,IAAI,yCAAyC;KACvD;IACD,sBAAsB;IACtB,CAAC,UAAU,IAAI;QACb,wBAAwB;QACxB,kDAAkD;QAClD,aAAa,IAAI,kCAAkC;QACnD,CAAC,SAAS,IAAI,mBAAmB;QACjC,SAAS,IAAI,yBAAyB;KACvC;IACD,iBAAiB;IACjB,UAAU,IAAI,+BAA+B,EAC7C,SAAS,CACV,CAAC;IAEF,OAAO,CACL,0CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,QAAQ,EAAE,UAAU,gBACR,SAAS,EACrB,KAAK,EAAE,KAAK,KACR,KAAK;QAET,8BAAC,WAAI,IACH,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,mDAA4B,CAAC,IAAI,CAAC,EACxC,SAAS,EAAE,IAAA,kBAAO,EAAC,cAAc,EAAE,SAAS,EAAE,SAAS,CAAC,KACpD,SAAS,GACb,CACK,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ButtonIconSize } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { Icon } from '../Icon';\n\nimport {\n  TWCLASSMAP_BUTTONICON_SIZE_DIMENSION,\n  MAP_BUTTONICON_SIZE_ICONSIZE,\n} from './ButtonIcon.constants';\nimport type { ButtonIconProps } from './ButtonIcon.types';\n\nexport const ButtonIcon = forwardRef<HTMLButtonElement, ButtonIconProps>(\n  (\n    {\n      className,\n      iconName,\n      iconProps,\n      ariaLabel,\n      isDisabled = false,\n      isInverse = false,\n      isFloating = false,\n      size = ButtonIconSize.Md,\n      style,\n      ...props\n    },\n    ref,\n  ) => {\n    const isInteractive = !isDisabled;\n\n    const mergedClassName = twMerge(\n      // Base styles\n      'inline-flex items-center justify-center p-0',\n      // Size styles\n      TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size],\n      // Floating styles\n      isFloating && [\n        'rounded-full',\n        !isInverse && 'bg-icon-default text-background-default',\n        isInverse && 'bg-icon-default text-background-default',\n      ],\n      // Non-floating styles\n      !isFloating && [\n        'bg-transparent rounded',\n        // Only apply hover/active styles when interactive\n        isInteractive && 'hover:bg-hover active:bg-pressed',\n        !isInverse && 'text-icon-default',\n        isInverse && 'text-background-default',\n      ],\n      // Disabled state\n      isDisabled && 'cursor-not-allowed opacity-50',\n      className,\n    );\n\n    return (\n      <button\n        ref={ref}\n        className={mergedClassName}\n        disabled={isDisabled}\n        aria-label={ariaLabel}\n        style={style}\n        {...props}\n      >\n        <Icon\n          name={iconName}\n          size={MAP_BUTTONICON_SIZE_ICONSIZE[size]}\n          className={twMerge('text-inherit', iconProps?.className)}\n          {...iconProps}\n        />\n      </button>\n    );\n  },\n);\n\nButtonIcon.displayName = 'ButtonIcon';\n"]}

package/dist/components/ButtonIcon/ButtonIcon.constants.cjs

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MAP_BUTTONICON_SIZE_ICONSIZE = exports.TWCLASSMAP_BUTTONICON_SIZE_DIMENSION = void 0;
+const types_1 = require("../../types/index.cjs");
+const Icon_1 = require("../Icon/index.cjs");
+exports.TWCLASSMAP_BUTTONICON_SIZE_DIMENSION = {
+    [types_1.ButtonIconSize.Sm]: 'h-6 w-6',
+    [types_1.ButtonIconSize.Md]: 'h-8 w-8',
+    [types_1.ButtonIconSize.Lg]: 'h-10 w-10',
+};
+exports.MAP_BUTTONICON_SIZE_ICONSIZE = {
+    [types_1.ButtonIconSize.Sm]: Icon_1.IconSize.Sm,
+    [types_1.ButtonIconSize.Md]: Icon_1.IconSize.Md,
+    [types_1.ButtonIconSize.Lg]: Icon_1.IconSize.Lg,
+};
+//# sourceMappingURL=ButtonIcon.constants.cjs.map

package/dist/components/ButtonIcon/ButtonIcon.constants.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.constants.cjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.constants.ts"],"names":[],"mappings":";;;AAAA,iDAA6C;AAC7C,4CAAmC;AAEtB,QAAA,oCAAoC,GAAG;IAClD,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,WAAW;CACxB,CAAC;AAEE,QAAA,4BAA4B,GAAG;IAC1C,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;IAChC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,eAAQ,CAAC,EAAE;CACxB,CAAC","sourcesContent":["import { ButtonIconSize } from '../../types';\nimport { IconSize } from '../Icon';\n\nexport const TWCLASSMAP_BUTTONICON_SIZE_DIMENSION = {\n  [ButtonIconSize.Sm]: 'h-6 w-6',\n  [ButtonIconSize.Md]: 'h-8 w-8',\n  [ButtonIconSize.Lg]: 'h-10 w-10',\n} as const;\n\nexport const MAP_BUTTONICON_SIZE_ICONSIZE = {\n  [ButtonIconSize.Sm]: IconSize.Sm,\n  [ButtonIconSize.Md]: IconSize.Md,\n  [ButtonIconSize.Lg]: IconSize.Lg,\n} as const;\n"]}

package/dist/components/ButtonIcon/ButtonIcon.constants.d.cts

@@ -0,0 +1,12 @@
+import { IconSize } from "../Icon/index.cjs";
+export declare const TWCLASSMAP_BUTTONICON_SIZE_DIMENSION: {
+    readonly sm: "h-6 w-6";
+    readonly md: "h-8 w-8";
+    readonly lg: "h-10 w-10";
+};
+export declare const MAP_BUTTONICON_SIZE_ICONSIZE: {
+    readonly sm: IconSize.Sm;
+    readonly md: IconSize.Md;
+    readonly lg: IconSize.Lg;
+};
+//# sourceMappingURL=ButtonIcon.constants.d.cts.map

package/dist/components/ButtonIcon/ButtonIcon.constants.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.constants.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.constants.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,0BAAgB;AAEnC,eAAO,MAAM,oCAAoC;;;;CAIvC,CAAC;AAEX,eAAO,MAAM,4BAA4B;;;;CAI/B,CAAC"}

package/dist/components/ButtonIcon/ButtonIcon.constants.d.mts

@@ -0,0 +1,12 @@
+import { IconSize } from "../Icon/index.mjs";
+export declare const TWCLASSMAP_BUTTONICON_SIZE_DIMENSION: {
+    readonly sm: "h-6 w-6";
+    readonly md: "h-8 w-8";
+    readonly lg: "h-10 w-10";
+};
+export declare const MAP_BUTTONICON_SIZE_ICONSIZE: {
+    readonly sm: IconSize.Sm;
+    readonly md: IconSize.Md;
+    readonly lg: IconSize.Lg;
+};
+//# sourceMappingURL=ButtonIcon.constants.d.mts.map

package/dist/components/ButtonIcon/ButtonIcon.constants.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.constants.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.constants.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,0BAAgB;AAEnC,eAAO,MAAM,oCAAoC;;;;CAIvC,CAAC;AAEX,eAAO,MAAM,4BAA4B;;;;CAI/B,CAAC"}

package/dist/components/ButtonIcon/ButtonIcon.constants.mjs

@@ -0,0 +1,13 @@
+import { ButtonIconSize } from "../../types/index.mjs";
+import { IconSize } from "../Icon/index.mjs";
+export const TWCLASSMAP_BUTTONICON_SIZE_DIMENSION = {
+    [ButtonIconSize.Sm]: 'h-6 w-6',
+    [ButtonIconSize.Md]: 'h-8 w-8',
+    [ButtonIconSize.Lg]: 'h-10 w-10',
+};
+export const MAP_BUTTONICON_SIZE_ICONSIZE = {
+    [ButtonIconSize.Sm]: IconSize.Sm,
+    [ButtonIconSize.Md]: IconSize.Md,
+    [ButtonIconSize.Lg]: IconSize.Lg,
+};
+//# sourceMappingURL=ButtonIcon.constants.mjs.map

package/dist/components/ButtonIcon/ButtonIcon.constants.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.constants.mjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,QAAQ,EAAE,0BAAgB;AAEnC,MAAM,CAAC,MAAM,oCAAoC,GAAG;IAClD,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,SAAS;IAC9B,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW;CACxB,CAAC;AAEX,MAAM,CAAC,MAAM,4BAA4B,GAAG;IAC1C,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;IAChC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE;CACxB,CAAC","sourcesContent":["import { ButtonIconSize } from '../../types';\nimport { IconSize } from '../Icon';\n\nexport const TWCLASSMAP_BUTTONICON_SIZE_DIMENSION = {\n  [ButtonIconSize.Sm]: 'h-6 w-6',\n  [ButtonIconSize.Md]: 'h-8 w-8',\n  [ButtonIconSize.Lg]: 'h-10 w-10',\n} as const;\n\nexport const MAP_BUTTONICON_SIZE_ICONSIZE = {\n  [ButtonIconSize.Sm]: IconSize.Sm,\n  [ButtonIconSize.Md]: IconSize.Md,\n  [ButtonIconSize.Lg]: IconSize.Lg,\n} as const;\n"]}

package/dist/components/ButtonIcon/ButtonIcon.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAU1C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,wGA4DtB,CAAC"}

package/dist/components/ButtonIcon/ButtonIcon.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAU1C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,wGA4DtB,CAAC"}

package/dist/components/ButtonIcon/ButtonIcon.mjs

@@ -0,0 +1,41 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+import $React from "react";
+const { forwardRef } = $React;
+const React = $importDefault($React);
+import { ButtonIconSize } from "../../types/index.mjs";
+import { twMerge } from "../../utils/tw-merge.mjs";
+import { Icon } from "../Icon/index.mjs";
+import { TWCLASSMAP_BUTTONICON_SIZE_DIMENSION, MAP_BUTTONICON_SIZE_ICONSIZE } from "./ButtonIcon.constants.mjs";
+export const ButtonIcon = forwardRef(({ className, iconName, iconProps, ariaLabel, isDisabled = false, isInverse = false, isFloating = false, size = ButtonIconSize.Md, style, ...props }, ref) => {
+    const isInteractive = !isDisabled;
+    const mergedClassName = twMerge(
+    // Base styles
+    'inline-flex items-center justify-center p-0', 
+    // Size styles
+    TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size], 
+    // Floating styles
+    isFloating && [
+        'rounded-full',
+        !isInverse && 'bg-icon-default text-background-default',
+        isInverse && 'bg-icon-default text-background-default',
+    ], 
+    // Non-floating styles
+    !isFloating && [
+        'bg-transparent rounded',
+        // Only apply hover/active styles when interactive
+        isInteractive && 'hover:bg-hover active:bg-pressed',
+        !isInverse && 'text-icon-default',
+        isInverse && 'text-background-default',
+    ], 
+    // Disabled state
+    isDisabled && 'cursor-not-allowed opacity-50', className);
+    return (React.createElement("button", { ref: ref, className: mergedClassName, disabled: isDisabled, "aria-label": ariaLabel, style: style, ...props },
+        React.createElement(Icon, { name: iconName, size: MAP_BUTTONICON_SIZE_ICONSIZE[size], className: twMerge('text-inherit', iconProps?.className), ...iconProps })));
+});
+ButtonIcon.displayName = 'ButtonIcon';
+//# sourceMappingURL=ButtonIcon.mjs.map

package/dist/components/ButtonIcon/ButtonIcon.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.mjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":";;;;;;;;;AAEA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,IAAI,EAAE,0BAAgB;AAE/B,OAAO,EACL,oCAAoC,EACpC,4BAA4B,EAC7B,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,SAAS,EACT,QAAQ,EACR,SAAS,EACT,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,aAAa,GAAG,CAAC,UAAU,CAAC;IAElC,MAAM,eAAe,GAAG,OAAO;IAC7B,cAAc;IACd,6CAA6C;IAC7C,cAAc;IACd,oCAAoC,CAAC,IAAI,CAAC;IAC1C,kBAAkB;IAClB,UAAU,IAAI;QACZ,cAAc;QACd,CAAC,SAAS,IAAI,yCAAyC;QACvD,SAAS,IAAI,yCAAyC;KACvD;IACD,sBAAsB;IACtB,CAAC,UAAU,IAAI;QACb,wBAAwB;QACxB,kDAAkD;QAClD,aAAa,IAAI,kCAAkC;QACnD,CAAC,SAAS,IAAI,mBAAmB;QACjC,SAAS,IAAI,yBAAyB;KACvC;IACD,iBAAiB;IACjB,UAAU,IAAI,+BAA+B,EAC7C,SAAS,CACV,CAAC;IAEF,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,QAAQ,EAAE,UAAU,gBACR,SAAS,EACrB,KAAK,EAAE,KAAK,KACR,KAAK;QAET,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,4BAA4B,CAAC,IAAI,CAAC,EACxC,SAAS,EAAE,OAAO,CAAC,cAAc,EAAE,SAAS,EAAE,SAAS,CAAC,KACpD,SAAS,GACb,CACK,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ButtonIconSize } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { Icon } from '../Icon';\n\nimport {\n  TWCLASSMAP_BUTTONICON_SIZE_DIMENSION,\n  MAP_BUTTONICON_SIZE_ICONSIZE,\n} from './ButtonIcon.constants';\nimport type { ButtonIconProps } from './ButtonIcon.types';\n\nexport const ButtonIcon = forwardRef<HTMLButtonElement, ButtonIconProps>(\n  (\n    {\n      className,\n      iconName,\n      iconProps,\n      ariaLabel,\n      isDisabled = false,\n      isInverse = false,\n      isFloating = false,\n      size = ButtonIconSize.Md,\n      style,\n      ...props\n    },\n    ref,\n  ) => {\n    const isInteractive = !isDisabled;\n\n    const mergedClassName = twMerge(\n      // Base styles\n      'inline-flex items-center justify-center p-0',\n      // Size styles\n      TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size],\n      // Floating styles\n      isFloating && [\n        'rounded-full',\n        !isInverse && 'bg-icon-default text-background-default',\n        isInverse && 'bg-icon-default text-background-default',\n      ],\n      // Non-floating styles\n      !isFloating && [\n        'bg-transparent rounded',\n        // Only apply hover/active styles when interactive\n        isInteractive && 'hover:bg-hover active:bg-pressed',\n        !isInverse && 'text-icon-default',\n        isInverse && 'text-background-default',\n      ],\n      // Disabled state\n      isDisabled && 'cursor-not-allowed opacity-50',\n      className,\n    );\n\n    return (\n      <button\n        ref={ref}\n        className={mergedClassName}\n        disabled={isDisabled}\n        aria-label={ariaLabel}\n        style={style}\n        {...props}\n      >\n        <Icon\n          name={iconName}\n          size={MAP_BUTTONICON_SIZE_ICONSIZE[size]}\n          className={twMerge('text-inherit', iconProps?.className)}\n          {...iconProps}\n        />\n      </button>\n    );\n  },\n);\n\nButtonIcon.displayName = 'ButtonIcon';\n"]}

package/dist/components/ButtonIcon/ButtonIcon.types.cjs

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=ButtonIcon.types.cjs.map

package/dist/components/ButtonIcon/ButtonIcon.types.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.types.cjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport type { ButtonIconSize } from '../../types';\nimport type { IconName, IconProps } from '../Icon';\n\nexport type ButtonIconProps = ComponentProps<'button'> & {\n  /**\n   * Required prop to specify the icon to show\n   */\n  iconName: IconName;\n  /**\n   * Required prop to provide an accessible label for the button\n   */\n  ariaLabel: string;\n  /**\n   * Optional prop to pass additional properties to the icon\n   */\n  iconProps?: Partial<IconProps>;\n  /**\n   * Optional prop that when true, disables the button\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Optional prop that when true, applies inverse styling to the button\n   *\n   * @default false\n   */\n  isInverse?: boolean;\n  /**\n   * Optional prop that when true, applies floating/contained styling to the button\n   *\n   * @default false\n   */\n  isFloating?: boolean;\n  /**\n   * Optional prop to control the size of the button\n   *\n   * @default ButtonIconSize.Md\n   */\n  size?: ButtonIconSize;\n  /**\n   * Optional prop for additional CSS classes to be applied to the ButtonIcon component\n   */\n  className?: string;\n  /**\n   * Optional CSS styles to be applied to the component.\n   * Should be used sparingly and only for dynamic styles that can't be achieved with className.\n   */\n  style?: React.CSSProperties;\n};\n"]}

package/dist/components/ButtonIcon/ButtonIcon.types.d.cts

@@ -0,0 +1,51 @@
+import type { ComponentProps } from "react";
+import type { ButtonIconSize } from "../../types/index.cjs";
+import type { IconName, IconProps } from "../Icon/index.cjs";
+export type ButtonIconProps = ComponentProps<'button'> & {
+    /**
+     * Required prop to specify the icon to show
+     */
+    iconName: IconName;
+    /**
+     * Required prop to provide an accessible label for the button
+     */
+    ariaLabel: string;
+    /**
+     * Optional prop to pass additional properties to the icon
+     */
+    iconProps?: Partial<IconProps>;
+    /**
+     * Optional prop that when true, disables the button
+     *
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Optional prop that when true, applies inverse styling to the button
+     *
+     * @default false
+     */
+    isInverse?: boolean;
+    /**
+     * Optional prop that when true, applies floating/contained styling to the button
+     *
+     * @default false
+     */
+    isFloating?: boolean;
+    /**
+     * Optional prop to control the size of the button
+     *
+     * @default ButtonIconSize.Md
+     */
+    size?: ButtonIconSize;
+    /**
+     * Optional prop for additional CSS classes to be applied to the ButtonIcon component
+     */
+    className?: string;
+    /**
+     * Optional CSS styles to be applied to the component.
+     * Should be used sparingly and only for dynamic styles that can't be achieved with className.
+     */
+    style?: React.CSSProperties;
+};
+//# sourceMappingURL=ButtonIcon.types.d.cts.map

package/dist/components/ButtonIcon/ButtonIcon.types.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.types.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAoB;AAClD,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAEnD,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACvD;;OAEG;IACH,QAAQ,EAAE,QAAQ,CAAC;IACnB;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}

package/dist/components/ButtonIcon/ButtonIcon.types.d.mts

@@ -0,0 +1,51 @@
+import type { ComponentProps } from "react";
+import type { ButtonIconSize } from "../../types/index.mjs";
+import type { IconName, IconProps } from "../Icon/index.mjs";
+export type ButtonIconProps = ComponentProps<'button'> & {
+    /**
+     * Required prop to specify the icon to show
+     */
+    iconName: IconName;
+    /**
+     * Required prop to provide an accessible label for the button
+     */
+    ariaLabel: string;
+    /**
+     * Optional prop to pass additional properties to the icon
+     */
+    iconProps?: Partial<IconProps>;
+    /**
+     * Optional prop that when true, disables the button
+     *
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Optional prop that when true, applies inverse styling to the button
+     *
+     * @default false
+     */
+    isInverse?: boolean;
+    /**
+     * Optional prop that when true, applies floating/contained styling to the button
+     *
+     * @default false
+     */
+    isFloating?: boolean;
+    /**
+     * Optional prop to control the size of the button
+     *
+     * @default ButtonIconSize.Md
+     */
+    size?: ButtonIconSize;
+    /**
+     * Optional prop for additional CSS classes to be applied to the ButtonIcon component
+     */
+    className?: string;
+    /**
+     * Optional CSS styles to be applied to the component.
+     * Should be used sparingly and only for dynamic styles that can't be achieved with className.
+     */
+    style?: React.CSSProperties;
+};
+//# sourceMappingURL=ButtonIcon.types.d.mts.map

package/dist/components/ButtonIcon/ButtonIcon.types.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.types.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc;AAE5C,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAoB;AAClD,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAEnD,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACvD;;OAEG;IACH,QAAQ,EAAE,QAAQ,CAAC;IACnB;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}

package/dist/components/ButtonIcon/ButtonIcon.types.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=ButtonIcon.types.mjs.map

package/dist/components/ButtonIcon/ButtonIcon.types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.types.mjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport type { ButtonIconSize } from '../../types';\nimport type { IconName, IconProps } from '../Icon';\n\nexport type ButtonIconProps = ComponentProps<'button'> & {\n  /**\n   * Required prop to specify the icon to show\n   */\n  iconName: IconName;\n  /**\n   * Required prop to provide an accessible label for the button\n   */\n  ariaLabel: string;\n  /**\n   * Optional prop to pass additional properties to the icon\n   */\n  iconProps?: Partial<IconProps>;\n  /**\n   * Optional prop that when true, disables the button\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Optional prop that when true, applies inverse styling to the button\n   *\n   * @default false\n   */\n  isInverse?: boolean;\n  /**\n   * Optional prop that when true, applies floating/contained styling to the button\n   *\n   * @default false\n   */\n  isFloating?: boolean;\n  /**\n   * Optional prop to control the size of the button\n   *\n   * @default ButtonIconSize.Md\n   */\n  size?: ButtonIconSize;\n  /**\n   * Optional prop for additional CSS classes to be applied to the ButtonIcon component\n   */\n  className?: string;\n  /**\n   * Optional CSS styles to be applied to the component.\n   * Should be used sparingly and only for dynamic styles that can't be achieved with className.\n   */\n  style?: React.CSSProperties;\n};\n"]}

package/dist/components/ButtonIcon/index.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonIcon = exports.ButtonIconSize = void 0;
+var types_1 = require("../../types/index.cjs");
+Object.defineProperty(exports, "ButtonIconSize", { enumerable: true, get: function () { return types_1.ButtonIconSize; } });
+var ButtonIcon_1 = require("./ButtonIcon.cjs");
+Object.defineProperty(exports, "ButtonIcon", { enumerable: true, get: function () { return ButtonIcon_1.ButtonIcon; } });
+//# sourceMappingURL=index.cjs.map

package/dist/components/ButtonIcon/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/index.ts"],"names":[],"mappings":";;;AAAA,+CAA6C;AAApC,uGAAA,cAAc,OAAA;AACvB,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export { ButtonIconSize } from '../../types';\nexport { ButtonIcon } from './ButtonIcon';\nexport type { ButtonIconProps } from './ButtonIcon.types';\n"]}

package/dist/components/ButtonIcon/index.d.cts

@@ -0,0 +1,4 @@
+export { ButtonIconSize } from "../../types/index.cjs";
+export { ButtonIcon } from "./ButtonIcon.cjs";
+export type { ButtonIconProps } from "./ButtonIcon.types.cjs";
+//# sourceMappingURL=index.d.cts.map

package/dist/components/ButtonIcon/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}

package/dist/components/ButtonIcon/index.d.mts

@@ -0,0 +1,4 @@
+export { ButtonIconSize } from "../../types/index.mjs";
+export { ButtonIcon } from "./ButtonIcon.mjs";
+export type { ButtonIconProps } from "./ButtonIcon.types.mjs";
+//# sourceMappingURL=index.d.mts.map

package/dist/components/ButtonIcon/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}

package/dist/components/ButtonIcon/index.mjs

@@ -0,0 +1,3 @@
+export { ButtonIconSize } from "../../types/index.mjs";
+export { ButtonIcon } from "./ButtonIcon.mjs";
+//# sourceMappingURL=index.mjs.map

package/dist/components/ButtonIcon/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB","sourcesContent":["export { ButtonIconSize } from '../../types';\nexport { ButtonIcon } from './ButtonIcon';\nexport type { ButtonIconProps } from './ButtonIcon.types';\n"]}

package/dist/components/Checkbox/Checkbox.cjs

@@ -0,0 +1,73 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Checkbox = void 0;
+const react_1 = __importStar(require("react"));
+const tw_merge_1 = require("../../utils/tw-merge.cjs");
+const Icon_1 = require("../Icon/index.cjs");
+const Text_1 = require("../Text/index.cjs");
+exports.Checkbox = (0, react_1.forwardRef)(({ id, isSelected, isDisabled = false, isInvalid = false, label, labelProps, onChange, inputProps, checkboxContainerProps, checkedIconProps, className, style, ...props }, ref) => {
+    const handleChange = (event) => {
+        if (isDisabled) {
+            return;
+        }
+        onChange?.(event.target.checked);
+    };
+    const handleClick = () => {
+        if (isDisabled) {
+            return;
+        }
+        onChange?.(!isSelected);
+    };
+    const handleKeyDown = (event) => {
+        if (event.key === 'Enter') {
+            event.preventDefault();
+            handleClick();
+        }
+    };
+    (0, react_1.useImperativeHandle)(ref, () => ({ toggle: handleClick }), [handleClick]);
+    const outerClassName = (0, tw_merge_1.twMerge)('inline-flex items-center', isDisabled && 'cursor-not-allowed opacity-50', className);
+    const baseBg = isSelected
+        ? 'bg-primary-default hover:bg-primary-default-hover active:bg-primary-default-pressed'
+        : 'bg-background-default hover:bg-background-default-hover active:bg-background-default-pressed';
+    let baseBorder = 'border-border-default';
+    if (isSelected) {
+        baseBorder = 'border-primary-default';
+    }
+    else if (isInvalid) {
+        baseBorder = 'border-error-default';
+    }
+    const checkboxClasses = (0, tw_merge_1.twMerge)('relative flex h-6 w-6 items-center justify-center rounded border-2 p-0 transition-transform active:scale-95', baseBg, baseBorder, checkboxContainerProps?.className);
+    const iconClasses = (0, tw_merge_1.twMerge)('pointer-events-none transition-opacity', isSelected ? 'opacity-100' : 'opacity-0', checkedIconProps?.className);
+    return (react_1.default.createElement("label", { htmlFor: id, className: outerClassName, style: style, ...props },
+        react_1.default.createElement("div", { className: "relative" },
+            react_1.default.createElement("input", { type: "checkbox", id: id, checked: isSelected, disabled: isDisabled, "aria-invalid": isInvalid, onChange: handleChange, onKeyDown: handleKeyDown, className: "absolute inset-0 h-full w-full cursor-pointer opacity-0 disabled:cursor-not-allowed", ...inputProps }),
+            react_1.default.createElement("div", { className: checkboxClasses, ...checkboxContainerProps },
+                react_1.default.createElement(Icon_1.Icon, { name: Icon_1.IconName.Check, color: Icon_1.IconColor.PrimaryInverse, size: Icon_1.IconSize.Sm, ...checkedIconProps, className: iconClasses }))),
+        label ? (react_1.default.createElement(Text_1.Text, { asChild: true, ...labelProps, className: (0, tw_merge_1.twMerge)('ml-3', labelProps?.className) },
+            react_1.default.createElement("span", null, label))) : null));
+});
+exports.Checkbox.displayName = 'Checkbox';
+//# sourceMappingURL=Checkbox.cjs.map