@metamask/design-system-react-native 0.19.0 → 0.20.0

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

@@ -1 +1 @@
-{"version":3,"file":"Box.mjs","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,6CAA6C;AACnE,OAAO,MAAK,cAAc;;AAC1B,OAAO,EAAE,IAAI,EAAE,8BAAqB;AAEpC,OAAO,EACL,kBAAkB,EAClB,qBAAqB,EACrB,yBAAyB,EACzB,2BAA2B,EAC3B,4BAA4B,EAC5B,0BAA0B,EAC1B,gCAAgC,EAChC,8BAA8B,EAC9B,sBAAsB,EACtB,0BAA0B,EAC1B,4BAA4B,EAC5B,6BAA6B,EAC7B,2BAA2B,EAC3B,iCAAiC,EACjC,+BAA+B,EAC/B,2BAA2B,EAC5B,4BAAwB;AAGzB,MAAM,CAAC,MAAM,GAAG,GAAG,CAAC,EAClB,aAAa,EACb,QAAQ,EACR,GAAG,EACH,UAAU,EACV,cAAc,EACd,MAAM,EACN,SAAS,EACT,WAAW,EACX,YAAY,EACZ,UAAU,EACV,gBAAgB,EAChB,cAAc,EACd,OAAO,EACP,UAAU,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,WAAW,EACX,eAAe,EACf,WAAW,EACX,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACC,EAAE,EAAE;IACb,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,OAAO,CACL,CAAC,IAAI,CACH,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CACN,MAAM,EACN,aAAa,EACb,QAAQ,EACR,GAAG,KAAK,SAAS,IAAI,kBAAkB,CAAC,GAAG,CAAC,EAC5C,UAAU,EACV,cAAc,EACd,MAAM,KAAK,SAAS,IAAI,qBAAqB,CAAC,MAAM,CAAC,EACrD,SAAS,KAAK,SAAS,IAAI,yBAAyB,CAAC,SAAS,CAAC,EAC/D,WAAW,KAAK,SAAS,IAAI,2BAA2B,CAAC,WAAW,CAAC,EACrE,YAAY,KAAK,SAAS;gBACxB,4BAA4B,CAAC,YAAY,CAAC,EAC5C,UAAU,KAAK,SAAS,IAAI,0BAA0B,CAAC,UAAU,CAAC,EAClE,gBAAgB,KAAK,SAAS;gBAC5B,gCAAgC,CAAC,gBAAgB,CAAC,EACpD,cAAc,KAAK,SAAS;gBAC1B,8BAA8B,CAAC,cAAc,CAAC,EAChD,OAAO,KAAK,SAAS,IAAI,sBAAsB,CAAC,OAAO,CAAC,EACxD,UAAU,KAAK,SAAS,IAAI,0BAA0B,CAAC,UAAU,CAAC,EAClE,YAAY,KAAK,SAAS;gBACxB,4BAA4B,CAAC,YAAY,CAAC,EAC5C,aAAa,KAAK,SAAS;gBACzB,6BAA6B,CAAC,aAAa,CAAC,EAC9C,WAAW,KAAK,SAAS,IAAI,2BAA2B,CAAC,WAAW,CAAC,EACrE,iBAAiB,KAAK,SAAS;gBAC7B,iCAAiC,CAAC,iBAAiB,CAAC,EACtD,eAAe,KAAK,SAAS;gBAC3B,+BAA+B,CAAC,eAAe,CAAC,EAClD,WAAW,KAAK,SAAS,IAAI,2BAA2B,CAAC,WAAW,CAAC,EACrE,WAAW,EACX,eAAe,EACf,WAAW,CACZ;YACD,KAAK;SACN,CAAC,CAEF;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React from 'react';\nimport { View } from 'react-native';\n\nimport {\n  TWCLASSMAP_BOX_GAP,\n  TWCLASSMAP_BOX_MARGIN,\n  TWCLASSMAP_BOX_MARGIN_TOP,\n  TWCLASSMAP_BOX_MARGIN_RIGHT,\n  TWCLASSMAP_BOX_MARGIN_BOTTOM,\n  TWCLASSMAP_BOX_MARGIN_LEFT,\n  TWCLASSMAP_BOX_MARGIN_HORIZONTAL,\n  TWCLASSMAP_BOX_MARGIN_VERTICAL,\n  TWCLASSMAP_BOX_PADDING,\n  TWCLASSMAP_BOX_PADDING_TOP,\n  TWCLASSMAP_BOX_PADDING_RIGHT,\n  TWCLASSMAP_BOX_PADDING_BOTTOM,\n  TWCLASSMAP_BOX_PADDING_LEFT,\n  TWCLASSMAP_BOX_PADDING_HORIZONTAL,\n  TWCLASSMAP_BOX_PADDING_VERTICAL,\n  TWCLASSMAP_BOX_BORDER_WIDTH,\n} from './Box.constants';\nimport type { BoxProps } from './Box.types';\n\nexport const Box = ({\n  flexDirection,\n  flexWrap,\n  gap,\n  alignItems,\n  justifyContent,\n  margin,\n  marginTop,\n  marginRight,\n  marginBottom,\n  marginLeft,\n  marginHorizontal,\n  marginVertical,\n  padding,\n  paddingTop,\n  paddingRight,\n  paddingBottom,\n  paddingLeft,\n  paddingHorizontal,\n  paddingVertical,\n  borderWidth,\n  borderColor,\n  backgroundColor,\n  twClassName,\n  style,\n  children,\n  ...props\n}: BoxProps) => {\n  const tw = useTailwind();\n\n  return (\n    <View\n      {...props}\n      style={[\n        tw.style(\n          'flex',\n          flexDirection,\n          flexWrap,\n          gap !== undefined && TWCLASSMAP_BOX_GAP[gap],\n          alignItems,\n          justifyContent,\n          margin !== undefined && TWCLASSMAP_BOX_MARGIN[margin],\n          marginTop !== undefined && TWCLASSMAP_BOX_MARGIN_TOP[marginTop],\n          marginRight !== undefined && TWCLASSMAP_BOX_MARGIN_RIGHT[marginRight],\n          marginBottom !== undefined &&\n            TWCLASSMAP_BOX_MARGIN_BOTTOM[marginBottom],\n          marginLeft !== undefined && TWCLASSMAP_BOX_MARGIN_LEFT[marginLeft],\n          marginHorizontal !== undefined &&\n            TWCLASSMAP_BOX_MARGIN_HORIZONTAL[marginHorizontal],\n          marginVertical !== undefined &&\n            TWCLASSMAP_BOX_MARGIN_VERTICAL[marginVertical],\n          padding !== undefined && TWCLASSMAP_BOX_PADDING[padding],\n          paddingTop !== undefined && TWCLASSMAP_BOX_PADDING_TOP[paddingTop],\n          paddingRight !== undefined &&\n            TWCLASSMAP_BOX_PADDING_RIGHT[paddingRight],\n          paddingBottom !== undefined &&\n            TWCLASSMAP_BOX_PADDING_BOTTOM[paddingBottom],\n          paddingLeft !== undefined && TWCLASSMAP_BOX_PADDING_LEFT[paddingLeft],\n          paddingHorizontal !== undefined &&\n            TWCLASSMAP_BOX_PADDING_HORIZONTAL[paddingHorizontal],\n          paddingVertical !== undefined &&\n            TWCLASSMAP_BOX_PADDING_VERTICAL[paddingVertical],\n          borderWidth !== undefined && TWCLASSMAP_BOX_BORDER_WIDTH[borderWidth],\n          borderColor,\n          backgroundColor,\n          twClassName,\n        ),\n        style,\n      ]}\n    >\n      {children}\n    </View>\n  );\n};\n"]}
+{"version":3,"file":"Box.mjs","sourceRoot":"","sources":["../../../src/components/Box/Box.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,6CAA6C;AACnE,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAC1C,OAAO,EAAE,IAAI,EAAE,8BAAqB;AAEpC,OAAO,EACL,kBAAkB,EAClB,qBAAqB,EACrB,yBAAyB,EACzB,2BAA2B,EAC3B,4BAA4B,EAC5B,0BAA0B,EAC1B,gCAAgC,EAChC,8BAA8B,EAC9B,sBAAsB,EACtB,0BAA0B,EAC1B,4BAA4B,EAC5B,6BAA6B,EAC7B,2BAA2B,EAC3B,iCAAiC,EACjC,+BAA+B,EAC/B,2BAA2B,EAC5B,4BAAwB;AAGzB,MAAM,CAAC,MAAM,GAAG,GAAG,UAAU,CAC3B,CACE,EACE,aAAa,EACb,QAAQ,EACR,GAAG,EACH,UAAU,EACV,cAAc,EACd,MAAM,EACN,SAAS,EACT,WAAW,EACX,YAAY,EACZ,UAAU,EACV,gBAAgB,EAChB,cAAc,EACd,OAAO,EACP,UAAU,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,WAAW,EACX,eAAe,EACf,WAAW,EACX,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACC,EACX,GAAG,EACH,EAAE;IACF,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,OAAO,CACL,CAAC,IAAI,CACH,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CACN,MAAM,EACN,aAAa,EACb,QAAQ,EACR,GAAG,KAAK,SAAS,IAAI,kBAAkB,CAAC,GAAG,CAAC,EAC5C,UAAU,EACV,cAAc,EACd,MAAM,KAAK,SAAS,IAAI,qBAAqB,CAAC,MAAM,CAAC,EACrD,SAAS,KAAK,SAAS,IAAI,yBAAyB,CAAC,SAAS,CAAC,EAC/D,WAAW,KAAK,SAAS;gBACvB,2BAA2B,CAAC,WAAW,CAAC,EAC1C,YAAY,KAAK,SAAS;gBACxB,4BAA4B,CAAC,YAAY,CAAC,EAC5C,UAAU,KAAK,SAAS,IAAI,0BAA0B,CAAC,UAAU,CAAC,EAClE,gBAAgB,KAAK,SAAS;gBAC5B,gCAAgC,CAAC,gBAAgB,CAAC,EACpD,cAAc,KAAK,SAAS;gBAC1B,8BAA8B,CAAC,cAAc,CAAC,EAChD,OAAO,KAAK,SAAS,IAAI,sBAAsB,CAAC,OAAO,CAAC,EACxD,UAAU,KAAK,SAAS,IAAI,0BAA0B,CAAC,UAAU,CAAC,EAClE,YAAY,KAAK,SAAS;gBACxB,4BAA4B,CAAC,YAAY,CAAC,EAC5C,aAAa,KAAK,SAAS;gBACzB,6BAA6B,CAAC,aAAa,CAAC,EAC9C,WAAW,KAAK,SAAS;gBACvB,2BAA2B,CAAC,WAAW,CAAC,EAC1C,iBAAiB,KAAK,SAAS;gBAC7B,iCAAiC,CAAC,iBAAiB,CAAC,EACtD,eAAe,KAAK,SAAS;gBAC3B,+BAA+B,CAAC,eAAe,CAAC,EAClD,WAAW,KAAK,SAAS;gBACvB,2BAA2B,CAAC,WAAW,CAAC,EAC1C,WAAW,EACX,eAAe,EACf,WAAW,CACZ;YACD,KAAK;SACN,CAAC,CAEF;QAAA,CAAC,QAAQ,CACX;MAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,GAAG,CAAC,WAAW,GAAG,KAAK,CAAC","sourcesContent":["import { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React, { forwardRef } from 'react';\nimport { View } from 'react-native';\n\nimport {\n  TWCLASSMAP_BOX_GAP,\n  TWCLASSMAP_BOX_MARGIN,\n  TWCLASSMAP_BOX_MARGIN_TOP,\n  TWCLASSMAP_BOX_MARGIN_RIGHT,\n  TWCLASSMAP_BOX_MARGIN_BOTTOM,\n  TWCLASSMAP_BOX_MARGIN_LEFT,\n  TWCLASSMAP_BOX_MARGIN_HORIZONTAL,\n  TWCLASSMAP_BOX_MARGIN_VERTICAL,\n  TWCLASSMAP_BOX_PADDING,\n  TWCLASSMAP_BOX_PADDING_TOP,\n  TWCLASSMAP_BOX_PADDING_RIGHT,\n  TWCLASSMAP_BOX_PADDING_BOTTOM,\n  TWCLASSMAP_BOX_PADDING_LEFT,\n  TWCLASSMAP_BOX_PADDING_HORIZONTAL,\n  TWCLASSMAP_BOX_PADDING_VERTICAL,\n  TWCLASSMAP_BOX_BORDER_WIDTH,\n} from './Box.constants';\nimport type { BoxProps } from './Box.types';\n\nexport const Box = forwardRef<View, BoxProps>(\n  (\n    {\n      flexDirection,\n      flexWrap,\n      gap,\n      alignItems,\n      justifyContent,\n      margin,\n      marginTop,\n      marginRight,\n      marginBottom,\n      marginLeft,\n      marginHorizontal,\n      marginVertical,\n      padding,\n      paddingTop,\n      paddingRight,\n      paddingBottom,\n      paddingLeft,\n      paddingHorizontal,\n      paddingVertical,\n      borderWidth,\n      borderColor,\n      backgroundColor,\n      twClassName,\n      style,\n      children,\n      ...props\n    }: BoxProps,\n    ref,\n  ) => {\n    const tw = useTailwind();\n\n    return (\n      <View\n        ref={ref}\n        {...props}\n        style={[\n          tw.style(\n            'flex',\n            flexDirection,\n            flexWrap,\n            gap !== undefined && TWCLASSMAP_BOX_GAP[gap],\n            alignItems,\n            justifyContent,\n            margin !== undefined && TWCLASSMAP_BOX_MARGIN[margin],\n            marginTop !== undefined && TWCLASSMAP_BOX_MARGIN_TOP[marginTop],\n            marginRight !== undefined &&\n              TWCLASSMAP_BOX_MARGIN_RIGHT[marginRight],\n            marginBottom !== undefined &&\n              TWCLASSMAP_BOX_MARGIN_BOTTOM[marginBottom],\n            marginLeft !== undefined && TWCLASSMAP_BOX_MARGIN_LEFT[marginLeft],\n            marginHorizontal !== undefined &&\n              TWCLASSMAP_BOX_MARGIN_HORIZONTAL[marginHorizontal],\n            marginVertical !== undefined &&\n              TWCLASSMAP_BOX_MARGIN_VERTICAL[marginVertical],\n            padding !== undefined && TWCLASSMAP_BOX_PADDING[padding],\n            paddingTop !== undefined && TWCLASSMAP_BOX_PADDING_TOP[paddingTop],\n            paddingRight !== undefined &&\n              TWCLASSMAP_BOX_PADDING_RIGHT[paddingRight],\n            paddingBottom !== undefined &&\n              TWCLASSMAP_BOX_PADDING_BOTTOM[paddingBottom],\n            paddingLeft !== undefined &&\n              TWCLASSMAP_BOX_PADDING_LEFT[paddingLeft],\n            paddingHorizontal !== undefined &&\n              TWCLASSMAP_BOX_PADDING_HORIZONTAL[paddingHorizontal],\n            paddingVertical !== undefined &&\n              TWCLASSMAP_BOX_PADDING_VERTICAL[paddingVertical],\n            borderWidth !== undefined &&\n              TWCLASSMAP_BOX_BORDER_WIDTH[borderWidth],\n            borderColor,\n            backgroundColor,\n            twClassName,\n          ),\n          style,\n        ]}\n      >\n        {children}\n      </View>\n    );\n  },\n);\n\nBox.displayName = 'Box';\n"]}

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  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"]}
+{"version":3,"file":"Box.types.cjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BoxPropsShared } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\nexport type BoxProps = BoxPropsShared &\n  ViewProps & {\n    /**\n     * Optional prop to add twrnc overriding classNames.\n     */\n    twClassName?: string;\n  };\n"]}

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

@@ -1,113 +1,9 @@
+import type { BoxPropsShared } from "@metamask/design-system-shared";
 import type { ViewProps } from "react-native/index.js";
-import type { BoxFlexDirection, BoxFlexWrap, BoxSpacing, BoxBorderWidth, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor } from "../../types/index.cjs";
-export type BoxProps = {
-    /**
-     * The flexDirection style of the component.
-     */
-    flexDirection?: BoxFlexDirection;
-    /**
-     * The flexWrap style of the component.
-     */
-    flexWrap?: BoxFlexWrap;
-    /**
-     * The gap between the component's children.
-     * Use 1-12 for a gap of 4px-48px.
-     */
-    gap?: BoxSpacing;
-    /**
-     * The alignItems style of the component.
-     */
-    alignItems?: BoxAlignItems;
-    /**
-     * 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;
+export type BoxProps = BoxPropsShared & ViewProps & {
     /**
      * Optional prop to add twrnc overriding classNames.
      */
     twClassName?: string;
-} & ViewProps;
+};
 //# sourceMappingURL=Box.types.d.cts.map

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,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"}
+{"version":3,"file":"Box.types.d.cts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,uCAAuC;AACrE,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,MAAM,MAAM,QAAQ,GAAG,cAAc,GACnC,SAAS,GAAG;IACV;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}

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

@@ -1,113 +1,9 @@
+import type { BoxPropsShared } from "@metamask/design-system-shared";
 import type { ViewProps } from "react-native/index.js";
-import type { BoxFlexDirection, BoxFlexWrap, BoxSpacing, BoxBorderWidth, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor } from "../../types/index.mjs";
-export type BoxProps = {
-    /**
-     * The flexDirection style of the component.
-     */
-    flexDirection?: BoxFlexDirection;
-    /**
-     * The flexWrap style of the component.
-     */
-    flexWrap?: BoxFlexWrap;
-    /**
-     * The gap between the component's children.
-     * Use 1-12 for a gap of 4px-48px.
-     */
-    gap?: BoxSpacing;
-    /**
-     * The alignItems style of the component.
-     */
-    alignItems?: BoxAlignItems;
-    /**
-     * 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;
+export type BoxProps = BoxPropsShared & ViewProps & {
     /**
      * Optional prop to add twrnc overriding classNames.
      */
     twClassName?: string;
-} & ViewProps;
+};
 //# sourceMappingURL=Box.types.d.mts.map

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,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"}
+{"version":3,"file":"Box.types.d.mts","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,uCAAuC;AACrE,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,MAAM,MAAM,QAAQ,GAAG,cAAc,GACnC,SAAS,GAAG;IACV;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,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  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"]}
+{"version":3,"file":"Box.types.mjs","sourceRoot":"","sources":["../../../src/components/Box/Box.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BoxPropsShared } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\nexport type BoxProps = BoxPropsShared &\n  ViewProps & {\n    /**\n     * Optional prop to add twrnc overriding classNames.\n     */\n    twClassName?: string;\n  };\n"]}

package/dist/components/Box/index.cjs

@@ -1,13 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Box = exports.BoxBorderColor = exports.BoxBackgroundColor = exports.BoxJustifyContent = exports.BoxAlignItems = exports.BoxFlexWrap = exports.BoxFlexDirection = void 0;
-var types_1 = require("../../types/index.cjs");
-Object.defineProperty(exports, "BoxFlexDirection", { enumerable: true, get: function () { return types_1.BoxFlexDirection; } });
-Object.defineProperty(exports, "BoxFlexWrap", { enumerable: true, get: function () { return types_1.BoxFlexWrap; } });
-Object.defineProperty(exports, "BoxAlignItems", { enumerable: true, get: function () { return types_1.BoxAlignItems; } });
-Object.defineProperty(exports, "BoxJustifyContent", { enumerable: true, get: function () { return types_1.BoxJustifyContent; } });
-Object.defineProperty(exports, "BoxBackgroundColor", { enumerable: true, get: function () { return types_1.BoxBackgroundColor; } });
-Object.defineProperty(exports, "BoxBorderColor", { enumerable: true, get: function () { return types_1.BoxBorderColor; } });
+var design_system_shared_1 = require("@metamask/design-system-shared");
+Object.defineProperty(exports, "BoxFlexDirection", { enumerable: true, get: function () { return design_system_shared_1.BoxFlexDirection; } });
+Object.defineProperty(exports, "BoxFlexWrap", { enumerable: true, get: function () { return design_system_shared_1.BoxFlexWrap; } });
+Object.defineProperty(exports, "BoxAlignItems", { enumerable: true, get: function () { return design_system_shared_1.BoxAlignItems; } });
+Object.defineProperty(exports, "BoxJustifyContent", { enumerable: true, get: function () { return design_system_shared_1.BoxJustifyContent; } });
+Object.defineProperty(exports, "BoxBackgroundColor", { enumerable: true, get: function () { return design_system_shared_1.BoxBackgroundColor; } });
+Object.defineProperty(exports, "BoxBorderColor", { enumerable: true, get: function () { return design_system_shared_1.BoxBorderColor; } });
 var Box_1 = require("./Box.cjs");
 Object.defineProperty(exports, "Box", { enumerable: true, get: function () { return Box_1.Box; } });
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/Box/index.ts"],"names":[],"mappings":";;;AAAA,+CAOqB;AANnB,yGAAA,gBAAgB,OAAA;AAChB,oGAAA,WAAW,OAAA;AACX,sGAAA,aAAa,OAAA;AACb,0GAAA,iBAAiB,OAAA;AACjB,2GAAA,kBAAkB,OAAA;AAClB,uGAAA,cAAc,OAAA;AAGhB,iCAA4B;AAAnB,0FAAA,GAAG,OAAA","sourcesContent":["export {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxAlignItems,\n  BoxJustifyContent,\n  BoxBackgroundColor,\n  BoxBorderColor,\n} from '../../types';\nexport type { BoxSpacing, BoxBorderWidth } 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,uEASwC;AARtC,wHAAA,gBAAgB,OAAA;AAChB,mHAAA,WAAW,OAAA;AACX,qHAAA,aAAa,OAAA;AACb,yHAAA,iBAAiB,OAAA;AACjB,0HAAA,kBAAkB,OAAA;AAClB,sHAAA,cAAc,OAAA;AAIhB,iCAA4B;AAAnB,0FAAA,GAAG,OAAA","sourcesContent":["export {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxAlignItems,\n  BoxJustifyContent,\n  BoxBackgroundColor,\n  BoxBorderColor,\n  type BoxSpacing,\n  type BoxBorderWidth,\n} from '@metamask/design-system-shared';\nexport { Box } from './Box';\nexport type { BoxProps } from './Box.types';\n"]}

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

@@ -1,5 +1,4 @@
-export { BoxFlexDirection, BoxFlexWrap, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor, } from "../../types/index.cjs";
-export type { BoxSpacing, BoxBorderWidth } from "../../types/index.cjs";
+export { BoxFlexDirection, BoxFlexWrap, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor, type BoxSpacing, type BoxBorderWidth, } from "@metamask/design-system-shared";
 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,EACjB,kBAAkB,EAClB,cAAc,GACf,8BAAoB;AACrB,YAAY,EAAE,UAAU,EAAE,cAAc,EAAE,8BAAoB;AAC9D,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,EACjB,kBAAkB,EAClB,cAAc,EACd,KAAK,UAAU,EACf,KAAK,cAAc,GACpB,uCAAuC;AACxC,OAAO,EAAE,GAAG,EAAE,kBAAc;AAC5B,YAAY,EAAE,QAAQ,EAAE,wBAAoB"}

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

@@ -1,5 +1,4 @@
-export { BoxFlexDirection, BoxFlexWrap, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor, } from "../../types/index.mjs";
-export type { BoxSpacing, BoxBorderWidth } from "../../types/index.mjs";
+export { BoxFlexDirection, BoxFlexWrap, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor, type BoxSpacing, type BoxBorderWidth, } from "@metamask/design-system-shared";
 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,EACjB,kBAAkB,EAClB,cAAc,GACf,8BAAoB;AACrB,YAAY,EAAE,UAAU,EAAE,cAAc,EAAE,8BAAoB;AAC9D,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,EACjB,kBAAkB,EAClB,cAAc,EACd,KAAK,UAAU,EACf,KAAK,cAAc,GACpB,uCAAuC;AACxC,OAAO,EAAE,GAAG,EAAE,kBAAc;AAC5B,YAAY,EAAE,QAAQ,EAAE,wBAAoB"}

package/dist/components/Box/index.mjs

@@ -1,3 +1,3 @@
-export { BoxFlexDirection, BoxFlexWrap, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor } from "../../types/index.mjs";
+export { BoxFlexDirection, BoxFlexWrap, BoxAlignItems, BoxJustifyContent, BoxBackgroundColor, BoxBorderColor } from "@metamask/design-system-shared";
 export { Box } from "./Box.mjs";
 //# sourceMappingURL=index.mjs.map

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,EACjB,kBAAkB,EAClB,cAAc,EACf,8BAAoB;AAErB,OAAO,EAAE,GAAG,EAAE,kBAAc","sourcesContent":["export {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxAlignItems,\n  BoxJustifyContent,\n  BoxBackgroundColor,\n  BoxBorderColor,\n} from '../../types';\nexport type { BoxSpacing, BoxBorderWidth } 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,EACjB,kBAAkB,EAClB,cAAc,EAGf,uCAAuC;AACxC,OAAO,EAAE,GAAG,EAAE,kBAAc","sourcesContent":["export {\n  BoxFlexDirection,\n  BoxFlexWrap,\n  BoxAlignItems,\n  BoxJustifyContent,\n  BoxBackgroundColor,\n  BoxBorderColor,\n  type BoxSpacing,\n  type BoxBorderWidth,\n} from '@metamask/design-system-shared';\nexport { Box } from './Box';\nexport type { BoxProps } from './Box.types';\n"]}

package/dist/components/BoxColumn/BoxColumn.cjs

@@ -4,11 +4,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BoxColumn = void 0;
+const design_system_shared_1 = require("@metamask/design-system-shared");
 const react_1 = __importDefault(require("react"));
-const types_1 = require("../../types/index.cjs");
 const Box_1 = require("../Box/index.cjs");
 const TextOrChildren_1 = require("../temp-components/TextOrChildren/index.cjs");
-const BoxColumn = ({ children, textProps, topAccessory, bottomAccessory, twClassName, ...rest }) => (<Box_1.Box flexDirection={types_1.BoxFlexDirection.Column} twClassName={twClassName} {...rest}>
+const BoxColumn = ({ children, textProps, topAccessory, bottomAccessory, twClassName, ...rest }) => (<Box_1.Box flexDirection={design_system_shared_1.BoxFlexDirection.Column} twClassName={twClassName} {...rest}>
     {topAccessory}
     <TextOrChildren_1.TextOrChildren textProps={textProps}>{children}</TextOrChildren_1.TextOrChildren>
     {bottomAccessory}

package/dist/components/BoxColumn/BoxColumn.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BoxColumn.cjs","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,iDAA+C;AAC/C,0CAA6B;AAC7B,gFAAmE;AAI5D,MAAM,SAAS,GAAG,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,WAAW,EACX,GAAG,IAAI,EACQ,EAAE,EAAE,CAAC,CACpB,CAAC,SAAG,CACF,aAAa,CAAC,CAAC,wBAAgB,CAAC,MAAM,CAAC,CACvC,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,YAAY,CACb;IAAA,CAAC,+BAAc,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,+BAAc,CAChE;IAAA,CAAC,eAAe,CAClB;EAAA,EAAE,SAAG,CAAC,CACP,CAAC;AAjBW,QAAA,SAAS,aAiBpB;AAEF,iBAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import React from 'react';\n\nimport { BoxFlexDirection } from '../../types';\nimport { Box } from '../Box';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { BoxColumnProps } from './BoxColumn.types';\n\nexport const BoxColumn = ({\n  children,\n  textProps,\n  topAccessory,\n  bottomAccessory,\n  twClassName,\n  ...rest\n}: BoxColumnProps) => (\n  <Box\n    flexDirection={BoxFlexDirection.Column}\n    twClassName={twClassName}\n    {...rest}\n  >\n    {topAccessory}\n    <TextOrChildren textProps={textProps}>{children}</TextOrChildren>\n    {bottomAccessory}\n  </Box>\n);\n\nBoxColumn.displayName = 'BoxColumn';\n"]}
+{"version":3,"file":"BoxColumn.cjs","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.tsx"],"names":[],"mappings":";;;;;;AAAA,yEAAkE;AAClE,kDAA0B;AAE1B,0CAA6B;AAC7B,gFAAmE;AAI5D,MAAM,SAAS,GAAG,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,WAAW,EACX,GAAG,IAAI,EACQ,EAAE,EAAE,CAAC,CACpB,CAAC,SAAG,CACF,aAAa,CAAC,CAAC,uCAAgB,CAAC,MAAM,CAAC,CACvC,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,YAAY,CACb;IAAA,CAAC,+BAAc,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,+BAAc,CAChE;IAAA,CAAC,eAAe,CAClB;EAAA,EAAE,SAAG,CAAC,CACP,CAAC;AAjBW,QAAA,SAAS,aAiBpB;AAEF,iBAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import { BoxFlexDirection } from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { Box } from '../Box';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { BoxColumnProps } from './BoxColumn.types';\n\nexport const BoxColumn = ({\n  children,\n  textProps,\n  topAccessory,\n  bottomAccessory,\n  twClassName,\n  ...rest\n}: BoxColumnProps) => (\n  <Box\n    flexDirection={BoxFlexDirection.Column}\n    twClassName={twClassName}\n    {...rest}\n  >\n    {topAccessory}\n    <TextOrChildren textProps={textProps}>{children}</TextOrChildren>\n    {bottomAccessory}\n  </Box>\n);\n\nBoxColumn.displayName = 'BoxColumn';\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"BoxColumn.d.cts","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc;AAM1B,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS;mFAOnB,cAAc;;CAUhB,CAAC"}
+{"version":3,"file":"BoxColumn.d.cts","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAK1B,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS;mFAOnB,cAAc;;CAUhB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"BoxColumn.d.mts","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc;AAM1B,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS;mFAOnB,cAAc;;CAUhB,CAAC"}
+{"version":3,"file":"BoxColumn.d.mts","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAK1B,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS;mFAOnB,cAAc;;CAUhB,CAAC"}

package/dist/components/BoxColumn/BoxColumn.mjs

@@ -4,9 +4,9 @@ function $importDefault(module) {
     }
     return module;
 }
+import { BoxFlexDirection } from "@metamask/design-system-shared";
 import $React from "react";
 const React = $importDefault($React);
-import { BoxFlexDirection } from "../../types/index.mjs";
 import { Box } from "../Box/index.mjs";
 import { TextOrChildren } from "../temp-components/TextOrChildren/index.mjs";
 export const BoxColumn = ({ children, textProps, topAccessory, bottomAccessory, twClassName, ...rest }) => (<Box flexDirection={BoxFlexDirection.Column} twClassName={twClassName} {...rest}>

package/dist/components/BoxColumn/BoxColumn.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BoxColumn.mjs","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,gBAAgB,EAAE,8BAAoB;AAC/C,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,cAAc,EAAE,oDAA0C;AAInE,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,WAAW,EACX,GAAG,IAAI,EACQ,EAAE,EAAE,CAAC,CACpB,CAAC,GAAG,CACF,aAAa,CAAC,CAAC,gBAAgB,CAAC,MAAM,CAAC,CACvC,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,YAAY,CACb;IAAA,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,cAAc,CAChE;IAAA,CAAC,eAAe,CAClB;EAAA,EAAE,GAAG,CAAC,CACP,CAAC;AAEF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import React from 'react';\n\nimport { BoxFlexDirection } from '../../types';\nimport { Box } from '../Box';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { BoxColumnProps } from './BoxColumn.types';\n\nexport const BoxColumn = ({\n  children,\n  textProps,\n  topAccessory,\n  bottomAccessory,\n  twClassName,\n  ...rest\n}: BoxColumnProps) => (\n  <Box\n    flexDirection={BoxFlexDirection.Column}\n    twClassName={twClassName}\n    {...rest}\n  >\n    {topAccessory}\n    <TextOrChildren textProps={textProps}>{children}</TextOrChildren>\n    {bottomAccessory}\n  </Box>\n);\n\nBoxColumn.displayName = 'BoxColumn';\n"]}
+{"version":3,"file":"BoxColumn.mjs","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,gBAAgB,EAAE,uCAAuC;AAClE,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,cAAc,EAAE,oDAA0C;AAInE,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,WAAW,EACX,GAAG,IAAI,EACQ,EAAE,EAAE,CAAC,CACpB,CAAC,GAAG,CACF,aAAa,CAAC,CAAC,gBAAgB,CAAC,MAAM,CAAC,CACvC,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,YAAY,CACb;IAAA,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,cAAc,CAChE;IAAA,CAAC,eAAe,CAClB;EAAA,EAAE,GAAG,CAAC,CACP,CAAC;AAEF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import { BoxFlexDirection } from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { Box } from '../Box';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { BoxColumnProps } from './BoxColumn.types';\n\nexport const BoxColumn = ({\n  children,\n  textProps,\n  topAccessory,\n  bottomAccessory,\n  twClassName,\n  ...rest\n}: BoxColumnProps) => (\n  <Box\n    flexDirection={BoxFlexDirection.Column}\n    twClassName={twClassName}\n    {...rest}\n  >\n    {topAccessory}\n    <TextOrChildren textProps={textProps}>{children}</TextOrChildren>\n    {bottomAccessory}\n  </Box>\n);\n\nBoxColumn.displayName = 'BoxColumn';\n"]}

package/dist/components/BoxRow/BoxRow.cjs

@@ -4,11 +4,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BoxRow = void 0;
+const design_system_shared_1 = require("@metamask/design-system-shared");
 const react_1 = __importDefault(require("react"));
-const types_1 = require("../../types/index.cjs");
 const Box_1 = require("../Box/index.cjs");
 const TextOrChildren_1 = require("../temp-components/TextOrChildren/index.cjs");
-const BoxRow = ({ children, textProps, startAccessory, endAccessory, twClassName, ...rest }) => (<Box_1.Box flexDirection={types_1.BoxFlexDirection.Row} alignItems={types_1.BoxAlignItems.Center} gap={1} twClassName={twClassName} {...rest}>
+const BoxRow = ({ children, textProps, startAccessory, endAccessory, twClassName, ...rest }) => (<Box_1.Box flexDirection={design_system_shared_1.BoxFlexDirection.Row} alignItems={design_system_shared_1.BoxAlignItems.Center} gap={1} twClassName={twClassName} {...rest}>
     {startAccessory}
     <TextOrChildren_1.TextOrChildren textProps={textProps}>{children}</TextOrChildren_1.TextOrChildren>
     {endAccessory}

package/dist/components/BoxRow/BoxRow.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BoxRow.cjs","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,iDAA8D;AAC9D,0CAA6B;AAC7B,gFAAmE;AAI5D,MAAM,MAAM,GAAG,CAAC,EACrB,QAAQ,EACR,SAAS,EACT,cAAc,EACd,YAAY,EACZ,WAAW,EACX,GAAG,IAAI,EACK,EAAE,EAAE,CAAC,CACjB,CAAC,SAAG,CACF,aAAa,CAAC,CAAC,wBAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,qBAAa,CAAC,MAAM,CAAC,CACjC,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,cAAc,CACf;IAAA,CAAC,+BAAc,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,+BAAc,CAChE;IAAA,CAAC,YAAY,CACf;EAAA,EAAE,SAAG,CAAC,CACP,CAAC;AAnBW,QAAA,MAAM,UAmBjB;AAEF,cAAM,CAAC,WAAW,GAAG,QAAQ,CAAC","sourcesContent":["import React from 'react';\n\nimport { BoxAlignItems, BoxFlexDirection } from '../../types';\nimport { Box } from '../Box';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { BoxRowProps } from './BoxRow.types';\n\nexport const BoxRow = ({\n  children,\n  textProps,\n  startAccessory,\n  endAccessory,\n  twClassName,\n  ...rest\n}: BoxRowProps) => (\n  <Box\n    flexDirection={BoxFlexDirection.Row}\n    alignItems={BoxAlignItems.Center}\n    gap={1}\n    twClassName={twClassName}\n    {...rest}\n  >\n    {startAccessory}\n    <TextOrChildren textProps={textProps}>{children}</TextOrChildren>\n    {endAccessory}\n  </Box>\n);\n\nBoxRow.displayName = 'BoxRow';\n"]}
+{"version":3,"file":"BoxRow.cjs","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.tsx"],"names":[],"mappings":";;;;;;AAAA,yEAGwC;AACxC,kDAA0B;AAE1B,0CAA6B;AAC7B,gFAAmE;AAI5D,MAAM,MAAM,GAAG,CAAC,EACrB,QAAQ,EACR,SAAS,EACT,cAAc,EACd,YAAY,EACZ,WAAW,EACX,GAAG,IAAI,EACK,EAAE,EAAE,CAAC,CACjB,CAAC,SAAG,CACF,aAAa,CAAC,CAAC,uCAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,oCAAa,CAAC,MAAM,CAAC,CACjC,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,cAAc,CACf;IAAA,CAAC,+BAAc,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,+BAAc,CAChE;IAAA,CAAC,YAAY,CACf;EAAA,EAAE,SAAG,CAAC,CACP,CAAC;AAnBW,QAAA,MAAM,UAmBjB;AAEF,cAAM,CAAC,WAAW,GAAG,QAAQ,CAAC","sourcesContent":["import {\n  BoxAlignItems,\n  BoxFlexDirection,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { Box } from '../Box';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { BoxRowProps } from './BoxRow.types';\n\nexport const BoxRow = ({\n  children,\n  textProps,\n  startAccessory,\n  endAccessory,\n  twClassName,\n  ...rest\n}: BoxRowProps) => (\n  <Box\n    flexDirection={BoxFlexDirection.Row}\n    alignItems={BoxAlignItems.Center}\n    gap={1}\n    twClassName={twClassName}\n    {...rest}\n  >\n    {startAccessory}\n    <TextOrChildren textProps={textProps}>{children}</TextOrChildren>\n    {endAccessory}\n  </Box>\n);\n\nBoxRow.displayName = 'BoxRow';\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"BoxRow.d.cts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc;AAM1B,OAAO,KAAK,EAAE,WAAW,EAAE,2BAAuB;AAElD,eAAO,MAAM,MAAM;kFAOhB,WAAW;;CAYb,CAAC"}
+{"version":3,"file":"BoxRow.d.cts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,cAAc;AAK1B,OAAO,KAAK,EAAE,WAAW,EAAE,2BAAuB;AAElD,eAAO,MAAM,MAAM;kFAOhB,WAAW;;CAYb,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"BoxRow.d.mts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc;AAM1B,OAAO,KAAK,EAAE,WAAW,EAAE,2BAAuB;AAElD,eAAO,MAAM,MAAM;kFAOhB,WAAW;;CAYb,CAAC"}
+{"version":3,"file":"BoxRow.d.mts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,cAAc;AAK1B,OAAO,KAAK,EAAE,WAAW,EAAE,2BAAuB;AAElD,eAAO,MAAM,MAAM;kFAOhB,WAAW;;CAYb,CAAC"}

package/dist/components/BoxRow/BoxRow.mjs

@@ -4,9 +4,9 @@ function $importDefault(module) {
     }
     return module;
 }
+import { BoxAlignItems, BoxFlexDirection } from "@metamask/design-system-shared";
 import $React from "react";
 const React = $importDefault($React);
-import { BoxAlignItems, BoxFlexDirection } from "../../types/index.mjs";
 import { Box } from "../Box/index.mjs";
 import { TextOrChildren } from "../temp-components/TextOrChildren/index.mjs";
 export const BoxRow = ({ children, textProps, startAccessory, endAccessory, twClassName, ...rest }) => (<Box flexDirection={BoxFlexDirection.Row} alignItems={BoxAlignItems.Center} gap={1} twClassName={twClassName} {...rest}>

package/dist/components/BoxRow/BoxRow.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BoxRow.mjs","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,8BAAoB;AAC9D,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,cAAc,EAAE,oDAA0C;AAInE,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EACrB,QAAQ,EACR,SAAS,EACT,cAAc,EACd,YAAY,EACZ,WAAW,EACX,GAAG,IAAI,EACK,EAAE,EAAE,CAAC,CACjB,CAAC,GAAG,CACF,aAAa,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,CACjC,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,cAAc,CACf;IAAA,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,cAAc,CAChE;IAAA,CAAC,YAAY,CACf;EAAA,EAAE,GAAG,CAAC,CACP,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC","sourcesContent":["import React from 'react';\n\nimport { BoxAlignItems, BoxFlexDirection } from '../../types';\nimport { Box } from '../Box';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { BoxRowProps } from './BoxRow.types';\n\nexport const BoxRow = ({\n  children,\n  textProps,\n  startAccessory,\n  endAccessory,\n  twClassName,\n  ...rest\n}: BoxRowProps) => (\n  <Box\n    flexDirection={BoxFlexDirection.Row}\n    alignItems={BoxAlignItems.Center}\n    gap={1}\n    twClassName={twClassName}\n    {...rest}\n  >\n    {startAccessory}\n    <TextOrChildren textProps={textProps}>{children}</TextOrChildren>\n    {endAccessory}\n  </Box>\n);\n\nBoxRow.displayName = 'BoxRow';\n"]}
+{"version":3,"file":"BoxRow.mjs","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,aAAa,EACb,gBAAgB,EACjB,uCAAuC;AACxC,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,cAAc,EAAE,oDAA0C;AAInE,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EACrB,QAAQ,EACR,SAAS,EACT,cAAc,EACd,YAAY,EACZ,WAAW,EACX,GAAG,IAAI,EACK,EAAE,EAAE,CAAC,CACjB,CAAC,GAAG,CACF,aAAa,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,CACjC,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,cAAc,CACf;IAAA,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,cAAc,CAChE;IAAA,CAAC,YAAY,CACf;EAAA,EAAE,GAAG,CAAC,CACP,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC","sourcesContent":["import {\n  BoxAlignItems,\n  BoxFlexDirection,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { Box } from '../Box';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport type { BoxRowProps } from './BoxRow.types';\n\nexport const BoxRow = ({\n  children,\n  textProps,\n  startAccessory,\n  endAccessory,\n  twClassName,\n  ...rest\n}: BoxRowProps) => (\n  <Box\n    flexDirection={BoxFlexDirection.Row}\n    alignItems={BoxAlignItems.Center}\n    gap={1}\n    twClassName={twClassName}\n    {...rest}\n  >\n    {startAccessory}\n    <TextOrChildren textProps={textProps}>{children}</TextOrChildren>\n    {endAccessory}\n  </Box>\n);\n\nBoxRow.displayName = 'BoxRow';\n"]}

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

@@ -77,9 +77,8 @@ const ButtonTertiary = ({ children, textProps, spinnerProps, startIconProps, end
         if (isInverse) {
             return 'text-primary-inverse';
         }
-        return pressed || isLoading
-            ? 'text-primary-default-pressed'
-            : 'text-primary-default';
+        // Use neutral text color for all states (default, pressed, loading)
+        return 'text-default';
     }, [isDanger, isInverse, isLoading]);
     return (<ButtonBase_1.ButtonBase textProps={{
             variant: Text_1.TextVariant.BodyMd,

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

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

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

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

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

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

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

@@ -58,9 +58,8 @@ export const ButtonTertiary = ({ children, textProps, spinnerProps, startIconPro
         if (isInverse) {
             return 'text-primary-inverse';
         }
-        return pressed || isLoading
-            ? 'text-primary-default-pressed'
-            : 'text-primary-default';
+        // Use neutral text color for all states (default, pressed, loading)
+        return 'text-default';
     }, [isDanger, isInverse, isLoading]);
     return (<ButtonBase textProps={{
             variant: TextVariant.BodyMd,

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

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