@metamask-previews/design-system-react-native 0.26.0-preview.620b9f3 → 0.27.0-preview.f5c2542

package/CHANGELOG.md

@@ -7,6 +7,28 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.27.0]
+
+### Added
+
+- Added `FlashFilled` icon (filled lightning bolt) to `IconName` ([#1191](https://github.com/MetaMask/metamask-design-system/pull/1191))
+- Added `SelectButtonSize` so `SelectButton` exposes a semantic size type ([#1177](https://github.com/MetaMask/metamask-design-system/pull/1177))
+
+### Changed
+
+- **BREAKING:** Removed `panGestureHandlerProps` from `BottomSheet` and `BottomSheetDialog` following the migration to the `react-native-gesture-handler` v2 `GestureDetector`/`Gesture.Pan()` API ([#1165](https://github.com/MetaMask/metamask-design-system/pull/1165))
+  - See [Migration Guide](./MIGRATION.md#from-version-0260-to-0270)
+- **BREAKING:** Removed the variant-based title API from `HeaderBase` and `BottomSheetHeader` ([#1103](https://github.com/MetaMask/metamask-design-system/pull/1103))
+  - Removed `variant`, `HeaderBaseVariant`, and `BottomSheetHeaderVariant`, plus `HeaderBase`'s `titleTestID`
+  - String titles now render with a centered `HeadingSm` treatment; pass custom `children` for bespoke title layouts and use `textProps.testID` in place of `titleTestID`
+  - See [Migration Guide](./MIGRATION.md#from-version-0260-to-0270)
+- Reduced the default `SegmentGroup` segment spacing from `gap-3` to `gap-1` for tighter grouped segments ([#1194](https://github.com/MetaMask/metamask-design-system/pull/1194))
+
+### Fixed
+
+- Fixed a `HeaderStandardAnimated` runtime crash under React Native Reanimated 4 by inlining the scroll-handler worklet ([#1185](https://github.com/MetaMask/metamask-design-system/pull/1185))
+- Fixed React Native Web rendering for `BottomSheet`, `BottomSheetOverlay`, `Icon`, and the animated `ButtonAnimated` and `Spinner` components ([#1187](https://github.com/MetaMask/metamask-design-system/pull/1187))
+
 ## [0.26.0]
 
 ### Added
@@ -446,7 +468,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Full TypeScript support with type definitions and enums
 - React Native integration with TWRNC preset support
 
-[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.26.0...HEAD
+[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.27.0...HEAD
+[0.27.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.26.0...@metamask/design-system-react-native@0.27.0
 [0.26.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.25.0...@metamask/design-system-react-native@0.26.0
 [0.25.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.24.0...@metamask/design-system-react-native@0.25.0
 [0.24.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.23.0...@metamask/design-system-react-native@0.24.0

package/dist/components/BottomSheetHeader/BottomSheetHeader.cjs

@@ -11,15 +11,11 @@ const react_1 = __importDefault(require("react"));
 const ButtonIcon_1 = require("../ButtonIcon/index.cjs");
 const HeaderBase_1 = require("../HeaderBase/index.cjs");
 const Icon_1 = require("../Icon/index.cjs");
-// Internal dependencies.
-const BottomSheetHeader_constants_1 = require("./BottomSheetHeader.constants.cjs");
-const BottomSheetHeader_types_1 = require("./BottomSheetHeader.types.cjs");
-const BottomSheetHeader = ({ style, twClassName, children, onBack, backButtonProps, onClose, closeButtonProps, variant = BottomSheetHeader_types_1.BottomSheetHeaderVariant.Compact, ...props }) => {
+const BottomSheetHeader = ({ style, twClassName, children, onBack, backButtonProps, onClose, closeButtonProps, ...props }) => {
     const tw = (0, design_system_twrnc_preset_1.useTailwind)();
     const startAccessory = onBack ? (<ButtonIcon_1.ButtonIcon iconName={Icon_1.IconName.ArrowLeft} onPress={onBack} size={ButtonIcon_1.ButtonIconSize.Md} {...backButtonProps}/>) : undefined;
     const endAccessory = onClose ? (<ButtonIcon_1.ButtonIcon iconName={Icon_1.IconName.Close} onPress={onClose} size={ButtonIcon_1.ButtonIconSize.Md} {...closeButtonProps}/>) : undefined;
-    const headerBaseVariant = BottomSheetHeader_constants_1.BOTTOM_SHEET_HEADER_VARIANT_MAP[variant];
-    return (<HeaderBase_1.HeaderBase {...props} style={[tw.style('px-4', twClassName), style]} startAccessory={startAccessory} endAccessory={endAccessory} variant={headerBaseVariant}>
+    return (<HeaderBase_1.HeaderBase {...props} style={[tw.style('px-4', twClassName), style]} startAccessory={startAccessory} endAccessory={endAccessory}>
       {children}
     </HeaderBase_1.HeaderBase>);
 };

package/dist/components/BottomSheetHeader/BottomSheetHeader.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetHeader.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,8FAA4E;AAC5E,kDAA0B;AAE1B,yBAAyB;AACzB,wDAA2D;AAC3D,wDAA2C;AAC3C,4CAAmC;AAEnC,yBAAyB;AACzB,mFAAgF;AAEhF,2EAAqE;AAE9D,MAAM,iBAAiB,GAAqC,CAAC,EAClE,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,gBAAgB,EAChB,OAAO,GAAG,kDAAwB,CAAC,OAAO,EAC1C,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IAEzB,MAAM,cAAc,GAAG,MAAM,CAAC,CAAC,CAAC,CAC9B,CAAC,uBAAU,CACT,QAAQ,CAAC,CAAC,eAAQ,CAAC,SAAS,CAAC,CAC7B,OAAO,CAAC,CAAC,MAAM,CAAC,CAChB,IAAI,CAAC,CAAC,2BAAc,CAAC,EAAE,CAAC,CACxB,IAAI,eAAe,CAAC,EACpB,CACH,CAAC,CAAC,CAAC,SAAS,CAAC;IAEd,MAAM,YAAY,GAAG,OAAO,CAAC,CAAC,CAAC,CAC7B,CAAC,uBAAU,CACT,QAAQ,CAAC,CAAC,eAAQ,CAAC,KAAK,CAAC,CACzB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,CAAC,CAAC,2BAAc,CAAC,EAAE,CAAC,CACxB,IAAI,gBAAgB,CAAC,EACrB,CACH,CAAC,CAAC,CAAC,SAAS,CAAC;IAEd,MAAM,iBAAiB,GAAG,6DAA+B,CAAC,OAAO,CAAC,CAAC;IAEnE,OAAO,CACL,CAAC,uBAAU,CACT,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,WAAW,CAAC,EAAE,KAAK,CAAC,CAAC,CAC9C,cAAc,CAAC,CAAC,cAAc,CAAC,CAC/B,YAAY,CAAC,CAAC,YAAY,CAAC,CAC3B,OAAO,CAAC,CAAC,iBAAiB,CAAC,CAE3B;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,uBAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC;AA5CW,QAAA,iBAAiB,qBA4C5B","sourcesContent":["// Third party dependencies.\nimport { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React from 'react';\n\n// External dependencies.\nimport { ButtonIcon, ButtonIconSize } from '../ButtonIcon';\nimport { HeaderBase } from '../HeaderBase';\nimport { IconName } from '../Icon';\n\n// Internal dependencies.\nimport { BOTTOM_SHEET_HEADER_VARIANT_MAP } from './BottomSheetHeader.constants';\nimport type { BottomSheetHeaderProps } from './BottomSheetHeader.types';\nimport { BottomSheetHeaderVariant } from './BottomSheetHeader.types';\n\nexport const BottomSheetHeader: React.FC<BottomSheetHeaderProps> = ({\n  style,\n  twClassName,\n  children,\n  onBack,\n  backButtonProps,\n  onClose,\n  closeButtonProps,\n  variant = BottomSheetHeaderVariant.Compact,\n  ...props\n}) => {\n  const tw = useTailwind();\n\n  const startAccessory = onBack ? (\n    <ButtonIcon\n      iconName={IconName.ArrowLeft}\n      onPress={onBack}\n      size={ButtonIconSize.Md}\n      {...backButtonProps}\n    />\n  ) : undefined;\n\n  const endAccessory = onClose ? (\n    <ButtonIcon\n      iconName={IconName.Close}\n      onPress={onClose}\n      size={ButtonIconSize.Md}\n      {...closeButtonProps}\n    />\n  ) : undefined;\n\n  const headerBaseVariant = BOTTOM_SHEET_HEADER_VARIANT_MAP[variant];\n\n  return (\n    <HeaderBase\n      {...props}\n      style={[tw.style('px-4', twClassName), style]}\n      startAccessory={startAccessory}\n      endAccessory={endAccessory}\n      variant={headerBaseVariant}\n    >\n      {children}\n    </HeaderBase>\n  );\n};\n"]}
+{"version":3,"file":"BottomSheetHeader.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,8FAA4E;AAC5E,kDAA0B;AAE1B,yBAAyB;AACzB,wDAA2D;AAC3D,wDAA2C;AAC3C,4CAAmC;AAI5B,MAAM,iBAAiB,GAAqC,CAAC,EAClE,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,gBAAgB,EAChB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IAEzB,MAAM,cAAc,GAAG,MAAM,CAAC,CAAC,CAAC,CAC9B,CAAC,uBAAU,CACT,QAAQ,CAAC,CAAC,eAAQ,CAAC,SAAS,CAAC,CAC7B,OAAO,CAAC,CAAC,MAAM,CAAC,CAChB,IAAI,CAAC,CAAC,2BAAc,CAAC,EAAE,CAAC,CACxB,IAAI,eAAe,CAAC,EACpB,CACH,CAAC,CAAC,CAAC,SAAS,CAAC;IAEd,MAAM,YAAY,GAAG,OAAO,CAAC,CAAC,CAAC,CAC7B,CAAC,uBAAU,CACT,QAAQ,CAAC,CAAC,eAAQ,CAAC,KAAK,CAAC,CACzB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,CAAC,CAAC,2BAAc,CAAC,EAAE,CAAC,CACxB,IAAI,gBAAgB,CAAC,EACrB,CACH,CAAC,CAAC,CAAC,SAAS,CAAC;IACd,OAAO,CACL,CAAC,uBAAU,CACT,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,WAAW,CAAC,EAAE,KAAK,CAAC,CAAC,CAC9C,cAAc,CAAC,CAAC,cAAc,CAAC,CAC/B,YAAY,CAAC,CAAC,YAAY,CAAC,CAE3B;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,uBAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC;AAvCW,QAAA,iBAAiB,qBAuC5B","sourcesContent":["// Third party dependencies.\nimport { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React from 'react';\n\n// External dependencies.\nimport { ButtonIcon, ButtonIconSize } from '../ButtonIcon';\nimport { HeaderBase } from '../HeaderBase';\nimport { IconName } from '../Icon';\n\nimport type { BottomSheetHeaderProps } from './BottomSheetHeader.types';\n\nexport const BottomSheetHeader: React.FC<BottomSheetHeaderProps> = ({\n  style,\n  twClassName,\n  children,\n  onBack,\n  backButtonProps,\n  onClose,\n  closeButtonProps,\n  ...props\n}) => {\n  const tw = useTailwind();\n\n  const startAccessory = onBack ? (\n    <ButtonIcon\n      iconName={IconName.ArrowLeft}\n      onPress={onBack}\n      size={ButtonIconSize.Md}\n      {...backButtonProps}\n    />\n  ) : undefined;\n\n  const endAccessory = onClose ? (\n    <ButtonIcon\n      iconName={IconName.Close}\n      onPress={onClose}\n      size={ButtonIconSize.Md}\n      {...closeButtonProps}\n    />\n  ) : undefined;\n  return (\n    <HeaderBase\n      {...props}\n      style={[tw.style('px-4', twClassName), style]}\n      startAccessory={startAccessory}\n      endAccessory={endAccessory}\n    >\n      {children}\n    </HeaderBase>\n  );\n};\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetHeader.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,cAAc;AAS1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,sCAAkC;AAGxE,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA4C9D,CAAC"}
+{"version":3,"file":"BottomSheetHeader.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,sCAAkC;AAExE,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAuC9D,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetHeader.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,cAAc;AAS1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,sCAAkC;AAGxE,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA4C9D,CAAC"}
+{"version":3,"file":"BottomSheetHeader.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,sBAAsB,EAAE,sCAAkC;AAExE,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAuC9D,CAAC"}

package/dist/components/BottomSheetHeader/BottomSheetHeader.mjs

@@ -12,15 +12,11 @@ const React = $importDefault($React);
 import { ButtonIcon, ButtonIconSize } from "../ButtonIcon/index.mjs";
 import { HeaderBase } from "../HeaderBase/index.mjs";
 import { IconName } from "../Icon/index.mjs";
-// Internal dependencies.
-import { BOTTOM_SHEET_HEADER_VARIANT_MAP } from "./BottomSheetHeader.constants.mjs";
-import { BottomSheetHeaderVariant } from "./BottomSheetHeader.types.mjs";
-export const BottomSheetHeader = ({ style, twClassName, children, onBack, backButtonProps, onClose, closeButtonProps, variant = BottomSheetHeaderVariant.Compact, ...props }) => {
+export const BottomSheetHeader = ({ style, twClassName, children, onBack, backButtonProps, onClose, closeButtonProps, ...props }) => {
     const tw = useTailwind();
     const startAccessory = onBack ? (<ButtonIcon iconName={IconName.ArrowLeft} onPress={onBack} size={ButtonIconSize.Md} {...backButtonProps}/>) : undefined;
     const endAccessory = onClose ? (<ButtonIcon iconName={IconName.Close} onPress={onClose} size={ButtonIconSize.Md} {...closeButtonProps}/>) : undefined;
-    const headerBaseVariant = BOTTOM_SHEET_HEADER_VARIANT_MAP[variant];
-    return (<HeaderBase {...props} style={[tw.style('px-4', twClassName), style]} startAccessory={startAccessory} endAccessory={endAccessory} variant={headerBaseVariant}>
+    return (<HeaderBase {...props} style={[tw.style('px-4', twClassName), style]} startAccessory={startAccessory} endAccessory={endAccessory}>
       {children}
     </HeaderBase>);
 };

package/dist/components/BottomSheetHeader/BottomSheetHeader.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetHeader.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,OAAO,EAAE,WAAW,EAAE,sDAAsD;AAC5E,OAAO,MAAK,cAAc;;AAE1B,yBAAyB;AACzB,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,gCAAsB;AAC3D,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,QAAQ,EAAE,0BAAgB;AAEnC,yBAAyB;AACzB,OAAO,EAAE,+BAA+B,EAAE,0CAAsC;AAEhF,OAAO,EAAE,wBAAwB,EAAE,sCAAkC;AAErE,MAAM,CAAC,MAAM,iBAAiB,GAAqC,CAAC,EAClE,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,gBAAgB,EAChB,OAAO,GAAG,wBAAwB,CAAC,OAAO,EAC1C,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,MAAM,cAAc,GAAG,MAAM,CAAC,CAAC,CAAC,CAC9B,CAAC,UAAU,CACT,QAAQ,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,CAC7B,OAAO,CAAC,CAAC,MAAM,CAAC,CAChB,IAAI,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC,CACxB,IAAI,eAAe,CAAC,EACpB,CACH,CAAC,CAAC,CAAC,SAAS,CAAC;IAEd,MAAM,YAAY,GAAG,OAAO,CAAC,CAAC,CAAC,CAC7B,CAAC,UAAU,CACT,QAAQ,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CACzB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC,CACxB,IAAI,gBAAgB,CAAC,EACrB,CACH,CAAC,CAAC,CAAC,SAAS,CAAC;IAEd,MAAM,iBAAiB,GAAG,+BAA+B,CAAC,OAAO,CAAC,CAAC;IAEnE,OAAO,CACL,CAAC,UAAU,CACT,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,WAAW,CAAC,EAAE,KAAK,CAAC,CAAC,CAC9C,cAAc,CAAC,CAAC,cAAc,CAAC,CAC/B,YAAY,CAAC,CAAC,YAAY,CAAC,CAC3B,OAAO,CAAC,CAAC,iBAAiB,CAAC,CAE3B;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Third party dependencies.\nimport { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React from 'react';\n\n// External dependencies.\nimport { ButtonIcon, ButtonIconSize } from '../ButtonIcon';\nimport { HeaderBase } from '../HeaderBase';\nimport { IconName } from '../Icon';\n\n// Internal dependencies.\nimport { BOTTOM_SHEET_HEADER_VARIANT_MAP } from './BottomSheetHeader.constants';\nimport type { BottomSheetHeaderProps } from './BottomSheetHeader.types';\nimport { BottomSheetHeaderVariant } from './BottomSheetHeader.types';\n\nexport const BottomSheetHeader: React.FC<BottomSheetHeaderProps> = ({\n  style,\n  twClassName,\n  children,\n  onBack,\n  backButtonProps,\n  onClose,\n  closeButtonProps,\n  variant = BottomSheetHeaderVariant.Compact,\n  ...props\n}) => {\n  const tw = useTailwind();\n\n  const startAccessory = onBack ? (\n    <ButtonIcon\n      iconName={IconName.ArrowLeft}\n      onPress={onBack}\n      size={ButtonIconSize.Md}\n      {...backButtonProps}\n    />\n  ) : undefined;\n\n  const endAccessory = onClose ? (\n    <ButtonIcon\n      iconName={IconName.Close}\n      onPress={onClose}\n      size={ButtonIconSize.Md}\n      {...closeButtonProps}\n    />\n  ) : undefined;\n\n  const headerBaseVariant = BOTTOM_SHEET_HEADER_VARIANT_MAP[variant];\n\n  return (\n    <HeaderBase\n      {...props}\n      style={[tw.style('px-4', twClassName), style]}\n      startAccessory={startAccessory}\n      endAccessory={endAccessory}\n      variant={headerBaseVariant}\n    >\n      {children}\n    </HeaderBase>\n  );\n};\n"]}
+{"version":3,"file":"BottomSheetHeader.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,OAAO,EAAE,WAAW,EAAE,sDAAsD;AAC5E,OAAO,MAAK,cAAc;;AAE1B,yBAAyB;AACzB,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,gCAAsB;AAC3D,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,QAAQ,EAAE,0BAAgB;AAInC,MAAM,CAAC,MAAM,iBAAiB,GAAqC,CAAC,EAClE,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,gBAAgB,EAChB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,MAAM,cAAc,GAAG,MAAM,CAAC,CAAC,CAAC,CAC9B,CAAC,UAAU,CACT,QAAQ,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,CAC7B,OAAO,CAAC,CAAC,MAAM,CAAC,CAChB,IAAI,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC,CACxB,IAAI,eAAe,CAAC,EACpB,CACH,CAAC,CAAC,CAAC,SAAS,CAAC;IAEd,MAAM,YAAY,GAAG,OAAO,CAAC,CAAC,CAAC,CAC7B,CAAC,UAAU,CACT,QAAQ,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CACzB,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC,CACxB,IAAI,gBAAgB,CAAC,EACrB,CACH,CAAC,CAAC,CAAC,SAAS,CAAC;IACd,OAAO,CACL,CAAC,UAAU,CACT,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,WAAW,CAAC,EAAE,KAAK,CAAC,CAAC,CAC9C,cAAc,CAAC,CAAC,cAAc,CAAC,CAC/B,YAAY,CAAC,CAAC,YAAY,CAAC,CAE3B;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Third party dependencies.\nimport { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React from 'react';\n\n// External dependencies.\nimport { ButtonIcon, ButtonIconSize } from '../ButtonIcon';\nimport { HeaderBase } from '../HeaderBase';\nimport { IconName } from '../Icon';\n\nimport type { BottomSheetHeaderProps } from './BottomSheetHeader.types';\n\nexport const BottomSheetHeader: React.FC<BottomSheetHeaderProps> = ({\n  style,\n  twClassName,\n  children,\n  onBack,\n  backButtonProps,\n  onClose,\n  closeButtonProps,\n  ...props\n}) => {\n  const tw = useTailwind();\n\n  const startAccessory = onBack ? (\n    <ButtonIcon\n      iconName={IconName.ArrowLeft}\n      onPress={onBack}\n      size={ButtonIconSize.Md}\n      {...backButtonProps}\n    />\n  ) : undefined;\n\n  const endAccessory = onClose ? (\n    <ButtonIcon\n      iconName={IconName.Close}\n      onPress={onClose}\n      size={ButtonIconSize.Md}\n      {...closeButtonProps}\n    />\n  ) : undefined;\n  return (\n    <HeaderBase\n      {...props}\n      style={[tw.style('px-4', twClassName), style]}\n      startAccessory={startAccessory}\n      endAccessory={endAccessory}\n    >\n      {children}\n    </HeaderBase>\n  );\n};\n"]}

package/dist/components/BottomSheetHeader/BottomSheetHeader.types.cjs

@@ -1,14 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BottomSheetHeaderVariant = void 0;
-/**
- * Variant options for BottomSheetHeader component.
- * - Compact: Center-aligned title with HeadingSm text (default)
- * - Display: Left-aligned title with HeadingLg text
- */
-var BottomSheetHeaderVariant;
-(function (BottomSheetHeaderVariant) {
-    BottomSheetHeaderVariant["Display"] = "display";
-    BottomSheetHeaderVariant["Compact"] = "compact";
-})(BottomSheetHeaderVariant || (exports.BottomSheetHeaderVariant = BottomSheetHeaderVariant = {}));
 //# sourceMappingURL=BottomSheetHeader.types.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetHeader.types.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.types.ts"],"names":[],"mappings":";;;AAGA;;;;GAIG;AACH,IAAY,wBAGX;AAHD,WAAY,wBAAwB;IAClC,+CAAmB,CAAA;IACnB,+CAAmB,CAAA;AACrB,CAAC,EAHW,wBAAwB,wCAAxB,wBAAwB,QAGnC","sourcesContent":["import type { ButtonIconProps } from '../ButtonIcon/ButtonIcon.types';\nimport type { HeaderBaseProps } from '../HeaderBase/HeaderBase.types';\n\n/**\n * Variant options for BottomSheetHeader component.\n * - Compact: Center-aligned title with HeadingSm text (default)\n * - Display: Left-aligned title with HeadingLg text\n */\nexport enum BottomSheetHeaderVariant {\n  Display = 'display',\n  Compact = 'compact',\n}\n\n/**\n * BottomSheetHeader component props.\n *\n * Extends HeaderBase's props (which extends ViewProps) to inherit standard\n * props such as `testID`, `accessibilityLabel`, and other View props.\n */\nexport type BottomSheetHeaderProps = {\n  /**\n   * Callback function triggered when the back button is pressed.\n   * When provided, a back arrow ButtonIcon is rendered as the start accessory.\n   */\n  onBack?: () => void;\n  /**\n   * Props spread to the back ButtonIcon component for additional properties\n   * like `testID` or `accessibilityLabel`. Use this for testing or accessibility purposes.\n   * Note: `iconName` and `onPress` are managed internally and excluded.\n   */\n  backButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;\n  /**\n   * Callback function triggered when the close button is pressed.\n   * When provided, a close ButtonIcon is rendered as the end accessory.\n   */\n  onClose?: () => void;\n  /**\n   * Props spread to the close ButtonIcon component for additional properties\n   * like `testID` or `accessibilityLabel`. Use this for testing or accessibility purposes.\n   * Note: `iconName` and `onPress` are managed internally and excluded.\n   */\n  closeButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;\n  /**\n   * Variant controlling header alignment and text size.\n   * - Compact: center-aligned with HeadingSm text\n   * - Display: left-aligned with HeadingLg text\n   *\n   * @default BottomSheetHeaderVariant.Compact\n   */\n  variant?: BottomSheetHeaderVariant;\n} & Omit<HeaderBaseProps, 'variant'>;\n"]}
+{"version":3,"file":"BottomSheetHeader.types.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconProps } from '../ButtonIcon/ButtonIcon.types';\nimport type { HeaderBaseProps } from '../HeaderBase/HeaderBase.types';\n\n/**\n * BottomSheetHeader component props.\n *\n * Extends HeaderBase's root and title props to inherit standard props such as\n * `testID`, `accessibilityLabel`, `textProps`, and other View props.\n * Start and end accessories are controlled internally via `onBack` and\n * `onClose`, so `startAccessory`, `endAccessory`, `startButtonIconProps`,\n * and `endButtonIconProps` are not part of this API.\n */\nexport type BottomSheetHeaderProps = {\n  /**\n   * Callback function triggered when the back button is pressed.\n   * When provided, a back arrow ButtonIcon is rendered as the start accessory.\n   */\n  onBack?: () => void;\n  /**\n   * Props spread to the back ButtonIcon component for additional properties\n   * like `testID` or `accessibilityLabel`. Use this for testing or accessibility purposes.\n   * Note: `iconName` and `onPress` are managed internally and excluded.\n   */\n  backButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;\n  /**\n   * Callback function triggered when the close button is pressed.\n   * When provided, a close ButtonIcon is rendered as the end accessory.\n   */\n  onClose?: () => void;\n  /**\n   * Props spread to the close ButtonIcon component for additional properties\n   * like `testID` or `accessibilityLabel`. Use this for testing or accessibility purposes.\n   * Note: `iconName` and `onPress` are managed internally and excluded.\n   */\n  closeButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;\n} & Omit<\n  HeaderBaseProps,\n  | 'startAccessory'\n  | 'endAccessory'\n  | 'startButtonIconProps'\n  | 'endButtonIconProps'\n>;\n"]}

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

@@ -1,19 +1,13 @@
 import type { ButtonIconProps } from "../ButtonIcon/ButtonIcon.types.cjs";
 import type { HeaderBaseProps } from "../HeaderBase/HeaderBase.types.cjs";
-/**
- * Variant options for BottomSheetHeader component.
- * - Compact: Center-aligned title with HeadingSm text (default)
- * - Display: Left-aligned title with HeadingLg text
- */
-export declare enum BottomSheetHeaderVariant {
-    Display = "display",
-    Compact = "compact"
-}
 /**
  * BottomSheetHeader component props.
  *
- * Extends HeaderBase's props (which extends ViewProps) to inherit standard
- * props such as `testID`, `accessibilityLabel`, and other View props.
+ * Extends HeaderBase's root and title props to inherit standard props such as
+ * `testID`, `accessibilityLabel`, `textProps`, and other View props.
+ * Start and end accessories are controlled internally via `onBack` and
+ * `onClose`, so `startAccessory`, `endAccessory`, `startButtonIconProps`,
+ * and `endButtonIconProps` are not part of this API.
  */
 export type BottomSheetHeaderProps = {
     /**
@@ -38,13 +32,5 @@ export type BottomSheetHeaderProps = {
      * Note: `iconName` and `onPress` are managed internally and excluded.
      */
     closeButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;
-    /**
-     * Variant controlling header alignment and text size.
-     * - Compact: center-aligned with HeadingSm text
-     * - Display: left-aligned with HeadingLg text
-     *
-     * @default BottomSheetHeaderVariant.Compact
-     */
-    variant?: BottomSheetHeaderVariant;
-} & Omit<HeaderBaseProps, 'variant'>;
+} & Omit<HeaderBaseProps, 'startAccessory' | 'endAccessory' | 'startButtonIconProps' | 'endButtonIconProps'>;
 //# sourceMappingURL=BottomSheetHeader.types.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetHeader.types.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AACtE,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AAEtE;;;;GAIG;AACH,oBAAY,wBAAwB;IAClC,OAAO,YAAY;IACnB,OAAO,YAAY;CACpB;AAED;;;;;GAKG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC;IACzE;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC;IAC1E;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,wBAAwB,CAAC;CACpC,GAAG,IAAI,CAAC,eAAe,EAAE,SAAS,CAAC,CAAC"}
+{"version":3,"file":"BottomSheetHeader.types.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AACtE,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AAEtE;;;;;;;;GAQG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC;IACzE;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC;CAC3E,GAAG,IAAI,CACN,eAAe,EACb,gBAAgB,GAChB,cAAc,GACd,sBAAsB,GACtB,oBAAoB,CACvB,CAAC"}

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

@@ -1,19 +1,13 @@
 import type { ButtonIconProps } from "../ButtonIcon/ButtonIcon.types.mjs";
 import type { HeaderBaseProps } from "../HeaderBase/HeaderBase.types.mjs";
-/**
- * Variant options for BottomSheetHeader component.
- * - Compact: Center-aligned title with HeadingSm text (default)
- * - Display: Left-aligned title with HeadingLg text
- */
-export declare enum BottomSheetHeaderVariant {
-    Display = "display",
-    Compact = "compact"
-}
 /**
  * BottomSheetHeader component props.
  *
- * Extends HeaderBase's props (which extends ViewProps) to inherit standard
- * props such as `testID`, `accessibilityLabel`, and other View props.
+ * Extends HeaderBase's root and title props to inherit standard props such as
+ * `testID`, `accessibilityLabel`, `textProps`, and other View props.
+ * Start and end accessories are controlled internally via `onBack` and
+ * `onClose`, so `startAccessory`, `endAccessory`, `startButtonIconProps`,
+ * and `endButtonIconProps` are not part of this API.
  */
 export type BottomSheetHeaderProps = {
     /**
@@ -38,13 +32,5 @@ export type BottomSheetHeaderProps = {
      * Note: `iconName` and `onPress` are managed internally and excluded.
      */
     closeButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;
-    /**
-     * Variant controlling header alignment and text size.
-     * - Compact: center-aligned with HeadingSm text
-     * - Display: left-aligned with HeadingLg text
-     *
-     * @default BottomSheetHeaderVariant.Compact
-     */
-    variant?: BottomSheetHeaderVariant;
-} & Omit<HeaderBaseProps, 'variant'>;
+} & Omit<HeaderBaseProps, 'startAccessory' | 'endAccessory' | 'startButtonIconProps' | 'endButtonIconProps'>;
 //# sourceMappingURL=BottomSheetHeader.types.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetHeader.types.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AACtE,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AAEtE;;;;GAIG;AACH,oBAAY,wBAAwB;IAClC,OAAO,YAAY;IACnB,OAAO,YAAY;CACpB;AAED;;;;;GAKG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC;IACzE;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC;IAC1E;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,wBAAwB,CAAC;CACpC,GAAG,IAAI,CAAC,eAAe,EAAE,SAAS,CAAC,CAAC"}
+{"version":3,"file":"BottomSheetHeader.types.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AACtE,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AAEtE;;;;;;;;GAQG;AACH,MAAM,MAAM,sBAAsB,GAAG;IACnC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC;IACzE;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC;CAC3E,GAAG,IAAI,CACN,eAAe,EACb,gBAAgB,GAChB,cAAc,GACd,sBAAsB,GACtB,oBAAoB,CACvB,CAAC"}

package/dist/components/BottomSheetHeader/BottomSheetHeader.types.mjs

@@ -1,11 +1,2 @@
-/**
- * Variant options for BottomSheetHeader component.
- * - Compact: Center-aligned title with HeadingSm text (default)
- * - Display: Left-aligned title with HeadingLg text
- */
-export var BottomSheetHeaderVariant;
-(function (BottomSheetHeaderVariant) {
-    BottomSheetHeaderVariant["Display"] = "display";
-    BottomSheetHeaderVariant["Compact"] = "compact";
-})(BottomSheetHeaderVariant || (BottomSheetHeaderVariant = {}));
+export {};
 //# sourceMappingURL=BottomSheetHeader.types.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"BottomSheetHeader.types.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.types.ts"],"names":[],"mappings":"AAGA;;;;GAIG;AACH,MAAM,CAAN,IAAY,wBAGX;AAHD,WAAY,wBAAwB;IAClC,+CAAmB,CAAA;IACnB,+CAAmB,CAAA;AACrB,CAAC,EAHW,wBAAwB,KAAxB,wBAAwB,QAGnC","sourcesContent":["import type { ButtonIconProps } from '../ButtonIcon/ButtonIcon.types';\nimport type { HeaderBaseProps } from '../HeaderBase/HeaderBase.types';\n\n/**\n * Variant options for BottomSheetHeader component.\n * - Compact: Center-aligned title with HeadingSm text (default)\n * - Display: Left-aligned title with HeadingLg text\n */\nexport enum BottomSheetHeaderVariant {\n  Display = 'display',\n  Compact = 'compact',\n}\n\n/**\n * BottomSheetHeader component props.\n *\n * Extends HeaderBase's props (which extends ViewProps) to inherit standard\n * props such as `testID`, `accessibilityLabel`, and other View props.\n */\nexport type BottomSheetHeaderProps = {\n  /**\n   * Callback function triggered when the back button is pressed.\n   * When provided, a back arrow ButtonIcon is rendered as the start accessory.\n   */\n  onBack?: () => void;\n  /**\n   * Props spread to the back ButtonIcon component for additional properties\n   * like `testID` or `accessibilityLabel`. Use this for testing or accessibility purposes.\n   * Note: `iconName` and `onPress` are managed internally and excluded.\n   */\n  backButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;\n  /**\n   * Callback function triggered when the close button is pressed.\n   * When provided, a close ButtonIcon is rendered as the end accessory.\n   */\n  onClose?: () => void;\n  /**\n   * Props spread to the close ButtonIcon component for additional properties\n   * like `testID` or `accessibilityLabel`. Use this for testing or accessibility purposes.\n   * Note: `iconName` and `onPress` are managed internally and excluded.\n   */\n  closeButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;\n  /**\n   * Variant controlling header alignment and text size.\n   * - Compact: center-aligned with HeadingSm text\n   * - Display: left-aligned with HeadingLg text\n   *\n   * @default BottomSheetHeaderVariant.Compact\n   */\n  variant?: BottomSheetHeaderVariant;\n} & Omit<HeaderBaseProps, 'variant'>;\n"]}
+{"version":3,"file":"BottomSheetHeader.types.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/BottomSheetHeader.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconProps } from '../ButtonIcon/ButtonIcon.types';\nimport type { HeaderBaseProps } from '../HeaderBase/HeaderBase.types';\n\n/**\n * BottomSheetHeader component props.\n *\n * Extends HeaderBase's root and title props to inherit standard props such as\n * `testID`, `accessibilityLabel`, `textProps`, and other View props.\n * Start and end accessories are controlled internally via `onBack` and\n * `onClose`, so `startAccessory`, `endAccessory`, `startButtonIconProps`,\n * and `endButtonIconProps` are not part of this API.\n */\nexport type BottomSheetHeaderProps = {\n  /**\n   * Callback function triggered when the back button is pressed.\n   * When provided, a back arrow ButtonIcon is rendered as the start accessory.\n   */\n  onBack?: () => void;\n  /**\n   * Props spread to the back ButtonIcon component for additional properties\n   * like `testID` or `accessibilityLabel`. Use this for testing or accessibility purposes.\n   * Note: `iconName` and `onPress` are managed internally and excluded.\n   */\n  backButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;\n  /**\n   * Callback function triggered when the close button is pressed.\n   * When provided, a close ButtonIcon is rendered as the end accessory.\n   */\n  onClose?: () => void;\n  /**\n   * Props spread to the close ButtonIcon component for additional properties\n   * like `testID` or `accessibilityLabel`. Use this for testing or accessibility purposes.\n   * Note: `iconName` and `onPress` are managed internally and excluded.\n   */\n  closeButtonProps?: Partial<Omit<ButtonIconProps, 'iconName' | 'onPress'>>;\n} & Omit<\n  HeaderBaseProps,\n  | 'startAccessory'\n  | 'endAccessory'\n  | 'startButtonIconProps'\n  | 'endButtonIconProps'\n>;\n"]}

package/dist/components/BottomSheetHeader/index.cjs

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/index.ts"],"names":[],"mappings":";;;AAAA,6DAAwD;AAA/C,sHAAA,iBAAiB,OAAA;AAC1B,yEAAqE;AAA5D,mIAAA,wBAAwB,OAAA","sourcesContent":["export { BottomSheetHeader } from './BottomSheetHeader';\nexport { BottomSheetHeaderVariant } from './BottomSheetHeader.types';\nexport type { BottomSheetHeaderProps } from './BottomSheetHeader.types';\n"]}
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/index.ts"],"names":[],"mappings":";;;AAAA,6DAAwD;AAA/C,sHAAA,iBAAiB,OAAA","sourcesContent":["export { BottomSheetHeader } from './BottomSheetHeader';\nexport type { BottomSheetHeaderProps } from './BottomSheetHeader.types';\n"]}

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

@@ -1,4 +1,3 @@
 export { BottomSheetHeader } from "./BottomSheetHeader.cjs";
-export { BottomSheetHeaderVariant } from "./BottomSheetHeader.types.cjs";
 export type { BottomSheetHeaderProps } from "./BottomSheetHeader.types.cjs";
 //# sourceMappingURL=index.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,gCAA4B;AACxD,OAAO,EAAE,wBAAwB,EAAE,sCAAkC;AACrE,YAAY,EAAE,sBAAsB,EAAE,sCAAkC"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,gCAA4B;AACxD,YAAY,EAAE,sBAAsB,EAAE,sCAAkC"}

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

@@ -1,4 +1,3 @@
 export { BottomSheetHeader } from "./BottomSheetHeader.mjs";
-export { BottomSheetHeaderVariant } from "./BottomSheetHeader.types.mjs";
 export type { BottomSheetHeaderProps } from "./BottomSheetHeader.types.mjs";
 //# sourceMappingURL=index.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,gCAA4B;AACxD,OAAO,EAAE,wBAAwB,EAAE,sCAAkC;AACrE,YAAY,EAAE,sBAAsB,EAAE,sCAAkC"}
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,gCAA4B;AACxD,YAAY,EAAE,sBAAsB,EAAE,sCAAkC"}

package/dist/components/BottomSheetHeader/index.mjs

@@ -1,3 +1,2 @@
 export { BottomSheetHeader } from "./BottomSheetHeader.mjs";
-export { BottomSheetHeaderVariant } from "./BottomSheetHeader.types.mjs";
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,gCAA4B;AACxD,OAAO,EAAE,wBAAwB,EAAE,sCAAkC","sourcesContent":["export { BottomSheetHeader } from './BottomSheetHeader';\nexport { BottomSheetHeaderVariant } from './BottomSheetHeader.types';\nexport type { BottomSheetHeaderProps } from './BottomSheetHeader.types';\n"]}
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetHeader/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,gCAA4B","sourcesContent":["export { BottomSheetHeader } from './BottomSheetHeader';\nexport type { BottomSheetHeaderProps } from './BottomSheetHeader.types';\n"]}

package/dist/components/Content/Content.cjs

@@ -0,0 +1,71 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Content = void 0;
+const design_system_shared_1 = require("@metamask-previews/design-system-shared");
+const react_1 = __importDefault(require("react"));
+const BoxColumn_1 = require("../BoxColumn/index.cjs");
+const BoxRow_1 = require("../BoxRow/index.cjs");
+const TextOrChildren_1 = require("../temp-components/TextOrChildren/index.cjs");
+const Content_constants_1 = require("./Content.constants.cjs");
+const Content = ({ startAccessory, endAccessory, topAccessory, bottomAccessory, verticalAlignment = design_system_shared_1.ContentVerticalAlignment.Center, avatar, twClassName, title, titleProps, titleStartAccessory, titleEndAccessory, description, descriptionProps, descriptionStartAccessory, descriptionEndAccessory, value, valueProps, valueStartAccessory, valueEndAccessory, subvalue, subvalueProps, subvalueStartAccessory, subvalueEndAccessory, ...props }) => {
+    const hasColumnShell = Boolean(topAccessory) || Boolean(bottomAccessory);
+    const contentRow = (<BoxRow_1.BoxRow startAccessory={startAccessory} endAccessory={endAccessory} alignItems={Content_constants_1.VERTICAL_ALIGNMENT_MAP[verticalAlignment]} gap={4} twClassName={`min-h-[46px] ${hasColumnShell ? 'min-w-0' : (twClassName ?? '')}`.trim()} {...(hasColumnShell ? {} : props)}>
+      {avatar}
+      {/* Title and description Column */}
+      <BoxColumn_1.BoxColumn twClassName="flex-1 min-w-0" bottomAccessory={description ? (<BoxRow_1.BoxRow twClassName="w-full" startAccessory={descriptionStartAccessory} endAccessory={descriptionEndAccessory} gap={1}>
+              <TextOrChildren_1.TextOrChildren textProps={{
+                variant: design_system_shared_1.TextVariant.BodySm,
+                fontWeight: design_system_shared_1.FontWeight.Medium,
+                color: design_system_shared_1.TextColor.TextAlternative,
+                ...descriptionProps,
+            }}>
+                {description}
+              </TextOrChildren_1.TextOrChildren>
+            </BoxRow_1.BoxRow>) : null}>
+        {title ? (<BoxRow_1.BoxRow twClassName="w-full" startAccessory={titleStartAccessory} endAccessory={titleEndAccessory} gap={1}>
+            <TextOrChildren_1.TextOrChildren textProps={{
+                variant: design_system_shared_1.TextVariant.BodyMd,
+                fontWeight: design_system_shared_1.FontWeight.Medium,
+                color: design_system_shared_1.TextColor.TextDefault,
+                ...titleProps,
+            }}>
+              {title}
+            </TextOrChildren_1.TextOrChildren>
+          </BoxRow_1.BoxRow>) : null}
+      </BoxColumn_1.BoxColumn>
+      {/* Value and subvalue Column */}
+      {value || subvalue ? (<BoxColumn_1.BoxColumn twClassName="min-w-0" bottomAccessory={subvalue ? (<BoxRow_1.BoxRow twClassName="w-full" startAccessory={subvalueStartAccessory} endAccessory={subvalueEndAccessory} gap={1}>
+                <TextOrChildren_1.TextOrChildren textProps={{
+                    variant: design_system_shared_1.TextVariant.BodySm,
+                    fontWeight: design_system_shared_1.FontWeight.Medium,
+                    color: design_system_shared_1.TextColor.TextAlternative,
+                    ...subvalueProps,
+                }}>
+                  {subvalue}
+                </TextOrChildren_1.TextOrChildren>
+              </BoxRow_1.BoxRow>) : null}>
+          {value ? (<BoxRow_1.BoxRow twClassName="w-full" startAccessory={valueStartAccessory} endAccessory={valueEndAccessory} gap={1}>
+              <TextOrChildren_1.TextOrChildren textProps={{
+                    variant: design_system_shared_1.TextVariant.BodyMd,
+                    fontWeight: design_system_shared_1.FontWeight.Medium,
+                    color: design_system_shared_1.TextColor.TextDefault,
+                    ...valueProps,
+                }}>
+                {value}
+              </TextOrChildren_1.TextOrChildren>
+            </BoxRow_1.BoxRow>) : null}
+        </BoxColumn_1.BoxColumn>) : null}
+    </BoxRow_1.BoxRow>);
+    if (hasColumnShell) {
+        return (<BoxColumn_1.BoxColumn gap={1} topAccessory={topAccessory} bottomAccessory={bottomAccessory} twClassName={twClassName} {...props}>
+        {contentRow}
+      </BoxColumn_1.BoxColumn>);
+    }
+    return contentRow;
+};
+exports.Content = Content;
+exports.Content.displayName = 'Content';
+//# sourceMappingURL=Content.cjs.map

package/dist/components/Content/Content.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Content.cjs","sourceRoot":"","sources":["../../../src/components/Content/Content.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  ContentVerticalAlignment,\n  FontWeight,\n  TextColor,\n  TextVariant,\n} from '@metamask-previews/design-system-shared';\nimport React from 'react';\n\nimport { BoxColumn } from '../BoxColumn';\nimport { BoxRow } from '../BoxRow';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport { VERTICAL_ALIGNMENT_MAP } from './Content.constants';\nimport type { ContentProps } from './Content.types';\n\nexport const Content: React.FC<ContentProps> = ({\n  startAccessory,\n  endAccessory,\n  topAccessory,\n  bottomAccessory,\n  verticalAlignment = ContentVerticalAlignment.Center,\n  avatar,\n  twClassName,\n  title,\n  titleProps,\n  titleStartAccessory,\n  titleEndAccessory,\n  description,\n  descriptionProps,\n  descriptionStartAccessory,\n  descriptionEndAccessory,\n  value,\n  valueProps,\n  valueStartAccessory,\n  valueEndAccessory,\n  subvalue,\n  subvalueProps,\n  subvalueStartAccessory,\n  subvalueEndAccessory,\n  ...props\n}) => {\n  const hasColumnShell = Boolean(topAccessory) || Boolean(bottomAccessory);\n\n  const contentRow = (\n    <BoxRow\n      startAccessory={startAccessory}\n      endAccessory={endAccessory}\n      alignItems={VERTICAL_ALIGNMENT_MAP[verticalAlignment]}\n      gap={4}\n      twClassName={`min-h-[46px] ${hasColumnShell ? 'min-w-0' : (twClassName ?? '')}`.trim()}\n      {...(hasColumnShell ? {} : props)}\n    >\n      {avatar}\n      {/* Title and description Column */}\n      <BoxColumn\n        twClassName=\"flex-1 min-w-0\"\n        bottomAccessory={\n          description ? (\n            <BoxRow\n              twClassName=\"w-full\"\n              startAccessory={descriptionStartAccessory}\n              endAccessory={descriptionEndAccessory}\n              gap={1}\n            >\n              <TextOrChildren\n                textProps={{\n                  variant: TextVariant.BodySm,\n                  fontWeight: FontWeight.Medium,\n                  color: TextColor.TextAlternative,\n                  ...descriptionProps,\n                }}\n              >\n                {description}\n              </TextOrChildren>\n            </BoxRow>\n          ) : null\n        }\n      >\n        {title ? (\n          <BoxRow\n            twClassName=\"w-full\"\n            startAccessory={titleStartAccessory}\n            endAccessory={titleEndAccessory}\n            gap={1}\n          >\n            <TextOrChildren\n              textProps={{\n                variant: TextVariant.BodyMd,\n                fontWeight: FontWeight.Medium,\n                color: TextColor.TextDefault,\n                ...titleProps,\n              }}\n            >\n              {title}\n            </TextOrChildren>\n          </BoxRow>\n        ) : null}\n      </BoxColumn>\n      {/* Value and subvalue Column */}\n      {value || subvalue ? (\n        <BoxColumn\n          twClassName=\"min-w-0\"\n          bottomAccessory={\n            subvalue ? (\n              <BoxRow\n                twClassName=\"w-full\"\n                startAccessory={subvalueStartAccessory}\n                endAccessory={subvalueEndAccessory}\n                gap={1}\n              >\n                <TextOrChildren\n                  textProps={{\n                    variant: TextVariant.BodySm,\n                    fontWeight: FontWeight.Medium,\n                    color: TextColor.TextAlternative,\n                    ...subvalueProps,\n                  }}\n                >\n                  {subvalue}\n                </TextOrChildren>\n              </BoxRow>\n            ) : null\n          }\n        >\n          {value ? (\n            <BoxRow\n              twClassName=\"w-full\"\n              startAccessory={valueStartAccessory}\n              endAccessory={valueEndAccessory}\n              gap={1}\n            >\n              <TextOrChildren\n                textProps={{\n                  variant: TextVariant.BodyMd,\n                  fontWeight: FontWeight.Medium,\n                  color: TextColor.TextDefault,\n                  ...valueProps,\n                }}\n              >\n                {value}\n              </TextOrChildren>\n            </BoxRow>\n          ) : null}\n        </BoxColumn>\n      ) : null}\n    </BoxRow>\n  );\n\n  if (hasColumnShell) {\n    return (\n      <BoxColumn\n        gap={1}\n        topAccessory={topAccessory}\n        bottomAccessory={bottomAccessory}\n        twClassName={twClassName}\n        {...props}\n      >\n        {contentRow}\n      </BoxColumn>\n    );\n  }\n\n  return contentRow;\n};\n\nContent.displayName = 'Content';\n"]}

package/dist/components/Content/Content.constants.cjs

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VERTICAL_ALIGNMENT_MAP = void 0;
+const design_system_shared_1 = require("@metamask-previews/design-system-shared");
+exports.VERTICAL_ALIGNMENT_MAP = {
+    [design_system_shared_1.ContentVerticalAlignment.Top]: design_system_shared_1.BoxAlignItems.Start,
+    [design_system_shared_1.ContentVerticalAlignment.Center]: design_system_shared_1.BoxAlignItems.Center,
+};
+//# sourceMappingURL=Content.constants.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Content.constants.cjs","sourceRoot":"","sources":["../../../src/components/Content/Content.constants.ts"],"names":[],"mappings":";;;AAAA,kFAGiD;AAEpC,QAAA,sBAAsB,GAG/B;IACF,CAAC,+CAAwB,CAAC,GAAG,CAAC,EAAE,oCAAa,CAAC,KAAK;IACnD,CAAC,+CAAwB,CAAC,MAAM,CAAC,EAAE,oCAAa,CAAC,MAAM;CACxD,CAAC","sourcesContent":["import {\n  BoxAlignItems,\n  ContentVerticalAlignment,\n} from '@metamask-previews/design-system-shared';\n\nexport const VERTICAL_ALIGNMENT_MAP: Record<\n  ContentVerticalAlignment,\n  BoxAlignItems\n> = {\n  [ContentVerticalAlignment.Top]: BoxAlignItems.Start,\n  [ContentVerticalAlignment.Center]: BoxAlignItems.Center,\n};\n"]}

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

@@ -0,0 +1,3 @@
+import { BoxAlignItems, ContentVerticalAlignment } from "@metamask-previews/design-system-shared";
+export declare const VERTICAL_ALIGNMENT_MAP: Record<ContentVerticalAlignment, BoxAlignItems>;
+//# sourceMappingURL=Content.constants.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Content.constants.d.cts","sourceRoot":"","sources":["../../../src/components/Content/Content.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EACb,wBAAwB,EACzB,gDAAgD;AAEjD,eAAO,MAAM,sBAAsB,EAAE,MAAM,CACzC,wBAAwB,EACxB,aAAa,CAId,CAAC"}

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

@@ -0,0 +1,3 @@
+import { BoxAlignItems, ContentVerticalAlignment } from "@metamask-previews/design-system-shared";
+export declare const VERTICAL_ALIGNMENT_MAP: Record<ContentVerticalAlignment, BoxAlignItems>;
+//# sourceMappingURL=Content.constants.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Content.constants.d.mts","sourceRoot":"","sources":["../../../src/components/Content/Content.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EACb,wBAAwB,EACzB,gDAAgD;AAEjD,eAAO,MAAM,sBAAsB,EAAE,MAAM,CACzC,wBAAwB,EACxB,aAAa,CAId,CAAC"}

package/dist/components/Content/Content.constants.mjs

@@ -0,0 +1,6 @@
+import { BoxAlignItems, ContentVerticalAlignment } from "@metamask-previews/design-system-shared";
+export const VERTICAL_ALIGNMENT_MAP = {
+    [ContentVerticalAlignment.Top]: BoxAlignItems.Start,
+    [ContentVerticalAlignment.Center]: BoxAlignItems.Center,
+};
+//# sourceMappingURL=Content.constants.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Content.constants.mjs","sourceRoot":"","sources":["../../../src/components/Content/Content.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EACb,wBAAwB,EACzB,gDAAgD;AAEjD,MAAM,CAAC,MAAM,sBAAsB,GAG/B;IACF,CAAC,wBAAwB,CAAC,GAAG,CAAC,EAAE,aAAa,CAAC,KAAK;IACnD,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,aAAa,CAAC,MAAM;CACxD,CAAC","sourcesContent":["import {\n  BoxAlignItems,\n  ContentVerticalAlignment,\n} from '@metamask-previews/design-system-shared';\n\nexport const VERTICAL_ALIGNMENT_MAP: Record<\n  ContentVerticalAlignment,\n  BoxAlignItems\n> = {\n  [ContentVerticalAlignment.Top]: BoxAlignItems.Start,\n  [ContentVerticalAlignment.Center]: BoxAlignItems.Center,\n};\n"]}

package/dist/components/Content/Content.d.cts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ContentProps } from "./Content.types.cjs";
+export declare const Content: React.FC<ContentProps>;
+//# sourceMappingURL=Content.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Content.d.cts","sourceRoot":"","sources":["../../../src/components/Content/Content.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,YAAY,EAAE,4BAAwB;AAEpD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAoJ1C,CAAC"}

package/dist/components/Content/Content.d.mts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ContentProps } from "./Content.types.mjs";
+export declare const Content: React.FC<ContentProps>;
+//# sourceMappingURL=Content.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Content.d.mts","sourceRoot":"","sources":["../../../src/components/Content/Content.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,cAAc;AAO1B,OAAO,KAAK,EAAE,YAAY,EAAE,4BAAwB;AAEpD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAoJ1C,CAAC"}

package/dist/components/Content/Content.mjs

@@ -0,0 +1,71 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+import { ContentVerticalAlignment, FontWeight, TextColor, TextVariant } from "@metamask-previews/design-system-shared";
+import $React from "react";
+const React = $importDefault($React);
+import { BoxColumn } from "../BoxColumn/index.mjs";
+import { BoxRow } from "../BoxRow/index.mjs";
+import { TextOrChildren } from "../temp-components/TextOrChildren/index.mjs";
+import { VERTICAL_ALIGNMENT_MAP } from "./Content.constants.mjs";
+export const Content = ({ startAccessory, endAccessory, topAccessory, bottomAccessory, verticalAlignment = ContentVerticalAlignment.Center, avatar, twClassName, title, titleProps, titleStartAccessory, titleEndAccessory, description, descriptionProps, descriptionStartAccessory, descriptionEndAccessory, value, valueProps, valueStartAccessory, valueEndAccessory, subvalue, subvalueProps, subvalueStartAccessory, subvalueEndAccessory, ...props }) => {
+    const hasColumnShell = Boolean(topAccessory) || Boolean(bottomAccessory);
+    const contentRow = (<BoxRow startAccessory={startAccessory} endAccessory={endAccessory} alignItems={VERTICAL_ALIGNMENT_MAP[verticalAlignment]} gap={4} twClassName={`min-h-[46px] ${hasColumnShell ? 'min-w-0' : (twClassName ?? '')}`.trim()} {...(hasColumnShell ? {} : props)}>
+      {avatar}
+      {/* Title and description Column */}
+      <BoxColumn twClassName="flex-1 min-w-0" bottomAccessory={description ? (<BoxRow twClassName="w-full" startAccessory={descriptionStartAccessory} endAccessory={descriptionEndAccessory} gap={1}>
+              <TextOrChildren textProps={{
+                variant: TextVariant.BodySm,
+                fontWeight: FontWeight.Medium,
+                color: TextColor.TextAlternative,
+                ...descriptionProps,
+            }}>
+                {description}
+              </TextOrChildren>
+            </BoxRow>) : null}>
+        {title ? (<BoxRow twClassName="w-full" startAccessory={titleStartAccessory} endAccessory={titleEndAccessory} gap={1}>
+            <TextOrChildren textProps={{
+                variant: TextVariant.BodyMd,
+                fontWeight: FontWeight.Medium,
+                color: TextColor.TextDefault,
+                ...titleProps,
+            }}>
+              {title}
+            </TextOrChildren>
+          </BoxRow>) : null}
+      </BoxColumn>
+      {/* Value and subvalue Column */}
+      {value || subvalue ? (<BoxColumn twClassName="min-w-0" bottomAccessory={subvalue ? (<BoxRow twClassName="w-full" startAccessory={subvalueStartAccessory} endAccessory={subvalueEndAccessory} gap={1}>
+                <TextOrChildren textProps={{
+                    variant: TextVariant.BodySm,
+                    fontWeight: FontWeight.Medium,
+                    color: TextColor.TextAlternative,
+                    ...subvalueProps,
+                }}>
+                  {subvalue}
+                </TextOrChildren>
+              </BoxRow>) : null}>
+          {value ? (<BoxRow twClassName="w-full" startAccessory={valueStartAccessory} endAccessory={valueEndAccessory} gap={1}>
+              <TextOrChildren textProps={{
+                    variant: TextVariant.BodyMd,
+                    fontWeight: FontWeight.Medium,
+                    color: TextColor.TextDefault,
+                    ...valueProps,
+                }}>
+                {value}
+              </TextOrChildren>
+            </BoxRow>) : null}
+        </BoxColumn>) : null}
+    </BoxRow>);
+    if (hasColumnShell) {
+        return (<BoxColumn gap={1} topAccessory={topAccessory} bottomAccessory={bottomAccessory} twClassName={twClassName} {...props}>
+        {contentRow}
+      </BoxColumn>);
+    }
+    return contentRow;
+};
+Content.displayName = 'Content';
+//# sourceMappingURL=Content.mjs.map

package/dist/components/Content/Content.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Content.mjs","sourceRoot":"","sources":["../../../src/components/Content/Content.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  ContentVerticalAlignment,\n  FontWeight,\n  TextColor,\n  TextVariant,\n} from '@metamask-previews/design-system-shared';\nimport React from 'react';\n\nimport { BoxColumn } from '../BoxColumn';\nimport { BoxRow } from '../BoxRow';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\n\nimport { VERTICAL_ALIGNMENT_MAP } from './Content.constants';\nimport type { ContentProps } from './Content.types';\n\nexport const Content: React.FC<ContentProps> = ({\n  startAccessory,\n  endAccessory,\n  topAccessory,\n  bottomAccessory,\n  verticalAlignment = ContentVerticalAlignment.Center,\n  avatar,\n  twClassName,\n  title,\n  titleProps,\n  titleStartAccessory,\n  titleEndAccessory,\n  description,\n  descriptionProps,\n  descriptionStartAccessory,\n  descriptionEndAccessory,\n  value,\n  valueProps,\n  valueStartAccessory,\n  valueEndAccessory,\n  subvalue,\n  subvalueProps,\n  subvalueStartAccessory,\n  subvalueEndAccessory,\n  ...props\n}) => {\n  const hasColumnShell = Boolean(topAccessory) || Boolean(bottomAccessory);\n\n  const contentRow = (\n    <BoxRow\n      startAccessory={startAccessory}\n      endAccessory={endAccessory}\n      alignItems={VERTICAL_ALIGNMENT_MAP[verticalAlignment]}\n      gap={4}\n      twClassName={`min-h-[46px] ${hasColumnShell ? 'min-w-0' : (twClassName ?? '')}`.trim()}\n      {...(hasColumnShell ? {} : props)}\n    >\n      {avatar}\n      {/* Title and description Column */}\n      <BoxColumn\n        twClassName=\"flex-1 min-w-0\"\n        bottomAccessory={\n          description ? (\n            <BoxRow\n              twClassName=\"w-full\"\n              startAccessory={descriptionStartAccessory}\n              endAccessory={descriptionEndAccessory}\n              gap={1}\n            >\n              <TextOrChildren\n                textProps={{\n                  variant: TextVariant.BodySm,\n                  fontWeight: FontWeight.Medium,\n                  color: TextColor.TextAlternative,\n                  ...descriptionProps,\n                }}\n              >\n                {description}\n              </TextOrChildren>\n            </BoxRow>\n          ) : null\n        }\n      >\n        {title ? (\n          <BoxRow\n            twClassName=\"w-full\"\n            startAccessory={titleStartAccessory}\n            endAccessory={titleEndAccessory}\n            gap={1}\n          >\n            <TextOrChildren\n              textProps={{\n                variant: TextVariant.BodyMd,\n                fontWeight: FontWeight.Medium,\n                color: TextColor.TextDefault,\n                ...titleProps,\n              }}\n            >\n              {title}\n            </TextOrChildren>\n          </BoxRow>\n        ) : null}\n      </BoxColumn>\n      {/* Value and subvalue Column */}\n      {value || subvalue ? (\n        <BoxColumn\n          twClassName=\"min-w-0\"\n          bottomAccessory={\n            subvalue ? (\n              <BoxRow\n                twClassName=\"w-full\"\n                startAccessory={subvalueStartAccessory}\n                endAccessory={subvalueEndAccessory}\n                gap={1}\n              >\n                <TextOrChildren\n                  textProps={{\n                    variant: TextVariant.BodySm,\n                    fontWeight: FontWeight.Medium,\n                    color: TextColor.TextAlternative,\n                    ...subvalueProps,\n                  }}\n                >\n                  {subvalue}\n                </TextOrChildren>\n              </BoxRow>\n            ) : null\n          }\n        >\n          {value ? (\n            <BoxRow\n              twClassName=\"w-full\"\n              startAccessory={valueStartAccessory}\n              endAccessory={valueEndAccessory}\n              gap={1}\n            >\n              <TextOrChildren\n                textProps={{\n                  variant: TextVariant.BodyMd,\n                  fontWeight: FontWeight.Medium,\n                  color: TextColor.TextDefault,\n                  ...valueProps,\n                }}\n              >\n                {value}\n              </TextOrChildren>\n            </BoxRow>\n          ) : null}\n        </BoxColumn>\n      ) : null}\n    </BoxRow>\n  );\n\n  if (hasColumnShell) {\n    return (\n      <BoxColumn\n        gap={1}\n        topAccessory={topAccessory}\n        bottomAccessory={bottomAccessory}\n        twClassName={twClassName}\n        {...props}\n      >\n        {contentRow}\n      </BoxColumn>\n    );\n  }\n\n  return contentRow;\n};\n\nContent.displayName = 'Content';\n"]}

package/dist/components/Content/Content.types.cjs

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