@metamask-previews/design-system-react-native 0.0.0-preview.58198a0 → 0.0.0-preview.646ebcc

package/dist/components/Button/variants/ButtonSecondary/index.cjs

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

package/dist/components/Button/variants/ButtonSecondary/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonSecondary/index.ts"],"names":[],"mappings":";;;AAAA,qDAAwD;AAA/C,4GAAA,mBAAmB,OAAA;AAC5B,yDAAoD;AAA3C,kHAAA,eAAe,OAAA","sourcesContent":["export { ButtonSecondarySize } from '../../../../types';\nexport { ButtonSecondary } from './ButtonSecondary';\nexport type { ButtonSecondaryProps } from './ButtonSecondary.types';\n"]}

package/dist/components/Button/variants/ButtonSecondary/index.d.cts

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

package/dist/components/Button/variants/ButtonSecondary/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonSecondary/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,oCAA0B;AACxD,OAAO,EAAE,eAAe,EAAE,8BAA0B;AACpD,YAAY,EAAE,oBAAoB,EAAE,oCAAgC"}

package/dist/components/Button/variants/ButtonSecondary/index.d.mts

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

package/dist/components/Button/variants/ButtonSecondary/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonSecondary/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,oCAA0B;AACxD,OAAO,EAAE,eAAe,EAAE,8BAA0B;AACpD,YAAY,EAAE,oBAAoB,EAAE,oCAAgC"}

package/dist/components/Button/variants/ButtonSecondary/index.mjs

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

package/dist/components/Button/variants/ButtonSecondary/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonSecondary/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,oCAA0B;AACxD,OAAO,EAAE,eAAe,EAAE,8BAA0B","sourcesContent":["export { ButtonSecondarySize } from '../../../../types';\nexport { ButtonSecondary } from './ButtonSecondary';\nexport type { ButtonSecondaryProps } from './ButtonSecondary.types';\n"]}

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.cjs

@@ -0,0 +1,106 @@
+"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.ButtonTertiary = void 0;
+const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-twrnc-preset");
+const react_1 = __importStar(require("react"));
+const ButtonBase_1 = require("../../../ButtonBase/index.cjs");
+const Icon_1 = require("../../../Icon/index.cjs");
+const Text_1 = require("../../../Text/index.cjs");
+const ButtonTertiary = ({ children, textProps, spinnerProps, startIconProps, endIconProps, isDanger = false, isInverse = false, isLoading = false, twClassName = '', style, ...props }) => {
+    const tw = (0, design_system_twrnc_preset_1.useTailwind)();
+    const getContainerClassName = (0, react_1.useCallback)((pressed) => {
+        const baseClasses = `
+        ${isInverse && !isDanger ? 'border-[1.5px]' : 'border-0'}
+        ${twClassName}
+      `;
+        let backgroundClass = '';
+        let borderClass = '';
+        if (isInverse && isDanger) {
+            backgroundClass =
+                pressed || isLoading ? 'bg-default-pressed' : 'bg-default';
+            borderClass =
+                pressed || isLoading
+                    ? 'border-background-default-pressed'
+                    : 'border-background-default';
+        }
+        else if (isDanger) {
+            backgroundClass =
+                pressed || isLoading ? 'bg-error-muted-pressed' : 'bg-transparent';
+            borderClass =
+                pressed || isLoading
+                    ? 'border-error-muted-pressed'
+                    : 'border-transparent';
+        }
+        else if (isInverse) {
+            backgroundClass =
+                pressed || isLoading ? 'bg-pressed' : 'bg-transparent';
+            borderClass = 'border-primary-inverse';
+        }
+        else {
+            backgroundClass =
+                pressed || isLoading ? 'bg-pressed' : 'bg-transparent';
+            borderClass =
+                pressed || isLoading
+                    ? 'border-background-pressed'
+                    : 'border-transparent';
+        }
+        return `${backgroundClass} ${borderClass} ${baseClasses}`;
+    }, [isInverse, isDanger, isLoading, twClassName]);
+    const getTextClassName = (0, react_1.useCallback)((pressed) => {
+        if (isDanger) {
+            return pressed || isLoading
+                ? 'text-error-default-pressed'
+                : 'text-error-default';
+        }
+        else if (isInverse) {
+            return 'text-primary-inverse';
+        }
+        else {
+            return pressed || isLoading
+                ? 'text-primary-default-pressed'
+                : 'text-primary-default';
+        }
+    }, [isDanger, isInverse, isLoading]);
+    return (<ButtonBase_1.ButtonBase textProps={{
+            variant: Text_1.TextVariant.BodyMd,
+            fontWeight: Text_1.FontWeight.Medium,
+            numberOfLines: 1,
+            ellipsizeMode: 'clip',
+            ...textProps,
+        }} spinnerProps={{
+            ...spinnerProps,
+        }} startIconProps={{
+            size: Icon_1.IconSize.Sm,
+            ...startIconProps,
+        }} endIconProps={{
+            size: Icon_1.IconSize.Sm,
+            ...endIconProps,
+        }} isLoading={isLoading} twClassName={getContainerClassName} textClassName={getTextClassName} iconClassName={getTextClassName} style={style} {...props}>
+      {children}
+    </ButtonBase_1.ButtonBase>);
+};
+exports.ButtonTertiary = ButtonTertiary;
+//# sourceMappingURL=ButtonTertiary.cjs.map

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonTertiary.cjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/ButtonTertiary.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useCallback } from 'react';\n\nimport { ButtonBase } from '../../../ButtonBase';\nimport type { IconColor } from '../../../Icon';\nimport { IconSize } from '../../../Icon';\nimport { TextVariant, FontWeight } from '../../../Text';\n\nimport type { ButtonTertiaryProps } from './ButtonTertiary.types';\n\nexport const ButtonTertiary = ({\n  children,\n  textProps,\n  spinnerProps,\n  startIconProps,\n  endIconProps,\n  isDanger = false,\n  isInverse = false,\n  isLoading = false,\n  twClassName = '',\n  style,\n  ...props\n}: ButtonTertiaryProps) => {\n  const tw = useTailwind();\n\n  const getContainerClassName = useCallback(\n    (pressed: boolean): string => {\n      const baseClasses = `\n        ${isInverse && !isDanger ? 'border-[1.5px]' : 'border-0'}\n        ${twClassName}\n      `;\n\n      let backgroundClass = '';\n      let borderClass = '';\n\n      if (isInverse && isDanger) {\n        backgroundClass =\n          pressed || isLoading ? 'bg-default-pressed' : 'bg-default';\n        borderClass =\n          pressed || isLoading\n            ? 'border-background-default-pressed'\n            : 'border-background-default';\n      } else if (isDanger) {\n        backgroundClass =\n          pressed || isLoading ? 'bg-error-muted-pressed' : 'bg-transparent';\n        borderClass =\n          pressed || isLoading\n            ? 'border-error-muted-pressed'\n            : 'border-transparent';\n      } else if (isInverse) {\n        backgroundClass =\n          pressed || isLoading ? 'bg-pressed' : 'bg-transparent';\n        borderClass = 'border-primary-inverse';\n      } else {\n        backgroundClass =\n          pressed || isLoading ? 'bg-pressed' : 'bg-transparent';\n        borderClass =\n          pressed || isLoading\n            ? 'border-background-pressed'\n            : 'border-transparent';\n      }\n\n      return `${backgroundClass} ${borderClass} ${baseClasses}`;\n    },\n    [isInverse, isDanger, isLoading, twClassName],\n  );\n\n  const getTextClassName = useCallback(\n    (pressed: boolean): string => {\n      if (isDanger) {\n        return pressed || isLoading\n          ? 'text-error-default-pressed'\n          : 'text-error-default';\n      } else if (isInverse) {\n        return 'text-primary-inverse';\n      } else {\n        return pressed || isLoading\n          ? 'text-primary-default-pressed'\n          : 'text-primary-default';\n      }\n    },\n    [isDanger, isInverse, isLoading],\n  );\n\n  return (\n    <ButtonBase\n      textProps={{\n        variant: TextVariant.BodyMd,\n        fontWeight: FontWeight.Medium,\n        numberOfLines: 1,\n        ellipsizeMode: 'clip',\n        ...textProps,\n      }}\n      spinnerProps={{\n        ...spinnerProps,\n      }}\n      startIconProps={{\n        size: IconSize.Sm,\n        ...startIconProps,\n      }}\n      endIconProps={{\n        size: IconSize.Sm,\n        ...endIconProps,\n      }}\n      isLoading={isLoading}\n      twClassName={getContainerClassName}\n      textClassName={getTextClassName}\n      iconClassName={getTextClassName}\n      style={style}\n      {...props}\n    >\n      {children}\n    </ButtonBase>\n  );\n};\n"]}

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.d.cts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ButtonTertiaryProps } from "./ButtonTertiary.types.cjs";
+export declare const ButtonTertiary: ({ children, textProps, spinnerProps, startIconProps, endIconProps, isDanger, isInverse, isLoading, twClassName, style, ...props }: ButtonTertiaryProps) => React.JSX.Element;
+//# sourceMappingURL=ButtonTertiary.d.cts.map

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonTertiary.d.cts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/ButtonTertiary.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,cAAc;AAO3C,OAAO,KAAK,EAAE,mBAAmB,EAAE,mCAA+B;AAElE,eAAO,MAAM,cAAc,sIAYxB,mBAAmB,sBA4FrB,CAAC"}

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.d.mts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ButtonTertiaryProps } from "./ButtonTertiary.types.mjs";
+export declare const ButtonTertiary: ({ children, textProps, spinnerProps, startIconProps, endIconProps, isDanger, isInverse, isLoading, twClassName, style, ...props }: ButtonTertiaryProps) => React.JSX.Element;
+//# sourceMappingURL=ButtonTertiary.d.mts.map

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonTertiary.d.mts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/ButtonTertiary.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,cAAc;AAO3C,OAAO,KAAK,EAAE,mBAAmB,EAAE,mCAA+B;AAElE,eAAO,MAAM,cAAc,sIAYxB,mBAAmB,sBA4FrB,CAAC"}

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.mjs

@@ -0,0 +1,86 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+import { useTailwind } from "@metamask-previews/design-system-twrnc-preset";
+import $React, { useCallback } from "react";
+const React = $importDefault($React);
+import { ButtonBase } from "../../../ButtonBase/index.mjs";
+import { IconSize } from "../../../Icon/index.mjs";
+import { TextVariant, FontWeight } from "../../../Text/index.mjs";
+export const ButtonTertiary = ({ children, textProps, spinnerProps, startIconProps, endIconProps, isDanger = false, isInverse = false, isLoading = false, twClassName = '', style, ...props }) => {
+    const tw = useTailwind();
+    const getContainerClassName = useCallback((pressed) => {
+        const baseClasses = `
+        ${isInverse && !isDanger ? 'border-[1.5px]' : 'border-0'}
+        ${twClassName}
+      `;
+        let backgroundClass = '';
+        let borderClass = '';
+        if (isInverse && isDanger) {
+            backgroundClass =
+                pressed || isLoading ? 'bg-default-pressed' : 'bg-default';
+            borderClass =
+                pressed || isLoading
+                    ? 'border-background-default-pressed'
+                    : 'border-background-default';
+        }
+        else if (isDanger) {
+            backgroundClass =
+                pressed || isLoading ? 'bg-error-muted-pressed' : 'bg-transparent';
+            borderClass =
+                pressed || isLoading
+                    ? 'border-error-muted-pressed'
+                    : 'border-transparent';
+        }
+        else if (isInverse) {
+            backgroundClass =
+                pressed || isLoading ? 'bg-pressed' : 'bg-transparent';
+            borderClass = 'border-primary-inverse';
+        }
+        else {
+            backgroundClass =
+                pressed || isLoading ? 'bg-pressed' : 'bg-transparent';
+            borderClass =
+                pressed || isLoading
+                    ? 'border-background-pressed'
+                    : 'border-transparent';
+        }
+        return `${backgroundClass} ${borderClass} ${baseClasses}`;
+    }, [isInverse, isDanger, isLoading, twClassName]);
+    const getTextClassName = useCallback((pressed) => {
+        if (isDanger) {
+            return pressed || isLoading
+                ? 'text-error-default-pressed'
+                : 'text-error-default';
+        }
+        else if (isInverse) {
+            return 'text-primary-inverse';
+        }
+        else {
+            return pressed || isLoading
+                ? 'text-primary-default-pressed'
+                : 'text-primary-default';
+        }
+    }, [isDanger, isInverse, isLoading]);
+    return (<ButtonBase textProps={{
+            variant: TextVariant.BodyMd,
+            fontWeight: FontWeight.Medium,
+            numberOfLines: 1,
+            ellipsizeMode: 'clip',
+            ...textProps,
+        }} spinnerProps={{
+            ...spinnerProps,
+        }} startIconProps={{
+            size: IconSize.Sm,
+            ...startIconProps,
+        }} endIconProps={{
+            size: IconSize.Sm,
+            ...endIconProps,
+        }} isLoading={isLoading} twClassName={getContainerClassName} textClassName={getTextClassName} iconClassName={getTextClassName} style={style} {...props}>
+      {children}
+    </ButtonBase>);
+};
+//# sourceMappingURL=ButtonTertiary.mjs.map

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonTertiary.mjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/ButtonTertiary.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useCallback } from 'react';\n\nimport { ButtonBase } from '../../../ButtonBase';\nimport type { IconColor } from '../../../Icon';\nimport { IconSize } from '../../../Icon';\nimport { TextVariant, FontWeight } from '../../../Text';\n\nimport type { ButtonTertiaryProps } from './ButtonTertiary.types';\n\nexport const ButtonTertiary = ({\n  children,\n  textProps,\n  spinnerProps,\n  startIconProps,\n  endIconProps,\n  isDanger = false,\n  isInverse = false,\n  isLoading = false,\n  twClassName = '',\n  style,\n  ...props\n}: ButtonTertiaryProps) => {\n  const tw = useTailwind();\n\n  const getContainerClassName = useCallback(\n    (pressed: boolean): string => {\n      const baseClasses = `\n        ${isInverse && !isDanger ? 'border-[1.5px]' : 'border-0'}\n        ${twClassName}\n      `;\n\n      let backgroundClass = '';\n      let borderClass = '';\n\n      if (isInverse && isDanger) {\n        backgroundClass =\n          pressed || isLoading ? 'bg-default-pressed' : 'bg-default';\n        borderClass =\n          pressed || isLoading\n            ? 'border-background-default-pressed'\n            : 'border-background-default';\n      } else if (isDanger) {\n        backgroundClass =\n          pressed || isLoading ? 'bg-error-muted-pressed' : 'bg-transparent';\n        borderClass =\n          pressed || isLoading\n            ? 'border-error-muted-pressed'\n            : 'border-transparent';\n      } else if (isInverse) {\n        backgroundClass =\n          pressed || isLoading ? 'bg-pressed' : 'bg-transparent';\n        borderClass = 'border-primary-inverse';\n      } else {\n        backgroundClass =\n          pressed || isLoading ? 'bg-pressed' : 'bg-transparent';\n        borderClass =\n          pressed || isLoading\n            ? 'border-background-pressed'\n            : 'border-transparent';\n      }\n\n      return `${backgroundClass} ${borderClass} ${baseClasses}`;\n    },\n    [isInverse, isDanger, isLoading, twClassName],\n  );\n\n  const getTextClassName = useCallback(\n    (pressed: boolean): string => {\n      if (isDanger) {\n        return pressed || isLoading\n          ? 'text-error-default-pressed'\n          : 'text-error-default';\n      } else if (isInverse) {\n        return 'text-primary-inverse';\n      } else {\n        return pressed || isLoading\n          ? 'text-primary-default-pressed'\n          : 'text-primary-default';\n      }\n    },\n    [isDanger, isInverse, isLoading],\n  );\n\n  return (\n    <ButtonBase\n      textProps={{\n        variant: TextVariant.BodyMd,\n        fontWeight: FontWeight.Medium,\n        numberOfLines: 1,\n        ellipsizeMode: 'clip',\n        ...textProps,\n      }}\n      spinnerProps={{\n        ...spinnerProps,\n      }}\n      startIconProps={{\n        size: IconSize.Sm,\n        ...startIconProps,\n      }}\n      endIconProps={{\n        size: IconSize.Sm,\n        ...endIconProps,\n      }}\n      isLoading={isLoading}\n      twClassName={getContainerClassName}\n      textClassName={getTextClassName}\n      iconClassName={getTextClassName}\n      style={style}\n      {...props}\n    >\n      {children}\n    </ButtonBase>\n  );\n};\n"]}

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.types.cjs

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

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.types.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonTertiary.types.cjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/ButtonTertiary.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonBaseProps } from '../../../ButtonBase';\n\n/**\n * ButtonTertiary component props.\n */\nexport type ButtonTertiaryProps = {\n  /**\n   * Optional prop to show the danger state of the button.\n   *\n   * @default false\n   */\n  isDanger?: boolean;\n  /**\n   * Optional prop to show the inverse state of the button, which is reserved for buttons on colored backgrounds.\n   *\n   * @default false\n   */\n  isInverse?: boolean;\n} & ButtonBaseProps;\n"]}

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.types.d.cts

@@ -0,0 +1,19 @@
+import type { ButtonBaseProps } from "../../../ButtonBase/index.cjs";
+/**
+ * ButtonTertiary component props.
+ */
+export type ButtonTertiaryProps = {
+    /**
+     * Optional prop to show the danger state of the button.
+     *
+     * @default false
+     */
+    isDanger?: boolean;
+    /**
+     * Optional prop to show the inverse state of the button, which is reserved for buttons on colored backgrounds.
+     *
+     * @default false
+     */
+    isInverse?: boolean;
+} & ButtonBaseProps;
+//# sourceMappingURL=ButtonTertiary.types.d.cts.map

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.types.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonTertiary.types.d.cts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/ButtonTertiary.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,sCAA4B;AAE3D;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,GAAG,eAAe,CAAC"}

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.types.d.mts

@@ -0,0 +1,19 @@
+import type { ButtonBaseProps } from "../../../ButtonBase/index.mjs";
+/**
+ * ButtonTertiary component props.
+ */
+export type ButtonTertiaryProps = {
+    /**
+     * Optional prop to show the danger state of the button.
+     *
+     * @default false
+     */
+    isDanger?: boolean;
+    /**
+     * Optional prop to show the inverse state of the button, which is reserved for buttons on colored backgrounds.
+     *
+     * @default false
+     */
+    isInverse?: boolean;
+} & ButtonBaseProps;
+//# sourceMappingURL=ButtonTertiary.types.d.mts.map

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.types.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonTertiary.types.d.mts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/ButtonTertiary.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,sCAA4B;AAE3D;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,GAAG,eAAe,CAAC"}

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.types.mjs

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

package/dist/components/Button/variants/ButtonTertiary/ButtonTertiary.types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonTertiary.types.mjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/ButtonTertiary.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonBaseProps } from '../../../ButtonBase';\n\n/**\n * ButtonTertiary component props.\n */\nexport type ButtonTertiaryProps = {\n  /**\n   * Optional prop to show the danger state of the button.\n   *\n   * @default false\n   */\n  isDanger?: boolean;\n  /**\n   * Optional prop to show the inverse state of the button, which is reserved for buttons on colored backgrounds.\n   *\n   * @default false\n   */\n  isInverse?: boolean;\n} & ButtonBaseProps;\n"]}

package/dist/components/Button/variants/ButtonTertiary/index.cjs

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

package/dist/components/Button/variants/ButtonTertiary/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/index.ts"],"names":[],"mappings":";;;AAAA,qDAAuD;AAA9C,2GAAA,kBAAkB,OAAA;AAC3B,uDAAkD;AAAzC,gHAAA,cAAc,OAAA","sourcesContent":["export { ButtonTertiarySize } from '../../../../types';\nexport { ButtonTertiary } from './ButtonTertiary';\nexport type { ButtonTertiaryProps } from './ButtonTertiary.types';\n"]}

package/dist/components/Button/variants/ButtonTertiary/index.d.cts

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

package/dist/components/Button/variants/ButtonTertiary/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,oCAA0B;AACvD,OAAO,EAAE,cAAc,EAAE,6BAAyB;AAClD,YAAY,EAAE,mBAAmB,EAAE,mCAA+B"}

package/dist/components/Button/variants/ButtonTertiary/index.d.mts

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

package/dist/components/Button/variants/ButtonTertiary/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,oCAA0B;AACvD,OAAO,EAAE,cAAc,EAAE,6BAAyB;AAClD,YAAY,EAAE,mBAAmB,EAAE,mCAA+B"}

package/dist/components/Button/variants/ButtonTertiary/index.mjs

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

package/dist/components/Button/variants/ButtonTertiary/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonTertiary/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,oCAA0B;AACvD,OAAO,EAAE,cAAc,EAAE,6BAAyB","sourcesContent":["export { ButtonTertiarySize } from '../../../../types';\nexport { ButtonTertiary } from './ButtonTertiary';\nexport type { ButtonTertiaryProps } from './ButtonTertiary.types';\n"]}

package/dist/components/ButtonBase/ButtonBase.cjs

@@ -0,0 +1,130 @@
+"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.ButtonBase = void 0;
+const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-twrnc-preset");
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native/index.js");
+const types_1 = require("../../types/index.cjs");
+const Icon_1 = require("../Icon/index.cjs");
+const Icon_2 = require("../Icon/index.cjs");
+const ButtonAnimated_1 = require("../temp-components/ButtonAnimated/index.cjs");
+const Spinner_1 = require("../temp-components/Spinner/index.cjs");
+const TextOrChildren_1 = require("../temp-components/TextOrChildren/TextOrChildren.cjs");
+const Text_1 = require("../Text/index.cjs");
+const ButtonBase_constants_1 = require("./ButtonBase.constants.cjs");
+const ButtonBase = ({ children, textProps, size = types_1.ButtonBaseSize.Lg, isLoading, loadingText, spinnerProps, startIconName, startIconProps, startAccessory, endIconName, endIconProps, endAccessory, isDisabled, isFullWidth, twClassName = '', textClassName, iconClassName, style, accessibilityLabel, accessibilityHint, accessibilityRole = 'button', accessibilityActions, onAccessibilityAction, ...props }) => {
+    const tw = (0, design_system_twrnc_preset_1.useTailwind)();
+    const finalStartIconName = startIconName ?? startIconProps?.name;
+    const finalEndIconName = endIconName ?? endIconProps?.name;
+    // Generate accessibility label if not provided
+    const finalAccessibilityLabel = (0, react_1.useMemo)(() => {
+        if (accessibilityLabel) {
+            return accessibilityLabel;
+        }
+        // For loading state with loadingText, prioritize loadingText
+        if (isLoading && loadingText) {
+            return loadingText;
+        }
+        // If children is a string, use it as the label
+        if (typeof children === 'string') {
+            return children;
+        }
+        return undefined;
+    }, [accessibilityLabel, children, isLoading, loadingText]);
+    // Generate accessibility hint for loading state if not provided
+    const finalAccessibilityHint = (0, react_1.useMemo)(() => {
+        if (accessibilityHint) {
+            return accessibilityHint;
+        }
+        if (isLoading) {
+            return 'Button is currently loading, please wait';
+        }
+        return undefined;
+    }, [accessibilityHint, isLoading]);
+    // Create accessibilityState object with only truthy values
+    const accessibilityState = (0, react_1.useMemo)(() => {
+        const state = {};
+        if (isDisabled || isLoading) {
+            state.disabled = true;
+        }
+        if (isLoading) {
+            state.busy = true;
+        }
+        return state;
+    }, [isDisabled, isLoading]);
+    return (<ButtonAnimated_1.ButtonAnimated disabled={isDisabled || isLoading} accessibilityRole={accessibilityRole} accessibilityLabel={finalAccessibilityLabel} accessibilityHint={finalAccessibilityHint} accessibilityActions={accessibilityActions} onAccessibilityAction={onAccessibilityAction} accessibilityState={accessibilityState} accessible style={({ pressed }) => {
+            const containerClassName = typeof twClassName === 'function'
+                ? twClassName(pressed)
+                : twClassName;
+            const baseContainerClassNames = `
+          flex-row items-center justify-center rounded-xl bg-muted px-4 min-w-[80px] overflow-hidden
+          ${ButtonBase_constants_1.TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION[size]}
+          ${isDisabled ? 'opacity-50' : 'opacity-100'}
+          ${isFullWidth ? 'w-full' : 'w-auto'}
+          ${containerClassName}
+        `;
+            const computedStyle = [
+                tw `${baseContainerClassNames}`,
+            ];
+            if (typeof style === 'function') {
+                const additionalStyle = style({ pressed });
+                if (additionalStyle) {
+                    computedStyle.push(additionalStyle);
+                }
+            }
+            else if (style) {
+                computedStyle.push(style);
+            }
+            return computedStyle;
+        }} {...props}>
+      {({ pressed }) => (<>
+          <react_native_1.View style={tw `absolute inset-0 flex items-center justify-center ${isLoading ? 'opacity-100' : 'opacity-0'}`} testID="spinner-container">
+            <Spinner_1.Spinner color={textClassName
+                ? textClassName(pressed)
+                : Icon_2.IconColor.IconDefault} loadingText={loadingText} loadingTextProps={{
+                numberOfLines: 1,
+                twClassName: textClassName ? textClassName(pressed) : '',
+                ...spinnerProps?.loadingTextProps,
+            }} {...spinnerProps}/>
+          </react_native_1.View>
+          <react_native_1.View style={tw `flex-row items-center justify-center gap-x-2 ${isLoading ? 'opacity-0' : 'opacity-100'}`} testID="content-container">
+            {finalStartIconName ? (<Icon_1.Icon name={finalStartIconName} size={Icon_2.IconSize.Sm} twClassName={`shrink-0 ${iconClassName ? iconClassName(pressed) : ''}`} {...startIconProps}/>) : (startAccessory)}
+            <TextOrChildren_1.TextOrChildren textProps={{
+                variant: Text_1.TextVariant.BodyMd,
+                fontWeight: Text_1.FontWeight.Medium,
+                color: Text_1.TextColor.TextDefault,
+                twClassName: `shrink grow-0 flex-wrap text-center ${textClassName ? textClassName(pressed) : ''}`,
+                ...textProps,
+            }}>
+              {children}
+            </TextOrChildren_1.TextOrChildren>
+            {finalEndIconName ? (<Icon_1.Icon name={finalEndIconName} size={Icon_2.IconSize.Sm} twClassName={`shrink-0 ${iconClassName ? iconClassName(pressed) : ''}`} {...endIconProps}/>) : (endAccessory)}
+          </react_native_1.View>
+        </>)}
+    </ButtonAnimated_1.ButtonAnimated>);
+};
+exports.ButtonBase = ButtonBase;
+//# sourceMappingURL=ButtonBase.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.cjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useMemo } from 'react';\nimport { View } from 'react-native';\nimport type { StyleProp, ViewStyle } from 'react-native';\n\nimport { ButtonBaseSize } from '../../types';\nimport { Icon } from '../Icon';\nimport { IconColor, IconSize } from '../Icon';\nimport { ButtonAnimated } from '../temp-components/ButtonAnimated';\nimport { Spinner } from '../temp-components/Spinner';\nimport { TextOrChildren } from '../temp-components/TextOrChildren/TextOrChildren';\nimport { TextVariant, FontWeight, TextColor } from '../Text';\n\nimport { TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION } from './ButtonBase.constants';\nimport type { ButtonBaseProps } from './ButtonBase.types';\n\nexport const ButtonBase = ({\n  children,\n  textProps,\n  size = ButtonBaseSize.Lg,\n  isLoading,\n  loadingText,\n  spinnerProps,\n  startIconName,\n  startIconProps,\n  startAccessory,\n  endIconName,\n  endIconProps,\n  endAccessory,\n  isDisabled,\n  isFullWidth,\n  twClassName = '',\n  textClassName,\n  iconClassName,\n  style,\n  accessibilityLabel,\n  accessibilityHint,\n  accessibilityRole = 'button',\n  accessibilityActions,\n  onAccessibilityAction,\n  ...props\n}: ButtonBaseProps) => {\n  const tw = useTailwind();\n\n  const finalStartIconName = startIconName ?? startIconProps?.name;\n  const finalEndIconName = endIconName ?? endIconProps?.name;\n\n  // Generate accessibility label if not provided\n  const finalAccessibilityLabel = useMemo(() => {\n    if (accessibilityLabel) {\n      return accessibilityLabel;\n    }\n\n    // For loading state with loadingText, prioritize loadingText\n    if (isLoading && loadingText) {\n      return loadingText;\n    }\n\n    // If children is a string, use it as the label\n    if (typeof children === 'string') {\n      return children;\n    }\n\n    return undefined;\n  }, [accessibilityLabel, children, isLoading, loadingText]);\n\n  // Generate accessibility hint for loading state if not provided\n  const finalAccessibilityHint = useMemo(() => {\n    if (accessibilityHint) {\n      return accessibilityHint;\n    }\n\n    if (isLoading) {\n      return 'Button is currently loading, please wait';\n    }\n\n    return undefined;\n  }, [accessibilityHint, isLoading]);\n\n  // Create accessibilityState object with only truthy values\n  const accessibilityState = useMemo(() => {\n    const state: { disabled?: boolean; busy?: boolean } = {};\n\n    if (isDisabled || isLoading) {\n      state.disabled = true;\n    }\n\n    if (isLoading) {\n      state.busy = true;\n    }\n\n    return state;\n  }, [isDisabled, isLoading]);\n\n  return (\n    <ButtonAnimated\n      disabled={isDisabled || isLoading}\n      accessibilityRole={accessibilityRole}\n      accessibilityLabel={finalAccessibilityLabel}\n      accessibilityHint={finalAccessibilityHint}\n      accessibilityActions={accessibilityActions}\n      onAccessibilityAction={onAccessibilityAction}\n      accessibilityState={accessibilityState}\n      accessible\n      style={({ pressed }) => {\n        const containerClassName =\n          typeof twClassName === 'function'\n            ? twClassName(pressed)\n            : twClassName;\n\n        const baseContainerClassNames = `\n          flex-row items-center justify-center rounded-xl bg-muted px-4 min-w-[80px] overflow-hidden\n          ${TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION[size]}\n          ${isDisabled ? 'opacity-50' : 'opacity-100'}\n          ${isFullWidth ? 'w-full' : 'w-auto'}\n          ${containerClassName}\n        `;\n\n        const computedStyle: StyleProp<ViewStyle>[] = [\n          tw`${baseContainerClassNames}`,\n        ];\n        if (typeof style === 'function') {\n          const additionalStyle = style({ pressed });\n          if (additionalStyle) {\n            computedStyle.push(additionalStyle);\n          }\n        } else if (style) {\n          computedStyle.push(style);\n        }\n\n        return computedStyle;\n      }}\n      {...props}\n    >\n      {({ pressed }) => (\n        <>\n          <View\n            style={tw`absolute inset-0 flex items-center justify-center ${\n              isLoading ? 'opacity-100' : 'opacity-0'\n            }`}\n            testID=\"spinner-container\"\n          >\n            <Spinner\n              color={\n                textClassName\n                  ? (textClassName(pressed) as IconColor)\n                  : IconColor.IconDefault\n              }\n              loadingText={loadingText}\n              loadingTextProps={{\n                numberOfLines: 1,\n                twClassName: textClassName ? textClassName(pressed) : '',\n                ...spinnerProps?.loadingTextProps,\n              }}\n              {...spinnerProps}\n            />\n          </View>\n          <View\n            style={tw`flex-row items-center justify-center gap-x-2 ${\n              isLoading ? 'opacity-0' : 'opacity-100'\n            }`}\n            testID=\"content-container\"\n          >\n            {finalStartIconName ? (\n              <Icon\n                name={finalStartIconName}\n                size={IconSize.Sm}\n                twClassName={`shrink-0 ${iconClassName ? iconClassName(pressed) : ''}`}\n                {...startIconProps}\n              />\n            ) : (\n              startAccessory\n            )}\n            <TextOrChildren\n              textProps={{\n                variant: TextVariant.BodyMd,\n                fontWeight: FontWeight.Medium,\n                color: TextColor.TextDefault,\n                twClassName: `shrink grow-0 flex-wrap text-center ${textClassName ? textClassName(pressed) : ''}`,\n                ...textProps,\n              }}\n            >\n              {children}\n            </TextOrChildren>\n            {finalEndIconName ? (\n              <Icon\n                name={finalEndIconName}\n                size={IconSize.Sm}\n                twClassName={`shrink-0 ${iconClassName ? iconClassName(pressed) : ''}`}\n                {...endIconProps}\n              />\n            ) : (\n              endAccessory\n            )}\n          </View>\n        </>\n      )}\n    </ButtonAnimated>\n  );\n};\n"]}

package/dist/components/ButtonBase/ButtonBase.constants.cjs

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION = void 0;
+const types_1 = require("../../types/index.cjs");
+exports.TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION = {
+    [types_1.ButtonBaseSize.Sm]: 'h-8',
+    [types_1.ButtonBaseSize.Md]: 'h-10',
+    [types_1.ButtonBaseSize.Lg]: 'h-12', // size (48px).
+};
+//# sourceMappingURL=ButtonBase.constants.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.constants.cjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.constants.ts"],"names":[],"mappings":";;;AAAA,iDAA6C;AAEhC,QAAA,oCAAoC,GAG7C;IACF,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,KAAK;IAC1B,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,MAAM;IAC3B,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,eAAe;CAC7C,CAAC","sourcesContent":["import { ButtonBaseSize } from '../../types';\n\nexport const TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION: Record<\n  ButtonBaseSize,\n  string\n> = {\n  [ButtonBaseSize.Sm]: 'h-8', // size (32px).\n  [ButtonBaseSize.Md]: 'h-10', // size (40px).\n  [ButtonBaseSize.Lg]: 'h-12', // size (48px).\n};\n"]}

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

@@ -0,0 +1,3 @@
+import { ButtonBaseSize } from "../../types/index.cjs";
+export declare const TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION: Record<ButtonBaseSize, string>;
+//# sourceMappingURL=ButtonBase.constants.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.constants.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAE7C,eAAO,MAAM,oCAAoC,EAAE,MAAM,CACvD,cAAc,EACd,MAAM,CAKP,CAAC"}

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

@@ -0,0 +1,3 @@
+import { ButtonBaseSize } from "../../types/index.mjs";
+export declare const TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION: Record<ButtonBaseSize, string>;
+//# sourceMappingURL=ButtonBase.constants.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.constants.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAE7C,eAAO,MAAM,oCAAoC,EAAE,MAAM,CACvD,cAAc,EACd,MAAM,CAKP,CAAC"}

package/dist/components/ButtonBase/ButtonBase.constants.mjs

@@ -0,0 +1,7 @@
+import { ButtonBaseSize } from "../../types/index.mjs";
+export const TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION = {
+    [ButtonBaseSize.Sm]: 'h-8',
+    [ButtonBaseSize.Md]: 'h-10',
+    [ButtonBaseSize.Lg]: 'h-12', // size (48px).
+};
+//# sourceMappingURL=ButtonBase.constants.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.constants.mjs","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAE7C,MAAM,CAAC,MAAM,oCAAoC,GAG7C;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,KAAK;IAC1B,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,MAAM;IAC3B,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,eAAe;CAC7C,CAAC","sourcesContent":["import { ButtonBaseSize } from '../../types';\n\nexport const TWCLASSMAP_BUTTONBASE_SIZE_DIMENSION: Record<\n  ButtonBaseSize,\n  string\n> = {\n  [ButtonBaseSize.Sm]: 'h-8', // size (32px).\n  [ButtonBaseSize.Md]: 'h-10', // size (40px).\n  [ButtonBaseSize.Lg]: 'h-12', // size (48px).\n};\n"]}

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

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ButtonBaseProps } from "./ButtonBase.types.cjs";
+export declare const ButtonBase: ({ children, textProps, size, isLoading, loadingText, spinnerProps, startIconName, startIconProps, startAccessory, endIconName, endIconProps, endAccessory, isDisabled, isFullWidth, twClassName, textClassName, iconClassName, style, accessibilityLabel, accessibilityHint, accessibilityRole, accessibilityActions, onAccessibilityAction, ...props }: ButtonBaseProps) => React.JSX.Element;
+//# sourceMappingURL=ButtonBase.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"AACA,OAAO,KAAkB,cAAc;AAavC,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,4VAyBpB,eAAe,sBA8JjB,CAAC"}