@metamask/design-system-react-native 0.14.0 → 0.16.0

package/dist/components/AvatarToken/AvatarToken.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarToken.cjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAwC;AAGxC,iDAA+D;AAC/D,wDAA2C;AAC3C,wEAA2D;AAIpD,MAAM,WAAW,GAAG,CAAC,EAC1B,GAAG,EACH,IAAI,GAAG,uBAAe,CAAC,EAAE,EACzB,IAAI,EACJ,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,GAAG,KAAK,EACS,EAAE,EAAE;IACrB,MAAM,CAAC,iBAAiB,EAAE,eAAe,CAAC,GAAG,IAAA,gBAAQ,EAAS,EAAE,CAAC,CAAC;IAElE,MAAM,kBAAkB,GAAG,YAAY,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;IAC3D,MAAM,mBAAmB,GAAG,CAC1B,CAA4C,EAC5C,EAAE;QACF,eAAe,CAAC,kBAAkB,CAAC,CAAC;QACpC,eAAe,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,CAAQ,EAAE,EAAE;QACrC,eAAe,CAAC,kBAAkB,CAAC,CAAC;QACpC,eAAe,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,uBAAU,CACT,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,KAAK,CAAC,CAAC,uBAAe,CAAC,MAAM,CAAC,CAC9B,YAAY,CAAC,CAAC,iBAAiB,CAAC,CAChC,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,GAAG,IAAI,CACN,CAAC,uBAAU,CACT,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,KAAK,CAAC,CAAC,MAAM,CAAC,CACd,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,eAAe,CAAC,CACpB,UAAU,CAAC,CAAC;gBACV,UAAU,EAAE,SAAS;gBACrB,GAAG,eAAe,EAAE,UAAU;aAC/B,CAAC,CACF,YAAY,CAAC,CAAC,mBAAmB,CAAC,CAClC,UAAU,CAAC,CAAC,iBAAiB,CAAC,EAC9B,CACH,CACH;IAAA,EAAE,uBAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC;AAhDW,QAAA,WAAW,eAgDtB","sourcesContent":["import React, { useState } from 'react';\nimport type { ImageErrorEventData, NativeSyntheticEvent } from 'react-native';\n\nimport { AvatarTokenSize, AvatarBaseShape } from '../../types';\nimport { AvatarBase } from '../AvatarBase';\nimport { ImageOrSvg } from '../temp-components/ImageOrSvg';\n\nimport type { AvatarTokenProps } from './AvatarToken.types';\n\nexport const AvatarToken = ({\n  src,\n  size = AvatarTokenSize.Md,\n  name,\n  fallbackText,\n  fallbackTextProps,\n  imageOrSvgProps,\n  ...props\n}: AvatarTokenProps) => {\n  const [finalFallbackText, setFallbackText] = useState<string>('');\n\n  const backupFallbackText = fallbackText || name?.[0] || '';\n  const onImageErrorHandler = (\n    e: NativeSyntheticEvent<ImageErrorEventData>,\n  ) => {\n    setFallbackText(backupFallbackText);\n    imageOrSvgProps?.onImageError?.(e);\n  };\n\n  const onSvgErrorHandler = (e: Error) => {\n    setFallbackText(backupFallbackText);\n    imageOrSvgProps?.onSvgError?.(e);\n  };\n\n  return (\n    <AvatarBase\n      size={size}\n      shape={AvatarBaseShape.Circle}\n      fallbackText={finalFallbackText}\n      fallbackTextProps={fallbackTextProps}\n      {...props}\n    >\n      {src && (\n        <ImageOrSvg\n          src={src}\n          width={'100%'}\n          height={'100%'}\n          {...imageOrSvgProps}\n          imageProps={{\n            resizeMode: 'contain',\n            ...imageOrSvgProps?.imageProps,\n          }}\n          onImageError={onImageErrorHandler}\n          onSvgError={onSvgErrorHandler}\n        />\n      )}\n    </AvatarBase>\n  );\n};\n"]}
+{"version":3,"file":"AvatarToken.cjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,yEAGwC;AACxC,+CAAwC;AAGxC,wDAA2C;AAC3C,wEAA2D;AAIpD,MAAM,WAAW,GAAG,CAAC,EAC1B,GAAG,EACH,IAAI,GAAG,sCAAe,CAAC,EAAE,EACzB,IAAI,EACJ,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,GAAG,KAAK,EACS,EAAE,EAAE;IACrB,MAAM,CAAC,iBAAiB,EAAE,eAAe,CAAC,GAAG,IAAA,gBAAQ,EAAS,EAAE,CAAC,CAAC;IAElE,MAAM,kBAAkB,GAAG,YAAY,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;IAC3D,MAAM,mBAAmB,GAAG,CAC1B,CAA4C,EAC5C,EAAE;QACF,eAAe,CAAC,kBAAkB,CAAC,CAAC;QACpC,eAAe,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,CAAQ,EAAE,EAAE;QACrC,eAAe,CAAC,kBAAkB,CAAC,CAAC;QACpC,eAAe,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,uBAAU,CACT,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,KAAK,CAAC,CAAC,sCAAe,CAAC,MAAM,CAAC,CAC9B,YAAY,CAAC,CAAC,iBAAiB,CAAC,CAChC,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,GAAG,IAAI,CACN,CAAC,uBAAU,CACT,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,KAAK,CAAC,CAAC,MAAM,CAAC,CACd,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,eAAe,CAAC,CACpB,UAAU,CAAC,CAAC;gBACV,UAAU,EAAE,SAAS;gBACrB,GAAG,eAAe,EAAE,UAAU;aAC/B,CAAC,CACF,YAAY,CAAC,CAAC,mBAAmB,CAAC,CAClC,UAAU,CAAC,CAAC,iBAAiB,CAAC,EAC9B,CACH,CACH;IAAA,EAAE,uBAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC;AAhDW,QAAA,WAAW,eAgDtB","sourcesContent":["import {\n  AvatarBaseShape,\n  AvatarTokenSize,\n} from '@metamask/design-system-shared';\nimport React, { useState } from 'react';\nimport type { ImageErrorEventData, NativeSyntheticEvent } from 'react-native';\n\nimport { AvatarBase } from '../AvatarBase';\nimport { ImageOrSvg } from '../temp-components/ImageOrSvg';\n\nimport type { AvatarTokenProps } from './AvatarToken.types';\n\nexport const AvatarToken = ({\n  src,\n  size = AvatarTokenSize.Md,\n  name,\n  fallbackText,\n  fallbackTextProps,\n  imageOrSvgProps,\n  ...props\n}: AvatarTokenProps) => {\n  const [finalFallbackText, setFallbackText] = useState<string>('');\n\n  const backupFallbackText = fallbackText || name?.[0] || '';\n  const onImageErrorHandler = (\n    e: NativeSyntheticEvent<ImageErrorEventData>,\n  ) => {\n    setFallbackText(backupFallbackText);\n    imageOrSvgProps?.onImageError?.(e);\n  };\n\n  const onSvgErrorHandler = (e: Error) => {\n    setFallbackText(backupFallbackText);\n    imageOrSvgProps?.onSvgError?.(e);\n  };\n\n  return (\n    <AvatarBase\n      size={size}\n      shape={AvatarBaseShape.Circle}\n      fallbackText={finalFallbackText}\n      fallbackTextProps={fallbackTextProps}\n      {...props}\n    >\n      {src && (\n        <ImageOrSvg\n          src={src}\n          width={'100%'}\n          height={'100%'}\n          {...imageOrSvgProps}\n          imageProps={{\n            resizeMode: 'contain',\n            ...imageOrSvgProps?.imageProps,\n          }}\n          onImageError={onImageErrorHandler}\n          onSvgError={onSvgErrorHandler}\n        />\n      )}\n    </AvatarBase>\n  );\n};\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"AvatarToken.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,cAAc;AAOxC,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAA4B;AAE5D,eAAO,MAAM,WAAW,oFAQrB,gBAAgB,sBAwClB,CAAC"}
+{"version":3,"file":"AvatarToken.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,cAAc;AAMxC,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAA4B;AAE5D,eAAO,MAAM,WAAW,oFAQrB,gBAAgB,sBAwClB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"AvatarToken.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,cAAc;AAOxC,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAA4B;AAE5D,eAAO,MAAM,WAAW,oFAQrB,gBAAgB,sBAwClB,CAAC"}
+{"version":3,"file":"AvatarToken.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,cAAc;AAMxC,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAA4B;AAE5D,eAAO,MAAM,WAAW,oFAQrB,gBAAgB,sBAwClB,CAAC"}

package/dist/components/AvatarToken/AvatarToken.mjs

@@ -4,9 +4,9 @@ function $importDefault(module) {
     }
     return module;
 }
+import { AvatarBaseShape, AvatarTokenSize } from "@metamask/design-system-shared";
 import $React, { useState } from "react";
 const React = $importDefault($React);
-import { AvatarTokenSize, AvatarBaseShape } from "../../types/index.mjs";
 import { AvatarBase } from "../AvatarBase/index.mjs";
 import { ImageOrSvg } from "../temp-components/ImageOrSvg/index.mjs";
 export const AvatarToken = ({ src, size = AvatarTokenSize.Md, name, fallbackText, fallbackTextProps, imageOrSvgProps, ...props }) => {

package/dist/components/AvatarToken/AvatarToken.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarToken.mjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,QAAQ,EAAE,cAAc;;AAGxC,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,8BAAoB;AAC/D,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,UAAU,EAAE,gDAAsC;AAI3D,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAC1B,GAAG,EACH,IAAI,GAAG,eAAe,CAAC,EAAE,EACzB,IAAI,EACJ,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,GAAG,KAAK,EACS,EAAE,EAAE;IACrB,MAAM,CAAC,iBAAiB,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IAElE,MAAM,kBAAkB,GAAG,YAAY,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;IAC3D,MAAM,mBAAmB,GAAG,CAC1B,CAA4C,EAC5C,EAAE;QACF,eAAe,CAAC,kBAAkB,CAAC,CAAC;QACpC,eAAe,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,CAAQ,EAAE,EAAE;QACrC,eAAe,CAAC,kBAAkB,CAAC,CAAC;QACpC,eAAe,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,UAAU,CACT,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,KAAK,CAAC,CAAC,eAAe,CAAC,MAAM,CAAC,CAC9B,YAAY,CAAC,CAAC,iBAAiB,CAAC,CAChC,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,GAAG,IAAI,CACN,CAAC,UAAU,CACT,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,KAAK,CAAC,CAAC,MAAM,CAAC,CACd,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,eAAe,CAAC,CACpB,UAAU,CAAC,CAAC;gBACV,UAAU,EAAE,SAAS;gBACrB,GAAG,eAAe,EAAE,UAAU;aAC/B,CAAC,CACF,YAAY,CAAC,CAAC,mBAAmB,CAAC,CAClC,UAAU,CAAC,CAAC,iBAAiB,CAAC,EAC9B,CACH,CACH;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import React, { useState } from 'react';\nimport type { ImageErrorEventData, NativeSyntheticEvent } from 'react-native';\n\nimport { AvatarTokenSize, AvatarBaseShape } from '../../types';\nimport { AvatarBase } from '../AvatarBase';\nimport { ImageOrSvg } from '../temp-components/ImageOrSvg';\n\nimport type { AvatarTokenProps } from './AvatarToken.types';\n\nexport const AvatarToken = ({\n  src,\n  size = AvatarTokenSize.Md,\n  name,\n  fallbackText,\n  fallbackTextProps,\n  imageOrSvgProps,\n  ...props\n}: AvatarTokenProps) => {\n  const [finalFallbackText, setFallbackText] = useState<string>('');\n\n  const backupFallbackText = fallbackText || name?.[0] || '';\n  const onImageErrorHandler = (\n    e: NativeSyntheticEvent<ImageErrorEventData>,\n  ) => {\n    setFallbackText(backupFallbackText);\n    imageOrSvgProps?.onImageError?.(e);\n  };\n\n  const onSvgErrorHandler = (e: Error) => {\n    setFallbackText(backupFallbackText);\n    imageOrSvgProps?.onSvgError?.(e);\n  };\n\n  return (\n    <AvatarBase\n      size={size}\n      shape={AvatarBaseShape.Circle}\n      fallbackText={finalFallbackText}\n      fallbackTextProps={fallbackTextProps}\n      {...props}\n    >\n      {src && (\n        <ImageOrSvg\n          src={src}\n          width={'100%'}\n          height={'100%'}\n          {...imageOrSvgProps}\n          imageProps={{\n            resizeMode: 'contain',\n            ...imageOrSvgProps?.imageProps,\n          }}\n          onImageError={onImageErrorHandler}\n          onSvgError={onSvgErrorHandler}\n        />\n      )}\n    </AvatarBase>\n  );\n};\n"]}
+{"version":3,"file":"AvatarToken.mjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,eAAe,EACf,eAAe,EAChB,uCAAuC;AACxC,OAAO,QAAO,EAAE,QAAQ,EAAE,cAAc;;AAGxC,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,UAAU,EAAE,gDAAsC;AAI3D,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAC1B,GAAG,EACH,IAAI,GAAG,eAAe,CAAC,EAAE,EACzB,IAAI,EACJ,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,GAAG,KAAK,EACS,EAAE,EAAE;IACrB,MAAM,CAAC,iBAAiB,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IAElE,MAAM,kBAAkB,GAAG,YAAY,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;IAC3D,MAAM,mBAAmB,GAAG,CAC1B,CAA4C,EAC5C,EAAE;QACF,eAAe,CAAC,kBAAkB,CAAC,CAAC;QACpC,eAAe,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,CAAQ,EAAE,EAAE;QACrC,eAAe,CAAC,kBAAkB,CAAC,CAAC;QACpC,eAAe,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,UAAU,CACT,IAAI,CAAC,CAAC,IAAI,CAAC,CACX,KAAK,CAAC,CAAC,eAAe,CAAC,MAAM,CAAC,CAC9B,YAAY,CAAC,CAAC,iBAAiB,CAAC,CAChC,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,CACrC,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,GAAG,IAAI,CACN,CAAC,UAAU,CACT,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,KAAK,CAAC,CAAC,MAAM,CAAC,CACd,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,IAAI,eAAe,CAAC,CACpB,UAAU,CAAC,CAAC;gBACV,UAAU,EAAE,SAAS;gBACrB,GAAG,eAAe,EAAE,UAAU;aAC/B,CAAC,CACF,YAAY,CAAC,CAAC,mBAAmB,CAAC,CAClC,UAAU,CAAC,CAAC,iBAAiB,CAAC,EAC9B,CACH,CACH;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {\n  AvatarBaseShape,\n  AvatarTokenSize,\n} from '@metamask/design-system-shared';\nimport React, { useState } from 'react';\nimport type { ImageErrorEventData, NativeSyntheticEvent } from 'react-native';\n\nimport { AvatarBase } from '../AvatarBase';\nimport { ImageOrSvg } from '../temp-components/ImageOrSvg';\n\nimport type { AvatarTokenProps } from './AvatarToken.types';\n\nexport const AvatarToken = ({\n  src,\n  size = AvatarTokenSize.Md,\n  name,\n  fallbackText,\n  fallbackTextProps,\n  imageOrSvgProps,\n  ...props\n}: AvatarTokenProps) => {\n  const [finalFallbackText, setFallbackText] = useState<string>('');\n\n  const backupFallbackText = fallbackText || name?.[0] || '';\n  const onImageErrorHandler = (\n    e: NativeSyntheticEvent<ImageErrorEventData>,\n  ) => {\n    setFallbackText(backupFallbackText);\n    imageOrSvgProps?.onImageError?.(e);\n  };\n\n  const onSvgErrorHandler = (e: Error) => {\n    setFallbackText(backupFallbackText);\n    imageOrSvgProps?.onSvgError?.(e);\n  };\n\n  return (\n    <AvatarBase\n      size={size}\n      shape={AvatarBaseShape.Circle}\n      fallbackText={finalFallbackText}\n      fallbackTextProps={fallbackTextProps}\n      {...props}\n    >\n      {src && (\n        <ImageOrSvg\n          src={src}\n          width={'100%'}\n          height={'100%'}\n          {...imageOrSvgProps}\n          imageProps={{\n            resizeMode: 'contain',\n            ...imageOrSvgProps?.imageProps,\n          }}\n          onImageError={onImageErrorHandler}\n          onSvgError={onSvgErrorHandler}\n        />\n      )}\n    </AvatarBase>\n  );\n};\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"AvatarToken.types.cjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarBaseProps } from '../AvatarBase';\nimport type {\n  ImageOrSvgProps,\n  ImageOrSvgSrc,\n} from '../temp-components/ImageOrSvg';\n\n/**\n * AvatarToken component props.\n */\nexport type AvatarTokenProps = {\n  /**\n   * Optional prop for the source of the image or SVG.\n   */\n  src?: ImageOrSvgSrc;\n  /**\n   * Optional props for token name, to be used to calculate the fallbackText.\n   */\n  name?: string;\n  /**\n   * Optional prop to pass to the underlying ImageOrSvg element\n   * Useful for overriding the default alt text which is the dapp name\n   */\n  imageOrSvgProps?: Partial<ImageOrSvgProps>;\n} & Omit<AvatarBaseProps, 'children'>;\n"]}
+{"version":3,"file":"AvatarToken.types.cjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarTokenPropsShared } from '@metamask/design-system-shared';\n\nimport type { AvatarBaseProps } from '../AvatarBase';\nimport type {\n  ImageOrSvgProps,\n  ImageOrSvgSrc,\n} from '../temp-components/ImageOrSvg';\n\n/**\n * AvatarToken component props (React Native platform-specific)\n * Extends shared props from @metamask/design-system-shared with React Native-specific platform concerns\n */\nexport type AvatarTokenProps = AvatarTokenPropsShared &\n  Omit<AvatarBaseProps, 'children'> & {\n    /**\n     * Optional prop for the source of the image or SVG.\n     */\n    src?: ImageOrSvgSrc;\n    /**\n     * Optional prop to pass to the underlying ImageOrSvg element\n     * Useful for overriding the default alt text which is the dapp name\n     */\n    imageOrSvgProps?: Partial<ImageOrSvgProps>;\n  };\n"]}

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

@@ -1,21 +1,19 @@
+import type { AvatarTokenPropsShared } from "@metamask/design-system-shared";
 import type { AvatarBaseProps } from "../AvatarBase/index.cjs";
 import type { ImageOrSvgProps, ImageOrSvgSrc } from "../temp-components/ImageOrSvg/index.cjs";
 /**
- * AvatarToken component props.
+ * AvatarToken component props (React Native platform-specific)
+ * Extends shared props from @metamask/design-system-shared with React Native-specific platform concerns
  */
-export type AvatarTokenProps = {
+export type AvatarTokenProps = AvatarTokenPropsShared & Omit<AvatarBaseProps, 'children'> & {
     /**
      * Optional prop for the source of the image or SVG.
      */
     src?: ImageOrSvgSrc;
-    /**
-     * Optional props for token name, to be used to calculate the fallbackText.
-     */
-    name?: string;
     /**
      * Optional prop to pass to the underlying ImageOrSvg element
      * Useful for overriding the default alt text which is the dapp name
      */
     imageOrSvgProps?: Partial<ImageOrSvgProps>;
-} & Omit<AvatarBaseProps, 'children'>;
+};
 //# sourceMappingURL=AvatarToken.types.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"AvatarToken.types.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EACV,eAAe,EACf,aAAa,EACd,gDAAsC;AAEvC;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CAC5C,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"AvatarToken.types.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,uCAAuC;AAE7E,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EACV,eAAe,EACf,aAAa,EACd,gDAAsC;AAEvC;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GACnD,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC,GAAG;IAClC;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CAC5C,CAAC"}

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

@@ -1,21 +1,19 @@
+import type { AvatarTokenPropsShared } from "@metamask/design-system-shared";
 import type { AvatarBaseProps } from "../AvatarBase/index.mjs";
 import type { ImageOrSvgProps, ImageOrSvgSrc } from "../temp-components/ImageOrSvg/index.mjs";
 /**
- * AvatarToken component props.
+ * AvatarToken component props (React Native platform-specific)
+ * Extends shared props from @metamask/design-system-shared with React Native-specific platform concerns
  */
-export type AvatarTokenProps = {
+export type AvatarTokenProps = AvatarTokenPropsShared & Omit<AvatarBaseProps, 'children'> & {
     /**
      * Optional prop for the source of the image or SVG.
      */
     src?: ImageOrSvgSrc;
-    /**
-     * Optional props for token name, to be used to calculate the fallbackText.
-     */
-    name?: string;
     /**
      * Optional prop to pass to the underlying ImageOrSvg element
      * Useful for overriding the default alt text which is the dapp name
      */
     imageOrSvgProps?: Partial<ImageOrSvgProps>;
-} & Omit<AvatarBaseProps, 'children'>;
+};
 //# sourceMappingURL=AvatarToken.types.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"AvatarToken.types.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EACV,eAAe,EACf,aAAa,EACd,gDAAsC;AAEvC;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CAC5C,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"AvatarToken.types.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,uCAAuC;AAE7E,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EACV,eAAe,EACf,aAAa,EACd,gDAAsC;AAEvC;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GACnD,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC,GAAG;IAClC;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CAC5C,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"AvatarToken.types.mjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarBaseProps } from '../AvatarBase';\nimport type {\n  ImageOrSvgProps,\n  ImageOrSvgSrc,\n} from '../temp-components/ImageOrSvg';\n\n/**\n * AvatarToken component props.\n */\nexport type AvatarTokenProps = {\n  /**\n   * Optional prop for the source of the image or SVG.\n   */\n  src?: ImageOrSvgSrc;\n  /**\n   * Optional props for token name, to be used to calculate the fallbackText.\n   */\n  name?: string;\n  /**\n   * Optional prop to pass to the underlying ImageOrSvg element\n   * Useful for overriding the default alt text which is the dapp name\n   */\n  imageOrSvgProps?: Partial<ImageOrSvgProps>;\n} & Omit<AvatarBaseProps, 'children'>;\n"]}
+{"version":3,"file":"AvatarToken.types.mjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/AvatarToken.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarTokenPropsShared } from '@metamask/design-system-shared';\n\nimport type { AvatarBaseProps } from '../AvatarBase';\nimport type {\n  ImageOrSvgProps,\n  ImageOrSvgSrc,\n} from '../temp-components/ImageOrSvg';\n\n/**\n * AvatarToken component props (React Native platform-specific)\n * Extends shared props from @metamask/design-system-shared with React Native-specific platform concerns\n */\nexport type AvatarTokenProps = AvatarTokenPropsShared &\n  Omit<AvatarBaseProps, 'children'> & {\n    /**\n     * Optional prop for the source of the image or SVG.\n     */\n    src?: ImageOrSvgSrc;\n    /**\n     * Optional prop to pass to the underlying ImageOrSvg element\n     * Useful for overriding the default alt text which is the dapp name\n     */\n    imageOrSvgProps?: Partial<ImageOrSvgProps>;\n  };\n"]}

package/dist/components/AvatarToken/index.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AvatarToken = exports.AvatarTokenSize = void 0;
-var types_1 = require("../../types/index.cjs");
-Object.defineProperty(exports, "AvatarTokenSize", { enumerable: true, get: function () { return types_1.AvatarTokenSize; } });
+var design_system_shared_1 = require("@metamask/design-system-shared");
+Object.defineProperty(exports, "AvatarTokenSize", { enumerable: true, get: function () { return design_system_shared_1.AvatarTokenSize; } });
 var AvatarToken_1 = require("./AvatarToken.cjs");
 Object.defineProperty(exports, "AvatarToken", { enumerable: true, get: function () { return AvatarToken_1.AvatarToken; } });
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/index.ts"],"names":[],"mappings":";;;AAAA,+CAA8C;AAArC,wGAAA,eAAe,OAAA;AACxB,iDAA4C;AAAnC,0GAAA,WAAW,OAAA","sourcesContent":["export { AvatarTokenSize } from '../../types';\nexport { AvatarToken } from './AvatarToken';\nexport type { AvatarTokenProps } from './AvatarToken.types';\n"]}
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/index.ts"],"names":[],"mappings":";;;AAAA,uEAAiE;AAAxD,uHAAA,eAAe,OAAA;AACxB,iDAA4C;AAAnC,0GAAA,WAAW,OAAA","sourcesContent":["export { AvatarTokenSize } from '@metamask/design-system-shared';\nexport { AvatarToken } from './AvatarToken';\nexport type { AvatarTokenProps } from './AvatarToken.types';\n"]}

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

@@ -1,4 +1,4 @@
-export { AvatarTokenSize } from "../../types/index.cjs";
+export { AvatarTokenSize } from "@metamask/design-system-shared";
 export { AvatarToken } from "./AvatarToken.cjs";
 export type { AvatarTokenProps } from "./AvatarToken.types.cjs";
 //# sourceMappingURL=index.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarToken/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,8BAAoB;AAC9C,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/AvatarToken/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,uCAAuC;AACjE,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}

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

@@ -1,4 +1,4 @@
-export { AvatarTokenSize } from "../../types/index.mjs";
+export { AvatarTokenSize } from "@metamask/design-system-shared";
 export { AvatarToken } from "./AvatarToken.mjs";
 export type { AvatarTokenProps } from "./AvatarToken.types.mjs";
 //# sourceMappingURL=index.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarToken/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,8BAAoB;AAC9C,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/AvatarToken/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,uCAAuC;AACjE,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}

package/dist/components/AvatarToken/index.mjs

@@ -1,3 +1,3 @@
-export { AvatarTokenSize } from "../../types/index.mjs";
+export { AvatarTokenSize } from "@metamask/design-system-shared";
 export { AvatarToken } from "./AvatarToken.mjs";
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,8BAAoB;AAC9C,OAAO,EAAE,WAAW,EAAE,0BAAsB","sourcesContent":["export { AvatarTokenSize } from '../../types';\nexport { AvatarToken } from './AvatarToken';\nexport type { AvatarTokenProps } from './AvatarToken.types';\n"]}
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/AvatarToken/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,uCAAuC;AACjE,OAAO,EAAE,WAAW,EAAE,0BAAsB","sourcesContent":["export { AvatarTokenSize } from '@metamask/design-system-shared';\nexport { AvatarToken } from './AvatarToken';\nexport type { AvatarTokenProps } from './AvatarToken.types';\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeNetwork.types.cjs","sourceRoot":"","sources":["../../../src/components/BadgeNetwork/BadgeNetwork.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarNetworkProps } from '../AvatarNetwork';\nimport type { ImageOrSvgSrc } from '../temp-components/ImageOrSvg';\n\nexport type BadgeNetworkProps = Omit<AvatarNetworkProps, 'size' | 'shape'> & {\n  /**\n   * Optional prop for the source of the image or SVG.\n   */\n  src?: ImageOrSvgSrc;\n  /**\n   * Optional props for network name, to be used to calculate the fallbackText.\n   */\n  name?: string;\n  /**\n   * Optional text to be rendered when the content fails to render\n   */\n  fallbackText?: string;\n};\n"]}
+{"version":3,"file":"BadgeNetwork.types.cjs","sourceRoot":"","sources":["../../../src/components/BadgeNetwork/BadgeNetwork.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BadgeNetworkPropsShared } from '@metamask/design-system-shared';\n\nimport type { AvatarNetworkProps } from '../AvatarNetwork';\n\n/**\n * BadgeNetwork component props (React Native platform-specific)\n * Extends shared props from @metamask/design-system-shared with React Native-specific platform concerns\n */\nexport type BadgeNetworkProps = Omit<AvatarNetworkProps, 'size' | 'shape'> &\n  BadgeNetworkPropsShared;\n"]}

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

@@ -1,17 +1,8 @@
+import type { BadgeNetworkPropsShared } from "@metamask/design-system-shared";
 import type { AvatarNetworkProps } from "../AvatarNetwork/index.cjs";
-import type { ImageOrSvgSrc } from "../temp-components/ImageOrSvg/index.cjs";
-export type BadgeNetworkProps = Omit<AvatarNetworkProps, 'size' | 'shape'> & {
-    /**
-     * Optional prop for the source of the image or SVG.
-     */
-    src?: ImageOrSvgSrc;
-    /**
-     * Optional props for network name, to be used to calculate the fallbackText.
-     */
-    name?: string;
-    /**
-     * Optional text to be rendered when the content fails to render
-     */
-    fallbackText?: string;
-};
+/**
+ * BadgeNetwork component props (React Native platform-specific)
+ * Extends shared props from @metamask/design-system-shared with React Native-specific platform concerns
+ */
+export type BadgeNetworkProps = Omit<AvatarNetworkProps, 'size' | 'shape'> & BadgeNetworkPropsShared;
 //# sourceMappingURL=BadgeNetwork.types.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeNetwork.types.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeNetwork/BadgeNetwork.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,mCAAyB;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,gDAAsC;AAEnE,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG;IAC3E;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC"}
+{"version":3,"file":"BadgeNetwork.types.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeNetwork/BadgeNetwork.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,uCAAuC;AAE9E,OAAO,KAAK,EAAE,kBAAkB,EAAE,mCAAyB;AAE3D;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,EAAE,MAAM,GAAG,OAAO,CAAC,GACxE,uBAAuB,CAAC"}

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

@@ -1,17 +1,8 @@
+import type { BadgeNetworkPropsShared } from "@metamask/design-system-shared";
 import type { AvatarNetworkProps } from "../AvatarNetwork/index.mjs";
-import type { ImageOrSvgSrc } from "../temp-components/ImageOrSvg/index.mjs";
-export type BadgeNetworkProps = Omit<AvatarNetworkProps, 'size' | 'shape'> & {
-    /**
-     * Optional prop for the source of the image or SVG.
-     */
-    src?: ImageOrSvgSrc;
-    /**
-     * Optional props for network name, to be used to calculate the fallbackText.
-     */
-    name?: string;
-    /**
-     * Optional text to be rendered when the content fails to render
-     */
-    fallbackText?: string;
-};
+/**
+ * BadgeNetwork component props (React Native platform-specific)
+ * Extends shared props from @metamask/design-system-shared with React Native-specific platform concerns
+ */
+export type BadgeNetworkProps = Omit<AvatarNetworkProps, 'size' | 'shape'> & BadgeNetworkPropsShared;
 //# sourceMappingURL=BadgeNetwork.types.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeNetwork.types.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeNetwork/BadgeNetwork.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,mCAAyB;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,gDAAsC;AAEnE,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG;IAC3E;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC"}
+{"version":3,"file":"BadgeNetwork.types.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeNetwork/BadgeNetwork.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,uCAAuC;AAE9E,OAAO,KAAK,EAAE,kBAAkB,EAAE,mCAAyB;AAE3D;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,kBAAkB,EAAE,MAAM,GAAG,OAAO,CAAC,GACxE,uBAAuB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeNetwork.types.mjs","sourceRoot":"","sources":["../../../src/components/BadgeNetwork/BadgeNetwork.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { AvatarNetworkProps } from '../AvatarNetwork';\nimport type { ImageOrSvgSrc } from '../temp-components/ImageOrSvg';\n\nexport type BadgeNetworkProps = Omit<AvatarNetworkProps, 'size' | 'shape'> & {\n  /**\n   * Optional prop for the source of the image or SVG.\n   */\n  src?: ImageOrSvgSrc;\n  /**\n   * Optional props for network name, to be used to calculate the fallbackText.\n   */\n  name?: string;\n  /**\n   * Optional text to be rendered when the content fails to render\n   */\n  fallbackText?: string;\n};\n"]}
+{"version":3,"file":"BadgeNetwork.types.mjs","sourceRoot":"","sources":["../../../src/components/BadgeNetwork/BadgeNetwork.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BadgeNetworkPropsShared } from '@metamask/design-system-shared';\n\nimport type { AvatarNetworkProps } from '../AvatarNetwork';\n\n/**\n * BadgeNetwork component props (React Native platform-specific)\n * Extends shared props from @metamask/design-system-shared with React Native-specific platform concerns\n */\nexport type BadgeNetworkProps = Omit<AvatarNetworkProps, 'size' | 'shape'> &\n  BadgeNetworkPropsShared;\n"]}

package/dist/components/{BoxVertical/BoxVertical.cjs → BoxColumn/BoxColumn.cjs}

@@ -3,16 +3,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BoxVertical = void 0;
+exports.BoxColumn = void 0;
 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 BoxVertical = ({ 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={types_1.BoxFlexDirection.Column} twClassName={twClassName} {...rest}>
     {topAccessory}
     <TextOrChildren_1.TextOrChildren textProps={textProps}>{children}</TextOrChildren_1.TextOrChildren>
     {bottomAccessory}
   </Box_1.Box>);
-exports.BoxVertical = BoxVertical;
-exports.BoxVertical.displayName = 'BoxVertical';
-//# sourceMappingURL=BoxVertical.cjs.map
+exports.BoxColumn = BoxColumn;
+exports.BoxColumn.displayName = 'BoxColumn';
+//# sourceMappingURL=BoxColumn.cjs.map

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

@@ -0,0 +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"]}

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

@@ -0,0 +1,7 @@
+import React from "react";
+import type { BoxColumnProps } from "./BoxColumn.types.cjs";
+export declare const BoxColumn: {
+    ({ children, textProps, topAccessory, bottomAccessory, twClassName, ...rest }: BoxColumnProps): React.JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=BoxColumn.d.cts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,7 @@
+import React from "react";
+import type { BoxColumnProps } from "./BoxColumn.types.mjs";
+export declare const BoxColumn: {
+    ({ children, textProps, topAccessory, bottomAccessory, twClassName, ...rest }: BoxColumnProps): React.JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=BoxColumn.d.mts.map

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

@@ -0,0 +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"}

package/dist/components/{BoxVertical/BoxVertical.mjs → BoxColumn/BoxColumn.mjs}

@@ -9,10 +9,10 @@ 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 BoxVertical = ({ children, textProps, topAccessory, bottomAccessory, twClassName, ...rest }) => (<Box flexDirection={BoxFlexDirection.Column} twClassName={twClassName} {...rest}>
+export const BoxColumn = ({ children, textProps, topAccessory, bottomAccessory, twClassName, ...rest }) => (<Box flexDirection={BoxFlexDirection.Column} twClassName={twClassName} {...rest}>
     {topAccessory}
     <TextOrChildren textProps={textProps}>{children}</TextOrChildren>
     {bottomAccessory}
   </Box>);
-BoxVertical.displayName = 'BoxVertical';
-//# sourceMappingURL=BoxVertical.mjs.map
+BoxColumn.displayName = 'BoxColumn';
+//# sourceMappingURL=BoxColumn.mjs.map

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

@@ -0,0 +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"]}

package/dist/components/{BoxVertical/BoxVertical.types.cjs → BoxColumn/BoxColumn.types.cjs}

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BoxColumn.types.cjs","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BoxColumnPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type { TextProps } from '../Text';\n\n/**\n * BoxColumn component props.\n */\nexport type BoxColumnProps = BoxColumnPropsShared &\n  Omit<BoxProps, 'children' | 'flexDirection'> & {\n    /**\n     * Optional props passed to `Text` when `children` is a string.\n     */\n    textProps?: Omit<Partial<TextProps>, 'children'>;\n  };\n"]}

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

@@ -0,0 +1,13 @@
+import type { BoxColumnPropsShared } from "@metamask/design-system-shared";
+import type { BoxProps } from "../Box/Box.types.cjs";
+import type { TextProps } from "../Text/index.cjs";
+/**
+ * BoxColumn component props.
+ */
+export type BoxColumnProps = BoxColumnPropsShared & Omit<BoxProps, 'children' | 'flexDirection'> & {
+    /**
+     * Optional props passed to `Text` when `children` is a string.
+     */
+    textProps?: Omit<Partial<TextProps>, 'children'>;
+};
+//# sourceMappingURL=BoxColumn.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BoxColumn.types.d.cts","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,uCAAuC;AAE3E,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAC/C,IAAI,CAAC,QAAQ,EAAE,UAAU,GAAG,eAAe,CAAC,GAAG;IAC7C;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;CAClD,CAAC"}

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

@@ -0,0 +1,13 @@
+import type { BoxColumnPropsShared } from "@metamask/design-system-shared";
+import type { BoxProps } from "../Box/Box.types.mjs";
+import type { TextProps } from "../Text/index.mjs";
+/**
+ * BoxColumn component props.
+ */
+export type BoxColumnProps = BoxColumnPropsShared & Omit<BoxProps, 'children' | 'flexDirection'> & {
+    /**
+     * Optional props passed to `Text` when `children` is a string.
+     */
+    textProps?: Omit<Partial<TextProps>, 'children'>;
+};
+//# sourceMappingURL=BoxColumn.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BoxColumn.types.d.mts","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,uCAAuC;AAE3E,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAC/C,IAAI,CAAC,QAAQ,EAAE,UAAU,GAAG,eAAe,CAAC,GAAG;IAC7C;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;CAClD,CAAC"}

package/dist/components/BoxColumn/BoxColumn.types.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BoxColumn.types.mjs","sourceRoot":"","sources":["../../../src/components/BoxColumn/BoxColumn.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BoxColumnPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type { TextProps } from '../Text';\n\n/**\n * BoxColumn component props.\n */\nexport type BoxColumnProps = BoxColumnPropsShared &\n  Omit<BoxProps, 'children' | 'flexDirection'> & {\n    /**\n     * Optional props passed to `Text` when `children` is a string.\n     */\n    textProps?: Omit<Partial<TextProps>, 'children'>;\n  };\n"]}

package/dist/components/BoxColumn/index.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BoxColumn/index.ts"],"names":[],"mappings":";;;AAAA,6CAAwC;AAA/B,sGAAA,SAAS,OAAA","sourcesContent":["export { BoxColumn } from './BoxColumn';\nexport type { BoxColumnProps } from './BoxColumn.types';\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/BoxColumn/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,wBAAoB;AACxC,YAAY,EAAE,cAAc,EAAE,8BAA0B"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/BoxColumn/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,wBAAoB;AACxC,YAAY,EAAE,cAAc,EAAE,8BAA0B"}

package/dist/components/BoxColumn/index.mjs

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

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

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

package/dist/components/{BoxHorizontal/BoxHorizontal.cjs → BoxRow/BoxRow.cjs}

@@ -3,16 +3,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BoxHorizontal = void 0;
+exports.BoxRow = void 0;
 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 BoxHorizontal = ({ 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={types_1.BoxFlexDirection.Row} alignItems={types_1.BoxAlignItems.Center} gap={1} twClassName={twClassName} {...rest}>
     {startAccessory}
     <TextOrChildren_1.TextOrChildren textProps={textProps}>{children}</TextOrChildren_1.TextOrChildren>
     {endAccessory}
   </Box_1.Box>);
-exports.BoxHorizontal = BoxHorizontal;
-exports.BoxHorizontal.displayName = 'BoxHorizontal';
-//# sourceMappingURL=BoxHorizontal.cjs.map
+exports.BoxRow = BoxRow;
+exports.BoxRow.displayName = 'BoxRow';
+//# sourceMappingURL=BoxRow.cjs.map

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

@@ -0,0 +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"]}

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

@@ -0,0 +1,7 @@
+import React from "react";
+import type { BoxRowProps } from "./BoxRow.types.cjs";
+export declare const BoxRow: {
+    ({ children, textProps, startAccessory, endAccessory, twClassName, ...rest }: BoxRowProps): React.JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=BoxRow.d.cts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,7 @@
+import React from "react";
+import type { BoxRowProps } from "./BoxRow.types.mjs";
+export declare const BoxRow: {
+    ({ children, textProps, startAccessory, endAccessory, twClassName, ...rest }: BoxRowProps): React.JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=BoxRow.d.mts.map

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

@@ -0,0 +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"}

package/dist/components/{BoxHorizontal/BoxHorizontal.mjs → BoxRow/BoxRow.mjs}

@@ -9,10 +9,10 @@ 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 BoxHorizontal = ({ children, textProps, startAccessory, endAccessory, twClassName, ...rest }) => (<Box flexDirection={BoxFlexDirection.Row} alignItems={BoxAlignItems.Center} gap={1} twClassName={twClassName} {...rest}>
+export const BoxRow = ({ children, textProps, startAccessory, endAccessory, twClassName, ...rest }) => (<Box flexDirection={BoxFlexDirection.Row} alignItems={BoxAlignItems.Center} gap={1} twClassName={twClassName} {...rest}>
     {startAccessory}
     <TextOrChildren textProps={textProps}>{children}</TextOrChildren>
     {endAccessory}
   </Box>);
-BoxHorizontal.displayName = 'BoxHorizontal';
-//# sourceMappingURL=BoxHorizontal.mjs.map
+BoxRow.displayName = 'BoxRow';
+//# sourceMappingURL=BoxRow.mjs.map

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

@@ -0,0 +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"]}

package/dist/components/{BoxHorizontal/BoxHorizontal.types.cjs → BoxRow/BoxRow.types.cjs}

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BoxRow.types.cjs","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BoxRowPropsShared } from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box/Box.types';\nimport type { TextProps } from '../Text';\n\n/**\n * BoxRow component props.\n */\nexport type BoxRowProps = BoxRowPropsShared &\n  Omit<BoxProps, 'children' | 'flexDirection'> & {\n    /**\n     * Optional props passed to `Text` when `children` is a string.\n     */\n    textProps?: Omit<Partial<TextProps>, 'children'>;\n  };\n"]}

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

@@ -0,0 +1,13 @@
+import type { BoxRowPropsShared } from "@metamask/design-system-shared";
+import type { BoxProps } from "../Box/Box.types.cjs";
+import type { TextProps } from "../Text/index.cjs";
+/**
+ * BoxRow component props.
+ */
+export type BoxRowProps = BoxRowPropsShared & Omit<BoxProps, 'children' | 'flexDirection'> & {
+    /**
+     * Optional props passed to `Text` when `children` is a string.
+     */
+    textProps?: Omit<Partial<TextProps>, 'children'>;
+};
+//# sourceMappingURL=BoxRow.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BoxRow.types.d.cts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,uCAAuC;AAExE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,iBAAiB,GACzC,IAAI,CAAC,QAAQ,EAAE,UAAU,GAAG,eAAe,CAAC,GAAG;IAC7C;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;CAClD,CAAC"}

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

@@ -0,0 +1,13 @@
+import type { BoxRowPropsShared } from "@metamask/design-system-shared";
+import type { BoxProps } from "../Box/Box.types.mjs";
+import type { TextProps } from "../Text/index.mjs";
+/**
+ * BoxRow component props.
+ */
+export type BoxRowProps = BoxRowPropsShared & Omit<BoxProps, 'children' | 'flexDirection'> & {
+    /**
+     * Optional props passed to `Text` when `children` is a string.
+     */
+    textProps?: Omit<Partial<TextProps>, 'children'>;
+};
+//# sourceMappingURL=BoxRow.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BoxRow.types.d.mts","sourceRoot":"","sources":["../../../src/components/BoxRow/BoxRow.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,uCAAuC;AAExE,OAAO,KAAK,EAAE,QAAQ,EAAE,6BAAyB;AACjD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,iBAAiB,GACzC,IAAI,CAAC,QAAQ,EAAE,UAAU,GAAG,eAAe,CAAC,GAAG;IAC7C;;OAEG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;CAClD,CAAC"}