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

package/dist/components/KeyValueRow/KeyValueRow.types.cjs

@@ -1,29 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.KeyValueRowSectionAlignments = exports.TooltipSizes = exports.IconSizes = exports.KeyValueRowFieldIconSides = void 0;
-const ButtonIcon_1 = require("../ButtonIcon/index.cjs");
-const Icon_1 = require("../Icon/index.cjs");
-/**
- * Used to position an icon in a KeyValueRowField.
- */
-exports.KeyValueRowFieldIconSides = {
-    Left: 'left',
-    Right: 'right',
-    Both: 'both',
-};
-/**
- * Re-exported for backwards compatibility.
- */
-exports.IconSizes = Icon_1.IconSize;
-/**
- * Re-exported for backwards compatibility.
- */
-exports.TooltipSizes = ButtonIcon_1.ButtonIconSize;
-/**
- * Represents the valid KeyValueSection alignments.
- */
-exports.KeyValueRowSectionAlignments = {
-    Left: 'items-start',
-    Right: 'items-end',
-};
 //# sourceMappingURL=KeyValueRow.types.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"KeyValueRow.types.cjs","sourceRoot":"","sources":["../../../src/components/KeyValueRow/KeyValueRow.types.ts"],"names":[],"mappings":";;;AAGA,wDAA+C;AAC/C,4CAA6C;AAsC7C;;GAEG;AACU,QAAA,yBAAyB,GAAG;IACvC,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,OAAO;IACd,IAAI,EAAE,MAAM;CACJ,CAAC;AAuBX;;GAEG;AACU,QAAA,SAAS,GAAG,eAAQ,CAAC;AAElC;;GAEG;AACU,QAAA,YAAY,GAAG,2BAAc,CAAC;AAsC3C;;GAEG;AACU,QAAA,4BAA4B,GAAG;IAC1C,IAAI,EAAE,aAAa;IACnB,KAAK,EAAE,WAAW;CACV,CAAC","sourcesContent":["import type { ReactNode } from 'react';\nimport type { ViewProps } from 'react-native';\n\nimport { ButtonIconSize } from '../ButtonIcon';\nimport { IconName, IconSize } from '../Icon';\nimport type { IconProps } from '../Icon';\nimport type { TextProps } from '../Text';\n\n/**\n * The optional tooltip that can be displayed within a KeyValueRowField.\n */\nexport type KeyValueRowTooltip = {\n  /**\n   * The title displayed at the top of the tooltip.\n   */\n  title: string;\n  /**\n   * The content displayed within the tooltip body.\n   */\n  content: string | ReactNode;\n  /**\n   * Optional size of the tooltip icon button.\n   *\n   * @default ButtonIconSize.Md\n   */\n  size?: ButtonIconSize;\n  /**\n   * Optional icon name for the tooltip icon.\n   *\n   * @default IconName.Question\n   */\n  iconName?: IconName;\n  /**\n   * Optional onPress handler called when the tooltip icon is pressed.\n   */\n  onPress?: (...args: unknown[]) => unknown;\n  /**\n   * Optional bottom padding for the tooltip modal.\n   */\n  bottomPadding?: number;\n};\n\n/**\n * Used to position an icon in a KeyValueRowField.\n */\nexport const KeyValueRowFieldIconSides = {\n  Left: 'left',\n  Right: 'right',\n  Both: 'both',\n} as const;\n\nexport type KeyValueRowFieldIconSides =\n  (typeof KeyValueRowFieldIconSides)[keyof typeof KeyValueRowFieldIconSides];\n\n/**\n * Represents a field displayed within KeyValueRowProps.\n */\nexport type KeyValueRowField = {\n  /**\n   * The label content displayed.\n   */\n  label: PreDefinedKeyValueRowLabel | ReactNode;\n  /**\n   * Optional icon to display. If undefined, no icon is displayed.\n   */\n  icon?: IconProps & { side?: KeyValueRowFieldIconSides };\n  /**\n   * Optional tooltip to display. If undefined, no tooltip is displayed.\n   */\n  tooltip?: KeyValueRowTooltip;\n};\n\n/**\n * Re-exported for backwards compatibility.\n */\nexport const IconSizes = IconSize;\n\n/**\n * Re-exported for backwards compatibility.\n */\nexport const TooltipSizes = ButtonIconSize;\n\n/**\n * A predefined label object with text, variant, and color.\n */\nexport type PreDefinedKeyValueRowLabel = {\n  /**\n   * Text to display.\n   */\n  text: string;\n  /**\n   * Optional text variant.\n   *\n   * @default TextVariant.BodyMd\n   */\n  variant?: TextProps['variant'];\n  /**\n   * Optional text color.\n   *\n   * @default TextColor.TextDefault\n   */\n  color?: TextProps['color'];\n};\n\n/**\n * The KeyValueRowLabel component props.\n */\nexport type KeyValueRowLabelProps = {\n  /**\n   * The label content displayed.\n   */\n  label: PreDefinedKeyValueRowLabel | ReactNode;\n  /**\n   * Optional tooltip. If undefined, the tooltip won't be displayed.\n   */\n  tooltip?: KeyValueRowTooltip;\n};\n\n/**\n * Represents the valid KeyValueSection alignments.\n */\nexport const KeyValueRowSectionAlignments = {\n  Left: 'items-start',\n  Right: 'items-end',\n} as const;\n\nexport type KeyValueRowSectionAlignments =\n  (typeof KeyValueRowSectionAlignments)[keyof typeof KeyValueRowSectionAlignments];\n\n/**\n * Represents the main container for the KeyValueRow component.\n *\n * Extends `ViewProps` so the root View inherits standard React Native\n * props such as `testID` and `accessibilityLabel`.\n */\nexport type KeyValueRowRootProps = {\n  /**\n   * Must have exactly two children. Adding more will lead to an undesired outcome.\n   */\n  children: [ReactNode, ReactNode];\n  /**\n   * Optional Tailwind class names to override default styles on the root element.\n   */\n  twClassName?: string;\n} & ViewProps;\n\n/**\n * The KeyValueSection component props.\n *\n * Extends `ViewProps` so the root View inherits standard React Native\n * props such as `testID` and `accessibilityLabel`.\n */\nexport type KeyValueSectionProps = {\n  /**\n   * Child components.\n   */\n  children: ReactNode;\n  /**\n   * Optional content alignment.\n   *\n   * @default KeyValueRowSectionAlignments.Left\n   */\n  align?: KeyValueRowSectionAlignments;\n  /**\n   * Optional Tailwind class names to override default styles on the root element.\n   */\n  twClassName?: string;\n} & ViewProps;\n\n/**\n * The KeyValueRow component props.\n *\n * Extends `ViewProps` so the root View inherits standard React Native\n * props such as `testID` and `accessibilityLabel`.\n */\nexport type KeyValueRowProps = {\n  /**\n   * The \"key\" portion of the KeyValueRow (left side).\n   * Using the variable name field because key is reserved.\n   */\n  field: KeyValueRowField;\n  /**\n   * The \"value\" portion of the KeyValueRow (right side).\n   */\n  value: KeyValueRowField;\n  /**\n   * Optional Tailwind class names to override default styles on the root element.\n   */\n  twClassName?: string;\n} & ViewProps;\n"]}
+{"version":3,"file":"KeyValueRow.types.cjs","sourceRoot":"","sources":["../../../src/components/KeyValueRow/KeyValueRow.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { KeyValueRowPropsShared } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\nimport type { ButtonIconProps } from '../ButtonIcon/ButtonIcon.types';\nimport type { TextProps } from '../Text/Text.types';\n\nexport type KeyValueRowProps = KeyValueRowPropsShared &\n  Omit<ViewProps, 'children'> & {\n    /** Optional props for the key Text when key is a string. */\n    keyTextProps?: Partial<Omit<TextProps, 'children'>>;\n    /** Optional props for the value Text when value is a string. */\n    valueTextProps?: Partial<Omit<TextProps, 'children'>>;\n    /** Optional Tailwind class names applied to the outer BoxHorizontal. Merged with base styles. */\n    twClassName?: string;\n    /** When set, renders a ButtonIcon as the key endAccessory (takes precedence over keyEndAccessory). */\n    keyEndButtonIconProps?: Partial<ButtonIconProps>;\n    /** When set, renders a ButtonIcon as the value endAccessory (takes precedence over valueEndAccessory). */\n    valueEndButtonIconProps?: Partial<ButtonIconProps>;\n  };\n"]}

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

@@ -1,177 +1,17 @@
-import type { ReactNode } from "react";
+import type { KeyValueRowPropsShared } from "@metamask/design-system-shared";
 import type { ViewProps } from "react-native/index.js";
-import { ButtonIconSize } from "../ButtonIcon/index.cjs";
-import { IconName, IconSize } from "../Icon/index.cjs";
-import type { IconProps } from "../Icon/index.cjs";
-import type { TextProps } from "../Text/index.cjs";
-/**
- * The optional tooltip that can be displayed within a KeyValueRowField.
- */
-export type KeyValueRowTooltip = {
-    /**
-     * The title displayed at the top of the tooltip.
-     */
-    title: string;
-    /**
-     * The content displayed within the tooltip body.
-     */
-    content: string | ReactNode;
-    /**
-     * Optional size of the tooltip icon button.
-     *
-     * @default ButtonIconSize.Md
-     */
-    size?: ButtonIconSize;
-    /**
-     * Optional icon name for the tooltip icon.
-     *
-     * @default IconName.Question
-     */
-    iconName?: IconName;
-    /**
-     * Optional onPress handler called when the tooltip icon is pressed.
-     */
-    onPress?: (...args: unknown[]) => unknown;
-    /**
-     * Optional bottom padding for the tooltip modal.
-     */
-    bottomPadding?: number;
-};
-/**
- * Used to position an icon in a KeyValueRowField.
- */
-export declare const KeyValueRowFieldIconSides: {
-    readonly Left: "left";
-    readonly Right: "right";
-    readonly Both: "both";
-};
-export type KeyValueRowFieldIconSides = (typeof KeyValueRowFieldIconSides)[keyof typeof KeyValueRowFieldIconSides];
-/**
- * Represents a field displayed within KeyValueRowProps.
- */
-export type KeyValueRowField = {
-    /**
-     * The label content displayed.
-     */
-    label: PreDefinedKeyValueRowLabel | ReactNode;
-    /**
-     * Optional icon to display. If undefined, no icon is displayed.
-     */
-    icon?: IconProps & {
-        side?: KeyValueRowFieldIconSides;
-    };
-    /**
-     * Optional tooltip to display. If undefined, no tooltip is displayed.
-     */
-    tooltip?: KeyValueRowTooltip;
-};
-/**
- * Re-exported for backwards compatibility.
- */
-export declare const IconSizes: typeof IconSize;
-/**
- * Re-exported for backwards compatibility.
- */
-export declare const TooltipSizes: typeof ButtonIconSize;
-/**
- * A predefined label object with text, variant, and color.
- */
-export type PreDefinedKeyValueRowLabel = {
-    /**
-     * Text to display.
-     */
-    text: string;
-    /**
-     * Optional text variant.
-     *
-     * @default TextVariant.BodyMd
-     */
-    variant?: TextProps['variant'];
-    /**
-     * Optional text color.
-     *
-     * @default TextColor.TextDefault
-     */
-    color?: TextProps['color'];
-};
-/**
- * The KeyValueRowLabel component props.
- */
-export type KeyValueRowLabelProps = {
-    /**
-     * The label content displayed.
-     */
-    label: PreDefinedKeyValueRowLabel | ReactNode;
-    /**
-     * Optional tooltip. If undefined, the tooltip won't be displayed.
-     */
-    tooltip?: KeyValueRowTooltip;
-};
-/**
- * Represents the valid KeyValueSection alignments.
- */
-export declare const KeyValueRowSectionAlignments: {
-    readonly Left: "items-start";
-    readonly Right: "items-end";
-};
-export type KeyValueRowSectionAlignments = (typeof KeyValueRowSectionAlignments)[keyof typeof KeyValueRowSectionAlignments];
-/**
- * Represents the main container for the KeyValueRow component.
- *
- * Extends `ViewProps` so the root View inherits standard React Native
- * props such as `testID` and `accessibilityLabel`.
- */
-export type KeyValueRowRootProps = {
-    /**
-     * Must have exactly two children. Adding more will lead to an undesired outcome.
-     */
-    children: [ReactNode, ReactNode];
-    /**
-     * Optional Tailwind class names to override default styles on the root element.
-     */
-    twClassName?: string;
-} & ViewProps;
-/**
- * The KeyValueSection component props.
- *
- * Extends `ViewProps` so the root View inherits standard React Native
- * props such as `testID` and `accessibilityLabel`.
- */
-export type KeyValueSectionProps = {
-    /**
-     * Child components.
-     */
-    children: ReactNode;
-    /**
-     * Optional content alignment.
-     *
-     * @default KeyValueRowSectionAlignments.Left
-     */
-    align?: KeyValueRowSectionAlignments;
-    /**
-     * Optional Tailwind class names to override default styles on the root element.
-     */
+import type { ButtonIconProps } from "../ButtonIcon/ButtonIcon.types.cjs";
+import type { TextProps } from "../Text/Text.types.cjs";
+export type KeyValueRowProps = KeyValueRowPropsShared & Omit<ViewProps, 'children'> & {
+    /** Optional props for the key Text when key is a string. */
+    keyTextProps?: Partial<Omit<TextProps, 'children'>>;
+    /** Optional props for the value Text when value is a string. */
+    valueTextProps?: Partial<Omit<TextProps, 'children'>>;
+    /** Optional Tailwind class names applied to the outer BoxHorizontal. Merged with base styles. */
     twClassName?: string;
-} & ViewProps;
-/**
- * The KeyValueRow component props.
- *
- * Extends `ViewProps` so the root View inherits standard React Native
- * props such as `testID` and `accessibilityLabel`.
- */
-export type KeyValueRowProps = {
-    /**
-     * The "key" portion of the KeyValueRow (left side).
-     * Using the variable name field because key is reserved.
-     */
-    field: KeyValueRowField;
-    /**
-     * The "value" portion of the KeyValueRow (right side).
-     */
-    value: KeyValueRowField;
-    /**
-     * Optional Tailwind class names to override default styles on the root element.
-     */
-    twClassName?: string;
-} & ViewProps;
+    /** When set, renders a ButtonIcon as the key endAccessory (takes precedence over keyEndAccessory). */
+    keyEndButtonIconProps?: Partial<ButtonIconProps>;
+    /** When set, renders a ButtonIcon as the value endAccessory (takes precedence over valueEndAccessory). */
+    valueEndButtonIconProps?: Partial<ButtonIconProps>;
+};
 //# sourceMappingURL=KeyValueRow.types.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"KeyValueRow.types.d.cts","sourceRoot":"","sources":["../../../src/components/KeyValueRow/KeyValueRow.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"KeyValueRow.types.d.cts","sourceRoot":"","sources":["../../../src/components/KeyValueRow/KeyValueRow.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,uCAAuC;AAC7E,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GACnD,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,GAAG;IAC5B,4DAA4D;IAC5D,YAAY,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IACpD,gEAAgE;IAChE,cAAc,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IACtD,iGAAiG;IACjG,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sGAAsG;IACtG,qBAAqB,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IACjD,0GAA0G;IAC1G,uBAAuB,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CACpD,CAAC"}

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

@@ -1,177 +1,17 @@
-import type { ReactNode } from "react";
+import type { KeyValueRowPropsShared } from "@metamask/design-system-shared";
 import type { ViewProps } from "react-native/index.js";
-import { ButtonIconSize } from "../ButtonIcon/index.mjs";
-import { IconName, IconSize } from "../Icon/index.mjs";
-import type { IconProps } from "../Icon/index.mjs";
-import type { TextProps } from "../Text/index.mjs";
-/**
- * The optional tooltip that can be displayed within a KeyValueRowField.
- */
-export type KeyValueRowTooltip = {
-    /**
-     * The title displayed at the top of the tooltip.
-     */
-    title: string;
-    /**
-     * The content displayed within the tooltip body.
-     */
-    content: string | ReactNode;
-    /**
-     * Optional size of the tooltip icon button.
-     *
-     * @default ButtonIconSize.Md
-     */
-    size?: ButtonIconSize;
-    /**
-     * Optional icon name for the tooltip icon.
-     *
-     * @default IconName.Question
-     */
-    iconName?: IconName;
-    /**
-     * Optional onPress handler called when the tooltip icon is pressed.
-     */
-    onPress?: (...args: unknown[]) => unknown;
-    /**
-     * Optional bottom padding for the tooltip modal.
-     */
-    bottomPadding?: number;
-};
-/**
- * Used to position an icon in a KeyValueRowField.
- */
-export declare const KeyValueRowFieldIconSides: {
-    readonly Left: "left";
-    readonly Right: "right";
-    readonly Both: "both";
-};
-export type KeyValueRowFieldIconSides = (typeof KeyValueRowFieldIconSides)[keyof typeof KeyValueRowFieldIconSides];
-/**
- * Represents a field displayed within KeyValueRowProps.
- */
-export type KeyValueRowField = {
-    /**
-     * The label content displayed.
-     */
-    label: PreDefinedKeyValueRowLabel | ReactNode;
-    /**
-     * Optional icon to display. If undefined, no icon is displayed.
-     */
-    icon?: IconProps & {
-        side?: KeyValueRowFieldIconSides;
-    };
-    /**
-     * Optional tooltip to display. If undefined, no tooltip is displayed.
-     */
-    tooltip?: KeyValueRowTooltip;
-};
-/**
- * Re-exported for backwards compatibility.
- */
-export declare const IconSizes: typeof IconSize;
-/**
- * Re-exported for backwards compatibility.
- */
-export declare const TooltipSizes: typeof ButtonIconSize;
-/**
- * A predefined label object with text, variant, and color.
- */
-export type PreDefinedKeyValueRowLabel = {
-    /**
-     * Text to display.
-     */
-    text: string;
-    /**
-     * Optional text variant.
-     *
-     * @default TextVariant.BodyMd
-     */
-    variant?: TextProps['variant'];
-    /**
-     * Optional text color.
-     *
-     * @default TextColor.TextDefault
-     */
-    color?: TextProps['color'];
-};
-/**
- * The KeyValueRowLabel component props.
- */
-export type KeyValueRowLabelProps = {
-    /**
-     * The label content displayed.
-     */
-    label: PreDefinedKeyValueRowLabel | ReactNode;
-    /**
-     * Optional tooltip. If undefined, the tooltip won't be displayed.
-     */
-    tooltip?: KeyValueRowTooltip;
-};
-/**
- * Represents the valid KeyValueSection alignments.
- */
-export declare const KeyValueRowSectionAlignments: {
-    readonly Left: "items-start";
-    readonly Right: "items-end";
-};
-export type KeyValueRowSectionAlignments = (typeof KeyValueRowSectionAlignments)[keyof typeof KeyValueRowSectionAlignments];
-/**
- * Represents the main container for the KeyValueRow component.
- *
- * Extends `ViewProps` so the root View inherits standard React Native
- * props such as `testID` and `accessibilityLabel`.
- */
-export type KeyValueRowRootProps = {
-    /**
-     * Must have exactly two children. Adding more will lead to an undesired outcome.
-     */
-    children: [ReactNode, ReactNode];
-    /**
-     * Optional Tailwind class names to override default styles on the root element.
-     */
-    twClassName?: string;
-} & ViewProps;
-/**
- * The KeyValueSection component props.
- *
- * Extends `ViewProps` so the root View inherits standard React Native
- * props such as `testID` and `accessibilityLabel`.
- */
-export type KeyValueSectionProps = {
-    /**
-     * Child components.
-     */
-    children: ReactNode;
-    /**
-     * Optional content alignment.
-     *
-     * @default KeyValueRowSectionAlignments.Left
-     */
-    align?: KeyValueRowSectionAlignments;
-    /**
-     * Optional Tailwind class names to override default styles on the root element.
-     */
+import type { ButtonIconProps } from "../ButtonIcon/ButtonIcon.types.mjs";
+import type { TextProps } from "../Text/Text.types.mjs";
+export type KeyValueRowProps = KeyValueRowPropsShared & Omit<ViewProps, 'children'> & {
+    /** Optional props for the key Text when key is a string. */
+    keyTextProps?: Partial<Omit<TextProps, 'children'>>;
+    /** Optional props for the value Text when value is a string. */
+    valueTextProps?: Partial<Omit<TextProps, 'children'>>;
+    /** Optional Tailwind class names applied to the outer BoxHorizontal. Merged with base styles. */
     twClassName?: string;
-} & ViewProps;
-/**
- * The KeyValueRow component props.
- *
- * Extends `ViewProps` so the root View inherits standard React Native
- * props such as `testID` and `accessibilityLabel`.
- */
-export type KeyValueRowProps = {
-    /**
-     * The "key" portion of the KeyValueRow (left side).
-     * Using the variable name field because key is reserved.
-     */
-    field: KeyValueRowField;
-    /**
-     * The "value" portion of the KeyValueRow (right side).
-     */
-    value: KeyValueRowField;
-    /**
-     * Optional Tailwind class names to override default styles on the root element.
-     */
-    twClassName?: string;
-} & ViewProps;
+    /** When set, renders a ButtonIcon as the key endAccessory (takes precedence over keyEndAccessory). */
+    keyEndButtonIconProps?: Partial<ButtonIconProps>;
+    /** When set, renders a ButtonIcon as the value endAccessory (takes precedence over valueEndAccessory). */
+    valueEndButtonIconProps?: Partial<ButtonIconProps>;
+};
 //# sourceMappingURL=KeyValueRow.types.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"KeyValueRow.types.d.mts","sourceRoot":"","sources":["../../../src/components/KeyValueRow/KeyValueRow.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"KeyValueRow.types.d.mts","sourceRoot":"","sources":["../../../src/components/KeyValueRow/KeyValueRow.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,uCAAuC;AAC7E,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,OAAO,KAAK,EAAE,eAAe,EAAE,2CAAuC;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GACnD,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,GAAG;IAC5B,4DAA4D;IAC5D,YAAY,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IACpD,gEAAgE;IAChE,cAAc,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IACtD,iGAAiG;IACjG,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sGAAsG;IACtG,qBAAqB,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IACjD,0GAA0G;IAC1G,uBAAuB,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CACpD,CAAC"}

package/dist/components/KeyValueRow/KeyValueRow.types.mjs

@@ -1,26 +1,2 @@
-import { ButtonIconSize } from "../ButtonIcon/index.mjs";
-import { IconName, IconSize } from "../Icon/index.mjs";
-/**
- * Used to position an icon in a KeyValueRowField.
- */
-export const KeyValueRowFieldIconSides = {
-    Left: 'left',
-    Right: 'right',
-    Both: 'both',
-};
-/**
- * Re-exported for backwards compatibility.
- */
-export const IconSizes = IconSize;
-/**
- * Re-exported for backwards compatibility.
- */
-export const TooltipSizes = ButtonIconSize;
-/**
- * Represents the valid KeyValueSection alignments.
- */
-export const KeyValueRowSectionAlignments = {
-    Left: 'items-start',
-    Right: 'items-end',
-};
+export {};
 //# sourceMappingURL=KeyValueRow.types.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"KeyValueRow.types.mjs","sourceRoot":"","sources":["../../../src/components/KeyValueRow/KeyValueRow.types.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,gCAAsB;AAC/C,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,0BAAgB;AAsC7C;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG;IACvC,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,OAAO;IACd,IAAI,EAAE,MAAM;CACJ,CAAC;AAuBX;;GAEG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,cAAc,CAAC;AAsC3C;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG;IAC1C,IAAI,EAAE,aAAa;IACnB,KAAK,EAAE,WAAW;CACV,CAAC","sourcesContent":["import type { ReactNode } from 'react';\nimport type { ViewProps } from 'react-native';\n\nimport { ButtonIconSize } from '../ButtonIcon';\nimport { IconName, IconSize } from '../Icon';\nimport type { IconProps } from '../Icon';\nimport type { TextProps } from '../Text';\n\n/**\n * The optional tooltip that can be displayed within a KeyValueRowField.\n */\nexport type KeyValueRowTooltip = {\n  /**\n   * The title displayed at the top of the tooltip.\n   */\n  title: string;\n  /**\n   * The content displayed within the tooltip body.\n   */\n  content: string | ReactNode;\n  /**\n   * Optional size of the tooltip icon button.\n   *\n   * @default ButtonIconSize.Md\n   */\n  size?: ButtonIconSize;\n  /**\n   * Optional icon name for the tooltip icon.\n   *\n   * @default IconName.Question\n   */\n  iconName?: IconName;\n  /**\n   * Optional onPress handler called when the tooltip icon is pressed.\n   */\n  onPress?: (...args: unknown[]) => unknown;\n  /**\n   * Optional bottom padding for the tooltip modal.\n   */\n  bottomPadding?: number;\n};\n\n/**\n * Used to position an icon in a KeyValueRowField.\n */\nexport const KeyValueRowFieldIconSides = {\n  Left: 'left',\n  Right: 'right',\n  Both: 'both',\n} as const;\n\nexport type KeyValueRowFieldIconSides =\n  (typeof KeyValueRowFieldIconSides)[keyof typeof KeyValueRowFieldIconSides];\n\n/**\n * Represents a field displayed within KeyValueRowProps.\n */\nexport type KeyValueRowField = {\n  /**\n   * The label content displayed.\n   */\n  label: PreDefinedKeyValueRowLabel | ReactNode;\n  /**\n   * Optional icon to display. If undefined, no icon is displayed.\n   */\n  icon?: IconProps & { side?: KeyValueRowFieldIconSides };\n  /**\n   * Optional tooltip to display. If undefined, no tooltip is displayed.\n   */\n  tooltip?: KeyValueRowTooltip;\n};\n\n/**\n * Re-exported for backwards compatibility.\n */\nexport const IconSizes = IconSize;\n\n/**\n * Re-exported for backwards compatibility.\n */\nexport const TooltipSizes = ButtonIconSize;\n\n/**\n * A predefined label object with text, variant, and color.\n */\nexport type PreDefinedKeyValueRowLabel = {\n  /**\n   * Text to display.\n   */\n  text: string;\n  /**\n   * Optional text variant.\n   *\n   * @default TextVariant.BodyMd\n   */\n  variant?: TextProps['variant'];\n  /**\n   * Optional text color.\n   *\n   * @default TextColor.TextDefault\n   */\n  color?: TextProps['color'];\n};\n\n/**\n * The KeyValueRowLabel component props.\n */\nexport type KeyValueRowLabelProps = {\n  /**\n   * The label content displayed.\n   */\n  label: PreDefinedKeyValueRowLabel | ReactNode;\n  /**\n   * Optional tooltip. If undefined, the tooltip won't be displayed.\n   */\n  tooltip?: KeyValueRowTooltip;\n};\n\n/**\n * Represents the valid KeyValueSection alignments.\n */\nexport const KeyValueRowSectionAlignments = {\n  Left: 'items-start',\n  Right: 'items-end',\n} as const;\n\nexport type KeyValueRowSectionAlignments =\n  (typeof KeyValueRowSectionAlignments)[keyof typeof KeyValueRowSectionAlignments];\n\n/**\n * Represents the main container for the KeyValueRow component.\n *\n * Extends `ViewProps` so the root View inherits standard React Native\n * props such as `testID` and `accessibilityLabel`.\n */\nexport type KeyValueRowRootProps = {\n  /**\n   * Must have exactly two children. Adding more will lead to an undesired outcome.\n   */\n  children: [ReactNode, ReactNode];\n  /**\n   * Optional Tailwind class names to override default styles on the root element.\n   */\n  twClassName?: string;\n} & ViewProps;\n\n/**\n * The KeyValueSection component props.\n *\n * Extends `ViewProps` so the root View inherits standard React Native\n * props such as `testID` and `accessibilityLabel`.\n */\nexport type KeyValueSectionProps = {\n  /**\n   * Child components.\n   */\n  children: ReactNode;\n  /**\n   * Optional content alignment.\n   *\n   * @default KeyValueRowSectionAlignments.Left\n   */\n  align?: KeyValueRowSectionAlignments;\n  /**\n   * Optional Tailwind class names to override default styles on the root element.\n   */\n  twClassName?: string;\n} & ViewProps;\n\n/**\n * The KeyValueRow component props.\n *\n * Extends `ViewProps` so the root View inherits standard React Native\n * props such as `testID` and `accessibilityLabel`.\n */\nexport type KeyValueRowProps = {\n  /**\n   * The \"key\" portion of the KeyValueRow (left side).\n   * Using the variable name field because key is reserved.\n   */\n  field: KeyValueRowField;\n  /**\n   * The \"value\" portion of the KeyValueRow (right side).\n   */\n  value: KeyValueRowField;\n  /**\n   * Optional Tailwind class names to override default styles on the root element.\n   */\n  twClassName?: string;\n} & ViewProps;\n"]}
+{"version":3,"file":"KeyValueRow.types.mjs","sourceRoot":"","sources":["../../../src/components/KeyValueRow/KeyValueRow.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { KeyValueRowPropsShared } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\nimport type { ButtonIconProps } from '../ButtonIcon/ButtonIcon.types';\nimport type { TextProps } from '../Text/Text.types';\n\nexport type KeyValueRowProps = KeyValueRowPropsShared &\n  Omit<ViewProps, 'children'> & {\n    /** Optional props for the key Text when key is a string. */\n    keyTextProps?: Partial<Omit<TextProps, 'children'>>;\n    /** Optional props for the value Text when value is a string. */\n    valueTextProps?: Partial<Omit<TextProps, 'children'>>;\n    /** Optional Tailwind class names applied to the outer BoxHorizontal. Merged with base styles. */\n    twClassName?: string;\n    /** When set, renders a ButtonIcon as the key endAccessory (takes precedence over keyEndAccessory). */\n    keyEndButtonIconProps?: Partial<ButtonIconProps>;\n    /** When set, renders a ButtonIcon as the value endAccessory (takes precedence over valueEndAccessory). */\n    valueEndButtonIconProps?: Partial<ButtonIconProps>;\n  };\n"]}

package/dist/components/KeyValueRow/index.cjs

@@ -1,12 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.IconSizes = exports.TooltipSizes = exports.KeyValueRowFieldIconSides = exports.KeyValueRowSectionAlignments = exports.KeyValueRowStubs = exports.KeyValueRow = void 0;
+exports.KeyValueRow = exports.KeyValueRowVariant = void 0;
+var design_system_shared_1 = require("@metamask/design-system-shared");
+Object.defineProperty(exports, "KeyValueRowVariant", { enumerable: true, get: function () { return design_system_shared_1.KeyValueRowVariant; } });
 var KeyValueRow_1 = require("./KeyValueRow.cjs");
 Object.defineProperty(exports, "KeyValueRow", { enumerable: true, get: function () { return KeyValueRow_1.KeyValueRow; } });
-Object.defineProperty(exports, "KeyValueRowStubs", { enumerable: true, get: function () { return KeyValueRow_1.KeyValueRowStubs; } });
-var KeyValueRow_types_1 = require("./KeyValueRow.types.cjs");
-Object.defineProperty(exports, "KeyValueRowSectionAlignments", { enumerable: true, get: function () { return KeyValueRow_types_1.KeyValueRowSectionAlignments; } });
-Object.defineProperty(exports, "KeyValueRowFieldIconSides", { enumerable: true, get: function () { return KeyValueRow_types_1.KeyValueRowFieldIconSides; } });
-Object.defineProperty(exports, "TooltipSizes", { enumerable: true, get: function () { return KeyValueRow_types_1.TooltipSizes; } });
-Object.defineProperty(exports, "IconSizes", { enumerable: true, get: function () { return KeyValueRow_types_1.IconSizes; } });
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/KeyValueRow/index.tsx"],"names":[],"mappings":";;;AAAA,iDAA8D;AAArD,0GAAA,WAAW,OAAA;AAAE,+GAAA,gBAAgB,OAAA;AACtC,6DAY6B;AAX3B,iIAAA,4BAA4B,OAAA;AAC5B,8HAAA,yBAAyB,OAAA;AACzB,iHAAA,YAAY,OAAA;AACZ,8GAAA,SAAS,OAAA","sourcesContent":["export { KeyValueRow, KeyValueRowStubs } from './KeyValueRow';\nexport {\n  KeyValueRowSectionAlignments,\n  KeyValueRowFieldIconSides,\n  TooltipSizes,\n  IconSizes,\n  type KeyValueRowTooltip,\n  type KeyValueRowField,\n  type PreDefinedKeyValueRowLabel,\n  type KeyValueRowLabelProps,\n  type KeyValueRowRootProps,\n  type KeyValueSectionProps,\n  type KeyValueRowProps,\n} from './KeyValueRow.types';\n"]}
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/KeyValueRow/index.ts"],"names":[],"mappings":";;;AAAA,uEAAoE;AAA3D,0HAAA,kBAAkB,OAAA;AAC3B,iDAA4C;AAAnC,0GAAA,WAAW,OAAA","sourcesContent":["export { KeyValueRowVariant } from '@metamask/design-system-shared';\nexport { KeyValueRow } from './KeyValueRow';\nexport type { KeyValueRowProps } from './KeyValueRow.types';\n"]}

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

@@ -1,3 +1,4 @@
-export { KeyValueRow, KeyValueRowStubs } from "./KeyValueRow.cjs";
-export { KeyValueRowSectionAlignments, KeyValueRowFieldIconSides, TooltipSizes, IconSizes, type KeyValueRowTooltip, type KeyValueRowField, type PreDefinedKeyValueRowLabel, type KeyValueRowLabelProps, type KeyValueRowRootProps, type KeyValueSectionProps, type KeyValueRowProps, } from "./KeyValueRow.types.cjs";
+export { KeyValueRowVariant } from "@metamask/design-system-shared";
+export { KeyValueRow } from "./KeyValueRow.cjs";
+export type { KeyValueRowProps } from "./KeyValueRow.types.cjs";
 //# sourceMappingURL=index.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/KeyValueRow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,gBAAgB,EAAE,0BAAsB;AAC9D,OAAO,EACL,4BAA4B,EAC5B,yBAAyB,EACzB,YAAY,EACZ,SAAS,EACT,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,EACrB,KAAK,0BAA0B,EAC/B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,gBAAgB,GACtB,gCAA4B"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/KeyValueRow/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,uCAAuC;AACpE,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}

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

@@ -1,3 +1,4 @@
-export { KeyValueRow, KeyValueRowStubs } from "./KeyValueRow.mjs";
-export { KeyValueRowSectionAlignments, KeyValueRowFieldIconSides, TooltipSizes, IconSizes, type KeyValueRowTooltip, type KeyValueRowField, type PreDefinedKeyValueRowLabel, type KeyValueRowLabelProps, type KeyValueRowRootProps, type KeyValueSectionProps, type KeyValueRowProps, } from "./KeyValueRow.types.mjs";
+export { KeyValueRowVariant } from "@metamask/design-system-shared";
+export { KeyValueRow } from "./KeyValueRow.mjs";
+export type { KeyValueRowProps } from "./KeyValueRow.types.mjs";
 //# sourceMappingURL=index.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/KeyValueRow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,gBAAgB,EAAE,0BAAsB;AAC9D,OAAO,EACL,4BAA4B,EAC5B,yBAAyB,EACzB,YAAY,EACZ,SAAS,EACT,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,EACrB,KAAK,0BAA0B,EAC/B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,gBAAgB,GACtB,gCAA4B"}
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/KeyValueRow/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,uCAAuC;AACpE,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}

package/dist/components/KeyValueRow/index.mjs

@@ -1,3 +1,3 @@
-export { KeyValueRow, KeyValueRowStubs } from "./KeyValueRow.mjs";
-export { KeyValueRowSectionAlignments, KeyValueRowFieldIconSides, TooltipSizes, IconSizes } from "./KeyValueRow.types.mjs";
+export { KeyValueRowVariant } from "@metamask/design-system-shared";
+export { KeyValueRow } from "./KeyValueRow.mjs";
 //# sourceMappingURL=index.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/KeyValueRow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,gBAAgB,EAAE,0BAAsB;AAC9D,OAAO,EACL,4BAA4B,EAC5B,yBAAyB,EACzB,YAAY,EACZ,SAAS,EAQV,gCAA4B","sourcesContent":["export { KeyValueRow, KeyValueRowStubs } from './KeyValueRow';\nexport {\n  KeyValueRowSectionAlignments,\n  KeyValueRowFieldIconSides,\n  TooltipSizes,\n  IconSizes,\n  type KeyValueRowTooltip,\n  type KeyValueRowField,\n  type PreDefinedKeyValueRowLabel,\n  type KeyValueRowLabelProps,\n  type KeyValueRowRootProps,\n  type KeyValueSectionProps,\n  type KeyValueRowProps,\n} from './KeyValueRow.types';\n"]}
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/KeyValueRow/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,uCAAuC;AACpE,OAAO,EAAE,WAAW,EAAE,0BAAsB","sourcesContent":["export { KeyValueRowVariant } from '@metamask/design-system-shared';\nexport { KeyValueRow } from './KeyValueRow';\nexport type { KeyValueRowProps } from './KeyValueRow.types';\n"]}

package/dist/components/index.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ButtonBase = exports.ButtonAnimated = exports.Card = exports.BoxVertical = exports.BoxHorizontal = exports.BoxBorderColor = exports.BoxBackgroundColor = exports.BoxJustifyContent = exports.BoxAlignItems = exports.BoxFlexWrap = exports.BoxFlexDirection = exports.Box = exports.Blockies = exports.BottomSheetOverlay = exports.BottomSheetHeaderVariant = exports.BottomSheetHeader = exports.ButtonsAlignment = exports.BottomSheetFooter = exports.BottomSheetDialog = exports.BottomSheet = exports.BannerBase = exports.BadgeWrapperPositionAnchorShape = exports.BadgeWrapperPosition = exports.BadgeWrapper = exports.BadgeStatusSize = exports.BadgeStatusStatus = exports.BadgeStatus = exports.BadgeNetwork = exports.BadgeIcon = exports.BadgeCountSize = exports.BadgeCount = exports.AvatarTokenSize = exports.AvatarToken = exports.AvatarNetworkSize = exports.AvatarNetwork = exports.AvatarIconSize = exports.AvatarIconSeverity = exports.AvatarIcon = exports.AvatarGroupVariant = exports.AvatarGroupSize = exports.AvatarGroup = exports.AvatarFaviconSize = exports.AvatarFavicon = exports.AvatarBaseShape = exports.AvatarBaseSize = exports.AvatarBase = exports.AvatarAccountSize = exports.AvatarAccountVariant = exports.AvatarAccount = exports.ActionListItem = void 0;
-exports.Spinner = exports.ImageOrSvg = exports.ButtonFilter = exports.ButtonHeroSize = exports.ButtonHero = exports.ToastContextWrapper = exports.ToastContext = exports.ToastCloseButtonVariant = exports.ToastVariant = exports.Toast = exports.TextOrChildren = exports.TextFieldSearch = exports.TextField = exports.TextVariant = exports.TextColor = exports.FontStyle = exports.FontFamily = exports.FontWeight = exports.Text = exports.TextButton = exports.TabEmptyState = exports.SensitiveTextLength = exports.SensitiveText = exports.Skeleton = exports.MainActionButton = exports.Maskicon = exports.Jazzicon = exports.RadioButton = exports.ListItemVerticalAlignment = exports.ListItem = exports.Label = exports.Input = exports.IconSize = exports.IconName = exports.IconColor = exports.Icon = exports.HeaderStandard = exports.HeaderRoot = exports.HeaderBaseVariant = exports.HeaderBase = exports.Checkbox = exports.ButtonSemanticSeverity = exports.ButtonSemantic = exports.ButtonIconVariant = exports.ButtonIconSize = exports.ButtonIcon = exports.ButtonVariant = exports.ButtonSize = exports.Button = exports.ButtonBaseSize = void 0;
-exports.BannerAlertSeverity = exports.BannerAlert = void 0;
+exports.ButtonBase = exports.ButtonAnimated = exports.Card = exports.BoxColumn = exports.BoxRow = exports.BoxBorderColor = exports.BoxBackgroundColor = exports.BoxJustifyContent = exports.BoxAlignItems = exports.BoxFlexWrap = exports.BoxFlexDirection = exports.Box = exports.Blockies = exports.BottomSheetOverlay = exports.BottomSheetHeaderVariant = exports.BottomSheetHeader = exports.ButtonsAlignment = exports.BottomSheetFooter = exports.BottomSheetDialog = exports.BottomSheet = exports.BannerBase = exports.BadgeWrapperPositionAnchorShape = exports.BadgeWrapperPosition = exports.BadgeWrapper = exports.BadgeStatusSize = exports.BadgeStatusStatus = exports.BadgeStatus = exports.BadgeNetwork = exports.BadgeIcon = exports.BadgeCountSize = exports.BadgeCount = exports.AvatarTokenSize = exports.AvatarToken = exports.AvatarNetworkSize = exports.AvatarNetwork = exports.AvatarIconSize = exports.AvatarIconSeverity = exports.AvatarIcon = exports.AvatarGroupVariant = exports.AvatarGroupSize = exports.AvatarGroup = exports.AvatarFaviconSize = exports.AvatarFavicon = exports.AvatarBaseShape = exports.AvatarBaseSize = exports.AvatarBase = exports.AvatarAccountSize = exports.AvatarAccountVariant = exports.AvatarAccount = exports.ActionListItem = void 0;
+exports.ToastContextWrapper = exports.ToastContext = exports.ToastCloseButtonVariant = exports.ToastVariant = exports.Toast = exports.TextOrChildren = exports.TextFieldSearch = exports.TextField = exports.TextVariant = exports.TextColor = exports.FontStyle = exports.FontFamily = exports.FontWeight = exports.Text = exports.TextButton = exports.TabEmptyState = exports.SensitiveTextLength = exports.SensitiveText = exports.Skeleton = exports.MainActionButton = exports.Maskicon = exports.Jazzicon = exports.RadioButton = exports.ListItemVerticalAlignment = exports.ListItem = exports.Label = exports.KeyValueRowVariant = exports.KeyValueRow = exports.KeyValueColumn = exports.Input = exports.IconSize = exports.IconName = exports.IconColor = exports.Icon = exports.HeaderStandard = exports.HeaderSearchVariant = exports.HeaderSearch = exports.HeaderRoot = exports.HeaderBaseVariant = exports.HeaderBase = exports.Checkbox = exports.ButtonSemanticSeverity = exports.ButtonSemantic = exports.ButtonIconVariant = exports.ButtonIconSize = exports.ButtonIcon = exports.ButtonVariant = exports.ButtonSize = exports.Button = exports.ButtonBaseSize = void 0;
+exports.BannerAlertSeverity = exports.BannerAlert = exports.Spinner = exports.ImageOrSvg = exports.ButtonFilter = exports.ButtonHeroSize = exports.ButtonHero = void 0;
 var ActionListItem_1 = require("./ActionListItem/index.cjs");
 Object.defineProperty(exports, "ActionListItem", { enumerable: true, get: function () { return ActionListItem_1.ActionListItem; } });
 var AvatarAccount_1 = require("./AvatarAccount/index.cjs");
@@ -69,10 +69,10 @@ Object.defineProperty(exports, "BoxAlignItems", { enumerable: true, get: functio
 Object.defineProperty(exports, "BoxJustifyContent", { enumerable: true, get: function () { return Box_1.BoxJustifyContent; } });
 Object.defineProperty(exports, "BoxBackgroundColor", { enumerable: true, get: function () { return Box_1.BoxBackgroundColor; } });
 Object.defineProperty(exports, "BoxBorderColor", { enumerable: true, get: function () { return Box_1.BoxBorderColor; } });
-var BoxHorizontal_1 = require("./BoxHorizontal/index.cjs");
-Object.defineProperty(exports, "BoxHorizontal", { enumerable: true, get: function () { return BoxHorizontal_1.BoxHorizontal; } });
-var BoxVertical_1 = require("./BoxVertical/index.cjs");
-Object.defineProperty(exports, "BoxVertical", { enumerable: true, get: function () { return BoxVertical_1.BoxVertical; } });
+var BoxRow_1 = require("./BoxRow/index.cjs");
+Object.defineProperty(exports, "BoxRow", { enumerable: true, get: function () { return BoxRow_1.BoxRow; } });
+var BoxColumn_1 = require("./BoxColumn/index.cjs");
+Object.defineProperty(exports, "BoxColumn", { enumerable: true, get: function () { return BoxColumn_1.BoxColumn; } });
 var Card_1 = require("./Card/index.cjs");
 Object.defineProperty(exports, "Card", { enumerable: true, get: function () { return Card_1.Card; } });
 var ButtonAnimated_1 = require("./temp-components/ButtonAnimated/index.cjs");
@@ -98,6 +98,9 @@ Object.defineProperty(exports, "HeaderBase", { enumerable: true, get: function (
 Object.defineProperty(exports, "HeaderBaseVariant", { enumerable: true, get: function () { return HeaderBase_1.HeaderBaseVariant; } });
 var HeaderRoot_1 = require("./HeaderRoot/index.cjs");
 Object.defineProperty(exports, "HeaderRoot", { enumerable: true, get: function () { return HeaderRoot_1.HeaderRoot; } });
+var HeaderSearch_1 = require("./HeaderSearch/index.cjs");
+Object.defineProperty(exports, "HeaderSearch", { enumerable: true, get: function () { return HeaderSearch_1.HeaderSearch; } });
+Object.defineProperty(exports, "HeaderSearchVariant", { enumerable: true, get: function () { return HeaderSearch_1.HeaderSearchVariant; } });
 var HeaderStandard_1 = require("./HeaderStandard/index.cjs");
 Object.defineProperty(exports, "HeaderStandard", { enumerable: true, get: function () { return HeaderStandard_1.HeaderStandard; } });
 var Icon_1 = require("./Icon/index.cjs");
@@ -107,6 +110,11 @@ Object.defineProperty(exports, "IconName", { enumerable: true, get: function ()
 Object.defineProperty(exports, "IconSize", { enumerable: true, get: function () { return Icon_1.IconSize; } });
 var Input_1 = require("./Input/index.cjs");
 Object.defineProperty(exports, "Input", { enumerable: true, get: function () { return Input_1.Input; } });
+var KeyValueColumn_1 = require("./KeyValueColumn/index.cjs");
+Object.defineProperty(exports, "KeyValueColumn", { enumerable: true, get: function () { return KeyValueColumn_1.KeyValueColumn; } });
+var KeyValueRow_1 = require("./KeyValueRow/index.cjs");
+Object.defineProperty(exports, "KeyValueRow", { enumerable: true, get: function () { return KeyValueRow_1.KeyValueRow; } });
+Object.defineProperty(exports, "KeyValueRowVariant", { enumerable: true, get: function () { return KeyValueRow_1.KeyValueRowVariant; } });
 var Label_1 = require("./Label/index.cjs");
 Object.defineProperty(exports, "Label", { enumerable: true, get: function () { return Label_1.Label; } });
 var ListItem_1 = require("./ListItem/index.cjs");