@metamask-previews/design-system-react-native 0.0.0-preview.ff8ed96 → 0.2.0-preview.a7d80d5

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

@@ -1 +1 @@
-{"version":3,"file":"Box.types.cjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ViewProps } from 'react-native';\n\nimport type {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxSpacing,\n  BoxAlignItems,\n  BoxJustifyContent,\n} from '../../types';\n\nexport type BoxProps = {\n  /**\n   * The flexDirection style of the component.\n   */\n  flexDirection?: BoxFlexDirection;\n  /**\n   * The flexWrap style of the component.\n   */\n  flexWrap?: BoxFlexWrap;\n  /**\n   * The gap between the component's children.\n   * Use 1-12 for a gap of 4px-48px.\n   */\n  gap?: BoxSpacing;\n  /**\n   * The alignItems style of the component.\n   */\n  alignItems?: BoxAlignItems;\n  /**\n   * The justifyContent style of the component.\n   */\n  justifyContent?: BoxJustifyContent;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n} & ViewProps;\n"]}
+{"version":3,"file":"Box.types.cjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ViewProps } from 'react-native';\n\nimport type {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxSpacing,\n  BoxBorderWidth,\n  BoxAlignItems,\n  BoxJustifyContent,\n  BoxBackgroundColor,\n  BoxBorderColor,\n} from '../../types';\n\nexport type BoxProps = {\n  /**\n   * The flexDirection style of the component.\n   */\n  flexDirection?: BoxFlexDirection;\n  /**\n   * The flexWrap style of the component.\n   */\n  flexWrap?: BoxFlexWrap;\n  /**\n   * The gap between the component's children.\n   * Use 1-12 for a gap of 4px-48px.\n   */\n  gap?: BoxSpacing;\n  /**\n   * The alignItems style of the component.\n   */\n  alignItems?: BoxAlignItems;\n  /**\n   * The justifyContent style of the component.\n   */\n  justifyContent?: BoxJustifyContent;\n  /**\n   * The margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  margin?: BoxSpacing;\n  /**\n   * The top margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginTop?: BoxSpacing;\n  /**\n   * The right margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginRight?: BoxSpacing;\n  /**\n   * The bottom margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginBottom?: BoxSpacing;\n  /**\n   * The left margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginLeft?: BoxSpacing;\n  /**\n   * The horizontal margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginHorizontal?: BoxSpacing;\n  /**\n   * The vertical margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginVertical?: BoxSpacing;\n  /**\n   * The padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  padding?: BoxSpacing;\n  /**\n   * The top padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingTop?: BoxSpacing;\n  /**\n   * The right padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingRight?: BoxSpacing;\n  /**\n   * The bottom padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingBottom?: BoxSpacing;\n  /**\n   * The left padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingLeft?: BoxSpacing;\n  /**\n   * The horizontal padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingHorizontal?: BoxSpacing;\n  /**\n   * The vertical padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingVertical?: BoxSpacing;\n  /**\n   * The border width of the component.\n   * Use 0, 1, 2, 4, or 8 for border width of 0px, 1px, 2px, 4px, or 8px.\n   */\n  borderWidth?: BoxBorderWidth;\n  /**\n   * The border color of the component.\n   */\n  borderColor?: BoxBorderColor;\n  /**\n   * The background color of the component.\n   */\n  backgroundColor?: BoxBackgroundColor;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n} & ViewProps;\n"]}

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

@@ -1,5 +1,5 @@
 import type { ViewProps } from "react-native/index.js";
-import type { BoxFlexDirection, BoxFlexWrap, BoxSpacing, BoxAlignItems, BoxJustifyContent } from "../../types/index.cjs";
+import type { BoxFlexDirection, BoxFlexWrap, BoxSpacing, BoxBorderWidth, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor } from "../../types/index.cjs";
 export type BoxProps = {
     /**
      * The flexDirection style of the component.
@@ -22,6 +22,89 @@ export type BoxProps = {
      * The justifyContent style of the component.
      */
     justifyContent?: BoxJustifyContent;
+    /**
+     * The margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    margin?: BoxSpacing;
+    /**
+     * The top margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginTop?: BoxSpacing;
+    /**
+     * The right margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginRight?: BoxSpacing;
+    /**
+     * The bottom margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginBottom?: BoxSpacing;
+    /**
+     * The left margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginLeft?: BoxSpacing;
+    /**
+     * The horizontal margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginHorizontal?: BoxSpacing;
+    /**
+     * The vertical margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginVertical?: BoxSpacing;
+    /**
+     * The padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    padding?: BoxSpacing;
+    /**
+     * The top padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingTop?: BoxSpacing;
+    /**
+     * The right padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingRight?: BoxSpacing;
+    /**
+     * The bottom padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingBottom?: BoxSpacing;
+    /**
+     * The left padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingLeft?: BoxSpacing;
+    /**
+     * The horizontal padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingHorizontal?: BoxSpacing;
+    /**
+     * The vertical padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingVertical?: BoxSpacing;
+    /**
+     * The border width of the component.
+     * Use 0, 1, 2, 4, or 8 for border width of 0px, 1px, 2px, 4px, or 8px.
+     */
+    borderWidth?: BoxBorderWidth;
+    /**
+     * The border color of the component.
+     */
+    borderColor?: BoxBorderColor;
+    /**
+     * The background color of the component.
+     */
+    backgroundColor?: BoxBackgroundColor;
     /**
      * Optional prop to add twrnc overriding classNames.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"Box.types.d.cts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,OAAO,KAAK,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,aAAa,EACb,iBAAiB,EAClB,8BAAoB;AAErB,MAAM,MAAM,QAAQ,GAAG;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,iBAAiB,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC"}
+{"version":3,"file":"Box.types.d.cts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,OAAO,KAAK,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,cAAc,EACd,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACf,8BAAoB;AAErB,MAAM,MAAM,QAAQ,GAAG;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,iBAAiB,CAAC;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC/B;;;OAGG;IACH,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,eAAe,CAAC,EAAE,kBAAkB,CAAC;IACrC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC"}

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

@@ -1,5 +1,5 @@
 import type { ViewProps } from "react-native/index.js";
-import type { BoxFlexDirection, BoxFlexWrap, BoxSpacing, BoxAlignItems, BoxJustifyContent } from "../../types/index.mjs";
+import type { BoxFlexDirection, BoxFlexWrap, BoxSpacing, BoxBorderWidth, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor } from "../../types/index.mjs";
 export type BoxProps = {
     /**
      * The flexDirection style of the component.
@@ -22,6 +22,89 @@ export type BoxProps = {
      * The justifyContent style of the component.
      */
     justifyContent?: BoxJustifyContent;
+    /**
+     * The margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    margin?: BoxSpacing;
+    /**
+     * The top margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginTop?: BoxSpacing;
+    /**
+     * The right margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginRight?: BoxSpacing;
+    /**
+     * The bottom margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginBottom?: BoxSpacing;
+    /**
+     * The left margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginLeft?: BoxSpacing;
+    /**
+     * The horizontal margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginHorizontal?: BoxSpacing;
+    /**
+     * The vertical margin of the component.
+     * Use 1-12 for margin of 4px-48px.
+     */
+    marginVertical?: BoxSpacing;
+    /**
+     * The padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    padding?: BoxSpacing;
+    /**
+     * The top padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingTop?: BoxSpacing;
+    /**
+     * The right padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingRight?: BoxSpacing;
+    /**
+     * The bottom padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingBottom?: BoxSpacing;
+    /**
+     * The left padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingLeft?: BoxSpacing;
+    /**
+     * The horizontal padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingHorizontal?: BoxSpacing;
+    /**
+     * The vertical padding of the component.
+     * Use 1-12 for padding of 4px-48px.
+     */
+    paddingVertical?: BoxSpacing;
+    /**
+     * The border width of the component.
+     * Use 0, 1, 2, 4, or 8 for border width of 0px, 1px, 2px, 4px, or 8px.
+     */
+    borderWidth?: BoxBorderWidth;
+    /**
+     * The border color of the component.
+     */
+    borderColor?: BoxBorderColor;
+    /**
+     * The background color of the component.
+     */
+    backgroundColor?: BoxBackgroundColor;
     /**
      * Optional prop to add twrnc overriding classNames.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"Box.types.d.mts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,OAAO,KAAK,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,aAAa,EACb,iBAAiB,EAClB,8BAAoB;AAErB,MAAM,MAAM,QAAQ,GAAG;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,iBAAiB,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC"}
+{"version":3,"file":"Box.types.d.mts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,OAAO,KAAK,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,cAAc,EACd,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACf,8BAAoB;AAErB,MAAM,MAAM,QAAQ,GAAG;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,gBAAgB,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC;IACvB;;;OAGG;IACH,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B;;OAEG;IACH,cAAc,CAAC,EAAE,iBAAiB,CAAC;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,UAAU,CAAC;IAC3B;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC/B;;;OAGG;IACH,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B;;;OAGG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC;IAC7B;;OAEG;IACH,eAAe,CAAC,EAAE,kBAAkB,CAAC;IACrC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,SAAS,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"Box.types.mjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ViewProps } from 'react-native';\n\nimport type {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxSpacing,\n  BoxAlignItems,\n  BoxJustifyContent,\n} from '../../types';\n\nexport type BoxProps = {\n  /**\n   * The flexDirection style of the component.\n   */\n  flexDirection?: BoxFlexDirection;\n  /**\n   * The flexWrap style of the component.\n   */\n  flexWrap?: BoxFlexWrap;\n  /**\n   * The gap between the component's children.\n   * Use 1-12 for a gap of 4px-48px.\n   */\n  gap?: BoxSpacing;\n  /**\n   * The alignItems style of the component.\n   */\n  alignItems?: BoxAlignItems;\n  /**\n   * The justifyContent style of the component.\n   */\n  justifyContent?: BoxJustifyContent;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n} & ViewProps;\n"]}
+{"version":3,"file":"Box.types.mjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ViewProps } from 'react-native';\n\nimport type {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxSpacing,\n  BoxBorderWidth,\n  BoxAlignItems,\n  BoxJustifyContent,\n  BoxBackgroundColor,\n  BoxBorderColor,\n} from '../../types';\n\nexport type BoxProps = {\n  /**\n   * The flexDirection style of the component.\n   */\n  flexDirection?: BoxFlexDirection;\n  /**\n   * The flexWrap style of the component.\n   */\n  flexWrap?: BoxFlexWrap;\n  /**\n   * The gap between the component's children.\n   * Use 1-12 for a gap of 4px-48px.\n   */\n  gap?: BoxSpacing;\n  /**\n   * The alignItems style of the component.\n   */\n  alignItems?: BoxAlignItems;\n  /**\n   * The justifyContent style of the component.\n   */\n  justifyContent?: BoxJustifyContent;\n  /**\n   * The margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  margin?: BoxSpacing;\n  /**\n   * The top margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginTop?: BoxSpacing;\n  /**\n   * The right margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginRight?: BoxSpacing;\n  /**\n   * The bottom margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginBottom?: BoxSpacing;\n  /**\n   * The left margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginLeft?: BoxSpacing;\n  /**\n   * The horizontal margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginHorizontal?: BoxSpacing;\n  /**\n   * The vertical margin of the component.\n   * Use 1-12 for margin of 4px-48px.\n   */\n  marginVertical?: BoxSpacing;\n  /**\n   * The padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  padding?: BoxSpacing;\n  /**\n   * The top padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingTop?: BoxSpacing;\n  /**\n   * The right padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingRight?: BoxSpacing;\n  /**\n   * The bottom padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingBottom?: BoxSpacing;\n  /**\n   * The left padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingLeft?: BoxSpacing;\n  /**\n   * The horizontal padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingHorizontal?: BoxSpacing;\n  /**\n   * The vertical padding of the component.\n   * Use 1-12 for padding of 4px-48px.\n   */\n  paddingVertical?: BoxSpacing;\n  /**\n   * The border width of the component.\n   * Use 0, 1, 2, 4, or 8 for border width of 0px, 1px, 2px, 4px, or 8px.\n   */\n  borderWidth?: BoxBorderWidth;\n  /**\n   * The border color of the component.\n   */\n  borderColor?: BoxBorderColor;\n  /**\n   * The background color of the component.\n   */\n  backgroundColor?: BoxBackgroundColor;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n} & ViewProps;\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":";;;AAAA,+CAKqB;AAJnB,yGAAA,gBAAgB,OAAA;AAChB,oGAAA,WAAW,OAAA;AACX,sGAAA,aAAa,OAAA;AACb,0GAAA,iBAAiB,OAAA;AAGnB,iCAA4B;AAAnB,0FAAA,GAAG,OAAA","sourcesContent":["export {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxAlignItems,\n  BoxJustifyContent,\n} from '../../types';\nexport type { BoxSpacing } from '../../types';\nexport { Box } from './Box';\nexport type { BoxProps } from './Box.types';\n"]}
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":";;;AAAA,+CAKqB;AAJnB,yGAAA,gBAAgB,OAAA;AAChB,oGAAA,WAAW,OAAA;AACX,sGAAA,aAAa,OAAA;AACb,0GAAA,iBAAiB,OAAA;AAGnB,iCAA4B;AAAnB,0FAAA,GAAG,OAAA","sourcesContent":["export {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxAlignItems,\n  BoxJustifyContent,\n} from '../../types';\nexport type { BoxSpacing, BoxBorderWidth } from '../../types';\nexport { Box } from './Box';\nexport type { BoxProps } from './Box.types';\n"]}

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

@@ -1,5 +1,5 @@
 export { BoxFlexDirection, BoxFlexWrap, BoxAlignItems, BoxJustifyContent, } from "../../types/index.cjs";
-export type { BoxSpacing } from "../../types/index.cjs";
+export type { BoxSpacing, BoxBorderWidth } from "../../types/index.cjs";
 export { Box } from "./Box.cjs";
 export type { BoxProps } from "./Box.types.cjs";
 //# sourceMappingURL=index.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,GAClB,8BAAoB;AACrB,YAAY,EAAE,UAAU,EAAE,8BAAoB;AAC9C,OAAO,EAAE,GAAG,EAAE,kBAAc;AAC5B,YAAY,EAAE,QAAQ,EAAE,wBAAoB"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,GAClB,8BAAoB;AACrB,YAAY,EAAE,UAAU,EAAE,cAAc,EAAE,8BAAoB;AAC9D,OAAO,EAAE,GAAG,EAAE,kBAAc;AAC5B,YAAY,EAAE,QAAQ,EAAE,wBAAoB"}

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

@@ -1,5 +1,5 @@
 export { BoxFlexDirection, BoxFlexWrap, BoxAlignItems, BoxJustifyContent, } from "../../types/index.mjs";
-export type { BoxSpacing } from "../../types/index.mjs";
+export type { BoxSpacing, BoxBorderWidth } from "../../types/index.mjs";
 export { Box } from "./Box.mjs";
 export type { BoxProps } from "./Box.types.mjs";
 //# sourceMappingURL=index.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,GAClB,8BAAoB;AACrB,YAAY,EAAE,UAAU,EAAE,8BAAoB;AAC9C,OAAO,EAAE,GAAG,EAAE,kBAAc;AAC5B,YAAY,EAAE,QAAQ,EAAE,wBAAoB"}
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,GAClB,8BAAoB;AACrB,YAAY,EAAE,UAAU,EAAE,cAAc,EAAE,8BAAoB;AAC9D,OAAO,EAAE,GAAG,EAAE,kBAAc;AAC5B,YAAY,EAAE,QAAQ,EAAE,wBAAoB"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,EAClB,8BAAoB;AAErB,OAAO,EAAE,GAAG,EAAE,kBAAc","sourcesContent":["export {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxAlignItems,\n  BoxJustifyContent,\n} from '../../types';\nexport type { BoxSpacing } from '../../types';\nexport { Box } from './Box';\nexport type { BoxProps } from './Box.types';\n"]}
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,iBAAiB,EAClB,8BAAoB;AAErB,OAAO,EAAE,GAAG,EAAE,kBAAc","sourcesContent":["export {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxAlignItems,\n  BoxJustifyContent,\n} from '../../types';\nexport type { BoxSpacing, BoxBorderWidth } from '../../types';\nexport { Box } from './Box';\nexport type { BoxProps } from './Box.types';\n"]}

package/dist/components/Button/Button.cjs

@@ -19,7 +19,7 @@ const Button = (buttonProps) => {
         case types_1.ButtonVariant.Secondary:
             return <ButtonSecondary_1.ButtonSecondary {...restProps}/>;
         default:
-            throw new Error(`Invalid Button Variant: ${variant}. Expected one of: ${Object.values(types_1.ButtonVariant).join(', ')}`);
+            throw new Error(`Invalid Button Variant: ${String(variant)}. Expected one of: ${Object.values(types_1.ButtonVariant).join(', ')}`);
     }
 };
 exports.Button = Button;

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

@@ -1 +1 @@
-{"version":3,"file":"Button.cjs","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,iDAA4C;AAG5C,sEAAyD;AACzD,0EAA6D;AAC7D,wEAA2D;AAEpD,MAAM,MAAM,GAAG,CAAC,WAAwB,EAAE,EAAE;IACjD,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,GAAG,WAAW,CAAC;IAE9C,QAAQ,OAAO,EAAE;QACf,KAAK,qBAAa,CAAC,QAAQ;YACzB,OAAO,CAAC,+BAAc,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC3C,KAAK,qBAAa,CAAC,OAAO;YACxB,OAAO,CAAC,6BAAa,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC1C,KAAK,qBAAa,CAAC,SAAS;YAC1B,OAAO,CAAC,iCAAe,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC5C;YACE,MAAM,IAAI,KAAK,CACb,2BAA2B,OAAO,sBAAsB,MAAM,CAAC,MAAM,CAAC,qBAAa,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAClG,CAAC;KACL;AACH,CAAC,CAAC;AAfW,QAAA,MAAM,UAejB","sourcesContent":["import React from 'react';\n\nimport { ButtonVariant } from '../../types';\n\nimport type { ButtonProps } from './Button.types';\nimport { ButtonPrimary } from './variants/ButtonPrimary';\nimport { ButtonSecondary } from './variants/ButtonSecondary';\nimport { ButtonTertiary } from './variants/ButtonTertiary';\n\nexport const Button = (buttonProps: ButtonProps) => {\n  const { variant, ...restProps } = buttonProps;\n\n  switch (variant) {\n    case ButtonVariant.Tertiary:\n      return <ButtonTertiary {...restProps} />;\n    case ButtonVariant.Primary:\n      return <ButtonPrimary {...restProps} />;\n    case ButtonVariant.Secondary:\n      return <ButtonSecondary {...restProps} />;\n    default:\n      throw new Error(\n        `Invalid Button Variant: ${variant}. Expected one of: ${Object.values(ButtonVariant).join(', ')}`,\n      );\n  }\n};\n"]}
+{"version":3,"file":"Button.cjs","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,iDAA4C;AAG5C,sEAAyD;AACzD,0EAA6D;AAC7D,wEAA2D;AAEpD,MAAM,MAAM,GAAG,CAAC,WAAwB,EAAE,EAAE;IACjD,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,GAAG,WAAW,CAAC;IAE9C,QAAQ,OAAO,EAAE;QACf,KAAK,qBAAa,CAAC,QAAQ;YACzB,OAAO,CAAC,+BAAc,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC3C,KAAK,qBAAa,CAAC,OAAO;YACxB,OAAO,CAAC,6BAAa,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC1C,KAAK,qBAAa,CAAC,SAAS;YAC1B,OAAO,CAAC,iCAAe,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC5C;YACE,MAAM,IAAI,KAAK,CACb,2BAA2B,MAAM,CAAC,OAAO,CAAC,sBAAsB,MAAM,CAAC,MAAM,CAAC,qBAAa,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAC1G,CAAC;KACL;AACH,CAAC,CAAC;AAfW,QAAA,MAAM,UAejB","sourcesContent":["import React from 'react';\n\nimport { ButtonVariant } from '../../types';\n\nimport type { ButtonProps } from './Button.types';\nimport { ButtonPrimary } from './variants/ButtonPrimary';\nimport { ButtonSecondary } from './variants/ButtonSecondary';\nimport { ButtonTertiary } from './variants/ButtonTertiary';\n\nexport const Button = (buttonProps: ButtonProps) => {\n  const { variant, ...restProps } = buttonProps;\n\n  switch (variant) {\n    case ButtonVariant.Tertiary:\n      return <ButtonTertiary {...restProps} />;\n    case ButtonVariant.Primary:\n      return <ButtonPrimary {...restProps} />;\n    case ButtonVariant.Secondary:\n      return <ButtonSecondary {...restProps} />;\n    default:\n      throw new Error(\n        `Invalid Button Variant: ${String(variant)}. Expected one of: ${Object.values(ButtonVariant).join(', ')}`,\n      );\n  }\n};\n"]}

package/dist/components/Button/Button.mjs

@@ -20,7 +20,7 @@ export const Button = (buttonProps) => {
         case ButtonVariant.Secondary:
             return <ButtonSecondary {...restProps}/>;
         default:
-            throw new Error(`Invalid Button Variant: ${variant}. Expected one of: ${Object.values(ButtonVariant).join(', ')}`);
+            throw new Error(`Invalid Button Variant: ${String(variant)}. Expected one of: ${Object.values(ButtonVariant).join(', ')}`);
     }
 };
 //# sourceMappingURL=Button.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Button.mjs","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,aAAa,EAAE,8BAAoB;AAG5C,OAAO,EAAE,aAAa,EAAE,2CAAiC;AACzD,OAAO,EAAE,eAAe,EAAE,6CAAmC;AAC7D,OAAO,EAAE,cAAc,EAAE,4CAAkC;AAE3D,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,WAAwB,EAAE,EAAE;IACjD,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,GAAG,WAAW,CAAC;IAE9C,QAAQ,OAAO,EAAE;QACf,KAAK,aAAa,CAAC,QAAQ;YACzB,OAAO,CAAC,cAAc,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC3C,KAAK,aAAa,CAAC,OAAO;YACxB,OAAO,CAAC,aAAa,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC1C,KAAK,aAAa,CAAC,SAAS;YAC1B,OAAO,CAAC,eAAe,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC5C;YACE,MAAM,IAAI,KAAK,CACb,2BAA2B,OAAO,sBAAsB,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAClG,CAAC;KACL;AACH,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { ButtonVariant } from '../../types';\n\nimport type { ButtonProps } from './Button.types';\nimport { ButtonPrimary } from './variants/ButtonPrimary';\nimport { ButtonSecondary } from './variants/ButtonSecondary';\nimport { ButtonTertiary } from './variants/ButtonTertiary';\n\nexport const Button = (buttonProps: ButtonProps) => {\n  const { variant, ...restProps } = buttonProps;\n\n  switch (variant) {\n    case ButtonVariant.Tertiary:\n      return <ButtonTertiary {...restProps} />;\n    case ButtonVariant.Primary:\n      return <ButtonPrimary {...restProps} />;\n    case ButtonVariant.Secondary:\n      return <ButtonSecondary {...restProps} />;\n    default:\n      throw new Error(\n        `Invalid Button Variant: ${variant}. Expected one of: ${Object.values(ButtonVariant).join(', ')}`,\n      );\n  }\n};\n"]}
+{"version":3,"file":"Button.mjs","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,aAAa,EAAE,8BAAoB;AAG5C,OAAO,EAAE,aAAa,EAAE,2CAAiC;AACzD,OAAO,EAAE,eAAe,EAAE,6CAAmC;AAC7D,OAAO,EAAE,cAAc,EAAE,4CAAkC;AAE3D,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,WAAwB,EAAE,EAAE;IACjD,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,GAAG,WAAW,CAAC;IAE9C,QAAQ,OAAO,EAAE;QACf,KAAK,aAAa,CAAC,QAAQ;YACzB,OAAO,CAAC,cAAc,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC3C,KAAK,aAAa,CAAC,OAAO;YACxB,OAAO,CAAC,aAAa,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC1C,KAAK,aAAa,CAAC,SAAS;YAC1B,OAAO,CAAC,eAAe,CAAC,IAAI,SAAS,CAAC,EAAG,CAAC;QAC5C;YACE,MAAM,IAAI,KAAK,CACb,2BAA2B,MAAM,CAAC,OAAO,CAAC,sBAAsB,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAC1G,CAAC;KACL;AACH,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { ButtonVariant } from '../../types';\n\nimport type { ButtonProps } from './Button.types';\nimport { ButtonPrimary } from './variants/ButtonPrimary';\nimport { ButtonSecondary } from './variants/ButtonSecondary';\nimport { ButtonTertiary } from './variants/ButtonTertiary';\n\nexport const Button = (buttonProps: ButtonProps) => {\n  const { variant, ...restProps } = buttonProps;\n\n  switch (variant) {\n    case ButtonVariant.Tertiary:\n      return <ButtonTertiary {...restProps} />;\n    case ButtonVariant.Primary:\n      return <ButtonPrimary {...restProps} />;\n    case ButtonVariant.Secondary:\n      return <ButtonSecondary {...restProps} />;\n    default:\n      throw new Error(\n        `Invalid Button Variant: ${String(variant)}. Expected one of: ${Object.values(ButtonVariant).join(', ')}`,\n      );\n  }\n};\n"]}

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

@@ -24,83 +24,55 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ButtonPrimary = void 0;
-const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-twrnc-preset");
 const react_1 = __importStar(require("react"));
 const ButtonBase_1 = require("../../../ButtonBase/index.cjs");
 const Icon_1 = require("../../../Icon/index.cjs");
 const Text_1 = require("../../../Text/index.cjs");
-const ButtonPrimaryBase = ({ children, textProps, spinnerProps, startIconProps, endIconProps, isDanger = false, isInverse, isLoading = false, onPressIn, onPressOut, twClassName = '', style, ...props }) => {
-    const [isPressed, setIsPressed] = (0, react_1.useState)(false);
-    const tw = (0, design_system_twrnc_preset_1.useTailwind)();
-    const twContainerClassNames = `
-    ${isInverse && isDanger
-        ? isPressed || isLoading
-            ? 'bg-default-pressed'
-            : 'bg-default'
-        : isDanger
-            ? isPressed || isLoading
-                ? 'bg-error-default-pressed'
-                : 'bg-error-default'
-            : isInverse
-                ? isPressed || isLoading
-                    ? 'bg-default-pressed'
-                    : 'bg-default'
-                : isPressed || isLoading
-                    ? 'bg-primary-default-pressed'
-                    : 'bg-primary-default'}
-    ${twClassName}
-  `;
-    const twTextClassNames = isInverse && isDanger
-        ? isPressed || isLoading
-            ? 'text-error-default-pressed'
-            : 'text-error-default'
-        : isDanger
-            ? 'text-primary-inverse'
-            : isInverse
-                ? 'text-default'
-                : 'text-primary-inverse';
-    const onPressInHandler = (event) => {
-        setIsPressed(true);
-        onPressIn?.(event);
-    };
-    const onPressOutHandler = (event) => {
-        setIsPressed(false);
-        onPressOut?.(event);
-    };
+const ButtonPrimary = ({ children, textProps, spinnerProps, startIconProps, endIconProps, isDanger = false, isInverse = false, isLoading = false, twClassName = '', style, ...props }) => {
+    const getContainerClassName = (0, react_1.useCallback)((pressed) => {
+        const classNameStr = typeof twClassName === 'function' ? twClassName(pressed) : twClassName;
+        if (isInverse && isDanger) {
+            return `${pressed || isLoading ? 'bg-default-pressed' : 'bg-default'} ${classNameStr}`;
+        }
+        if (isDanger) {
+            return `${pressed || isLoading ? 'bg-error-default-pressed' : 'bg-error-default'} ${classNameStr}`;
+        }
+        if (isInverse) {
+            return `${pressed || isLoading ? 'bg-default-pressed' : 'bg-default'} ${classNameStr}`;
+        }
+        return `${pressed || isLoading ? 'bg-icon-default-pressed' : 'bg-icon-default'} ${classNameStr}`;
+    }, [isInverse, isDanger, isLoading, twClassName]);
+    const getTextClassName = (0, react_1.useCallback)((pressed) => {
+        if (isInverse && isDanger) {
+            return pressed || isLoading
+                ? 'text-error-default-pressed'
+                : 'text-error-default';
+        }
+        if (isDanger) {
+            return 'text-primary-inverse';
+        }
+        if (isInverse) {
+            return 'text-default';
+        }
+        return 'text-primary-inverse';
+    }, [isInverse, isDanger, isLoading]);
     return (<ButtonBase_1.ButtonBase textProps={{
             variant: Text_1.TextVariant.BodyMd,
             fontWeight: Text_1.FontWeight.Medium,
             numberOfLines: 1,
             ellipsizeMode: 'clip',
             ...textProps,
-            twClassName: `${twTextClassNames} ${textProps?.twClassName ?? ''}`,
         }} spinnerProps={{
-            color: twTextClassNames,
-            loadingTextProps: {
-                twClassName: twTextClassNames,
-            },
             ...spinnerProps,
         }} startIconProps={{
             size: Icon_1.IconSize.Sm,
             ...startIconProps,
-            twClassName: `${twTextClassNames} ${startIconProps?.twClassName ?? ''}`,
         }} endIconProps={{
             size: Icon_1.IconSize.Sm,
             ...endIconProps,
-            twClassName: `${twTextClassNames} ${startIconProps?.twClassName ?? ''}`,
-        }} isLoading={isLoading} onPressIn={onPressInHandler} onPressOut={onPressOutHandler} style={[tw `${twContainerClassNames}`, style]} {...props}>
+        }} isLoading={isLoading} twClassName={getContainerClassName} textClassName={getTextClassName} iconClassName={getTextClassName} style={style} {...props}>
       {children}
     </ButtonBase_1.ButtonBase>);
 };
-const ButtonPrimary = ({ isInverse = false, ...props }) => {
-    // If inverse, use the current theme context
-    if (isInverse) {
-        return <ButtonPrimaryBase isInverse {...props}/>;
-    }
-    // Otherwise, force light theme
-    return (<design_system_twrnc_preset_1.ThemeProvider theme={design_system_twrnc_preset_1.Theme.Light}>
-      <ButtonPrimaryBase isInverse={false} {...props}/>
-    </design_system_twrnc_preset_1.ThemeProvider>);
-};
 exports.ButtonPrimary = ButtonPrimary;
 //# sourceMappingURL=ButtonPrimary.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"ButtonPrimary.cjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonPrimary/ButtonPrimary.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  useTailwind,\n  ThemeProvider,\n  Theme,\n} from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useState } from 'react';\nimport type { GestureResponderEvent } from 'react-native';\n\nimport { ButtonBase } from '../../../ButtonBase';\nimport type { IconColor } from '../../../Icon';\nimport { IconSize } from '../../../Icon';\nimport { TextVariant, FontWeight } from '../../../Text';\n\nimport type { ButtonPrimaryProps } from './ButtonPrimary.types';\n\nconst ButtonPrimaryBase = ({\n  children,\n  textProps,\n  spinnerProps,\n  startIconProps,\n  endIconProps,\n  isDanger = false,\n  isInverse,\n  isLoading = false,\n  onPressIn,\n  onPressOut,\n  twClassName = '',\n  style,\n  ...props\n}: ButtonPrimaryProps) => {\n  const [isPressed, setIsPressed] = useState(false);\n  const tw = useTailwind();\n\n  const twContainerClassNames = `\n    ${\n      isInverse && isDanger\n        ? isPressed || isLoading\n          ? 'bg-default-pressed'\n          : 'bg-default'\n        : isDanger\n          ? isPressed || isLoading\n            ? 'bg-error-default-pressed'\n            : 'bg-error-default'\n          : isInverse\n            ? isPressed || isLoading\n              ? 'bg-default-pressed'\n              : 'bg-default'\n            : isPressed || isLoading\n              ? 'bg-primary-default-pressed'\n              : 'bg-primary-default'\n    }\n    ${twClassName}\n  `;\n\n  const twTextClassNames =\n    isInverse && isDanger\n      ? isPressed || isLoading\n        ? 'text-error-default-pressed'\n        : 'text-error-default'\n      : isDanger\n        ? 'text-primary-inverse'\n        : isInverse\n          ? 'text-default'\n          : 'text-primary-inverse';\n\n  const onPressInHandler = (event: GestureResponderEvent) => {\n    setIsPressed(true);\n    onPressIn?.(event);\n  };\n\n  const onPressOutHandler = (event: GestureResponderEvent) => {\n    setIsPressed(false);\n    onPressOut?.(event);\n  };\n\n  return (\n    <ButtonBase\n      textProps={{\n        variant: TextVariant.BodyMd,\n        fontWeight: FontWeight.Medium,\n        numberOfLines: 1,\n        ellipsizeMode: 'clip',\n        ...textProps,\n        twClassName: `${twTextClassNames} ${textProps?.twClassName ?? ''}`,\n      }}\n      spinnerProps={{\n        color: twTextClassNames as IconColor,\n        loadingTextProps: {\n          twClassName: twTextClassNames,\n        },\n        ...spinnerProps,\n      }}\n      startIconProps={{\n        size: IconSize.Sm,\n        ...startIconProps,\n        twClassName: `${twTextClassNames} ${startIconProps?.twClassName ?? ''}`,\n      }}\n      endIconProps={{\n        size: IconSize.Sm,\n        ...endIconProps,\n        twClassName: `${twTextClassNames} ${startIconProps?.twClassName ?? ''}`,\n      }}\n      isLoading={isLoading}\n      onPressIn={onPressInHandler}\n      onPressOut={onPressOutHandler}\n      style={[tw`${twContainerClassNames}`, style]}\n      {...props}\n    >\n      {children}\n    </ButtonBase>\n  );\n};\n\nexport const ButtonPrimary = ({\n  isInverse = false,\n  ...props\n}: ButtonPrimaryProps) => {\n  // If inverse, use the current theme context\n  if (isInverse) {\n    return <ButtonPrimaryBase isInverse {...props} />;\n  }\n  // Otherwise, force light theme\n  return (\n    <ThemeProvider theme={Theme.Light}>\n      <ButtonPrimaryBase isInverse={false} {...props} />\n    </ThemeProvider>\n  );\n};\n"]}
+{"version":3,"file":"ButtonPrimary.cjs","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonPrimary/ButtonPrimary.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA2C;AAE3C,8DAAiD;AACjD,kDAAyC;AACzC,kDAAwD;AAIjD,MAAM,aAAa,GAAG,CAAC,EAC5B,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,cAAc,EACd,YAAY,EACZ,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,EACjB,WAAW,GAAG,EAAE,EAChB,KAAK,EACL,GAAG,KAAK,EACW,EAAE,EAAE;IACvB,MAAM,qBAAqB,GAAG,IAAA,mBAAW,EACvC,CAAC,OAAgB,EAAU,EAAE;QAC3B,MAAM,YAAY,GAChB,OAAO,WAAW,KAAK,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC;QAEzE,IAAI,SAAS,IAAI,QAAQ,EAAE;YACzB,OAAO,GAAG,OAAO,IAAI,SAAS,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,YAAY,IAAI,YAAY,EAAE,CAAC;SACxF;QACD,IAAI,QAAQ,EAAE;YACZ,OAAO,GAAG,OAAO,IAAI,SAAS,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,kBAAkB,IAAI,YAAY,EAAE,CAAC;SACpG;QACD,IAAI,SAAS,EAAE;YACb,OAAO,GAAG,OAAO,IAAI,SAAS,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,YAAY,IAAI,YAAY,EAAE,CAAC;SACxF;QACD,OAAO,GAAG,OAAO,IAAI,SAAS,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,iBAAiB,IAAI,YAAY,EAAE,CAAC;IACnG,CAAC,EACD,CAAC,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,CAAC,CAC9C,CAAC;IAEF,MAAM,gBAAgB,GAAG,IAAA,mBAAW,EAClC,CAAC,OAAgB,EAAU,EAAE;QAC3B,IAAI,SAAS,IAAI,QAAQ,EAAE;YACzB,OAAO,OAAO,IAAI,SAAS;gBACzB,CAAC,CAAC,4BAA4B;gBAC9B,CAAC,CAAC,oBAAoB,CAAC;SAC1B;QACD,IAAI,QAAQ,EAAE;YACZ,OAAO,sBAAsB,CAAC;SAC/B;QACD,IAAI,SAAS,EAAE;YACb,OAAO,cAAc,CAAC;SACvB;QACD,OAAO,sBAAsB,CAAC;IAChC,CAAC,EACD,CAAC,SAAS,EAAE,QAAQ,EAAE,SAAS,CAAC,CACjC,CAAC;IAEF,OAAO,CACL,CAAC,uBAAU,CACT,SAAS,CAAC,CAAC;YACT,OAAO,EAAE,kBAAW,CAAC,MAAM;YAC3B,UAAU,EAAE,iBAAU,CAAC,MAAM;YAC7B,aAAa,EAAE,CAAC;YAChB,aAAa,EAAE,MAAM;YACrB,GAAG,SAAS;SACb,CAAC,CACF,YAAY,CAAC,CAAC;YACZ,GAAG,YAAY;SAChB,CAAC,CACF,cAAc,CAAC,CAAC;YACd,IAAI,EAAE,eAAQ,CAAC,EAAE;YACjB,GAAG,cAAc;SAClB,CAAC,CACF,YAAY,CAAC,CAAC;YACZ,IAAI,EAAE,eAAQ,CAAC,EAAE;YACjB,GAAG,YAAY;SAChB,CAAC,CACF,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,WAAW,CAAC,CAAC,qBAAqB,CAAC,CACnC,aAAa,CAAC,CAAC,gBAAgB,CAAC,CAChC,aAAa,CAAC,CAAC,gBAAgB,CAAC,CAChC,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,uBAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC;AAhFW,QAAA,aAAa,iBAgFxB","sourcesContent":["import React, { useCallback } from 'react';\n\nimport { ButtonBase } from '../../../ButtonBase';\nimport { IconSize } from '../../../Icon';\nimport { TextVariant, FontWeight } from '../../../Text';\n\nimport type { ButtonPrimaryProps } from './ButtonPrimary.types';\n\nexport const ButtonPrimary = ({\n  children,\n  textProps,\n  spinnerProps,\n  startIconProps,\n  endIconProps,\n  isDanger = false,\n  isInverse = false,\n  isLoading = false,\n  twClassName = '',\n  style,\n  ...props\n}: ButtonPrimaryProps) => {\n  const getContainerClassName = useCallback(\n    (pressed: boolean): string => {\n      const classNameStr =\n        typeof twClassName === 'function' ? twClassName(pressed) : twClassName;\n\n      if (isInverse && isDanger) {\n        return `${pressed || isLoading ? 'bg-default-pressed' : 'bg-default'} ${classNameStr}`;\n      }\n      if (isDanger) {\n        return `${pressed || isLoading ? 'bg-error-default-pressed' : 'bg-error-default'} ${classNameStr}`;\n      }\n      if (isInverse) {\n        return `${pressed || isLoading ? 'bg-default-pressed' : 'bg-default'} ${classNameStr}`;\n      }\n      return `${pressed || isLoading ? 'bg-icon-default-pressed' : 'bg-icon-default'} ${classNameStr}`;\n    },\n    [isInverse, isDanger, isLoading, twClassName],\n  );\n\n  const getTextClassName = useCallback(\n    (pressed: boolean): string => {\n      if (isInverse && isDanger) {\n        return pressed || isLoading\n          ? 'text-error-default-pressed'\n          : 'text-error-default';\n      }\n      if (isDanger) {\n        return 'text-primary-inverse';\n      }\n      if (isInverse) {\n        return 'text-default';\n      }\n      return 'text-primary-inverse';\n    },\n    [isInverse, isDanger, isLoading],\n  );\n\n  return (\n    <ButtonBase\n      textProps={{\n        variant: TextVariant.BodyMd,\n        fontWeight: FontWeight.Medium,\n        numberOfLines: 1,\n        ellipsizeMode: 'clip',\n        ...textProps,\n      }}\n      spinnerProps={{\n        ...spinnerProps,\n      }}\n      startIconProps={{\n        size: IconSize.Sm,\n        ...startIconProps,\n      }}\n      endIconProps={{\n        size: IconSize.Sm,\n        ...endIconProps,\n      }}\n      isLoading={isLoading}\n      twClassName={getContainerClassName}\n      textClassName={getTextClassName}\n      iconClassName={getTextClassName}\n      style={style}\n      {...props}\n    >\n      {children}\n    </ButtonBase>\n  );\n};\n"]}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"ButtonPrimary.d.cts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonPrimary/ButtonPrimary.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAmB,cAAc;AAQxC,OAAO,KAAK,EAAE,kBAAkB,EAAE,kCAA8B;AAoGhE,eAAO,MAAM,aAAa,4BAGvB,kBAAkB,sBAWpB,CAAC"}
+{"version":3,"file":"ButtonPrimary.d.cts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonPrimary/ButtonPrimary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,cAAc;AAM3C,OAAO,KAAK,EAAE,kBAAkB,EAAE,kCAA8B;AAEhE,eAAO,MAAM,aAAa,sIAYvB,kBAAkB,sBAoEpB,CAAC"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"ButtonPrimary.d.mts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonPrimary/ButtonPrimary.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAmB,cAAc;AAQxC,OAAO,KAAK,EAAE,kBAAkB,EAAE,kCAA8B;AAoGhE,eAAO,MAAM,aAAa,4BAGvB,kBAAkB,sBAWpB,CAAC"}
+{"version":3,"file":"ButtonPrimary.d.mts","sourceRoot":"","sources":["../../../../../src/components/Button/variants/ButtonPrimary/ButtonPrimary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,cAAc;AAM3C,OAAO,KAAK,EAAE,kBAAkB,EAAE,kCAA8B;AAEhE,eAAO,MAAM,aAAa,sIAYvB,kBAAkB,sBAoEpB,CAAC"}

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

@@ -4,83 +4,55 @@ function $importDefault(module) {
     }
     return module;
 }
-import { useTailwind, ThemeProvider, Theme } from "@metamask-previews/design-system-twrnc-preset";
-import $React, { useState } from "react";
+import $React, { useCallback } from "react";
 const React = $importDefault($React);
 import { ButtonBase } from "../../../ButtonBase/index.mjs";
 import { IconSize } from "../../../Icon/index.mjs";
 import { TextVariant, FontWeight } from "../../../Text/index.mjs";
-const ButtonPrimaryBase = ({ children, textProps, spinnerProps, startIconProps, endIconProps, isDanger = false, isInverse, isLoading = false, onPressIn, onPressOut, twClassName = '', style, ...props }) => {
-    const [isPressed, setIsPressed] = useState(false);
-    const tw = useTailwind();
-    const twContainerClassNames = `
-    ${isInverse && isDanger
-        ? isPressed || isLoading
-            ? 'bg-default-pressed'
-            : 'bg-default'
-        : isDanger
-            ? isPressed || isLoading
-                ? 'bg-error-default-pressed'
-                : 'bg-error-default'
-            : isInverse
-                ? isPressed || isLoading
-                    ? 'bg-default-pressed'
-                    : 'bg-default'
-                : isPressed || isLoading
-                    ? 'bg-primary-default-pressed'
-                    : 'bg-primary-default'}
-    ${twClassName}
-  `;
-    const twTextClassNames = isInverse && isDanger
-        ? isPressed || isLoading
-            ? 'text-error-default-pressed'
-            : 'text-error-default'
-        : isDanger
-            ? 'text-primary-inverse'
-            : isInverse
-                ? 'text-default'
-                : 'text-primary-inverse';
-    const onPressInHandler = (event) => {
-        setIsPressed(true);
-        onPressIn?.(event);
-    };
-    const onPressOutHandler = (event) => {
-        setIsPressed(false);
-        onPressOut?.(event);
-    };
+export const ButtonPrimary = ({ children, textProps, spinnerProps, startIconProps, endIconProps, isDanger = false, isInverse = false, isLoading = false, twClassName = '', style, ...props }) => {
+    const getContainerClassName = useCallback((pressed) => {
+        const classNameStr = typeof twClassName === 'function' ? twClassName(pressed) : twClassName;
+        if (isInverse && isDanger) {
+            return `${pressed || isLoading ? 'bg-default-pressed' : 'bg-default'} ${classNameStr}`;
+        }
+        if (isDanger) {
+            return `${pressed || isLoading ? 'bg-error-default-pressed' : 'bg-error-default'} ${classNameStr}`;
+        }
+        if (isInverse) {
+            return `${pressed || isLoading ? 'bg-default-pressed' : 'bg-default'} ${classNameStr}`;
+        }
+        return `${pressed || isLoading ? 'bg-icon-default-pressed' : 'bg-icon-default'} ${classNameStr}`;
+    }, [isInverse, isDanger, isLoading, twClassName]);
+    const getTextClassName = useCallback((pressed) => {
+        if (isInverse && isDanger) {
+            return pressed || isLoading
+                ? 'text-error-default-pressed'
+                : 'text-error-default';
+        }
+        if (isDanger) {
+            return 'text-primary-inverse';
+        }
+        if (isInverse) {
+            return 'text-default';
+        }
+        return 'text-primary-inverse';
+    }, [isInverse, isDanger, isLoading]);
     return (<ButtonBase textProps={{
             variant: TextVariant.BodyMd,
             fontWeight: FontWeight.Medium,
             numberOfLines: 1,
             ellipsizeMode: 'clip',
             ...textProps,
-            twClassName: `${twTextClassNames} ${textProps?.twClassName ?? ''}`,
         }} spinnerProps={{
-            color: twTextClassNames,
-            loadingTextProps: {
-                twClassName: twTextClassNames,
-            },
             ...spinnerProps,
         }} startIconProps={{
             size: IconSize.Sm,
             ...startIconProps,
-            twClassName: `${twTextClassNames} ${startIconProps?.twClassName ?? ''}`,
         }} endIconProps={{
             size: IconSize.Sm,
             ...endIconProps,
-            twClassName: `${twTextClassNames} ${startIconProps?.twClassName ?? ''}`,
-        }} isLoading={isLoading} onPressIn={onPressInHandler} onPressOut={onPressOutHandler} style={[tw `${twContainerClassNames}`, style]} {...props}>
+        }} isLoading={isLoading} twClassName={getContainerClassName} textClassName={getTextClassName} iconClassName={getTextClassName} style={style} {...props}>
       {children}
     </ButtonBase>);
 };
-export const ButtonPrimary = ({ isInverse = false, ...props }) => {
-    // If inverse, use the current theme context
-    if (isInverse) {
-        return <ButtonPrimaryBase isInverse {...props}/>;
-    }
-    // Otherwise, force light theme
-    return (<ThemeProvider theme={Theme.Light}>
-      <ButtonPrimaryBase isInverse={false} {...props}/>
-    </ThemeProvider>);
-};
 //# sourceMappingURL=ButtonPrimary.mjs.map