@metamask-previews/design-system-react-native 0.0.0-preview.bf69b6b → 0.0.0-preview.fbd1fe9

package/dist/components/TextButton/TextButton.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextButton.types.js","sourceRoot":"","sources":["../../../src/components/TextButton/TextButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { PressableProps, StyleProp, ViewStyle } from 'react-native';\nimport type { TextProps } from 'src/components/Text/Text.types';\n\nimport type { SpinnerProps } from '../../temp-components/Spinner';\nimport type { IconProps, IconName } from '../Icon';\n\n/**\n * TextButton component props.\n */\nexport type TextButtonProps = {\n  /**\n   * Required prop for the content to be rendered within the TextButton\n   */\n  children: string;\n  /**\n   * Optional props to be passed to the Text component when children is a string\n   */\n  textProps?: Omit<Partial<TextProps>, 'children'>;\n  /**\n   * Optional prop that when true, shows a loading spinner\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 prop to pass additional properties to the end icon\n   */\n  spinnerProps?: Partial<SpinnerProps>;\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   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Optional prop to show the inverse state of the button, which is reserved for buttons on colored backgrounds.\n   * @default false\n   */\n  isInverse?: boolean;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n  /**\n   * Optional prop to control the style.\n   */\n  style?: StyleProp<ViewStyle>;\n} & Omit<PressableProps, 'disabled'>;\n"]}

package/dist/components/TextButton/TextButton.utilities.d.ts

@@ -0,0 +1,55 @@
+import type { TextButtonProps } from './TextButton.types';
+/**
+ * Generates a Tailwind class name for the text button container based on its state and optional additional classes.
+ *
+ * This function computes the appropriate background class name for a text button's container, considering its
+ * `isPressed` and `isLoading` states. Additional Tailwind class names can also be appended using the `twClassName` parameter.
+ *
+ * @param isPressed - Indicates whether the button is currently being pressed.
+ * @param isLoading - Indicates whether the button is in a loading state.
+ * @param isDisabled - Indicates whether the button is in a disabled state.
+ * @param twClassName - Additional Tailwind class names for customization.
+ * @returns A combined string of Tailwind class names for the container's background styling.
+ *
+ * Example:
+ * ```
+ * const classNames = generateTextButtonContainerClassNames({
+ *   isPressed: true,
+ *   isLoading: false,
+ *   twClassName: 'rounded-full',
+ * });
+ *
+ * console.log(classNames);
+ * // Output: "bg-background-pressed rounded-full"
+ * ```
+ */
+export declare const generateTextButtonContainerClassNames: ({ isPressed, isLoading, isDisabled, twClassName, }: Partial<TextButtonProps> & {
+    isPressed?: boolean | undefined;
+}) => string;
+/**
+ * Generates a Tailwind class name for the text button's text based on its state.
+ *
+ * This function computes the appropriate text color and style class names for a text button,
+ * considering its `isPressed`, `isInverse`, and `isLoading` states.
+ *
+ * @param isPressed - Indicates whether the button is currently being pressed.
+ * @param isInverse - Indicates whether the button is using an "inverse" theme.
+ * @param isLoading - Indicates whether the button is in a loading state.
+ * @returns A combined string of Tailwind class names for the text's color and style.
+ *
+ * Example:
+ * ```
+ * const classNames = generateTextButtonTextClassNames({
+ *   isPressed: true,
+ *   isInverse: false,
+ *   isLoading: false,
+ * });
+ *
+ * console.log(classNames);
+ * // Output: "text-primary-defaultPressed underline"
+ * ```
+ */
+export declare const generateTextButtonTextClassNames: ({ isPressed, isInverse, isLoading, }: Partial<TextButtonProps> & {
+    isPressed?: boolean | undefined;
+}) => string;
+//# sourceMappingURL=TextButton.utilities.d.ts.map

package/dist/components/TextButton/TextButton.utilities.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextButton.utilities.d.ts","sourceRoot":"","sources":["../../../src/components/TextButton/TextButton.utilities.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,qCAAqC;;MAO9C,MAQH,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,gCAAgC;;MAMzC,MAeH,CAAC"}

package/dist/components/TextButton/TextButton.utilities.js

@@ -0,0 +1,77 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateTextButtonTextClassNames = exports.generateTextButtonContainerClassNames = void 0;
+/**
+ * Generates a Tailwind class name for the text button container based on its state and optional additional classes.
+ *
+ * This function computes the appropriate background class name for a text button's container, considering its
+ * `isPressed` and `isLoading` states. Additional Tailwind class names can also be appended using the `twClassName` parameter.
+ *
+ * @param isPressed - Indicates whether the button is currently being pressed.
+ * @param isLoading - Indicates whether the button is in a loading state.
+ * @param isDisabled - Indicates whether the button is in a disabled state.
+ * @param twClassName - Additional Tailwind class names for customization.
+ * @returns A combined string of Tailwind class names for the container's background styling.
+ *
+ * Example:
+ * ```
+ * const classNames = generateTextButtonContainerClassNames({
+ *   isPressed: true,
+ *   isLoading: false,
+ *   twClassName: 'rounded-full',
+ * });
+ *
+ * console.log(classNames);
+ * // Output: "bg-background-pressed rounded-full"
+ * ```
+ */
+const generateTextButtonContainerClassNames = ({ isPressed = false, isLoading = false, isDisabled = false, twClassName = '', }) => {
+    const isPressedOrLoading = isPressed || isLoading;
+    const backgroundStyle = isPressedOrLoading
+        ? 'bg-background-pressed'
+        : 'bg-transparent';
+    const opacityStyle = `opacity-${isDisabled ? 50 : 100}`;
+    return `${backgroundStyle} ${opacityStyle} ${twClassName}`;
+};
+exports.generateTextButtonContainerClassNames = generateTextButtonContainerClassNames;
+/**
+ * Generates a Tailwind class name for the text button's text based on its state.
+ *
+ * This function computes the appropriate text color and style class names for a text button,
+ * considering its `isPressed`, `isInverse`, and `isLoading` states.
+ *
+ * @param isPressed - Indicates whether the button is currently being pressed.
+ * @param isInverse - Indicates whether the button is using an "inverse" theme.
+ * @param isLoading - Indicates whether the button is in a loading state.
+ * @returns A combined string of Tailwind class names for the text's color and style.
+ *
+ * Example:
+ * ```
+ * const classNames = generateTextButtonTextClassNames({
+ *   isPressed: true,
+ *   isInverse: false,
+ *   isLoading: false,
+ * });
+ *
+ * console.log(classNames);
+ * // Output: "text-primary-defaultPressed underline"
+ * ```
+ */
+const generateTextButtonTextClassNames = ({ isPressed = false, isInverse = false, isLoading = false, }) => {
+    let textColor, textStyle;
+    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+    const isPressedOrLoading = isPressed || isLoading;
+    if (isInverse) {
+        textColor = 'text-primary-inverse';
+        textStyle = 'underline';
+    }
+    else {
+        textColor = isPressedOrLoading
+            ? 'text-primary-defaultPressed'
+            : 'text-primary-default';
+        textStyle = isPressedOrLoading ? 'underline' : 'no-underline';
+    }
+    return `${textColor} ${textStyle}`;
+};
+exports.generateTextButtonTextClassNames = generateTextButtonTextClassNames;
+//# sourceMappingURL=TextButton.utilities.js.map

package/dist/components/TextButton/TextButton.utilities.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextButton.utilities.js","sourceRoot":"","sources":["../../../src/components/TextButton/TextButton.utilities.ts"],"names":[],"mappings":";;;AAIA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACI,MAAM,qCAAqC,GAAG,CAAC,EACpD,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,WAAW,GAAG,EAAE,GAGjB,EAAU,EAAE;IACX,MAAM,kBAAkB,GAAG,SAAS,IAAI,SAAS,CAAC;IAClD,MAAM,eAAe,GAAG,kBAAkB;QACxC,CAAC,CAAC,uBAAuB;QACzB,CAAC,CAAC,gBAAgB,CAAC;IACrB,MAAM,YAAY,GAAG,WAAW,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC;IAExD,OAAO,GAAG,eAAe,IAAI,YAAY,IAAI,WAAW,EAAE,CAAC;AAC7D,CAAC,CAAC;AAfW,QAAA,qCAAqC,yCAehD;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACI,MAAM,gCAAgC,GAAG,CAAC,EAC/C,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,GAGlB,EAAU,EAAE;IACX,IAAI,SAAS,EAAE,SAAS,CAAC;IACzB,wEAAwE;IACxE,MAAM,kBAAkB,GAAG,SAAS,IAAI,SAAS,CAAC;IAClD,IAAI,SAAS,EAAE;QACb,SAAS,GAAG,sBAAsB,CAAC;QACnC,SAAS,GAAG,WAAW,CAAC;KACzB;SAAM;QACL,SAAS,GAAG,kBAAkB;YAC5B,CAAC,CAAC,6BAA6B;YAC/B,CAAC,CAAC,sBAAsB,CAAC;QAC3B,SAAS,GAAG,kBAAkB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,cAAc,CAAC;KAC/D;IAED,OAAO,GAAG,SAAS,IAAI,SAAS,EAAE,CAAC;AACrC,CAAC,CAAC;AArBW,QAAA,gCAAgC,oCAqB3C","sourcesContent":["/* eslint-disable jsdoc/check-param-names */\n/* eslint-disable jsdoc/require-param */\nimport type { TextButtonProps } from './TextButton.types';\n\n/**\n * Generates a Tailwind class name for the text button container based on its state and optional additional classes.\n *\n * This function computes the appropriate background class name for a text button's container, considering its\n * `isPressed` and `isLoading` states. Additional Tailwind class names can also be appended using the `twClassName` parameter.\n *\n * @param isPressed - Indicates whether the button is currently being pressed.\n * @param isLoading - Indicates whether the button is in a loading state.\n * @param isDisabled - Indicates whether the button is in a disabled state.\n * @param twClassName - Additional Tailwind class names for customization.\n * @returns A combined string of Tailwind class names for the container's background styling.\n *\n * Example:\n * ```\n * const classNames = generateTextButtonContainerClassNames({\n *   isPressed: true,\n *   isLoading: false,\n *   twClassName: 'rounded-full',\n * });\n *\n * console.log(classNames);\n * // Output: \"bg-background-pressed rounded-full\"\n * ```\n */\nexport const generateTextButtonContainerClassNames = ({\n  isPressed = false,\n  isLoading = false,\n  isDisabled = false,\n  twClassName = '',\n}: Partial<TextButtonProps> & {\n  isPressed?: boolean;\n}): string => {\n  const isPressedOrLoading = isPressed || isLoading;\n  const backgroundStyle = isPressedOrLoading\n    ? 'bg-background-pressed'\n    : 'bg-transparent';\n  const opacityStyle = `opacity-${isDisabled ? 50 : 100}`;\n\n  return `${backgroundStyle} ${opacityStyle} ${twClassName}`;\n};\n\n/**\n * Generates a Tailwind class name for the text button's text based on its state.\n *\n * This function computes the appropriate text color and style class names for a text button,\n * considering its `isPressed`, `isInverse`, and `isLoading` states.\n *\n * @param isPressed - Indicates whether the button is currently being pressed.\n * @param isInverse - Indicates whether the button is using an \"inverse\" theme.\n * @param isLoading - Indicates whether the button is in a loading state.\n * @returns A combined string of Tailwind class names for the text's color and style.\n *\n * Example:\n * ```\n * const classNames = generateTextButtonTextClassNames({\n *   isPressed: true,\n *   isInverse: false,\n *   isLoading: false,\n * });\n *\n * console.log(classNames);\n * // Output: \"text-primary-defaultPressed underline\"\n * ```\n */\nexport const generateTextButtonTextClassNames = ({\n  isPressed = false,\n  isInverse = false,\n  isLoading = false,\n}: Partial<TextButtonProps> & {\n  isPressed?: boolean;\n}): string => {\n  let textColor, textStyle;\n  // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing\n  const isPressedOrLoading = isPressed || isLoading;\n  if (isInverse) {\n    textColor = 'text-primary-inverse';\n    textStyle = 'underline';\n  } else {\n    textColor = isPressedOrLoading\n      ? 'text-primary-defaultPressed'\n      : 'text-primary-default';\n    textStyle = isPressedOrLoading ? 'underline' : 'no-underline';\n  }\n\n  return `${textColor} ${textStyle}`;\n};\n"]}

package/dist/components/TextButton/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './TextButton';
+export type { TextButtonProps } from './TextButton.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/TextButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TextButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/TextButton/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var TextButton_1 = require("./TextButton");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(TextButton_1).default; } });
+//# sourceMappingURL=index.js.map

package/dist/components/TextButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/TextButton/index.ts"],"names":[],"mappings":";;;;;;AAAA,2CAAuC;AAA9B,sHAAA,OAAO,OAAA","sourcesContent":["export { default } from './TextButton';\nexport type { TextButtonProps } from './TextButton.types';\n"]}

package/dist/index.d.ts

@@ -1,10 +1,10 @@
-export declare const Text: import("react").ForwardRefExoticComponent<Omit<{
+export declare const Text: import("react").ForwardRefExoticComponent<{
     variant?: import("./components/Text").TextVariant | undefined;
     children: import("react").ReactNode;
     color?: import("./components/Text").TextColor | undefined;
     fontWeight?: import("./components/Text").FontWeight | undefined;
     fontStyle?: import("./components/Text").FontStyle | undefined;
     twClassName?: string | undefined;
-} & import("react-native").TextProps & import("react").RefAttributes<any>, "ref"> & import("react").RefAttributes<any>>;
+} & import("react-native").TextProps & import("react").RefAttributes<any>>;
 export { TextVariant, TextColor, FontWeight, FontStyle, } from './components/Text';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI;;;;;;;uHAAmC,CAAC;AACrD,OAAO,EACL,WAAW,EACX,SAAS,EACT,UAAU,EACV,SAAS,GACV,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI;;;;;;;0EAAmC,CAAC;AACrD,OAAO,EACL,WAAW,EACX,SAAS,EACT,UAAU,EACV,SAAS,GACV,MAAM,mBAAmB,CAAC"}

package/dist/primitives/ButtonAnimated/ButtonAnimated.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { ButtonAnimatedProps } from './ButtonAnimated.types';
+declare const ButtonAnimated: ({ onPressIn, onPressOut, disabled, ...props }: ButtonAnimatedProps) => React.JSX.Element;
+export default ButtonAnimated;
+//# sourceMappingURL=ButtonAnimated.d.ts.map

package/dist/primitives/ButtonAnimated/ButtonAnimated.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonAnimated.d.ts","sourceRoot":"","sources":["../../../src/primitives/ButtonAnimated/ButtonAnimated.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAElE,QAAA,MAAM,cAAc,kDAKjB,mBAAmB,sBAoCrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/primitives/ButtonAnimated/ButtonAnimated.js

@@ -0,0 +1,58 @@
+"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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const react_native_reanimated_1 = __importStar(require("react-native-reanimated"));
+const ButtonAnimated = ({ onPressIn, onPressOut, disabled, ...props }) => {
+    const animation = (0, react_native_reanimated_1.useSharedValue)(1);
+    const scaleStyle = (0, react_native_reanimated_1.useAnimatedStyle)(() => {
+        return {
+            transform: [{ scale: animation.value }],
+        };
+    });
+    const onPressInHandler = (event) => {
+        animation.value = (0, react_native_reanimated_1.withTiming)(0.97, {
+            duration: 100,
+            easing: react_native_reanimated_1.Easing.bezier(0.3, 0.8, 0.3, 1),
+        });
+        onPressIn?.(event);
+    };
+    const onPressOutHandler = (event) => {
+        animation.value = (0, react_native_reanimated_1.withTiming)(1, {
+            duration: 100,
+            easing: react_native_reanimated_1.Easing.bezier(0.3, 0.8, 0.3, 1),
+        });
+        onPressOut?.(event);
+    };
+    return (<react_native_reanimated_1.default.View style={[scaleStyle, { alignItems: 'center', justifyContent: 'center' }]}>
+      <react_native_1.Pressable onPressIn={onPressInHandler} onPressOut={onPressOutHandler} disabled={disabled} {...props}/>
+    </react_native_reanimated_1.default.View>);
+};
+exports.default = ButtonAnimated;
+//# sourceMappingURL=ButtonAnimated.js.map

package/dist/primitives/ButtonAnimated/ButtonAnimated.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonAnimated.js","sourceRoot":"","sources":["../../../src/primitives/ButtonAnimated/ButtonAnimated.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAE1B,+CAAyC;AACzC,mFAKiC;AAIjC,MAAM,cAAc,GAAG,CAAC,EACtB,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,KAAK,EACY,EAAE,EAAE;IACxB,MAAM,SAAS,GAAG,IAAA,wCAAc,EAAC,CAAC,CAAC,CAAC;IACpC,MAAM,UAAU,GAAG,IAAA,0CAAgB,EAAC,GAAG,EAAE;QACvC,OAAO;YACL,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,KAAK,EAAE,CAAC;SACxC,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,MAAM,gBAAgB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACxD,SAAS,CAAC,KAAK,GAAG,IAAA,oCAAU,EAAC,IAAI,EAAE;YACjC,QAAQ,EAAE,GAAG;YACb,MAAM,EAAE,gCAAM,CAAC,MAAM,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;SACxC,CAAC,CAAC;QACH,SAAS,EAAE,CAAC,KAAK,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,KAA4B,EAAE,EAAE;QACzD,SAAS,CAAC,KAAK,GAAG,IAAA,oCAAU,EAAC,CAAC,EAAE;YAC9B,QAAQ,EAAE,GAAG;YACb,MAAM,EAAE,gCAAM,CAAC,MAAM,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;SACxC,CAAC,CAAC;QACH,UAAU,EAAE,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,iCAAQ,CAAC,IAAI,CACZ,KAAK,CAAC,CAAC,CAAC,UAAU,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,CAAC,CAAC,CAExE;MAAA,CAAC,wBAAS,CACR,SAAS,CAAC,CAAC,gBAAgB,CAAC,CAC5B,UAAU,CAAC,CAAC,iBAAiB,CAAC,CAC9B,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,IAAI,KAAK,CAAC,EAEd;IAAA,EAAE,iCAAQ,CAAC,IAAI,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,cAAc,CAAC","sourcesContent":["import React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport { Pressable } from 'react-native';\nimport Animated, {\n  useSharedValue,\n  useAnimatedStyle,\n  withTiming,\n  Easing,\n} from 'react-native-reanimated';\n\nimport type { ButtonAnimatedProps } from './ButtonAnimated.types';\n\nconst ButtonAnimated = ({\n  onPressIn,\n  onPressOut,\n  disabled,\n  ...props\n}: ButtonAnimatedProps) => {\n  const animation = useSharedValue(1);\n  const scaleStyle = useAnimatedStyle(() => {\n    return {\n      transform: [{ scale: animation.value }],\n    };\n  });\n\n  const onPressInHandler = (event: GestureResponderEvent) => {\n    animation.value = withTiming(0.97, {\n      duration: 100,\n      easing: Easing.bezier(0.3, 0.8, 0.3, 1),\n    });\n    onPressIn?.(event);\n  };\n\n  const onPressOutHandler = (event: GestureResponderEvent) => {\n    animation.value = withTiming(1, {\n      duration: 100,\n      easing: Easing.bezier(0.3, 0.8, 0.3, 1),\n    });\n    onPressOut?.(event);\n  };\n\n  return (\n    <Animated.View\n      style={[scaleStyle, { alignItems: 'center', justifyContent: 'center' }]}\n    >\n      <Pressable\n        onPressIn={onPressInHandler}\n        onPressOut={onPressOutHandler}\n        disabled={disabled}\n        {...props}\n      />\n    </Animated.View>\n  );\n};\n\nexport default ButtonAnimated;\n"]}

package/dist/primitives/ButtonAnimated/ButtonAnimated.types.d.ts

@@ -0,0 +1,6 @@
+import type { PressableProps } from 'react-native';
+/**
+ * ButtonAnimated component props.
+ */
+export type ButtonAnimatedProps = PressableProps;
+//# sourceMappingURL=ButtonAnimated.types.d.ts.map

package/dist/primitives/ButtonAnimated/ButtonAnimated.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonAnimated.types.d.ts","sourceRoot":"","sources":["../../../src/primitives/ButtonAnimated/ButtonAnimated.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC"}

package/dist/primitives/ButtonAnimated/ButtonAnimated.types.js

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

package/dist/primitives/ButtonAnimated/ButtonAnimated.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonAnimated.types.js","sourceRoot":"","sources":["../../../src/primitives/ButtonAnimated/ButtonAnimated.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { PressableProps } from 'react-native';\n\n/**\n * ButtonAnimated component props.\n */\nexport type ButtonAnimatedProps = PressableProps;\n"]}

package/dist/primitives/ButtonAnimated/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './ButtonAnimated';
+//# sourceMappingURL=index.d.ts.map

package/dist/primitives/ButtonAnimated/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/primitives/ButtonAnimated/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/primitives/ButtonAnimated/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var ButtonAnimated_1 = require("./ButtonAnimated");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ButtonAnimated_1).default; } });
+//# sourceMappingURL=index.js.map

package/dist/primitives/ButtonAnimated/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/primitives/ButtonAnimated/index.ts"],"names":[],"mappings":";;;;;;AAAA,mDAA2C;AAAlC,0HAAA,OAAO,OAAA","sourcesContent":["export { default } from './ButtonAnimated';\n"]}

package/dist/primitives/ButtonBase/ButtonBase.constants.d.ts

@@ -0,0 +1,3 @@
+import type { ButtonBaseProps } from './ButtonBase.types';
+export declare const DEFAULT_BUTTONBASE_PROPS: Pick<ButtonBaseProps, 'textProps' | 'size' | 'isLoading' | 'spinnerProps' | 'startIconProps' | 'endIconProps' | 'isDisabled' | 'isFullWidth'>;
+//# sourceMappingURL=ButtonBase.constants.d.ts.map

package/dist/primitives/ButtonBase/ButtonBase.constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.constants.d.ts","sourceRoot":"","sources":["../../../src/primitives/ButtonBase/ButtonBase.constants.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAI1D,eAAO,MAAM,wBAAwB,EAAE,IAAI,CACzC,eAAe,EACb,WAAW,GACX,MAAM,GACN,WAAW,GACX,cAAc,GACd,gBAAgB,GAChB,cAAc,GACd,YAAY,GACZ,aAAa,CAwBhB,CAAC"}

package/dist/primitives/ButtonBase/ButtonBase.constants.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_BUTTONBASE_PROPS = void 0;
+const Icon_1 = require("../../components/Icon");
+const Text_1 = require("../../components/Text");
+const ButtonBase_types_1 = require("./ButtonBase.types");
+// Defaults
+exports.DEFAULT_BUTTONBASE_PROPS = {
+    textProps: {
+        variant: Text_1.TextVariant.BodyMd,
+        fontWeight: Text_1.FontWeight.Medium,
+        color: Text_1.TextColor.TextDefault,
+        numberOfLines: 1,
+        ellipsizeMode: 'clip',
+    },
+    size: ButtonBase_types_1.ButtonBaseSize.Lg,
+    isLoading: false,
+    spinnerProps: {
+        color: Icon_1.IconColor.IconDefault,
+    },
+    startIconProps: {
+        size: Icon_1.IconSize.Sm,
+        testID: 'start-icon',
+    },
+    endIconProps: {
+        size: Icon_1.IconSize.Sm,
+        testID: 'end-icon',
+    },
+    isDisabled: false,
+    isFullWidth: false,
+};
+//# sourceMappingURL=ButtonBase.constants.js.map

package/dist/primitives/ButtonBase/ButtonBase.constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.constants.js","sourceRoot":"","sources":["../../../src/primitives/ButtonBase/ButtonBase.constants.ts"],"names":[],"mappings":";;;AAAA,gDAA4D;AAC5D,gDAA2E;AAE3E,yDAAoD;AAEpD,WAAW;AACE,QAAA,wBAAwB,GAUjC;IACF,SAAS,EAAE;QACT,OAAO,EAAE,kBAAW,CAAC,MAAM;QAC3B,UAAU,EAAE,iBAAU,CAAC,MAAM;QAC7B,KAAK,EAAE,gBAAS,CAAC,WAAW;QAC5B,aAAa,EAAE,CAAC;QAChB,aAAa,EAAE,MAAM;KACtB;IACD,IAAI,EAAE,iCAAc,CAAC,EAAE;IACvB,SAAS,EAAE,KAAK;IAChB,YAAY,EAAE;QACZ,KAAK,EAAE,gBAAS,CAAC,WAAW;KAC7B;IACD,cAAc,EAAE;QACd,IAAI,EAAE,eAAQ,CAAC,EAAE;QACjB,MAAM,EAAE,YAAY;KACrB;IACD,YAAY,EAAE;QACZ,IAAI,EAAE,eAAQ,CAAC,EAAE;QACjB,MAAM,EAAE,UAAU;KACnB;IACD,UAAU,EAAE,KAAK;IACjB,WAAW,EAAE,KAAK;CACnB,CAAC","sourcesContent":["import { IconSize, IconColor } from '../../components/Icon';\nimport { TextColor, TextVariant, FontWeight } from '../../components/Text';\nimport type { ButtonBaseProps } from './ButtonBase.types';\nimport { ButtonBaseSize } from './ButtonBase.types';\n\n// Defaults\nexport const DEFAULT_BUTTONBASE_PROPS: Pick<\n  ButtonBaseProps,\n  | 'textProps'\n  | 'size'\n  | 'isLoading'\n  | 'spinnerProps'\n  | 'startIconProps'\n  | 'endIconProps'\n  | 'isDisabled'\n  | 'isFullWidth'\n> = {\n  textProps: {\n    variant: TextVariant.BodyMd,\n    fontWeight: FontWeight.Medium,\n    color: TextColor.TextDefault,\n    numberOfLines: 1,\n    ellipsizeMode: 'clip',\n  },\n  size: ButtonBaseSize.Lg,\n  isLoading: false,\n  spinnerProps: {\n    color: IconColor.IconDefault,\n  },\n  startIconProps: {\n    size: IconSize.Sm,\n    testID: 'start-icon',\n  },\n  endIconProps: {\n    size: IconSize.Sm,\n    testID: 'end-icon',\n  },\n  isDisabled: false,\n  isFullWidth: false,\n};\n"]}

package/dist/primitives/ButtonBase/ButtonBase.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { ButtonBaseProps } from './ButtonBase.types';
+declare const ButtonBase: ({ children, textProps, size, isLoading, loadingText, spinnerProps, startIconName, startIconProps, startAccessory, endIconName, endIconProps, endAccessory, isDisabled, isFullWidth, twClassName, style, ...props }: ButtonBaseProps) => React.JSX.Element;
+export default ButtonBase;
+//# sourceMappingURL=ButtonBase.d.ts.map

package/dist/primitives/ButtonBase/ButtonBase.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.d.ts","sourceRoot":"","sources":["../../../src/primitives/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAWvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAG1D,QAAA,MAAM,UAAU,uNAkBb,eAAe,sBAyEjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/primitives/ButtonBase/ButtonBase.js

@@ -0,0 +1,84 @@
+"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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+/* eslint-disable @typescript-eslint/prefer-nullish-coalescing */
+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");
+const Icon_1 = __importDefault(require("../../components/Icon"));
+const Spinner_1 = __importDefault(require("../../temp-components/Spinner"));
+const ButtonAnimated_1 = __importDefault(require("../ButtonAnimated"));
+const TextOrChildren_1 = __importDefault(require("../TextOrChildren/TextOrChildren"));
+const ButtonBase_constants_1 = require("./ButtonBase.constants");
+const ButtonBase_utilities_1 = require("./ButtonBase.utilities");
+const ButtonBase = ({ children, textProps, size = ButtonBase_constants_1.DEFAULT_BUTTONBASE_PROPS.size, isLoading, loadingText, spinnerProps, startIconName, startIconProps, startAccessory, endIconName, endIconProps, endAccessory, isDisabled, isFullWidth, twClassName, style, ...props }) => {
+    const tw = (0, design_system_twrnc_preset_1.useTailwind)();
+    const twContainerClassNames = (0, react_1.useMemo)(() => {
+        return (0, ButtonBase_utilities_1.generateButtonBaseContainerClassNames)({
+            size,
+            twClassName,
+            isLoading,
+            isDisabled,
+            isFullWidth,
+        });
+    }, [size, twClassName, isLoading, isDisabled, isFullWidth]);
+    const finalTextProps = {
+        ...ButtonBase_constants_1.DEFAULT_BUTTONBASE_PROPS.textProps,
+        ...textProps,
+    };
+    const finalStartIconName = startIconName ?? startIconProps?.name;
+    const finalStartIconProps = {
+        ...ButtonBase_constants_1.DEFAULT_BUTTONBASE_PROPS.startIconProps,
+        ...startIconProps,
+    };
+    const finalEndIconName = endIconName ?? endIconProps?.name;
+    const finalEndIconProps = {
+        ...ButtonBase_constants_1.DEFAULT_BUTTONBASE_PROPS.endIconProps,
+        ...endIconProps,
+    };
+    const finalSpinnerProps = {
+        ...ButtonBase_constants_1.DEFAULT_BUTTONBASE_PROPS.spinnerProps,
+        loadingText,
+        loadingTextProps: {
+            numberOfLines: 1,
+        },
+        ...spinnerProps,
+    };
+    return (<ButtonAnimated_1.default disabled={isDisabled || isLoading} accessibilityRole="button" accessible style={[tw `${twContainerClassNames}`, style]} {...props}>
+      <react_native_1.View style={tw `absolute inset-0 flex items-center justify-center ${isLoading ? 'opacity-100' : 'opacity-0'}`} testID="spinner-container">
+        <Spinner_1.default {...finalSpinnerProps}/>
+      </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.default name={finalStartIconName} {...finalStartIconProps}/>) : (startAccessory)}
+        <TextOrChildren_1.default textProps={finalTextProps}>{children}</TextOrChildren_1.default>
+        {finalEndIconName ? (<Icon_1.default name={finalEndIconName} {...finalEndIconProps}/>) : (endAccessory)}
+      </react_native_1.View>
+    </ButtonAnimated_1.default>);
+};
+exports.default = ButtonBase;
+//# sourceMappingURL=ButtonBase.js.map

package/dist/primitives/ButtonBase/ButtonBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.js","sourceRoot":"","sources":["../../../src/primitives/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iEAAiE;AACjE,8FAA4E;AAC5E,+CAAuC;AACvC,+CAAoC;AAGpC,iEAAyC;AAGzC,4EAAoD;AACpD,uEAA+C;AAC/C,sFAA8D;AAC9D,iEAAkE;AAElE,iEAA+E;AAE/E,MAAM,UAAU,GAAG,CAAC,EAClB,QAAQ,EACR,SAAS,EACT,IAAI,GAAG,+CAAwB,CAAC,IAAI,EACpC,SAAS,EACT,WAAW,EACX,YAAY,EACZ,aAAa,EACb,cAAc,EACd,cAAc,EACd,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,WAAW,EACX,WAAW,EACX,KAAK,EACL,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IACzB,MAAM,qBAAqB,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACzC,OAAO,IAAA,4DAAqC,EAAC;YAC3C,IAAI;YACJ,WAAW;YACX,SAAS;YACT,UAAU;YACV,WAAW;SACZ,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC;IAE5D,MAAM,cAAc,GAAyC;QAC3D,GAAG,+CAAwB,CAAC,SAAS;QACrC,GAAG,SAAS;KACb,CAAC;IACF,MAAM,kBAAkB,GAAG,aAAa,IAAI,cAAc,EAAE,IAAI,CAAC;IACjE,MAAM,mBAAmB,GAAuB;QAC9C,GAAG,+CAAwB,CAAC,cAAc;QAC1C,GAAG,cAAc;KAClB,CAAC;IAEF,MAAM,gBAAgB,GAAG,WAAW,IAAI,YAAY,EAAE,IAAI,CAAC;IAC3D,MAAM,iBAAiB,GAAuB;QAC5C,GAAG,+CAAwB,CAAC,YAAY;QACxC,GAAG,YAAY;KAChB,CAAC;IAEF,MAAM,iBAAiB,GAAiB;QACtC,GAAG,+CAAwB,CAAC,YAAY;QACxC,WAAW;QACX,gBAAgB,EAAE;YAChB,aAAa,EAAE,CAAC;SACjB;QACD,GAAG,YAAY;KAChB,CAAC;IAEF,OAAO,CACL,CAAC,wBAAc,CACb,QAAQ,CAAC,CAAC,UAAU,IAAI,SAAS,CAAC,CAClC,iBAAiB,CAAC,QAAQ,CAC1B,UAAU,CACV,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA,GAAG,qBAAqB,EAAE,EAAE,KAAK,CAAC,CAAC,CAC7C,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,mBAAI,CACH,KAAK,CAAC,CAAC,EAAE,CAAA,qDACP,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,WAC9B,EAAE,CAAC,CACH,MAAM,CAAC,mBAAmB,CAE1B;QAAA,CAAC,iBAAO,CAAC,IAAI,iBAAiB,CAAC,EACjC;MAAA,EAAE,mBAAI,CACN;MAAA,CAAC,mBAAI,CACH,KAAK,CAAC,CAAC,EAAE,CAAA,gDACP,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,aAC5B,EAAE,CAAC,CACH,MAAM,CAAC,mBAAmB,CAE1B;QAAA,CAAC,kBAAkB,CAAC,CAAC,CAAC,CACpB,CAAC,cAAI,CAAC,IAAI,CAAC,CAAC,kBAAkB,CAAC,CAAC,IAAI,mBAAmB,CAAC,EAAG,CAC5D,CAAC,CAAC,CAAC,CACF,cAAc,CACf,CACD;QAAA,CAAC,wBAAc,CAAC,SAAS,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,wBAAc,CACrE;QAAA,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAClB,CAAC,cAAI,CAAC,IAAI,CAAC,CAAC,gBAAgB,CAAC,CAAC,IAAI,iBAAiB,CAAC,EAAG,CACxD,CAAC,CAAC,CAAC,CACF,YAAY,CACb,CACH;MAAA,EAAE,mBAAI,CACR;IAAA,EAAE,wBAAc,CAAC,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,UAAU,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/prefer-nullish-coalescing */\nimport { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useMemo } from 'react';\nimport { View } from 'react-native';\n\nimport type { IconProps } from '../../components/Icon';\nimport Icon from '../../components/Icon';\nimport type { TextProps } from '../../components/Text/Text.types';\nimport type { SpinnerProps } from '../../temp-components/Spinner';\nimport Spinner from '../../temp-components/Spinner';\nimport ButtonAnimated from '../ButtonAnimated';\nimport TextOrChildren from '../TextOrChildren/TextOrChildren';\nimport { DEFAULT_BUTTONBASE_PROPS } from './ButtonBase.constants';\nimport type { ButtonBaseProps } from './ButtonBase.types';\nimport { generateButtonBaseContainerClassNames } from './ButtonBase.utilities';\n\nconst ButtonBase = ({\n  children,\n  textProps,\n  size = DEFAULT_BUTTONBASE_PROPS.size,\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  style,\n  ...props\n}: ButtonBaseProps) => {\n  const tw = useTailwind();\n  const twContainerClassNames = useMemo(() => {\n    return generateButtonBaseContainerClassNames({\n      size,\n      twClassName,\n      isLoading,\n      isDisabled,\n      isFullWidth,\n    });\n  }, [size, twClassName, isLoading, isDisabled, isFullWidth]);\n\n  const finalTextProps: Omit<Partial<TextProps>, 'children'> = {\n    ...DEFAULT_BUTTONBASE_PROPS.textProps,\n    ...textProps,\n  };\n  const finalStartIconName = startIconName ?? startIconProps?.name;\n  const finalStartIconProps: Partial<IconProps> = {\n    ...DEFAULT_BUTTONBASE_PROPS.startIconProps,\n    ...startIconProps,\n  };\n\n  const finalEndIconName = endIconName ?? endIconProps?.name;\n  const finalEndIconProps: Partial<IconProps> = {\n    ...DEFAULT_BUTTONBASE_PROPS.endIconProps,\n    ...endIconProps,\n  };\n\n  const finalSpinnerProps: SpinnerProps = {\n    ...DEFAULT_BUTTONBASE_PROPS.spinnerProps,\n    loadingText,\n    loadingTextProps: {\n      numberOfLines: 1,\n    },\n    ...spinnerProps,\n  };\n\n  return (\n    <ButtonAnimated\n      disabled={isDisabled || isLoading}\n      accessibilityRole=\"button\"\n      accessible\n      style={[tw`${twContainerClassNames}`, style]}\n      {...props}\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 {...finalSpinnerProps} />\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 name={finalStartIconName} {...finalStartIconProps} />\n        ) : (\n          startAccessory\n        )}\n        <TextOrChildren textProps={finalTextProps}>{children}</TextOrChildren>\n        {finalEndIconName ? (\n          <Icon name={finalEndIconName} {...finalEndIconProps} />\n        ) : (\n          endAccessory\n        )}\n      </View>\n    </ButtonAnimated>\n  );\n};\n\nexport default ButtonBase;\n"]}

package/dist/primitives/ButtonBase/ButtonBase.types.d.ts

@@ -0,0 +1,93 @@
+import type { PressableProps, StyleProp, ViewStyle } from 'react-native';
+import type { TextProps } from 'src/components/Text/Text.types';
+import type { IconProps, IconName } from '../../components/Icon';
+import type { SpinnerProps } from '../../temp-components/Spinner';
+export declare enum ButtonBaseSize {
+    /**
+     * Represents a small button size (32px).
+     */
+    Sm = "32",
+    /**
+     * Represents a medium button size (40px).
+     */
+    Md = "40",
+    /**
+     * Represents a large button size (48px).
+     */
+    Lg = "48"
+}
+/**
+ * ButtonBase component props.
+ */
+export type ButtonBaseProps = {
+    /**
+     * Required prop for the content to be rendered within the ButtonBase
+     */
+    children: React.ReactNode | string;
+    /**
+     * Optional props to be passed to the Text component when children is a string
+     */
+    textProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional prop to control the size of the ButtonBase
+     * Possible values: ButtonBaseSize.Sm (32px), ButtonBaseSize.Md (40px), ButtonBaseSize.Lg (48px)
+     * @default ButtonBaseSize.Lg
+     */
+    size?: ButtonBaseSize;
+    /**
+     * 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 prop to pass additional properties to the end icon
+     */
+    spinnerProps?: Partial<SpinnerProps>;
+    /**
+     * 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 that when true, makes the button take up the full width of its container
+     * @default false
+     */
+    isFullWidth?: boolean;
+    /**
+     * Optional prop to add twrnc overriding classNames.
+     */
+    twClassName?: string;
+    /**
+     * Optional prop to control the style.
+     */
+    style?: StyleProp<ViewStyle>;
+} & PressableProps;
+//# sourceMappingURL=ButtonBase.types.d.ts.map

package/dist/primitives/ButtonBase/ButtonBase.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.types.d.ts","sourceRoot":"","sources":["../../../src/primitives/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAEhE,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAElE,oBAAY,cAAc;IACxB;;OAEG;IACH,EAAE,OAAO;IACT;;OAEG;IACH,EAAE,OAAO;IACT;;OAEG;IACH,EAAE,OAAO;CACV;AAED;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;IACnC;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IACjD;;;;OAIG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IACrC;;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;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,GAAG,cAAc,CAAC"}

package/dist/primitives/ButtonBase/ButtonBase.types.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonBaseSize = void 0;
+var ButtonBaseSize;
+(function (ButtonBaseSize) {
+    /**
+     * Represents a small button size (32px).
+     */
+    ButtonBaseSize["Sm"] = "32";
+    /**
+     * Represents a medium button size (40px).
+     */
+    ButtonBaseSize["Md"] = "40";
+    /**
+     * Represents a large button size (48px).
+     */
+    ButtonBaseSize["Lg"] = "48";
+})(ButtonBaseSize || (exports.ButtonBaseSize = ButtonBaseSize = {}));
+//# sourceMappingURL=ButtonBase.types.js.map

package/dist/primitives/ButtonBase/ButtonBase.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonBase.types.js","sourceRoot":"","sources":["../../../src/primitives/ButtonBase/ButtonBase.types.ts"],"names":[],"mappings":";;;AAMA,IAAY,cAaX;AAbD,WAAY,cAAc;IACxB;;OAEG;IACH,2BAAS,CAAA;IACT;;OAEG;IACH,2BAAS,CAAA;IACT;;OAEG;IACH,2BAAS,CAAA;AACX,CAAC,EAbW,cAAc,8BAAd,cAAc,QAazB","sourcesContent":["import type { PressableProps, StyleProp, ViewStyle } from 'react-native';\nimport type { TextProps } from 'src/components/Text/Text.types';\n\nimport type { IconProps, IconName } from '../../components/Icon';\nimport type { SpinnerProps } from '../../temp-components/Spinner';\n\nexport enum ButtonBaseSize {\n  /**\n   * Represents a small button size (32px).\n   */\n  Sm = '32',\n  /**\n   * Represents a medium button size (40px).\n   */\n  Md = '40',\n  /**\n   * Represents a large button size (48px).\n   */\n  Lg = '48',\n}\n\n/**\n * ButtonBase component props.\n */\nexport type ButtonBaseProps = {\n  /**\n   * Required prop for the content to be rendered within the ButtonBase\n   */\n  children: React.ReactNode | string;\n  /**\n   * Optional props to be passed to the Text component when children is a string\n   */\n  textProps?: Omit<Partial<TextProps>, 'children'>;\n  /**\n   * Optional prop to control the size of the ButtonBase\n   * Possible values: ButtonBaseSize.Sm (32px), ButtonBaseSize.Md (40px), ButtonBaseSize.Lg (48px)\n   * @default ButtonBaseSize.Lg\n   */\n  size?: ButtonBaseSize;\n  /**\n   * Optional prop that when true, shows a loading spinner\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 prop to pass additional properties to the end icon\n   */\n  spinnerProps?: Partial<SpinnerProps>;\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   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Optional prop that when true, makes the button take up the full width of its container\n   * @default false\n   */\n  isFullWidth?: boolean;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n  /**\n   * Optional prop to control the style.\n   */\n  style?: StyleProp<ViewStyle>;\n} & PressableProps;\n"]}