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

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

@@ -0,0 +1,38 @@
+import type { TagPropsShared } from "@metamask/design-system-shared";
+import type { ViewProps, StyleProp, ViewStyle } from "react-native/index.js";
+import type { IconName, IconProps } from "../Icon/index.mjs";
+/**
+ * Tag component props (React Native platform-specific).
+ * Extends shared props from @metamask/design-system-shared with React Native specific platform concerns.
+ */
+export type TagProps = TagPropsShared & {
+    /**
+     * Optional prop to specify an icon to show at the start of the tag (`IconSize.Xs` unless overridden in `startIconProps`).
+     */
+    startIconName?: IconName;
+    /**
+     * Optional prop to pass additional properties to the start icon. You may set `name` here instead of `startIconName`.
+     */
+    startIconProps?: Partial<IconProps>;
+    /**
+     * Optional prop to specify an icon to show at the end of the tag (`IconSize.Xs` unless overridden in `endIconProps`).
+     */
+    endIconName?: IconName;
+    /**
+     * Optional prop to pass additional properties to the end icon. You may set `name` here instead of `endIconName`.
+     */
+    endIconProps?: Partial<IconProps>;
+    /**
+     * Additional Tailwind classes to be applied to the Tag container.
+     */
+    twClassName?: string;
+    /**
+     * Test identifier for selecting the component in tests.
+     */
+    testID?: string;
+    /**
+     * Optional container styles.
+     */
+    style?: StyleProp<ViewStyle>;
+} & Omit<ViewProps, 'children' | 'style'>;
+//# sourceMappingURL=Tag.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.types.d.mts","sourceRoot":"","sources":["../../../src/components/Tag/Tag.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,uCAAuC;AACrE,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,8BAAqB;AAEpE,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,0BAAgB;AAEnD;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG,cAAc,GAAG;IACtC;;OAEG;IACH,aAAa,CAAC,EAAE,QAAQ,CAAC;IACzB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,QAAQ,CAAC;IACvB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAClC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC"}

package/dist/components/Tag/Tag.types.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.types.mjs","sourceRoot":"","sources":["../../../src/components/Tag/Tag.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { TagPropsShared } from '@metamask/design-system-shared';\nimport type { ViewProps, StyleProp, ViewStyle } from 'react-native';\n\nimport type { IconName, IconProps } from '../Icon';\n\n/**\n * Tag component props (React Native platform-specific).\n * Extends shared props from @metamask/design-system-shared with React Native specific platform concerns.\n */\nexport type TagProps = TagPropsShared & {\n  /**\n   * Optional prop to specify an icon to show at the start of the tag (`IconSize.Xs` unless overridden in `startIconProps`).\n   */\n  startIconName?: IconName;\n  /**\n   * Optional prop to pass additional properties to the start icon. You may set `name` here instead of `startIconName`.\n   */\n  startIconProps?: Partial<IconProps>;\n  /**\n   * Optional prop to specify an icon to show at the end of the tag (`IconSize.Xs` unless overridden in `endIconProps`).\n   */\n  endIconName?: IconName;\n  /**\n   * Optional prop to pass additional properties to the end icon. You may set `name` here instead of `endIconName`.\n   */\n  endIconProps?: Partial<IconProps>;\n  /**\n   * Additional Tailwind classes to be applied to the Tag container.\n   */\n  twClassName?: string;\n  /**\n   * Test identifier for selecting the component in tests.\n   */\n  testID?: string;\n  /**\n   * Optional container styles.\n   */\n  style?: StyleProp<ViewStyle>;\n} & Omit<ViewProps, 'children' | 'style'>;\n"]}

package/dist/components/Tag/index.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/Tag/index.ts"],"names":[],"mappings":";;;AAAA,iCAA4B;AAAnB,0FAAA,GAAG,OAAA;AACZ,uEAA6D;AAApD,mHAAA,WAAW,OAAA","sourcesContent":["export { Tag } from './Tag';\nexport { TagSeverity } from '@metamask/design-system-shared';\nexport type { TagProps } from './Tag.types';\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Tag/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,kBAAc;AAC5B,OAAO,EAAE,WAAW,EAAE,uCAAuC;AAC7D,YAAY,EAAE,QAAQ,EAAE,wBAAoB"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/Tag/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,kBAAc;AAC5B,OAAO,EAAE,WAAW,EAAE,uCAAuC;AAC7D,YAAY,EAAE,QAAQ,EAAE,wBAAoB"}

package/dist/components/Tag/index.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/Tag/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,kBAAc;AAC5B,OAAO,EAAE,WAAW,EAAE,uCAAuC","sourcesContent":["export { Tag } from './Tag';\nexport { TagSeverity } from '@metamask/design-system-shared';\nexport type { TagProps } from './Tag.types';\n"]}

package/dist/components/TitleStandard/TitleStandard.cjs

@@ -0,0 +1,58 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TitleStandard = void 0;
+// Third party dependencies.
+const design_system_shared_1 = require("@metamask/design-system-shared");
+const react_1 = __importDefault(require("react"));
+// Internal dependencies.
+const Box_1 = require("../Box/index.cjs");
+const BoxRow_1 = require("../BoxRow/index.cjs");
+/**
+ * Displays a primary title with optional top, inline, and bottom rows in a left-aligned layout.
+ * Remaining `View` props are forwarded to the root `Box`.
+ *
+ * @param props - Component props
+ * @param props.title - Primary title content
+ * @param props.titleEndAccessory - Optional inline accessory to the right of the title
+ * @param props.topAccessory - Optional row above the title
+ * @param props.bottomAccessory - Optional custom bottom row when `bottomLabel` is not renderable
+ * @param props.bottomLabel - Optional secondary label below the title
+ * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of the bottom label
+ * @param props.titleProps - Optional props merged into title `Text` when `title` is a string
+ * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string
+ * @param props.titleWrapperProps - Optional props forwarded to the title row `BoxRow`
+ * @param props.bottomLabelWrapperProps - Optional props forwarded to the bottom label row `BoxRow`
+ * @param props.twClassName - Optional Tailwind classes on the root container
+ *
+ * @returns The rendered TitleStandard layout.
+ */
+const TitleStandard = ({ title, titleEndAccessory, topAccessory, bottomAccessory, bottomLabel, bottomLabelEndAccessory, titleProps, titleWrapperProps, bottomLabelProps, bottomLabelWrapperProps, twClassName = '', ...props }) => {
+    return (<Box_1.Box twClassName={twClassName} gap={1} {...props}>
+      {/* Top Accessory Slot */}
+      {topAccessory}
+      {/* Title Row */}
+      <BoxRow_1.BoxRow gap={2} {...titleWrapperProps} endAccessory={titleEndAccessory} textProps={{
+            variant: design_system_shared_1.TextVariant.HeadingLg,
+            ...titleProps,
+        }}>
+        {title}
+      </BoxRow_1.BoxRow>
+      {/* Bottom Label Row */}
+      {bottomLabel && (<BoxRow_1.BoxRow gap={2} {...bottomLabelWrapperProps} endAccessory={bottomLabelEndAccessory} textProps={{
+                variant: design_system_shared_1.TextVariant.BodySm,
+                fontWeight: design_system_shared_1.FontWeight.Medium,
+                color: design_system_shared_1.TextColor.TextAlternative,
+                ...bottomLabelProps,
+            }}>
+          {bottomLabel}
+        </BoxRow_1.BoxRow>)}
+      {/* Bottom Accessory Slot */}
+      {!bottomLabel && bottomAccessory}
+    </Box_1.Box>);
+};
+exports.TitleStandard = TitleStandard;
+exports.TitleStandard.displayName = 'TitleStandard';
+//# sourceMappingURL=TitleStandard.cjs.map

package/dist/components/TitleStandard/TitleStandard.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TitleStandard.cjs","sourceRoot":"","sources":["../../../src/components/TitleStandard/TitleStandard.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,yEAIwC;AACxC,kDAA0B;AAE1B,yBAAyB;AACzB,0CAA6B;AAC7B,gDAAmC;AAInC;;;;;;;;;;;;;;;;;;GAkBG;AACI,MAAM,aAAa,GAAiC,CAAC,EAC1D,KAAK,EACL,iBAAiB,EACjB,YAAY,EACZ,eAAe,EACf,WAAW,EACX,uBAAuB,EACvB,UAAU,EACV,iBAAiB,EACjB,gBAAgB,EAChB,uBAAuB,EACvB,WAAW,GAAG,EAAE,EAChB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,CAAC,SAAG,CAAC,WAAW,CAAC,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAC/C;MAAA,CAAC,wBAAwB,CACzB;MAAA,CAAC,YAAY,CACb;MAAA,CAAC,eAAe,CAChB;MAAA,CAAC,eAAM,CACL,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,IAAI,iBAAiB,CAAC,CACtB,YAAY,CAAC,CAAC,iBAAiB,CAAC,CAChC,SAAS,CAAC,CAAC;YACT,OAAO,EAAE,kCAAW,CAAC,SAAS;YAC9B,GAAG,UAAU;SACd,CAAC,CAEF;QAAA,CAAC,KAAK,CACR;MAAA,EAAE,eAAM,CACR;MAAA,CAAC,sBAAsB,CACvB;MAAA,CAAC,WAAW,IAAI,CACd,CAAC,eAAM,CACL,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,IAAI,uBAAuB,CAAC,CAC5B,YAAY,CAAC,CAAC,uBAAuB,CAAC,CACtC,SAAS,CAAC,CAAC;gBACT,OAAO,EAAE,kCAAW,CAAC,MAAM;gBAC3B,UAAU,EAAE,iCAAU,CAAC,MAAM;gBAC7B,KAAK,EAAE,gCAAS,CAAC,eAAe;gBAChC,GAAG,gBAAgB;aACpB,CAAC,CAEF;UAAA,CAAC,WAAW,CACd;QAAA,EAAE,eAAM,CAAC,CACV,CACD;MAAA,CAAC,2BAA2B,CAC5B;MAAA,CAAC,CAAC,WAAW,IAAI,eAAe,CAClC;IAAA,EAAE,SAAG,CAAC,CACP,CAAC;AACJ,CAAC,CAAC;AAlDW,QAAA,aAAa,iBAkDxB;AAEF,qBAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["// Third party dependencies.\nimport {\n  FontWeight,\n  TextColor,\n  TextVariant,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\n// Internal dependencies.\nimport { Box } from '../Box';\nimport { BoxRow } from '../BoxRow';\n\nimport type { TitleStandardProps } from './TitleStandard.types';\n\n/**\n * Displays a primary title with optional top, inline, and bottom rows in a left-aligned layout.\n * Remaining `View` props are forwarded to the root `Box`.\n *\n * @param props - Component props\n * @param props.title - Primary title content\n * @param props.titleEndAccessory - Optional inline accessory to the right of the title\n * @param props.topAccessory - Optional row above the title\n * @param props.bottomAccessory - Optional custom bottom row when `bottomLabel` is not renderable\n * @param props.bottomLabel - Optional secondary label below the title\n * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of the bottom label\n * @param props.titleProps - Optional props merged into title `Text` when `title` is a string\n * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string\n * @param props.titleWrapperProps - Optional props forwarded to the title row `BoxRow`\n * @param props.bottomLabelWrapperProps - Optional props forwarded to the bottom label row `BoxRow`\n * @param props.twClassName - Optional Tailwind classes on the root container\n *\n * @returns The rendered TitleStandard layout.\n */\nexport const TitleStandard: React.FC<TitleStandardProps> = ({\n  title,\n  titleEndAccessory,\n  topAccessory,\n  bottomAccessory,\n  bottomLabel,\n  bottomLabelEndAccessory,\n  titleProps,\n  titleWrapperProps,\n  bottomLabelProps,\n  bottomLabelWrapperProps,\n  twClassName = '',\n  ...props\n}) => {\n  return (\n    <Box twClassName={twClassName} gap={1} {...props}>\n      {/* Top Accessory Slot */}\n      {topAccessory}\n      {/* Title Row */}\n      <BoxRow\n        gap={2}\n        {...titleWrapperProps}\n        endAccessory={titleEndAccessory}\n        textProps={{\n          variant: TextVariant.HeadingLg,\n          ...titleProps,\n        }}\n      >\n        {title}\n      </BoxRow>\n      {/* Bottom Label Row */}\n      {bottomLabel && (\n        <BoxRow\n          gap={2}\n          {...bottomLabelWrapperProps}\n          endAccessory={bottomLabelEndAccessory}\n          textProps={{\n            variant: TextVariant.BodySm,\n            fontWeight: FontWeight.Medium,\n            color: TextColor.TextAlternative,\n            ...bottomLabelProps,\n          }}\n        >\n          {bottomLabel}\n        </BoxRow>\n      )}\n      {/* Bottom Accessory Slot */}\n      {!bottomLabel && bottomAccessory}\n    </Box>\n  );\n};\n\nTitleStandard.displayName = 'TitleStandard';\n"]}

package/dist/components/TitleStandard/TitleStandard.d.cts

@@ -0,0 +1,23 @@
+import React from "react";
+import type { TitleStandardProps } from "./TitleStandard.types.cjs";
+/**
+ * Displays a primary title with optional top, inline, and bottom rows in a left-aligned layout.
+ * Remaining `View` props are forwarded to the root `Box`.
+ *
+ * @param props - Component props
+ * @param props.title - Primary title content
+ * @param props.titleEndAccessory - Optional inline accessory to the right of the title
+ * @param props.topAccessory - Optional row above the title
+ * @param props.bottomAccessory - Optional custom bottom row when `bottomLabel` is not renderable
+ * @param props.bottomLabel - Optional secondary label below the title
+ * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of the bottom label
+ * @param props.titleProps - Optional props merged into title `Text` when `title` is a string
+ * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string
+ * @param props.titleWrapperProps - Optional props forwarded to the title row `BoxRow`
+ * @param props.bottomLabelWrapperProps - Optional props forwarded to the bottom label row `BoxRow`
+ * @param props.twClassName - Optional Tailwind classes on the root container
+ *
+ * @returns The rendered TitleStandard layout.
+ */
+export declare const TitleStandard: React.FC<TitleStandardProps>;
+//# sourceMappingURL=TitleStandard.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TitleStandard.d.cts","sourceRoot":"","sources":["../../../src/components/TitleStandard/TitleStandard.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,cAAc;AAM1B,OAAO,KAAK,EAAE,kBAAkB,EAAE,kCAA8B;AAEhE;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAkDtD,CAAC"}

package/dist/components/TitleStandard/TitleStandard.d.mts

@@ -0,0 +1,23 @@
+import React from "react";
+import type { TitleStandardProps } from "./TitleStandard.types.mjs";
+/**
+ * Displays a primary title with optional top, inline, and bottom rows in a left-aligned layout.
+ * Remaining `View` props are forwarded to the root `Box`.
+ *
+ * @param props - Component props
+ * @param props.title - Primary title content
+ * @param props.titleEndAccessory - Optional inline accessory to the right of the title
+ * @param props.topAccessory - Optional row above the title
+ * @param props.bottomAccessory - Optional custom bottom row when `bottomLabel` is not renderable
+ * @param props.bottomLabel - Optional secondary label below the title
+ * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of the bottom label
+ * @param props.titleProps - Optional props merged into title `Text` when `title` is a string
+ * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string
+ * @param props.titleWrapperProps - Optional props forwarded to the title row `BoxRow`
+ * @param props.bottomLabelWrapperProps - Optional props forwarded to the bottom label row `BoxRow`
+ * @param props.twClassName - Optional Tailwind classes on the root container
+ *
+ * @returns The rendered TitleStandard layout.
+ */
+export declare const TitleStandard: React.FC<TitleStandardProps>;
+//# sourceMappingURL=TitleStandard.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TitleStandard.d.mts","sourceRoot":"","sources":["../../../src/components/TitleStandard/TitleStandard.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,cAAc;AAM1B,OAAO,KAAK,EAAE,kBAAkB,EAAE,kCAA8B;AAEhE;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAkDtD,CAAC"}

package/dist/components/TitleStandard/TitleStandard.mjs

@@ -0,0 +1,58 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+// Third party dependencies.
+import { FontWeight, TextColor, TextVariant } from "@metamask/design-system-shared";
+import $React from "react";
+const React = $importDefault($React);
+// Internal dependencies.
+import { Box } from "../Box/index.mjs";
+import { BoxRow } from "../BoxRow/index.mjs";
+/**
+ * Displays a primary title with optional top, inline, and bottom rows in a left-aligned layout.
+ * Remaining `View` props are forwarded to the root `Box`.
+ *
+ * @param props - Component props
+ * @param props.title - Primary title content
+ * @param props.titleEndAccessory - Optional inline accessory to the right of the title
+ * @param props.topAccessory - Optional row above the title
+ * @param props.bottomAccessory - Optional custom bottom row when `bottomLabel` is not renderable
+ * @param props.bottomLabel - Optional secondary label below the title
+ * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of the bottom label
+ * @param props.titleProps - Optional props merged into title `Text` when `title` is a string
+ * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string
+ * @param props.titleWrapperProps - Optional props forwarded to the title row `BoxRow`
+ * @param props.bottomLabelWrapperProps - Optional props forwarded to the bottom label row `BoxRow`
+ * @param props.twClassName - Optional Tailwind classes on the root container
+ *
+ * @returns The rendered TitleStandard layout.
+ */
+export const TitleStandard = ({ title, titleEndAccessory, topAccessory, bottomAccessory, bottomLabel, bottomLabelEndAccessory, titleProps, titleWrapperProps, bottomLabelProps, bottomLabelWrapperProps, twClassName = '', ...props }) => {
+    return (<Box twClassName={twClassName} gap={1} {...props}>
+      {/* Top Accessory Slot */}
+      {topAccessory}
+      {/* Title Row */}
+      <BoxRow gap={2} {...titleWrapperProps} endAccessory={titleEndAccessory} textProps={{
+            variant: TextVariant.HeadingLg,
+            ...titleProps,
+        }}>
+        {title}
+      </BoxRow>
+      {/* Bottom Label Row */}
+      {bottomLabel && (<BoxRow gap={2} {...bottomLabelWrapperProps} endAccessory={bottomLabelEndAccessory} textProps={{
+                variant: TextVariant.BodySm,
+                fontWeight: FontWeight.Medium,
+                color: TextColor.TextAlternative,
+                ...bottomLabelProps,
+            }}>
+          {bottomLabel}
+        </BoxRow>)}
+      {/* Bottom Accessory Slot */}
+      {!bottomLabel && bottomAccessory}
+    </Box>);
+};
+TitleStandard.displayName = 'TitleStandard';
+//# sourceMappingURL=TitleStandard.mjs.map

package/dist/components/TitleStandard/TitleStandard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TitleStandard.mjs","sourceRoot":"","sources":["../../../src/components/TitleStandard/TitleStandard.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,OAAO,EACL,UAAU,EACV,SAAS,EACT,WAAW,EACZ,uCAAuC;AACxC,OAAO,MAAK,cAAc;;AAE1B,yBAAyB;AACzB,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,MAAM,EAAE,4BAAkB;AAInC;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAC1D,KAAK,EACL,iBAAiB,EACjB,YAAY,EACZ,eAAe,EACf,WAAW,EACX,uBAAuB,EACvB,UAAU,EACV,iBAAiB,EACjB,gBAAgB,EAChB,uBAAuB,EACvB,WAAW,GAAG,EAAE,EAChB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAC/C;MAAA,CAAC,wBAAwB,CACzB;MAAA,CAAC,YAAY,CACb;MAAA,CAAC,eAAe,CAChB;MAAA,CAAC,MAAM,CACL,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,IAAI,iBAAiB,CAAC,CACtB,YAAY,CAAC,CAAC,iBAAiB,CAAC,CAChC,SAAS,CAAC,CAAC;YACT,OAAO,EAAE,WAAW,CAAC,SAAS;YAC9B,GAAG,UAAU;SACd,CAAC,CAEF;QAAA,CAAC,KAAK,CACR;MAAA,EAAE,MAAM,CACR;MAAA,CAAC,sBAAsB,CACvB;MAAA,CAAC,WAAW,IAAI,CACd,CAAC,MAAM,CACL,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,IAAI,uBAAuB,CAAC,CAC5B,YAAY,CAAC,CAAC,uBAAuB,CAAC,CACtC,SAAS,CAAC,CAAC;gBACT,OAAO,EAAE,WAAW,CAAC,MAAM;gBAC3B,UAAU,EAAE,UAAU,CAAC,MAAM;gBAC7B,KAAK,EAAE,SAAS,CAAC,eAAe;gBAChC,GAAG,gBAAgB;aACpB,CAAC,CAEF;UAAA,CAAC,WAAW,CACd;QAAA,EAAE,MAAM,CAAC,CACV,CACD;MAAA,CAAC,2BAA2B,CAC5B;MAAA,CAAC,CAAC,WAAW,IAAI,eAAe,CAClC;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["// Third party dependencies.\nimport {\n  FontWeight,\n  TextColor,\n  TextVariant,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\n// Internal dependencies.\nimport { Box } from '../Box';\nimport { BoxRow } from '../BoxRow';\n\nimport type { TitleStandardProps } from './TitleStandard.types';\n\n/**\n * Displays a primary title with optional top, inline, and bottom rows in a left-aligned layout.\n * Remaining `View` props are forwarded to the root `Box`.\n *\n * @param props - Component props\n * @param props.title - Primary title content\n * @param props.titleEndAccessory - Optional inline accessory to the right of the title\n * @param props.topAccessory - Optional row above the title\n * @param props.bottomAccessory - Optional custom bottom row when `bottomLabel` is not renderable\n * @param props.bottomLabel - Optional secondary label below the title\n * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of the bottom label\n * @param props.titleProps - Optional props merged into title `Text` when `title` is a string\n * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string\n * @param props.titleWrapperProps - Optional props forwarded to the title row `BoxRow`\n * @param props.bottomLabelWrapperProps - Optional props forwarded to the bottom label row `BoxRow`\n * @param props.twClassName - Optional Tailwind classes on the root container\n *\n * @returns The rendered TitleStandard layout.\n */\nexport const TitleStandard: React.FC<TitleStandardProps> = ({\n  title,\n  titleEndAccessory,\n  topAccessory,\n  bottomAccessory,\n  bottomLabel,\n  bottomLabelEndAccessory,\n  titleProps,\n  titleWrapperProps,\n  bottomLabelProps,\n  bottomLabelWrapperProps,\n  twClassName = '',\n  ...props\n}) => {\n  return (\n    <Box twClassName={twClassName} gap={1} {...props}>\n      {/* Top Accessory Slot */}\n      {topAccessory}\n      {/* Title Row */}\n      <BoxRow\n        gap={2}\n        {...titleWrapperProps}\n        endAccessory={titleEndAccessory}\n        textProps={{\n          variant: TextVariant.HeadingLg,\n          ...titleProps,\n        }}\n      >\n        {title}\n      </BoxRow>\n      {/* Bottom Label Row */}\n      {bottomLabel && (\n        <BoxRow\n          gap={2}\n          {...bottomLabelWrapperProps}\n          endAccessory={bottomLabelEndAccessory}\n          textProps={{\n            variant: TextVariant.BodySm,\n            fontWeight: FontWeight.Medium,\n            color: TextColor.TextAlternative,\n            ...bottomLabelProps,\n          }}\n        >\n          {bottomLabel}\n        </BoxRow>\n      )}\n      {/* Bottom Accessory Slot */}\n      {!bottomLabel && bottomAccessory}\n    </Box>\n  );\n};\n\nTitleStandard.displayName = 'TitleStandard';\n"]}

package/dist/components/TitleStandard/TitleStandard.types.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"TitleStandard.types.cjs","sourceRoot":"","sources":["../../../src/components/TitleStandard/TitleStandard.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { TitleStandardPropsShared } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\n// Internal dependencies.\nimport type { BoxRowProps } from '../BoxRow/BoxRow.types';\nimport type { TextProps } from '../Text/Text.types';\n\n/**\n * TitleStandard component props (React Native).\n * Extends {@link TitleStandardPropsShared} (requires `title`) with platform `Text` passthroughs, `twClassName`, and `View` props.\n */\nexport type TitleStandardProps = TitleStandardPropsShared & {\n  /**\n   * Optional props merged into {@link BoxRow} `textProps` when `title` is a string.\n   */\n  titleProps?: Omit<Partial<TextProps>, 'children'>;\n  /**\n   * Optional props forwarded to the title row {@link BoxRow} (excluding `children`, `textProps`, and `endAccessory`, which are controlled by this component).\n   */\n  titleWrapperProps?: Omit<\n    Partial<BoxRowProps>,\n    'children' | 'textProps' | 'endAccessory'\n  >;\n  /**\n   * Optional props merged into {@link BoxRow} `textProps` when `bottomLabel` is a string.\n   */\n  bottomLabelProps?: Omit<Partial<TextProps>, 'children'>;\n  /**\n   * Optional props forwarded to the bottom label row {@link BoxRow} when `bottomLabel` is renderable (excluding `children`, `textProps`, and `endAccessory`, which are controlled by this component).\n   */\n  bottomLabelWrapperProps?: Omit<\n    Partial<BoxRowProps>,\n    'children' | 'textProps' | 'endAccessory'\n  >;\n  /**\n   * Optional Tailwind class name to apply to the container.\n   */\n  twClassName?: string;\n} & Omit<ViewProps, 'children'>;\n"]}

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

@@ -0,0 +1,31 @@
+import type { TitleStandardPropsShared } from "@metamask/design-system-shared";
+import type { ViewProps } from "react-native/index.js";
+import type { BoxRowProps } from "../BoxRow/BoxRow.types.cjs";
+import type { TextProps } from "../Text/Text.types.cjs";
+/**
+ * TitleStandard component props (React Native).
+ * Extends {@link TitleStandardPropsShared} (requires `title`) with platform `Text` passthroughs, `twClassName`, and `View` props.
+ */
+export type TitleStandardProps = TitleStandardPropsShared & {
+    /**
+     * Optional props merged into {@link BoxRow} `textProps` when `title` is a string.
+     */
+    titleProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional props forwarded to the title row {@link BoxRow} (excluding `children`, `textProps`, and `endAccessory`, which are controlled by this component).
+     */
+    titleWrapperProps?: Omit<Partial<BoxRowProps>, 'children' | 'textProps' | 'endAccessory'>;
+    /**
+     * Optional props merged into {@link BoxRow} `textProps` when `bottomLabel` is a string.
+     */
+    bottomLabelProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional props forwarded to the bottom label row {@link BoxRow} when `bottomLabel` is renderable (excluding `children`, `textProps`, and `endAccessory`, which are controlled by this component).
+     */
+    bottomLabelWrapperProps?: Omit<Partial<BoxRowProps>, 'children' | 'textProps' | 'endAccessory'>;
+    /**
+     * Optional Tailwind class name to apply to the container.
+     */
+    twClassName?: string;
+} & Omit<ViewProps, 'children'>;
+//# sourceMappingURL=TitleStandard.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TitleStandard.types.d.cts","sourceRoot":"","sources":["../../../src/components/TitleStandard/TitleStandard.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,uCAAuC;AAC/E,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAG9C,OAAO,KAAK,EAAE,WAAW,EAAE,mCAA+B;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,wBAAwB,GAAG;IAC1D;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAClD;;OAEG;IACH,iBAAiB,CAAC,EAAE,IAAI,CACtB,OAAO,CAAC,WAAW,CAAC,EACpB,UAAU,GAAG,WAAW,GAAG,cAAc,CAC1C,CAAC;IACF;;OAEG;IACH,gBAAgB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IACxD;;OAEG;IACH,uBAAuB,CAAC,EAAE,IAAI,CAC5B,OAAO,CAAC,WAAW,CAAC,EACpB,UAAU,GAAG,WAAW,GAAG,cAAc,CAC1C,CAAC;IACF;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC"}

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

@@ -0,0 +1,31 @@
+import type { TitleStandardPropsShared } from "@metamask/design-system-shared";
+import type { ViewProps } from "react-native/index.js";
+import type { BoxRowProps } from "../BoxRow/BoxRow.types.mjs";
+import type { TextProps } from "../Text/Text.types.mjs";
+/**
+ * TitleStandard component props (React Native).
+ * Extends {@link TitleStandardPropsShared} (requires `title`) with platform `Text` passthroughs, `twClassName`, and `View` props.
+ */
+export type TitleStandardProps = TitleStandardPropsShared & {
+    /**
+     * Optional props merged into {@link BoxRow} `textProps` when `title` is a string.
+     */
+    titleProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional props forwarded to the title row {@link BoxRow} (excluding `children`, `textProps`, and `endAccessory`, which are controlled by this component).
+     */
+    titleWrapperProps?: Omit<Partial<BoxRowProps>, 'children' | 'textProps' | 'endAccessory'>;
+    /**
+     * Optional props merged into {@link BoxRow} `textProps` when `bottomLabel` is a string.
+     */
+    bottomLabelProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional props forwarded to the bottom label row {@link BoxRow} when `bottomLabel` is renderable (excluding `children`, `textProps`, and `endAccessory`, which are controlled by this component).
+     */
+    bottomLabelWrapperProps?: Omit<Partial<BoxRowProps>, 'children' | 'textProps' | 'endAccessory'>;
+    /**
+     * Optional Tailwind class name to apply to the container.
+     */
+    twClassName?: string;
+} & Omit<ViewProps, 'children'>;
+//# sourceMappingURL=TitleStandard.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TitleStandard.types.d.mts","sourceRoot":"","sources":["../../../src/components/TitleStandard/TitleStandard.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,uCAAuC;AAC/E,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAG9C,OAAO,KAAK,EAAE,WAAW,EAAE,mCAA+B;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,wBAAwB,GAAG;IAC1D;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAClD;;OAEG;IACH,iBAAiB,CAAC,EAAE,IAAI,CACtB,OAAO,CAAC,WAAW,CAAC,EACpB,UAAU,GAAG,WAAW,GAAG,cAAc,CAC1C,CAAC;IACF;;OAEG;IACH,gBAAgB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IACxD;;OAEG;IACH,uBAAuB,CAAC,EAAE,IAAI,CAC5B,OAAO,CAAC,WAAW,CAAC,EACpB,UAAU,GAAG,WAAW,GAAG,cAAc,CAC1C,CAAC;IACF;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC"}

package/dist/components/TitleStandard/TitleStandard.types.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"TitleStandard.types.mjs","sourceRoot":"","sources":["../../../src/components/TitleStandard/TitleStandard.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { TitleStandardPropsShared } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\n// Internal dependencies.\nimport type { BoxRowProps } from '../BoxRow/BoxRow.types';\nimport type { TextProps } from '../Text/Text.types';\n\n/**\n * TitleStandard component props (React Native).\n * Extends {@link TitleStandardPropsShared} (requires `title`) with platform `Text` passthroughs, `twClassName`, and `View` props.\n */\nexport type TitleStandardProps = TitleStandardPropsShared & {\n  /**\n   * Optional props merged into {@link BoxRow} `textProps` when `title` is a string.\n   */\n  titleProps?: Omit<Partial<TextProps>, 'children'>;\n  /**\n   * Optional props forwarded to the title row {@link BoxRow} (excluding `children`, `textProps`, and `endAccessory`, which are controlled by this component).\n   */\n  titleWrapperProps?: Omit<\n    Partial<BoxRowProps>,\n    'children' | 'textProps' | 'endAccessory'\n  >;\n  /**\n   * Optional props merged into {@link BoxRow} `textProps` when `bottomLabel` is a string.\n   */\n  bottomLabelProps?: Omit<Partial<TextProps>, 'children'>;\n  /**\n   * Optional props forwarded to the bottom label row {@link BoxRow} when `bottomLabel` is renderable (excluding `children`, `textProps`, and `endAccessory`, which are controlled by this component).\n   */\n  bottomLabelWrapperProps?: Omit<\n    Partial<BoxRowProps>,\n    'children' | 'textProps' | 'endAccessory'\n  >;\n  /**\n   * Optional Tailwind class name to apply to the container.\n   */\n  twClassName?: string;\n} & Omit<ViewProps, 'children'>;\n"]}

package/dist/components/TitleStandard/index.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/TitleStandard/index.ts"],"names":[],"mappings":";;;AAAA,qDAAgD;AAAvC,8GAAA,aAAa,OAAA","sourcesContent":["export { TitleStandard } from './TitleStandard';\nexport type { TitleStandardProps } from './TitleStandard.types';\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/TitleStandard/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,4BAAwB;AAChD,YAAY,EAAE,kBAAkB,EAAE,kCAA8B"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/TitleStandard/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,4BAAwB;AAChD,YAAY,EAAE,kBAAkB,EAAE,kCAA8B"}

package/dist/components/TitleStandard/index.mjs

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

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

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

package/dist/components/TitleSubpage/TitleSubpage.cjs

@@ -0,0 +1,85 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TitleSubpage = void 0;
+// Third party dependencies.
+const design_system_shared_1 = require("@metamask/design-system-shared");
+const react_1 = __importDefault(require("react"));
+// Internal dependencies.
+const Box_1 = require("../Box/index.cjs");
+const BoxRow_1 = require("../BoxRow/index.cjs");
+/**
+ * Displays a required identity row (avatar + title stack) with optional subtitle, amount, inline accessories, and bottom rows in a left-aligned layout.
+ * Remaining `View` props are forwarded to the root `Box`.
+ *
+ * @param props - Component props
+ * @param props.title - Title row content (required)
+ * @param props.titleAvatar - Leading visual for the identity row (required); passed through as the identity `BoxRow` `startAccessory` so callers control layout and composition (for example badges that extend past the token)
+ * @param props.identityRowProps - Optional props spread onto the identity `BoxRow` after defaults (`children`, `startAccessory`, and `textProps` are reserved)
+ * @param props.titleColumnProps - Optional props spread onto the title/subtitle column `Box` (`children` is reserved)
+ * @param props.bottomLabelWrapperProps - Optional props spread onto the bottom label `BoxRow` after defaults (`children`, `endAccessory`, and `textProps` are reserved)
+ * @param props.titleEndAccessory - Optional inline accessory to the right of `title`
+ * @param props.subtitle - Optional subtitle row below the title and above the amount
+ * @param props.subtitleEndAccessory - Optional inline accessory to the right of `subtitle`
+ * @param props.amount - Optional primary amount below the title
+ * @param props.amountEndAccessory - Optional inline accessory to the right of the amount
+ * @param props.bottomAccessory - Optional custom bottom row when the bottom label row is not shown
+ * @param props.bottomLabel - Optional secondary label below the amount row
+ * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of `bottomLabel`
+ * @param props.titleProps - Optional props merged into title row `Text` when `title` is a string
+ * @param props.subtitleProps - Optional props merged into subtitle row `Text` when `subtitle` is a string
+ * @param props.amountProps - Optional props merged into amount `Text` when `amount` is a string
+ * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string
+ * @param props.twClassName - Optional Tailwind classes on the root container
+ *
+ * @returns The rendered TitleSubpage layout.
+ */
+const TitleSubpage = ({ amount, amountEndAccessory, title, titleAvatar, titleEndAccessory, subtitle, subtitleEndAccessory, bottomAccessory, bottomLabel, bottomLabelEndAccessory, amountProps, titleProps, subtitleProps, bottomLabelProps, identityRowProps, titleColumnProps, bottomLabelWrapperProps, twClassName = '', ...props }) => {
+    return (<Box_1.Box twClassName={twClassName} gap={1} {...props}>
+      {/* Identity Row */}
+      <BoxRow_1.BoxRow gap={4} twClassName="h-14" {...identityRowProps} startAccessory={titleAvatar}>
+        {/* Title and Subtitle Column */}
+        <Box_1.Box {...titleColumnProps}>
+          {/* Title Row */}
+          {title && (<BoxRow_1.BoxRow endAccessory={titleEndAccessory} textProps={{
+                variant: design_system_shared_1.TextVariant.HeadingSm,
+                color: design_system_shared_1.TextColor.TextDefault,
+                ...titleProps,
+            }}>
+              {title}
+            </BoxRow_1.BoxRow>)}
+          {/* Subtitle Row */}
+          {subtitle && (<BoxRow_1.BoxRow endAccessory={subtitleEndAccessory} textProps={{
+                variant: design_system_shared_1.TextVariant.BodySm,
+                fontWeight: design_system_shared_1.FontWeight.Medium,
+                color: design_system_shared_1.TextColor.TextAlternative,
+                ...subtitleProps,
+            }}>
+              {subtitle}
+            </BoxRow_1.BoxRow>)}
+        </Box_1.Box>
+      </BoxRow_1.BoxRow>
+      {/* Amount Row */}
+      {amount && (<BoxRow_1.BoxRow endAccessory={amountEndAccessory} textProps={{
+                variant: design_system_shared_1.TextVariant.DisplayLg,
+                ...amountProps,
+            }}>
+          {amount}
+        </BoxRow_1.BoxRow>)}
+      {/* Bottom Label Row */}
+      {bottomLabel && (<BoxRow_1.BoxRow {...bottomLabelWrapperProps} endAccessory={bottomLabelEndAccessory} textProps={{
+                variant: design_system_shared_1.TextVariant.BodySm,
+                fontWeight: design_system_shared_1.FontWeight.Medium,
+                color: design_system_shared_1.TextColor.TextAlternative,
+                ...bottomLabelProps,
+            }}>
+          {bottomLabel}
+        </BoxRow_1.BoxRow>)}
+      {!bottomLabel && bottomAccessory}
+    </Box_1.Box>);
+};
+exports.TitleSubpage = TitleSubpage;
+exports.TitleSubpage.displayName = 'TitleSubpage';
+//# sourceMappingURL=TitleSubpage.cjs.map

package/dist/components/TitleSubpage/TitleSubpage.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TitleSubpage.cjs","sourceRoot":"","sources":["../../../src/components/TitleSubpage/TitleSubpage.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,yEAIwC;AACxC,kDAA0B;AAE1B,yBAAyB;AACzB,0CAA6B;AAC7B,gDAAmC;AAInC;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACI,MAAM,YAAY,GAAgC,CAAC,EACxD,MAAM,EACN,kBAAkB,EAClB,KAAK,EACL,WAAW,EACX,iBAAiB,EACjB,QAAQ,EACR,oBAAoB,EACpB,eAAe,EACf,WAAW,EACX,uBAAuB,EACvB,WAAW,EACX,UAAU,EACV,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,gBAAgB,EAChB,uBAAuB,EACvB,WAAW,GAAG,EAAE,EAChB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,CAAC,SAAG,CAAC,WAAW,CAAC,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAC/C;MAAA,CAAC,kBAAkB,CACnB;MAAA,CAAC,eAAM,CACL,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,WAAW,CAAC,MAAM,CAClB,IAAI,gBAAgB,CAAC,CACrB,cAAc,CAAC,CAAC,WAAW,CAAC,CAE5B;QAAA,CAAC,+BAA+B,CAChC;QAAA,CAAC,SAAG,CAAC,IAAI,gBAAgB,CAAC,CACxB;UAAA,CAAC,eAAe,CAChB;UAAA,CAAC,KAAK,IAAI,CACR,CAAC,eAAM,CACL,YAAY,CAAC,CAAC,iBAAiB,CAAC,CAChC,SAAS,CAAC,CAAC;gBACT,OAAO,EAAE,kCAAW,CAAC,SAAS;gBAC9B,KAAK,EAAE,gCAAS,CAAC,WAAW;gBAC5B,GAAG,UAAU;aACd,CAAC,CAEF;cAAA,CAAC,KAAK,CACR;YAAA,EAAE,eAAM,CAAC,CACV,CACD;UAAA,CAAC,kBAAkB,CACnB;UAAA,CAAC,QAAQ,IAAI,CACX,CAAC,eAAM,CACL,YAAY,CAAC,CAAC,oBAAoB,CAAC,CACnC,SAAS,CAAC,CAAC;gBACT,OAAO,EAAE,kCAAW,CAAC,MAAM;gBAC3B,UAAU,EAAE,iCAAU,CAAC,MAAM;gBAC7B,KAAK,EAAE,gCAAS,CAAC,eAAe;gBAChC,GAAG,aAAa;aACjB,CAAC,CAEF;cAAA,CAAC,QAAQ,CACX;YAAA,EAAE,eAAM,CAAC,CACV,CACH;QAAA,EAAE,SAAG,CACP;MAAA,EAAE,eAAM,CACR;MAAA,CAAC,gBAAgB,CACjB;MAAA,CAAC,MAAM,IAAI,CACT,CAAC,eAAM,CACL,YAAY,CAAC,CAAC,kBAAkB,CAAC,CACjC,SAAS,CAAC,CAAC;gBACT,OAAO,EAAE,kCAAW,CAAC,SAAS;gBAC9B,GAAG,WAAW;aACf,CAAC,CAEF;UAAA,CAAC,MAAM,CACT;QAAA,EAAE,eAAM,CAAC,CACV,CACD;MAAA,CAAC,sBAAsB,CACvB;MAAA,CAAC,WAAW,IAAI,CACd,CAAC,eAAM,CACL,IAAI,uBAAuB,CAAC,CAC5B,YAAY,CAAC,CAAC,uBAAuB,CAAC,CACtC,SAAS,CAAC,CAAC;gBACT,OAAO,EAAE,kCAAW,CAAC,MAAM;gBAC3B,UAAU,EAAE,iCAAU,CAAC,MAAM;gBAC7B,KAAK,EAAE,gCAAS,CAAC,eAAe;gBAChC,GAAG,gBAAgB;aACpB,CAAC,CAEF;UAAA,CAAC,WAAW,CACd;QAAA,EAAE,eAAM,CAAC,CACV,CACD;MAAA,CAAC,CAAC,WAAW,IAAI,eAAe,CAClC;IAAA,EAAE,SAAG,CAAC,CACP,CAAC;AACJ,CAAC,CAAC;AA3FW,QAAA,YAAY,gBA2FvB;AAEF,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["// Third party dependencies.\nimport {\n  FontWeight,\n  TextColor,\n  TextVariant,\n} from '@metamask/design-system-shared';\nimport React from 'react';\n\n// Internal dependencies.\nimport { Box } from '../Box';\nimport { BoxRow } from '../BoxRow';\n\nimport type { TitleSubpageProps } from './TitleSubpage.types';\n\n/**\n * Displays a required identity row (avatar + title stack) with optional subtitle, amount, inline accessories, and bottom rows in a left-aligned layout.\n * Remaining `View` props are forwarded to the root `Box`.\n *\n * @param props - Component props\n * @param props.title - Title row content (required)\n * @param props.titleAvatar - Leading visual for the identity row (required); passed through as the identity `BoxRow` `startAccessory` so callers control layout and composition (for example badges that extend past the token)\n * @param props.identityRowProps - Optional props spread onto the identity `BoxRow` after defaults (`children`, `startAccessory`, and `textProps` are reserved)\n * @param props.titleColumnProps - Optional props spread onto the title/subtitle column `Box` (`children` is reserved)\n * @param props.bottomLabelWrapperProps - Optional props spread onto the bottom label `BoxRow` after defaults (`children`, `endAccessory`, and `textProps` are reserved)\n * @param props.titleEndAccessory - Optional inline accessory to the right of `title`\n * @param props.subtitle - Optional subtitle row below the title and above the amount\n * @param props.subtitleEndAccessory - Optional inline accessory to the right of `subtitle`\n * @param props.amount - Optional primary amount below the title\n * @param props.amountEndAccessory - Optional inline accessory to the right of the amount\n * @param props.bottomAccessory - Optional custom bottom row when the bottom label row is not shown\n * @param props.bottomLabel - Optional secondary label below the amount row\n * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of `bottomLabel`\n * @param props.titleProps - Optional props merged into title row `Text` when `title` is a string\n * @param props.subtitleProps - Optional props merged into subtitle row `Text` when `subtitle` is a string\n * @param props.amountProps - Optional props merged into amount `Text` when `amount` is a string\n * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string\n * @param props.twClassName - Optional Tailwind classes on the root container\n *\n * @returns The rendered TitleSubpage layout.\n */\nexport const TitleSubpage: React.FC<TitleSubpageProps> = ({\n  amount,\n  amountEndAccessory,\n  title,\n  titleAvatar,\n  titleEndAccessory,\n  subtitle,\n  subtitleEndAccessory,\n  bottomAccessory,\n  bottomLabel,\n  bottomLabelEndAccessory,\n  amountProps,\n  titleProps,\n  subtitleProps,\n  bottomLabelProps,\n  identityRowProps,\n  titleColumnProps,\n  bottomLabelWrapperProps,\n  twClassName = '',\n  ...props\n}) => {\n  return (\n    <Box twClassName={twClassName} gap={1} {...props}>\n      {/* Identity Row */}\n      <BoxRow\n        gap={4}\n        twClassName=\"h-14\"\n        {...identityRowProps}\n        startAccessory={titleAvatar}\n      >\n        {/* Title and Subtitle Column */}\n        <Box {...titleColumnProps}>\n          {/* Title Row */}\n          {title && (\n            <BoxRow\n              endAccessory={titleEndAccessory}\n              textProps={{\n                variant: TextVariant.HeadingSm,\n                color: TextColor.TextDefault,\n                ...titleProps,\n              }}\n            >\n              {title}\n            </BoxRow>\n          )}\n          {/* Subtitle Row */}\n          {subtitle && (\n            <BoxRow\n              endAccessory={subtitleEndAccessory}\n              textProps={{\n                variant: TextVariant.BodySm,\n                fontWeight: FontWeight.Medium,\n                color: TextColor.TextAlternative,\n                ...subtitleProps,\n              }}\n            >\n              {subtitle}\n            </BoxRow>\n          )}\n        </Box>\n      </BoxRow>\n      {/* Amount Row */}\n      {amount && (\n        <BoxRow\n          endAccessory={amountEndAccessory}\n          textProps={{\n            variant: TextVariant.DisplayLg,\n            ...amountProps,\n          }}\n        >\n          {amount}\n        </BoxRow>\n      )}\n      {/* Bottom Label Row */}\n      {bottomLabel && (\n        <BoxRow\n          {...bottomLabelWrapperProps}\n          endAccessory={bottomLabelEndAccessory}\n          textProps={{\n            variant: TextVariant.BodySm,\n            fontWeight: FontWeight.Medium,\n            color: TextColor.TextAlternative,\n            ...bottomLabelProps,\n          }}\n        >\n          {bottomLabel}\n        </BoxRow>\n      )}\n      {!bottomLabel && bottomAccessory}\n    </Box>\n  );\n};\n\nTitleSubpage.displayName = 'TitleSubpage';\n"]}

package/dist/components/TitleSubpage/TitleSubpage.d.cts

@@ -0,0 +1,30 @@
+import React from "react";
+import type { TitleSubpageProps } from "./TitleSubpage.types.cjs";
+/**
+ * Displays a required identity row (avatar + title stack) with optional subtitle, amount, inline accessories, and bottom rows in a left-aligned layout.
+ * Remaining `View` props are forwarded to the root `Box`.
+ *
+ * @param props - Component props
+ * @param props.title - Title row content (required)
+ * @param props.titleAvatar - Leading visual for the identity row (required); passed through as the identity `BoxRow` `startAccessory` so callers control layout and composition (for example badges that extend past the token)
+ * @param props.identityRowProps - Optional props spread onto the identity `BoxRow` after defaults (`children`, `startAccessory`, and `textProps` are reserved)
+ * @param props.titleColumnProps - Optional props spread onto the title/subtitle column `Box` (`children` is reserved)
+ * @param props.bottomLabelWrapperProps - Optional props spread onto the bottom label `BoxRow` after defaults (`children`, `endAccessory`, and `textProps` are reserved)
+ * @param props.titleEndAccessory - Optional inline accessory to the right of `title`
+ * @param props.subtitle - Optional subtitle row below the title and above the amount
+ * @param props.subtitleEndAccessory - Optional inline accessory to the right of `subtitle`
+ * @param props.amount - Optional primary amount below the title
+ * @param props.amountEndAccessory - Optional inline accessory to the right of the amount
+ * @param props.bottomAccessory - Optional custom bottom row when the bottom label row is not shown
+ * @param props.bottomLabel - Optional secondary label below the amount row
+ * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of `bottomLabel`
+ * @param props.titleProps - Optional props merged into title row `Text` when `title` is a string
+ * @param props.subtitleProps - Optional props merged into subtitle row `Text` when `subtitle` is a string
+ * @param props.amountProps - Optional props merged into amount `Text` when `amount` is a string
+ * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string
+ * @param props.twClassName - Optional Tailwind classes on the root container
+ *
+ * @returns The rendered TitleSubpage layout.
+ */
+export declare const TitleSubpage: React.FC<TitleSubpageProps>;
+//# sourceMappingURL=TitleSubpage.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TitleSubpage.d.cts","sourceRoot":"","sources":["../../../src/components/TitleSubpage/TitleSubpage.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,cAAc;AAM1B,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAE9D;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA2FpD,CAAC"}

package/dist/components/TitleSubpage/TitleSubpage.d.mts

@@ -0,0 +1,30 @@
+import React from "react";
+import type { TitleSubpageProps } from "./TitleSubpage.types.mjs";
+/**
+ * Displays a required identity row (avatar + title stack) with optional subtitle, amount, inline accessories, and bottom rows in a left-aligned layout.
+ * Remaining `View` props are forwarded to the root `Box`.
+ *
+ * @param props - Component props
+ * @param props.title - Title row content (required)
+ * @param props.titleAvatar - Leading visual for the identity row (required); passed through as the identity `BoxRow` `startAccessory` so callers control layout and composition (for example badges that extend past the token)
+ * @param props.identityRowProps - Optional props spread onto the identity `BoxRow` after defaults (`children`, `startAccessory`, and `textProps` are reserved)
+ * @param props.titleColumnProps - Optional props spread onto the title/subtitle column `Box` (`children` is reserved)
+ * @param props.bottomLabelWrapperProps - Optional props spread onto the bottom label `BoxRow` after defaults (`children`, `endAccessory`, and `textProps` are reserved)
+ * @param props.titleEndAccessory - Optional inline accessory to the right of `title`
+ * @param props.subtitle - Optional subtitle row below the title and above the amount
+ * @param props.subtitleEndAccessory - Optional inline accessory to the right of `subtitle`
+ * @param props.amount - Optional primary amount below the title
+ * @param props.amountEndAccessory - Optional inline accessory to the right of the amount
+ * @param props.bottomAccessory - Optional custom bottom row when the bottom label row is not shown
+ * @param props.bottomLabel - Optional secondary label below the amount row
+ * @param props.bottomLabelEndAccessory - Optional inline accessory to the right of `bottomLabel`
+ * @param props.titleProps - Optional props merged into title row `Text` when `title` is a string
+ * @param props.subtitleProps - Optional props merged into subtitle row `Text` when `subtitle` is a string
+ * @param props.amountProps - Optional props merged into amount `Text` when `amount` is a string
+ * @param props.bottomLabelProps - Optional props merged into bottom label `Text` when `bottomLabel` is a string
+ * @param props.twClassName - Optional Tailwind classes on the root container
+ *
+ * @returns The rendered TitleSubpage layout.
+ */
+export declare const TitleSubpage: React.FC<TitleSubpageProps>;
+//# sourceMappingURL=TitleSubpage.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TitleSubpage.d.mts","sourceRoot":"","sources":["../../../src/components/TitleSubpage/TitleSubpage.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,cAAc;AAM1B,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAE9D;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA2FpD,CAAC"}