@metamask-previews/design-system-react-native 0.6.0-preview.3dc70e1 → 0.11.0-preview.23cc337

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

@@ -0,0 +1,60 @@
+import type { ReactNode } from "react";
+import type { ViewProps } from "react-native/index.js";
+/**
+ * Vertical alignment options for children inside the ListItem row.
+ */
+export declare const ListItemVerticalAlignment: {
+    readonly Top: "top";
+    readonly Center: "center";
+    readonly Bottom: "bottom";
+};
+export type ListItemVerticalAlignment = (typeof ListItemVerticalAlignment)[keyof typeof ListItemVerticalAlignment];
+/**
+ * ListItem component props.
+ *
+ * Extends `ViewProps` so the root View inherits standard React Native
+ * props such as `testID` and `accessibilityLabel`.
+ */
+export type ListItemProps = {
+    /**
+     * Content to display inside the list item row.
+     */
+    children?: ReactNode;
+    /**
+     * Optional content displayed above the list item row.
+     */
+    topAccessory?: ReactNode;
+    /**
+     * Optional content displayed below the list item row.
+     */
+    bottomAccessory?: ReactNode;
+    /**
+     * Gap in pixels between the topAccessory and the row.
+     *
+     * @default 0
+     */
+    topAccessoryGap?: number;
+    /**
+     * Gap in pixels between the row and the bottomAccessory.
+     *
+     * @default 0
+     */
+    bottomAccessoryGap?: number;
+    /**
+     * Horizontal spacing between each child inside the row.
+     *
+     * @default 16
+     */
+    gap?: number | string;
+    /**
+     * Vertical alignment of children inside the row.
+     *
+     * @default ListItemVerticalAlignment.Center
+     */
+    verticalAlignment?: ListItemVerticalAlignment;
+    /**
+     * Optional Tailwind class names to override default styles on the root element.
+     */
+    twClassName?: string;
+} & ViewProps;
+//# sourceMappingURL=ListItem.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.types.d.cts","sourceRoot":"","sources":["../../../src/components/ListItem/ListItem.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C;;GAEG;AACH,eAAO,MAAM,yBAAyB;;;;CAI5B,CAAC;AAEX,MAAM,MAAM,yBAAyB,GACnC,CAAC,OAAO,yBAAyB,CAAC,CAAC,MAAM,OAAO,yBAAyB,CAAC,CAAC;AAE7E;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,yBAAyB,CAAC;IAC9C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC"}

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

@@ -0,0 +1,60 @@
+import type { ReactNode } from "react";
+import type { ViewProps } from "react-native/index.js";
+/**
+ * Vertical alignment options for children inside the ListItem row.
+ */
+export declare const ListItemVerticalAlignment: {
+    readonly Top: "top";
+    readonly Center: "center";
+    readonly Bottom: "bottom";
+};
+export type ListItemVerticalAlignment = (typeof ListItemVerticalAlignment)[keyof typeof ListItemVerticalAlignment];
+/**
+ * ListItem component props.
+ *
+ * Extends `ViewProps` so the root View inherits standard React Native
+ * props such as `testID` and `accessibilityLabel`.
+ */
+export type ListItemProps = {
+    /**
+     * Content to display inside the list item row.
+     */
+    children?: ReactNode;
+    /**
+     * Optional content displayed above the list item row.
+     */
+    topAccessory?: ReactNode;
+    /**
+     * Optional content displayed below the list item row.
+     */
+    bottomAccessory?: ReactNode;
+    /**
+     * Gap in pixels between the topAccessory and the row.
+     *
+     * @default 0
+     */
+    topAccessoryGap?: number;
+    /**
+     * Gap in pixels between the row and the bottomAccessory.
+     *
+     * @default 0
+     */
+    bottomAccessoryGap?: number;
+    /**
+     * Horizontal spacing between each child inside the row.
+     *
+     * @default 16
+     */
+    gap?: number | string;
+    /**
+     * Vertical alignment of children inside the row.
+     *
+     * @default ListItemVerticalAlignment.Center
+     */
+    verticalAlignment?: ListItemVerticalAlignment;
+    /**
+     * Optional Tailwind class names to override default styles on the root element.
+     */
+    twClassName?: string;
+} & ViewProps;
+//# sourceMappingURL=ListItem.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.types.d.mts","sourceRoot":"","sources":["../../../src/components/ListItem/ListItem.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc;AACvC,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C;;GAEG;AACH,eAAO,MAAM,yBAAyB;;;;CAI5B,CAAC;AAEX,MAAM,MAAM,yBAAyB,GACnC,CAAC,OAAO,yBAAyB,CAAC,CAAC,MAAM,OAAO,yBAAyB,CAAC,CAAC;AAE7E;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,yBAAyB,CAAC;IAC9C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC"}

package/dist/components/ListItem/ListItem.types.mjs

@@ -0,0 +1,9 @@
+/**
+ * Vertical alignment options for children inside the ListItem row.
+ */
+export const ListItemVerticalAlignment = {
+    Top: 'top',
+    Center: 'center',
+    Bottom: 'bottom',
+};
+//# sourceMappingURL=ListItem.types.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.types.mjs","sourceRoot":"","sources":["../../../src/components/ListItem/ListItem.types.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG;IACvC,GAAG,EAAE,KAAK;IACV,MAAM,EAAE,QAAQ;IAChB,MAAM,EAAE,QAAQ;CACR,CAAC","sourcesContent":["import type { ReactNode } from 'react';\nimport type { ViewProps } from 'react-native';\n\n/**\n * Vertical alignment options for children inside the ListItem row.\n */\nexport const ListItemVerticalAlignment = {\n  Top: 'top',\n  Center: 'center',\n  Bottom: 'bottom',\n} as const;\n\nexport type ListItemVerticalAlignment =\n  (typeof ListItemVerticalAlignment)[keyof typeof ListItemVerticalAlignment];\n\n/**\n * ListItem component props.\n *\n * Extends `ViewProps` so the root View inherits standard React Native\n * props such as `testID` and `accessibilityLabel`.\n */\nexport type ListItemProps = {\n  /**\n   * Content to display inside the list item row.\n   */\n  children?: ReactNode;\n  /**\n   * Optional content displayed above the list item row.\n   */\n  topAccessory?: ReactNode;\n  /**\n   * Optional content displayed below the list item row.\n   */\n  bottomAccessory?: ReactNode;\n  /**\n   * Gap in pixels between the topAccessory and the row.\n   *\n   * @default 0\n   */\n  topAccessoryGap?: number;\n  /**\n   * Gap in pixels between the row and the bottomAccessory.\n   *\n   * @default 0\n   */\n  bottomAccessoryGap?: number;\n  /**\n   * Horizontal spacing between each child inside the row.\n   *\n   * @default 16\n   */\n  gap?: number | string;\n  /**\n   * Vertical alignment of children inside the row.\n   *\n   * @default ListItemVerticalAlignment.Center\n   */\n  verticalAlignment?: ListItemVerticalAlignment;\n  /**\n   * Optional Tailwind class names to override default styles on the root element.\n   */\n  twClassName?: string;\n} & ViewProps;\n"]}

package/dist/components/ListItem/index.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ListItem/index.ts"],"names":[],"mappings":";;;AAAA,2CAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,uDAA6D;AAApD,2HAAA,yBAAyB,OAAA","sourcesContent":["export { ListItem } from './ListItem';\nexport { ListItemVerticalAlignment } from './ListItem.types';\nexport type { ListItemProps } from './ListItem.types';\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ListItem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,uBAAmB;AACtC,OAAO,EAAE,yBAAyB,EAAE,6BAAyB;AAC7D,YAAY,EAAE,aAAa,EAAE,6BAAyB"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/ListItem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,uBAAmB;AACtC,OAAO,EAAE,yBAAyB,EAAE,6BAAyB;AAC7D,YAAY,EAAE,aAAa,EAAE,6BAAyB"}

package/dist/components/ListItem/index.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/ListItem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,uBAAmB;AACtC,OAAO,EAAE,yBAAyB,EAAE,6BAAyB","sourcesContent":["export { ListItem } from './ListItem';\nexport { ListItemVerticalAlignment } from './ListItem.types';\nexport type { ListItemProps } from './ListItem.types';\n"]}

package/dist/components/MainActionButton/MainActionButton.cjs

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MainActionButton = void 0;
+const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-twrnc-preset");
+const react_1 = __importDefault(require("react"));
+const Icon_1 = require("../Icon/index.cjs");
+const ButtonAnimated_1 = require("../temp-components/ButtonAnimated/index.cjs");
+const Text_1 = require("../Text/index.cjs");
+const MainActionButton = ({ iconName, label, iconProps, labelProps, onPress, onPressIn, onPressOut, style, isDisabled = false, twClassName = '', ...props }) => {
+    const tw = (0, design_system_twrnc_preset_1.useTailwind)();
+    return (<ButtonAnimated_1.ButtonAnimated disabled={isDisabled} accessible onPress={!isDisabled ? onPress : undefined} onPressIn={!isDisabled ? onPressIn : undefined} onPressOut={!isDisabled ? onPressOut : undefined} style={({ pressed }) => {
+            const baseStyle = tw.style('items-center justify-center rounded-xl px-1 py-4 min-w-[68px]', pressed && !isDisabled ? 'bg-muted-pressed' : 'bg-muted', isDisabled ? 'opacity-50' : 'opacity-100', twClassName);
+            const additionalStyle = typeof style === 'function' ? style({ pressed }) : style;
+            return additionalStyle ? [baseStyle, additionalStyle] : [baseStyle];
+        }} {...props}>
+      <>
+        <Icon_1.Icon {...iconProps} name={iconName} size={Icon_1.IconSize.Lg} color={Icon_1.IconColor.IconAlternative}/>
+        <Text_1.Text {...labelProps} variant={Text_1.TextVariant.BodySm} fontWeight={Text_1.FontWeight.Medium} color={Text_1.TextColor.TextDefault} twClassName="mt-0.5 w-full text-center shrink" numberOfLines={1} ellipsizeMode="tail">
+          {label}
+        </Text_1.Text>
+      </>
+    </ButtonAnimated_1.ButtonAnimated>);
+};
+exports.MainActionButton = MainActionButton;
+//# sourceMappingURL=MainActionButton.cjs.map

package/dist/components/MainActionButton/MainActionButton.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainActionButton.cjs","sourceRoot":"","sources":["../../../src/components/MainActionButton/MainActionButton.tsx"],"names":[],"mappings":";;;;;;AAAA,8FAA4E;AAC5E,kDAA0B;AAG1B,4CAAoD;AACpD,gFAAmE;AACnE,4CAAmE;AAI5D,MAAM,gBAAgB,GAAG,CAAC,EAC/B,QAAQ,EACR,KAAK,EACL,SAAS,EACT,UAAU,EACV,OAAO,EACP,SAAS,EACT,UAAU,EACV,KAAK,EACL,UAAU,GAAG,KAAK,EAClB,WAAW,GAAG,EAAE,EAChB,GAAG,KAAK,EACc,EAAE,EAAE;IAC1B,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IAEzB,OAAO,CACL,CAAC,+BAAc,CACb,QAAQ,CAAC,CAAC,UAAU,CAAC,CACrB,UAAU,CACV,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAC3C,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAC/C,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CACjD,KAAK,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;YACrB,MAAM,SAAS,GAAG,EAAE,CAAC,KAAK,CACxB,+DAA+D,EAC/D,OAAO,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,UAAU,EACxD,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,EACzC,WAAW,CACY,CAAC;YAE1B,MAAM,eAAe,GACnB,OAAO,KAAK,KAAK,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;YAE3D,OAAO,eAAe,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;QACtE,CAAC,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,EACE;QAAA,CAAC,WAAI,CACH,IAAI,SAAS,CAAC,CACd,IAAI,CAAC,CAAC,QAAQ,CAAC,CACf,IAAI,CAAC,CAAC,eAAQ,CAAC,EAAE,CAAC,CAClB,KAAK,CAAC,CAAC,gBAAS,CAAC,eAAe,CAAC,EAEnC;QAAA,CAAC,WAAI,CACH,IAAI,UAAU,CAAC,CACf,OAAO,CAAC,CAAC,kBAAW,CAAC,MAAM,CAAC,CAC5B,UAAU,CAAC,CAAC,iBAAU,CAAC,MAAM,CAAC,CAC9B,KAAK,CAAC,CAAC,gBAAS,CAAC,WAAW,CAAC,CAC7B,WAAW,CAAC,kCAAkC,CAC9C,aAAa,CAAC,CAAC,CAAC,CAAC,CACjB,aAAa,CAAC,MAAM,CAEpB;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,WAAI,CACR;MAAA,GACF;IAAA,EAAE,+BAAc,CAAC,CAClB,CAAC;AACJ,CAAC,CAAC;AA1DW,QAAA,gBAAgB,oBA0D3B","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React from 'react';\nimport type { StyleProp, ViewStyle } from 'react-native';\n\nimport { Icon, IconColor, IconSize } from '../Icon';\nimport { ButtonAnimated } from '../temp-components/ButtonAnimated';\nimport { Text, FontWeight, TextColor, TextVariant } from '../Text';\n\nimport type { MainActionButtonProps } from './MainActionButton.types';\n\nexport const MainActionButton = ({\n  iconName,\n  label,\n  iconProps,\n  labelProps,\n  onPress,\n  onPressIn,\n  onPressOut,\n  style,\n  isDisabled = false,\n  twClassName = '',\n  ...props\n}: MainActionButtonProps) => {\n  const tw = useTailwind();\n\n  return (\n    <ButtonAnimated\n      disabled={isDisabled}\n      accessible\n      onPress={!isDisabled ? onPress : undefined}\n      onPressIn={!isDisabled ? onPressIn : undefined}\n      onPressOut={!isDisabled ? onPressOut : undefined}\n      style={({ pressed }) => {\n        const baseStyle = tw.style(\n          'items-center justify-center rounded-xl px-1 py-4 min-w-[68px]',\n          pressed && !isDisabled ? 'bg-muted-pressed' : 'bg-muted',\n          isDisabled ? 'opacity-50' : 'opacity-100',\n          twClassName,\n        ) as StyleProp<ViewStyle>;\n\n        const additionalStyle =\n          typeof style === 'function' ? style({ pressed }) : style;\n\n        return additionalStyle ? [baseStyle, additionalStyle] : [baseStyle];\n      }}\n      {...props}\n    >\n      <>\n        <Icon\n          {...iconProps}\n          name={iconName}\n          size={IconSize.Lg}\n          color={IconColor.IconAlternative}\n        />\n        <Text\n          {...labelProps}\n          variant={TextVariant.BodySm}\n          fontWeight={FontWeight.Medium}\n          color={TextColor.TextDefault}\n          twClassName=\"mt-0.5 w-full text-center shrink\"\n          numberOfLines={1}\n          ellipsizeMode=\"tail\"\n        >\n          {label}\n        </Text>\n      </>\n    </ButtonAnimated>\n  );\n};\n"]}

package/dist/components/MainActionButton/MainActionButton.d.cts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { MainActionButtonProps } from "./MainActionButton.types.cjs";
+export declare const MainActionButton: ({ iconName, label, iconProps, labelProps, onPress, onPressIn, onPressOut, style, isDisabled, twClassName, ...props }: MainActionButtonProps) => React.JSX.Element;
+//# sourceMappingURL=MainActionButton.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MainActionButton.d.cts","sourceRoot":"","sources":["../../../src/components/MainActionButton/MainActionButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,qCAAiC;AAEtE,eAAO,MAAM,gBAAgB,yHAY1B,qBAAqB,sBA8CvB,CAAC"}

package/dist/components/MainActionButton/MainActionButton.d.mts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { MainActionButtonProps } from "./MainActionButton.types.mjs";
+export declare const MainActionButton: ({ iconName, label, iconProps, labelProps, onPress, onPressIn, onPressOut, style, isDisabled, twClassName, ...props }: MainActionButtonProps) => React.JSX.Element;
+//# sourceMappingURL=MainActionButton.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MainActionButton.d.mts","sourceRoot":"","sources":["../../../src/components/MainActionButton/MainActionButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,qCAAiC;AAEtE,eAAO,MAAM,gBAAgB,yHAY1B,qBAAqB,sBA8CvB,CAAC"}

package/dist/components/MainActionButton/MainActionButton.mjs

@@ -0,0 +1,28 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+import { useTailwind } from "@metamask-previews/design-system-twrnc-preset";
+import $React from "react";
+const React = $importDefault($React);
+import { Icon, IconColor, IconSize } from "../Icon/index.mjs";
+import { ButtonAnimated } from "../temp-components/ButtonAnimated/index.mjs";
+import { Text, FontWeight, TextColor, TextVariant } from "../Text/index.mjs";
+export const MainActionButton = ({ iconName, label, iconProps, labelProps, onPress, onPressIn, onPressOut, style, isDisabled = false, twClassName = '', ...props }) => {
+    const tw = useTailwind();
+    return (<ButtonAnimated disabled={isDisabled} accessible onPress={!isDisabled ? onPress : undefined} onPressIn={!isDisabled ? onPressIn : undefined} onPressOut={!isDisabled ? onPressOut : undefined} style={({ pressed }) => {
+            const baseStyle = tw.style('items-center justify-center rounded-xl px-1 py-4 min-w-[68px]', pressed && !isDisabled ? 'bg-muted-pressed' : 'bg-muted', isDisabled ? 'opacity-50' : 'opacity-100', twClassName);
+            const additionalStyle = typeof style === 'function' ? style({ pressed }) : style;
+            return additionalStyle ? [baseStyle, additionalStyle] : [baseStyle];
+        }} {...props}>
+      <>
+        <Icon {...iconProps} name={iconName} size={IconSize.Lg} color={IconColor.IconAlternative}/>
+        <Text {...labelProps} variant={TextVariant.BodySm} fontWeight={FontWeight.Medium} color={TextColor.TextDefault} twClassName="mt-0.5 w-full text-center shrink" numberOfLines={1} ellipsizeMode="tail">
+          {label}
+        </Text>
+      </>
+    </ButtonAnimated>);
+};
+//# sourceMappingURL=MainActionButton.mjs.map

package/dist/components/MainActionButton/MainActionButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainActionButton.mjs","sourceRoot":"","sources":["../../../src/components/MainActionButton/MainActionButton.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,sDAAsD;AAC5E,OAAO,MAAK,cAAc;;AAG1B,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,0BAAgB;AACpD,OAAO,EAAE,cAAc,EAAE,oDAA0C;AACnE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW,EAAE,0BAAgB;AAInE,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,QAAQ,EACR,KAAK,EACL,SAAS,EACT,UAAU,EACV,OAAO,EACP,SAAS,EACT,UAAU,EACV,KAAK,EACL,UAAU,GAAG,KAAK,EAClB,WAAW,GAAG,EAAE,EAChB,GAAG,KAAK,EACc,EAAE,EAAE;IAC1B,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,OAAO,CACL,CAAC,cAAc,CACb,QAAQ,CAAC,CAAC,UAAU,CAAC,CACrB,UAAU,CACV,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAC3C,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAC/C,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CACjD,KAAK,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;YACrB,MAAM,SAAS,GAAG,EAAE,CAAC,KAAK,CACxB,+DAA+D,EAC/D,OAAO,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,UAAU,EACxD,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,EACzC,WAAW,CACY,CAAC;YAE1B,MAAM,eAAe,GACnB,OAAO,KAAK,KAAK,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;YAE3D,OAAO,eAAe,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;QACtE,CAAC,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,EACE;QAAA,CAAC,IAAI,CACH,IAAI,SAAS,CAAC,CACd,IAAI,CAAC,CAAC,QAAQ,CAAC,CACf,IAAI,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAClB,KAAK,CAAC,CAAC,SAAS,CAAC,eAAe,CAAC,EAEnC;QAAA,CAAC,IAAI,CACH,IAAI,UAAU,CAAC,CACf,OAAO,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAC5B,UAAU,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,CAC9B,KAAK,CAAC,CAAC,SAAS,CAAC,WAAW,CAAC,CAC7B,WAAW,CAAC,kCAAkC,CAC9C,aAAa,CAAC,CAAC,CAAC,CAAC,CACjB,aAAa,CAAC,MAAM,CAEpB;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,IAAI,CACR;MAAA,GACF;IAAA,EAAE,cAAc,CAAC,CAClB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React from 'react';\nimport type { StyleProp, ViewStyle } from 'react-native';\n\nimport { Icon, IconColor, IconSize } from '../Icon';\nimport { ButtonAnimated } from '../temp-components/ButtonAnimated';\nimport { Text, FontWeight, TextColor, TextVariant } from '../Text';\n\nimport type { MainActionButtonProps } from './MainActionButton.types';\n\nexport const MainActionButton = ({\n  iconName,\n  label,\n  iconProps,\n  labelProps,\n  onPress,\n  onPressIn,\n  onPressOut,\n  style,\n  isDisabled = false,\n  twClassName = '',\n  ...props\n}: MainActionButtonProps) => {\n  const tw = useTailwind();\n\n  return (\n    <ButtonAnimated\n      disabled={isDisabled}\n      accessible\n      onPress={!isDisabled ? onPress : undefined}\n      onPressIn={!isDisabled ? onPressIn : undefined}\n      onPressOut={!isDisabled ? onPressOut : undefined}\n      style={({ pressed }) => {\n        const baseStyle = tw.style(\n          'items-center justify-center rounded-xl px-1 py-4 min-w-[68px]',\n          pressed && !isDisabled ? 'bg-muted-pressed' : 'bg-muted',\n          isDisabled ? 'opacity-50' : 'opacity-100',\n          twClassName,\n        ) as StyleProp<ViewStyle>;\n\n        const additionalStyle =\n          typeof style === 'function' ? style({ pressed }) : style;\n\n        return additionalStyle ? [baseStyle, additionalStyle] : [baseStyle];\n      }}\n      {...props}\n    >\n      <>\n        <Icon\n          {...iconProps}\n          name={iconName}\n          size={IconSize.Lg}\n          color={IconColor.IconAlternative}\n        />\n        <Text\n          {...labelProps}\n          variant={TextVariant.BodySm}\n          fontWeight={FontWeight.Medium}\n          color={TextColor.TextDefault}\n          twClassName=\"mt-0.5 w-full text-center shrink\"\n          numberOfLines={1}\n          ellipsizeMode=\"tail\"\n        >\n          {label}\n        </Text>\n      </>\n    </ButtonAnimated>\n  );\n};\n"]}

package/dist/components/MainActionButton/MainActionButton.types.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"MainActionButton.types.cjs","sourceRoot":"","sources":["../../../src/components/MainActionButton/MainActionButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n  PressableProps,\n  PressableStateCallbackType,\n  StyleProp,\n  ViewStyle,\n} from 'react-native';\n\nimport type { IconName, IconProps } from '../Icon';\nimport type { TextProps } from '../Text';\n\n/**\n * MainActionButton component props.\n */\nexport type MainActionButtonProps = {\n  /**\n   * Icon name rendered above the label.\n   */\n  iconName: IconName;\n  /**\n   * Label text rendered below the icon.\n   */\n  label: string;\n  /**\n   * Optional props forwarded to the internal Icon component.\n   * Useful for test IDs and accessibility metadata.\n   */\n  iconProps?: Omit<Partial<IconProps>, 'name' | 'size' | 'color'>;\n  /**\n   * Optional props forwarded to the internal Text component.\n   * Useful for test IDs and accessibility metadata.\n   */\n  labelProps?: Omit<\n    Partial<TextProps>,\n    'children' | 'variant' | 'fontWeight' | 'color' | 'twClassName'\n  >;\n  /**\n   * Disables the button interaction and applies disabled styling.\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Optional Tailwind classes to extend or override container styles.\n   */\n  twClassName?: string;\n  /**\n   * Optional React Native style for the button container.\n   */\n  style?:\n    | StyleProp<ViewStyle>\n    | ((state: PressableStateCallbackType) => StyleProp<ViewStyle>);\n} & Omit<PressableProps, 'children' | 'disabled' | 'style'>;\n"]}

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

@@ -0,0 +1,41 @@
+import type { PressableProps, PressableStateCallbackType, StyleProp, ViewStyle } from "react-native/index.js";
+import type { IconName, IconProps } from "../Icon/index.cjs";
+import type { TextProps } from "../Text/index.cjs";
+/**
+ * MainActionButton component props.
+ */
+export type MainActionButtonProps = {
+    /**
+     * Icon name rendered above the label.
+     */
+    iconName: IconName;
+    /**
+     * Label text rendered below the icon.
+     */
+    label: string;
+    /**
+     * Optional props forwarded to the internal Icon component.
+     * Useful for test IDs and accessibility metadata.
+     */
+    iconProps?: Omit<Partial<IconProps>, 'name' | 'size' | 'color'>;
+    /**
+     * Optional props forwarded to the internal Text component.
+     * Useful for test IDs and accessibility metadata.
+     */
+    labelProps?: Omit<Partial<TextProps>, 'children' | 'variant' | 'fontWeight' | 'color' | 'twClassName'>;
+    /**
+     * Disables the button interaction and applies disabled styling.
+     *
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Optional Tailwind classes to extend or override container styles.
+     */
+    twClassName?: string;
+    /**
+     * Optional React Native style for the button container.
+     */
+    style?: StyleProp<ViewStyle> | ((state: PressableStateCallbackType) => StyleProp<ViewStyle>);
+} & Omit<PressableProps, 'children' | 'disabled' | 'style'>;
+//# sourceMappingURL=MainActionButton.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MainActionButton.types.d.cts","sourceRoot":"","sources":["../../../src/components/MainActionButton/MainActionButton.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,cAAc,EACd,0BAA0B,EAC1B,SAAS,EACT,SAAS,EACV,8BAAqB;AAEtB,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,QAAQ,EAAE,QAAQ,CAAC;IACnB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;IAChE;;;OAGG;IACH,UAAU,CAAC,EAAE,IAAI,CACf,OAAO,CAAC,SAAS,CAAC,EAClB,UAAU,GAAG,SAAS,GAAG,YAAY,GAAG,OAAO,GAAG,aAAa,CAChE,CAAC;IACF;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EACF,SAAS,CAAC,SAAS,CAAC,GACpB,CAAC,CAAC,KAAK,EAAE,0BAA0B,KAAK,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;CACnE,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC,CAAC"}

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

@@ -0,0 +1,41 @@
+import type { PressableProps, PressableStateCallbackType, StyleProp, ViewStyle } from "react-native/index.js";
+import type { IconName, IconProps } from "../Icon/index.mjs";
+import type { TextProps } from "../Text/index.mjs";
+/**
+ * MainActionButton component props.
+ */
+export type MainActionButtonProps = {
+    /**
+     * Icon name rendered above the label.
+     */
+    iconName: IconName;
+    /**
+     * Label text rendered below the icon.
+     */
+    label: string;
+    /**
+     * Optional props forwarded to the internal Icon component.
+     * Useful for test IDs and accessibility metadata.
+     */
+    iconProps?: Omit<Partial<IconProps>, 'name' | 'size' | 'color'>;
+    /**
+     * Optional props forwarded to the internal Text component.
+     * Useful for test IDs and accessibility metadata.
+     */
+    labelProps?: Omit<Partial<TextProps>, 'children' | 'variant' | 'fontWeight' | 'color' | 'twClassName'>;
+    /**
+     * Disables the button interaction and applies disabled styling.
+     *
+     * @default false
+     */
+    isDisabled?: boolean;
+    /**
+     * Optional Tailwind classes to extend or override container styles.
+     */
+    twClassName?: string;
+    /**
+     * Optional React Native style for the button container.
+     */
+    style?: StyleProp<ViewStyle> | ((state: PressableStateCallbackType) => StyleProp<ViewStyle>);
+} & Omit<PressableProps, 'children' | 'disabled' | 'style'>;
+//# sourceMappingURL=MainActionButton.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MainActionButton.types.d.mts","sourceRoot":"","sources":["../../../src/components/MainActionButton/MainActionButton.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,cAAc,EACd,0BAA0B,EAC1B,SAAS,EACT,SAAS,EACV,8BAAqB;AAEtB,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC;;OAEG;IACH,QAAQ,EAAE,QAAQ,CAAC;IACnB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;IAChE;;;OAGG;IACH,UAAU,CAAC,EAAE,IAAI,CACf,OAAO,CAAC,SAAS,CAAC,EAClB,UAAU,GAAG,SAAS,GAAG,YAAY,GAAG,OAAO,GAAG,aAAa,CAChE,CAAC;IACF;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EACF,SAAS,CAAC,SAAS,CAAC,GACpB,CAAC,CAAC,KAAK,EAAE,0BAA0B,KAAK,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;CACnE,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC,CAAC"}

package/dist/components/MainActionButton/MainActionButton.types.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"MainActionButton.types.mjs","sourceRoot":"","sources":["../../../src/components/MainActionButton/MainActionButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n  PressableProps,\n  PressableStateCallbackType,\n  StyleProp,\n  ViewStyle,\n} from 'react-native';\n\nimport type { IconName, IconProps } from '../Icon';\nimport type { TextProps } from '../Text';\n\n/**\n * MainActionButton component props.\n */\nexport type MainActionButtonProps = {\n  /**\n   * Icon name rendered above the label.\n   */\n  iconName: IconName;\n  /**\n   * Label text rendered below the icon.\n   */\n  label: string;\n  /**\n   * Optional props forwarded to the internal Icon component.\n   * Useful for test IDs and accessibility metadata.\n   */\n  iconProps?: Omit<Partial<IconProps>, 'name' | 'size' | 'color'>;\n  /**\n   * Optional props forwarded to the internal Text component.\n   * Useful for test IDs and accessibility metadata.\n   */\n  labelProps?: Omit<\n    Partial<TextProps>,\n    'children' | 'variant' | 'fontWeight' | 'color' | 'twClassName'\n  >;\n  /**\n   * Disables the button interaction and applies disabled styling.\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Optional Tailwind classes to extend or override container styles.\n   */\n  twClassName?: string;\n  /**\n   * Optional React Native style for the button container.\n   */\n  style?:\n    | StyleProp<ViewStyle>\n    | ((state: PressableStateCallbackType) => StyleProp<ViewStyle>);\n} & Omit<PressableProps, 'children' | 'disabled' | 'style'>;\n"]}

package/dist/components/MainActionButton/index.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/MainActionButton/index.ts"],"names":[],"mappings":";;;AAAA,2DAAsD;AAA7C,oHAAA,gBAAgB,OAAA","sourcesContent":["export { MainActionButton } from './MainActionButton';\nexport type { MainActionButtonProps } from './MainActionButton.types';\n"]}

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

@@ -0,0 +1,3 @@
+export { MainActionButton } from "./MainActionButton.cjs";
+export type { MainActionButtonProps } from "./MainActionButton.types.cjs";
+//# sourceMappingURL=index.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/MainActionButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,+BAA2B;AACtD,YAAY,EAAE,qBAAqB,EAAE,qCAAiC"}

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

@@ -0,0 +1,3 @@
+export { MainActionButton } from "./MainActionButton.mjs";
+export type { MainActionButtonProps } from "./MainActionButton.types.mjs";
+//# sourceMappingURL=index.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/MainActionButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,+BAA2B;AACtD,YAAY,EAAE,qBAAqB,EAAE,qCAAiC"}

package/dist/components/MainActionButton/index.mjs

@@ -0,0 +1,2 @@
+export { MainActionButton } from "./MainActionButton.mjs";
+//# sourceMappingURL=index.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/MainActionButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,+BAA2B","sourcesContent":["export { MainActionButton } from './MainActionButton';\nexport type { MainActionButtonProps } from './MainActionButton.types';\n"]}

package/dist/components/RadioButton/RadioButton.cjs

@@ -0,0 +1,58 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RadioButton = void 0;
+const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-twrnc-preset");
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native/index.js");
+const TextOrChildren_1 = require("../temp-components/TextOrChildren/index.cjs");
+const getRadioButtonBorderClass = (isReadOnly, isDanger, isChecked) => {
+    if (isReadOnly) {
+        return 'border-background-default';
+    }
+    if (isDanger) {
+        return 'border-error-default';
+    }
+    if (isChecked) {
+        return 'border-primary-default';
+    }
+    return 'border-default';
+};
+const getRadioButtonDotClass = (isReadOnly, isDanger) => {
+    if (isReadOnly) {
+        return 'bg-icon-alternative';
+    }
+    if (isDanger) {
+        return 'bg-error-default';
+    }
+    return 'bg-primary-default';
+};
+const RadioButton = ({ onPress, label, labelProps, isChecked = false, isDisabled = false, isReadOnly = false, isDanger = false, touchableOpacityProps, radioButtonContainerProps, twClassName, style, ...props }) => {
+    const tw = (0, design_system_twrnc_preset_1.useTailwind)();
+    return (<react_native_1.View {...props} style={[
+            tw.style('flex-row items-center', isDisabled ? 'opacity-50' : 'opacity-100', twClassName),
+            style,
+        ]}>
+      <react_native_1.TouchableOpacity onPress={onPress} disabled={isDisabled || isReadOnly} accessible accessibilityRole="radio" accessibilityState={{
+            checked: isChecked,
+            disabled: isDisabled,
+        }} accessibilityLabel={typeof label === 'string' ? label : undefined} {...touchableOpacityProps} style={[
+            tw.style('flex-row items-center'),
+            touchableOpacityProps?.style,
+        ]}>
+        <react_native_1.View {...radioButtonContainerProps} style={[
+            tw.style('size-5 items-center justify-center rounded-full border-2 bg-default', getRadioButtonBorderClass(isReadOnly, isDanger, isChecked)),
+            radioButtonContainerProps?.style,
+        ]}>
+          {isChecked && (<react_native_1.View style={tw.style('size-3 rounded-full', getRadioButtonDotClass(isReadOnly, isDanger))}/>)}
+        </react_native_1.View>
+        {label ? (<TextOrChildren_1.TextOrChildren textProps={{ ...labelProps, twClassName: 'ml-3' }}>
+            {label}
+          </TextOrChildren_1.TextOrChildren>) : null}
+      </react_native_1.TouchableOpacity>
+    </react_native_1.View>);
+};
+exports.RadioButton = RadioButton;
+//# sourceMappingURL=RadioButton.cjs.map

package/dist/components/RadioButton/RadioButton.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.cjs","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.tsx"],"names":[],"mappings":";;;;;;AAAA,8FAA4E;AAC5E,kDAA0B;AAC1B,wDAAsD;AAEtD,gFAAmE;AAInE,MAAM,yBAAyB,GAAG,CAChC,UAAmB,EACnB,QAAiB,EACjB,SAAkB,EACV,EAAE;IACV,IAAI,UAAU,EAAE;QACd,OAAO,2BAA2B,CAAC;KACpC;IACD,IAAI,QAAQ,EAAE;QACZ,OAAO,sBAAsB,CAAC;KAC/B;IACD,IAAI,SAAS,EAAE;QACb,OAAO,wBAAwB,CAAC;KACjC;IACD,OAAO,gBAAgB,CAAC;AAC1B,CAAC,CAAC;AAEF,MAAM,sBAAsB,GAAG,CAC7B,UAAmB,EACnB,QAAiB,EACT,EAAE;IACV,IAAI,UAAU,EAAE;QACd,OAAO,qBAAqB,CAAC;KAC9B;IACD,IAAI,QAAQ,EAAE;QACZ,OAAO,kBAAkB,CAAC;KAC3B;IACD,OAAO,oBAAoB,CAAC;AAC9B,CAAC,CAAC;AAEK,MAAM,WAAW,GAAG,CAAC,EAC1B,OAAO,EACP,KAAK,EACL,UAAU,EACV,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,QAAQ,GAAG,KAAK,EAChB,qBAAqB,EACrB,yBAAyB,EACzB,WAAW,EACX,KAAK,EACL,GAAG,KAAK,EACS,EAAE,EAAE;IACrB,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IAEzB,OAAO,CACL,CAAC,mBAAI,CACH,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CACN,uBAAuB,EACvB,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,EACzC,WAAW,CACZ;YACD,KAAK;SACN,CAAC,CAEF;MAAA,CAAC,+BAAgB,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,QAAQ,CAAC,CAAC,UAAU,IAAI,UAAU,CAAC,CACnC,UAAU,CACV,iBAAiB,CAAC,OAAO,CACzB,kBAAkB,CAAC,CAAC;YAClB,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,UAAU;SACrB,CAAC,CACF,kBAAkB,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAClE,IAAI,qBAAqB,CAAC,CAC1B,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CAAC,uBAAuB,CAAC;YACjC,qBAAqB,EAAE,KAAK;SAC7B,CAAC,CAEF;QAAA,CAAC,mBAAI,CACH,IAAI,yBAAyB,CAAC,CAC9B,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CACN,qEAAqE,EACrE,yBAAyB,CAAC,UAAU,EAAE,QAAQ,EAAE,SAAS,CAAC,CAC3D;YACD,yBAAyB,EAAE,KAAK;SACjC,CAAC,CAEF;UAAA,CAAC,SAAS,IAAI,CACZ,CAAC,mBAAI,CACH,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CACb,qBAAqB,EACrB,sBAAsB,CAAC,UAAU,EAAE,QAAQ,CAAC,CAC7C,CAAC,EACF,CACH,CACH;QAAA,EAAE,mBAAI,CACN;QAAA,CAAC,KAAK,CAAC,CAAC,CAAC,CACP,CAAC,+BAAc,CAAC,SAAS,CAAC,CAAC,EAAE,GAAG,UAAU,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC,CAChE;YAAA,CAAC,KAAK,CACR;UAAA,EAAE,+BAAc,CAAC,CAClB,CAAC,CAAC,CAAC,IAAI,CACV;MAAA,EAAE,+BAAgB,CACpB;IAAA,EAAE,mBAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAvEW,QAAA,WAAW,eAuEtB","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React from 'react';\nimport { View, TouchableOpacity } from 'react-native';\n\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { RadioButtonProps } from './RadioButton.types';\n\nconst getRadioButtonBorderClass = (\n  isReadOnly: boolean,\n  isDanger: boolean,\n  isChecked: boolean,\n): string => {\n  if (isReadOnly) {\n    return 'border-background-default';\n  }\n  if (isDanger) {\n    return 'border-error-default';\n  }\n  if (isChecked) {\n    return 'border-primary-default';\n  }\n  return 'border-default';\n};\n\nconst getRadioButtonDotClass = (\n  isReadOnly: boolean,\n  isDanger: boolean,\n): string => {\n  if (isReadOnly) {\n    return 'bg-icon-alternative';\n  }\n  if (isDanger) {\n    return 'bg-error-default';\n  }\n  return 'bg-primary-default';\n};\n\nexport const RadioButton = ({\n  onPress,\n  label,\n  labelProps,\n  isChecked = false,\n  isDisabled = false,\n  isReadOnly = false,\n  isDanger = false,\n  touchableOpacityProps,\n  radioButtonContainerProps,\n  twClassName,\n  style,\n  ...props\n}: RadioButtonProps) => {\n  const tw = useTailwind();\n\n  return (\n    <View\n      {...props}\n      style={[\n        tw.style(\n          'flex-row items-center',\n          isDisabled ? 'opacity-50' : 'opacity-100',\n          twClassName,\n        ),\n        style,\n      ]}\n    >\n      <TouchableOpacity\n        onPress={onPress}\n        disabled={isDisabled || isReadOnly}\n        accessible\n        accessibilityRole=\"radio\"\n        accessibilityState={{\n          checked: isChecked,\n          disabled: isDisabled,\n        }}\n        accessibilityLabel={typeof label === 'string' ? label : undefined}\n        {...touchableOpacityProps}\n        style={[\n          tw.style('flex-row items-center'),\n          touchableOpacityProps?.style,\n        ]}\n      >\n        <View\n          {...radioButtonContainerProps}\n          style={[\n            tw.style(\n              'size-5 items-center justify-center rounded-full border-2 bg-default',\n              getRadioButtonBorderClass(isReadOnly, isDanger, isChecked),\n            ),\n            radioButtonContainerProps?.style,\n          ]}\n        >\n          {isChecked && (\n            <View\n              style={tw.style(\n                'size-3 rounded-full',\n                getRadioButtonDotClass(isReadOnly, isDanger),\n              )}\n            />\n          )}\n        </View>\n        {label ? (\n          <TextOrChildren textProps={{ ...labelProps, twClassName: 'ml-3' }}>\n            {label}\n          </TextOrChildren>\n        ) : null}\n      </TouchableOpacity>\n    </View>\n  );\n};\n"]}

package/dist/components/RadioButton/RadioButton.constants.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SAMPLE_RADIOBUTTON_PROPS = void 0;
+// Sample props for stories and tests
+exports.SAMPLE_RADIOBUTTON_PROPS = {
+    label: 'Sample RadioButton Label',
+    isChecked: false,
+    isDisabled: false,
+    isReadOnly: false,
+    isDanger: false,
+};
+//# sourceMappingURL=RadioButton.constants.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.constants.cjs","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.constants.ts"],"names":[],"mappings":";;;AAEA,qCAAqC;AACxB,QAAA,wBAAwB,GAAqB;IACxD,KAAK,EAAE,0BAA0B;IACjC,SAAS,EAAE,KAAK;IAChB,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,KAAK;IACjB,QAAQ,EAAE,KAAK;CAChB,CAAC","sourcesContent":["import type { RadioButtonProps } from './RadioButton.types';\n\n// Sample props for stories and tests\nexport const SAMPLE_RADIOBUTTON_PROPS: RadioButtonProps = {\n  label: 'Sample RadioButton Label',\n  isChecked: false,\n  isDisabled: false,\n  isReadOnly: false,\n  isDanger: false,\n};\n"]}

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

@@ -0,0 +1,3 @@
+import type { RadioButtonProps } from "./RadioButton.types.cjs";
+export declare const SAMPLE_RADIOBUTTON_PROPS: RadioButtonProps;
+//# sourceMappingURL=RadioButton.constants.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.constants.d.cts","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAA4B;AAG5D,eAAO,MAAM,wBAAwB,EAAE,gBAMtC,CAAC"}

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

@@ -0,0 +1,3 @@
+import type { RadioButtonProps } from "./RadioButton.types.mjs";
+export declare const SAMPLE_RADIOBUTTON_PROPS: RadioButtonProps;
+//# sourceMappingURL=RadioButton.constants.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.constants.d.mts","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAA4B;AAG5D,eAAO,MAAM,wBAAwB,EAAE,gBAMtC,CAAC"}

package/dist/components/RadioButton/RadioButton.constants.mjs

@@ -0,0 +1,9 @@
+// Sample props for stories and tests
+export const SAMPLE_RADIOBUTTON_PROPS = {
+    label: 'Sample RadioButton Label',
+    isChecked: false,
+    isDisabled: false,
+    isReadOnly: false,
+    isDanger: false,
+};
+//# sourceMappingURL=RadioButton.constants.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.constants.mjs","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.constants.ts"],"names":[],"mappings":"AAEA,qCAAqC;AACrC,MAAM,CAAC,MAAM,wBAAwB,GAAqB;IACxD,KAAK,EAAE,0BAA0B;IACjC,SAAS,EAAE,KAAK;IAChB,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,KAAK;IACjB,QAAQ,EAAE,KAAK;CAChB,CAAC","sourcesContent":["import type { RadioButtonProps } from './RadioButton.types';\n\n// Sample props for stories and tests\nexport const SAMPLE_RADIOBUTTON_PROPS: RadioButtonProps = {\n  label: 'Sample RadioButton Label',\n  isChecked: false,\n  isDisabled: false,\n  isReadOnly: false,\n  isDanger: false,\n};\n"]}

package/dist/components/RadioButton/RadioButton.d.cts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { RadioButtonProps } from "./RadioButton.types.cjs";
+export declare const RadioButton: ({ onPress, label, labelProps, isChecked, isDisabled, isReadOnly, isDanger, touchableOpacityProps, radioButtonContainerProps, twClassName, style, ...props }: RadioButtonProps) => React.JSX.Element;
+//# sourceMappingURL=RadioButton.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.d.cts","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAK1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAA4B;AAgC5D,eAAO,MAAM,WAAW,gKAarB,gBAAgB,sBA0DlB,CAAC"}

package/dist/components/RadioButton/RadioButton.d.mts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { RadioButtonProps } from "./RadioButton.types.mjs";
+export declare const RadioButton: ({ onPress, label, labelProps, isChecked, isDisabled, isReadOnly, isDanger, touchableOpacityProps, radioButtonContainerProps, twClassName, style, ...props }: RadioButtonProps) => React.JSX.Element;
+//# sourceMappingURL=RadioButton.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.d.mts","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAK1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAA4B;AAgC5D,eAAO,MAAM,WAAW,gKAarB,gBAAgB,sBA0DlB,CAAC"}