npm - @metamask/design-system-react-native - Versions diffs - 0.15.0 → 0.16.0 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (218) hide show

package/dist/components/HeaderSearch/HeaderSearch.cjs ADDED Viewed

@@ -0,0 +1,80 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HeaderSearch = void 0;
+const design_system_shared_1 = require("@metamask/design-system-shared");
+const react_1 = __importDefault(require("react"));
+const Box_1 = require("../Box/index.cjs");
+const Button_1 = require("../Button/index.cjs");
+const ButtonIcon_1 = require("../ButtonIcon/index.cjs");
+const Icon_1 = require("../Icon/index.cjs");
+const TextFieldSearch_1 = require("../TextFieldSearch/index.cjs");
+const CANCEL_LABEL = 'Cancel';
+/**
+ * HeaderSearch is a header component that combines a search field
+ * with either a back button (screen variant) or cancel button (inline variant).
+ *
+ * @example
+ * // Screen variant with back button
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Screen}
+ *   onPressBackButton={handleBack}
+ *   textFieldSearchProps={{
+ *     value: searchText,
+ *     onChangeText: setSearchText,
+ *     onPressClearButton: () => setSearchText(''),
+ *     placeholder: 'Search...',
+ *   }}
+ * />
+ *
+ * @example
+ * // Inline variant with cancel button
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Inline}
+ *   onPressCancelButton={handleCancel}
+ *   textFieldSearchProps={{
+ *     value: searchText,
+ *     onChangeText: setSearchText,
+ *     onPressClearButton: () => setSearchText(''),
+ *     placeholder: 'Search...',
+ *   }}
+ * />
+ *
+ * @param props - Header row props (discriminated by `variant`).
+ * @returns The header search UI for the active variant.
+ */
+const HeaderSearch = (props) => {
+    const baseTwClassName = 'h-14 flex-row items-center';
+    if (props.variant === design_system_shared_1.HeaderSearchVariant.Screen) {
+        const { variant: _variant, textFieldSearchProps, twClassName, onPressBackButton, backButtonProps, ...screenBoxProps } = props;
+        return (<Box_1.Box {...screenBoxProps} twClassName={twClassName
+                ? `${baseTwClassName} ml-1 mr-4 gap-2 ${twClassName}`
+                : `${baseTwClassName} ml-1 mr-4 gap-2`}>
+        <ButtonIcon_1.ButtonIcon size={ButtonIcon_1.ButtonIconSize.Md} {...backButtonProps} iconName={Icon_1.IconName.ArrowLeft} onPress={onPressBackButton}/>
+        <TextFieldSearch_1.TextFieldSearch {...textFieldSearchProps} twClassName={textFieldSearchProps.twClassName
+                ? `flex-1 ${textFieldSearchProps.twClassName}`
+                : 'flex-1'}/>
+      </Box_1.Box>);
+    }
+    const { variant: _variant, textFieldSearchProps, twClassName, onPressCancelButton, cancelButtonProps, ...inlineBoxProps } = props;
+    return (<Box_1.Box {...inlineBoxProps} twClassName={twClassName
+            ? `${baseTwClassName} ml-4 ${twClassName}`
+            : `${baseTwClassName} ml-4`}>
+      <TextFieldSearch_1.TextFieldSearch {...textFieldSearchProps} twClassName={textFieldSearchProps.twClassName
+            ? `flex-1 ${textFieldSearchProps.twClassName}`
+            : 'flex-1'}/>
+      <Button_1.Button {...cancelButtonProps} variant={Button_1.ButtonVariant.Tertiary} onPress={onPressCancelButton} textProps={{
+            ...cancelButtonProps?.textProps,
+            twClassName: cancelButtonProps?.textProps?.twClassName
+                ? `text-default ${cancelButtonProps.textProps.twClassName}`
+                : 'text-default',
+        }}>
+        {CANCEL_LABEL}
+      </Button_1.Button>
+    </Box_1.Box>);
+};
+exports.HeaderSearch = HeaderSearch;
+exports.HeaderSearch.displayName = 'HeaderSearch';
+//# sourceMappingURL=HeaderSearch.cjs.map

package/dist/components/HeaderSearch/HeaderSearch.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"HeaderSearch.cjs","sourceRoot":"","sources":["../../../src/components/HeaderSearch/HeaderSearch.tsx"],"names":[],"mappings":";;;;;;AAAA,yEAAqE;AACrE,kDAA0B;AAE1B,0CAA6B;AAC7B,gDAAkD;AAClD,wDAA2D;AAC3D,4CAAmC;AACnC,kEAAqD;AAKrD,MAAM,YAAY,GAAG,QAAQ,CAAC;AAE9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACI,MAAM,YAAY,GAAgC,CAAC,KAAK,EAAE,EAAE;IACjE,MAAM,eAAe,GAAG,4BAA4B,CAAC;IAErD,IAAI,KAAK,CAAC,OAAO,KAAK,0CAAmB,CAAC,MAAM,EAAE;QAChD,MAAM,EACJ,OAAO,EAAE,QAAQ,EACjB,oBAAoB,EACpB,WAAW,EACX,iBAAiB,EACjB,eAAe,EACf,GAAG,cAAc,EAClB,GAAG,KAAK,CAAC;QAEV,OAAO,CACL,CAAC,SAAG,CACF,IAAI,cAAc,CAAC,CACnB,WAAW,CAAC,CACV,WAAW;gBACT,CAAC,CAAC,GAAG,eAAe,oBAAoB,WAAW,EAAE;gBACrD,CAAC,CAAC,GAAG,eAAe,kBAAkB,CACzC,CAED;QAAA,CAAC,uBAAU,CACT,IAAI,CAAC,CAAC,2BAAc,CAAC,EAAE,CAAC,CACxB,IAAI,eAAe,CAAC,CACpB,QAAQ,CAAC,CAAC,eAAQ,CAAC,SAAS,CAAC,CAC7B,OAAO,CAAC,CAAC,iBAAiB,CAAC,EAE7B;QAAA,CAAC,iCAAe,CACd,IAAK,oBAA6C,CAAC,CACnD,WAAW,CAAC,CACV,oBAAoB,CAAC,WAAW;gBAC9B,CAAC,CAAC,UAAU,oBAAoB,CAAC,WAAW,EAAE;gBAC9C,CAAC,CAAC,QAAQ,CACb,EAEL;MAAA,EAAE,SAAG,CAAC,CACP,CAAC;KACH;IAED,MAAM,EACJ,OAAO,EAAE,QAAQ,EACjB,oBAAoB,EACpB,WAAW,EACX,mBAAmB,EACnB,iBAAiB,EACjB,GAAG,cAAc,EAClB,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,CAAC,SAAG,CACF,IAAI,cAAc,CAAC,CACnB,WAAW,CAAC,CACV,WAAW;YACT,CAAC,CAAC,GAAG,eAAe,SAAS,WAAW,EAAE;YAC1C,CAAC,CAAC,GAAG,eAAe,OAAO,CAC9B,CAED;MAAA,CAAC,iCAAe,CACd,IAAK,oBAA6C,CAAC,CACnD,WAAW,CAAC,CACV,oBAAoB,CAAC,WAAW;YAC9B,CAAC,CAAC,UAAU,oBAAoB,CAAC,WAAW,EAAE;YAC9C,CAAC,CAAC,QAAQ,CACb,EAEH;MAAA,CAAC,eAAM,CACL,IAAI,iBAAiB,CAAC,CACtB,OAAO,CAAC,CAAC,sBAAa,CAAC,QAAQ,CAAC,CAChC,OAAO,CAAC,CAAC,mBAAmB,CAAC,CAC7B,SAAS,CAAC,CAAC;YACT,GAAG,iBAAiB,EAAE,SAAS;YAC/B,WAAW,EAAE,iBAAiB,EAAE,SAAS,EAAE,WAAW;gBACpD,CAAC,CAAC,gBAAgB,iBAAiB,CAAC,SAAS,CAAC,WAAW,EAAE;gBAC3D,CAAC,CAAC,cAAc;SACnB,CAAC,CAEF;QAAA,CAAC,YAAY,CACf;MAAA,EAAE,eAAM,CACV;IAAA,EAAE,SAAG,CAAC,CACP,CAAC;AACJ,CAAC,CAAC;AAjFW,QAAA,YAAY,gBAiFvB;AAEF,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import { HeaderSearchVariant } from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { Box } from '../Box';\nimport { Button, ButtonVariant } from '../Button';\nimport { ButtonIcon, ButtonIconSize } from '../ButtonIcon';\nimport { IconName } from '../Icon';\nimport { TextFieldSearch } from '../TextFieldSearch';\nimport type { TextFieldSearchProps } from '../TextFieldSearch';\n\nimport type { HeaderSearchProps } from './HeaderSearch.types';\n\nconst CANCEL_LABEL = 'Cancel';\n\n/**\n * HeaderSearch is a header component that combines a search field\n * with either a back button (screen variant) or cancel button (inline variant).\n *\n * @example\n * // Screen variant with back button\n * <HeaderSearch\n * variant={HeaderSearchVariant.Screen}\n * onPressBackButton={handleBack}\n * textFieldSearchProps={{\n * value: searchText,\n * onChangeText: setSearchText,\n * onPressClearButton: () => setSearchText(''),\n * placeholder: 'Search...',\n * }}\n * />\n *\n * @example\n * // Inline variant with cancel button\n * <HeaderSearch\n * variant={HeaderSearchVariant.Inline}\n * onPressCancelButton={handleCancel}\n * textFieldSearchProps={{\n * value: searchText,\n * onChangeText: setSearchText,\n * onPressClearButton: () => setSearchText(''),\n * placeholder: 'Search...',\n * }}\n * />\n *\n * @param props - Header row props (discriminated by `variant`).\n * @returns The header search UI for the active variant.\n */\nexport const HeaderSearch: React.FC<HeaderSearchProps> = (props) => {\n const baseTwClassName = 'h-14 flex-row items-center';\n\n if (props.variant === HeaderSearchVariant.Screen) {\n const {\n variant: _variant,\n textFieldSearchProps,\n twClassName,\n onPressBackButton,\n backButtonProps,\n ...screenBoxProps\n } = props;\n\n return (\n <Box\n {...screenBoxProps}\n twClassName={\n twClassName\n ? `${baseTwClassName} ml-1 mr-4 gap-2 ${twClassName}`\n : `${baseTwClassName} ml-1 mr-4 gap-2`\n }\n >\n <ButtonIcon\n size={ButtonIconSize.Md}\n {...backButtonProps}\n iconName={IconName.ArrowLeft}\n onPress={onPressBackButton}\n />\n <TextFieldSearch\n {...(textFieldSearchProps as TextFieldSearchProps)}\n twClassName={\n textFieldSearchProps.twClassName\n ? `flex-1 ${textFieldSearchProps.twClassName}`\n : 'flex-1'\n }\n />\n </Box>\n );\n }\n\n const {\n variant: _variant,\n textFieldSearchProps,\n twClassName,\n onPressCancelButton,\n cancelButtonProps,\n ...inlineBoxProps\n } = props;\n\n return (\n <Box\n {...inlineBoxProps}\n twClassName={\n twClassName\n ? `${baseTwClassName} ml-4 ${twClassName}`\n : `${baseTwClassName} ml-4`\n }\n >\n <TextFieldSearch\n {...(textFieldSearchProps as TextFieldSearchProps)}\n twClassName={\n textFieldSearchProps.twClassName\n ? `flex-1 ${textFieldSearchProps.twClassName}`\n : 'flex-1'\n }\n />\n <Button\n {...cancelButtonProps}\n variant={ButtonVariant.Tertiary}\n onPress={onPressCancelButton}\n textProps={{\n ...cancelButtonProps?.textProps,\n twClassName: cancelButtonProps?.textProps?.twClassName\n ? `text-default ${cancelButtonProps.textProps.twClassName}`\n : 'text-default',\n }}\n >\n {CANCEL_LABEL}\n </Button>\n </Box>\n );\n};\n\nHeaderSearch.displayName = 'HeaderSearch';\n"]}

package/dist/components/HeaderSearch/HeaderSearch.d.cts ADDED Viewed

@@ -0,0 +1,37 @@
+import React from "react";
+import type { HeaderSearchProps } from "./HeaderSearch.types.cjs";
+/**
+ * HeaderSearch is a header component that combines a search field
+ * with either a back button (screen variant) or cancel button (inline variant).
+ *
+ * @example
+ * // Screen variant with back button
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Screen}
+ *   onPressBackButton={handleBack}
+ *   textFieldSearchProps={{
+ *     value: searchText,
+ *     onChangeText: setSearchText,
+ *     onPressClearButton: () => setSearchText(''),
+ *     placeholder: 'Search...',
+ *   }}
+ * />
+ *
+ * @example
+ * // Inline variant with cancel button
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Inline}
+ *   onPressCancelButton={handleCancel}
+ *   textFieldSearchProps={{
+ *     value: searchText,
+ *     onChangeText: setSearchText,
+ *     onPressClearButton: () => setSearchText(''),
+ *     placeholder: 'Search...',
+ *   }}
+ * />
+ *
+ * @param props - Header row props (discriminated by `variant`).
+ * @returns The header search UI for the active variant.
+ */
+export declare const HeaderSearch: React.FC<HeaderSearchProps>;
+//# sourceMappingURL=HeaderSearch.d.cts.map

package/dist/components/HeaderSearch/HeaderSearch.d.cts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"HeaderSearch.d.cts","sourceRoot":"","sources":["../../../src/components/HeaderSearch/HeaderSearch.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAS1B,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAI9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAiFpD,CAAC"}

package/dist/components/HeaderSearch/HeaderSearch.d.mts ADDED Viewed

@@ -0,0 +1,37 @@
+import React from "react";
+import type { HeaderSearchProps } from "./HeaderSearch.types.mjs";
+/**
+ * HeaderSearch is a header component that combines a search field
+ * with either a back button (screen variant) or cancel button (inline variant).
+ *
+ * @example
+ * // Screen variant with back button
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Screen}
+ *   onPressBackButton={handleBack}
+ *   textFieldSearchProps={{
+ *     value: searchText,
+ *     onChangeText: setSearchText,
+ *     onPressClearButton: () => setSearchText(''),
+ *     placeholder: 'Search...',
+ *   }}
+ * />
+ *
+ * @example
+ * // Inline variant with cancel button
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Inline}
+ *   onPressCancelButton={handleCancel}
+ *   textFieldSearchProps={{
+ *     value: searchText,
+ *     onChangeText: setSearchText,
+ *     onPressClearButton: () => setSearchText(''),
+ *     placeholder: 'Search...',
+ *   }}
+ * />
+ *
+ * @param props - Header row props (discriminated by `variant`).
+ * @returns The header search UI for the active variant.
+ */
+export declare const HeaderSearch: React.FC<HeaderSearchProps>;
+//# sourceMappingURL=HeaderSearch.d.mts.map

package/dist/components/HeaderSearch/HeaderSearch.d.mts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"HeaderSearch.d.mts","sourceRoot":"","sources":["../../../src/components/HeaderSearch/HeaderSearch.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAS1B,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAI9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAiFpD,CAAC"}

package/dist/components/HeaderSearch/HeaderSearch.mjs ADDED Viewed

@@ -0,0 +1,80 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+import { HeaderSearchVariant } from "@metamask/design-system-shared";
+import $React from "react";
+const React = $importDefault($React);
+import { Box } from "../Box/index.mjs";
+import { Button, ButtonVariant } from "../Button/index.mjs";
+import { ButtonIcon, ButtonIconSize } from "../ButtonIcon/index.mjs";
+import { IconName } from "../Icon/index.mjs";
+import { TextFieldSearch } from "../TextFieldSearch/index.mjs";
+const CANCEL_LABEL = 'Cancel';
+/**
+ * HeaderSearch is a header component that combines a search field
+ * with either a back button (screen variant) or cancel button (inline variant).
+ *
+ * @example
+ * // Screen variant with back button
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Screen}
+ *   onPressBackButton={handleBack}
+ *   textFieldSearchProps={{
+ *     value: searchText,
+ *     onChangeText: setSearchText,
+ *     onPressClearButton: () => setSearchText(''),
+ *     placeholder: 'Search...',
+ *   }}
+ * />
+ *
+ * @example
+ * // Inline variant with cancel button
+ * <HeaderSearch
+ *   variant={HeaderSearchVariant.Inline}
+ *   onPressCancelButton={handleCancel}
+ *   textFieldSearchProps={{
+ *     value: searchText,
+ *     onChangeText: setSearchText,
+ *     onPressClearButton: () => setSearchText(''),
+ *     placeholder: 'Search...',
+ *   }}
+ * />
+ *
+ * @param props - Header row props (discriminated by `variant`).
+ * @returns The header search UI for the active variant.
+ */
+export const HeaderSearch = (props) => {
+    const baseTwClassName = 'h-14 flex-row items-center';
+    if (props.variant === HeaderSearchVariant.Screen) {
+        const { variant: _variant, textFieldSearchProps, twClassName, onPressBackButton, backButtonProps, ...screenBoxProps } = props;
+        return (<Box {...screenBoxProps} twClassName={twClassName
+                ? `${baseTwClassName} ml-1 mr-4 gap-2 ${twClassName}`
+                : `${baseTwClassName} ml-1 mr-4 gap-2`}>
+        <ButtonIcon size={ButtonIconSize.Md} {...backButtonProps} iconName={IconName.ArrowLeft} onPress={onPressBackButton}/>
+        <TextFieldSearch {...textFieldSearchProps} twClassName={textFieldSearchProps.twClassName
+                ? `flex-1 ${textFieldSearchProps.twClassName}`
+                : 'flex-1'}/>
+      </Box>);
+    }
+    const { variant: _variant, textFieldSearchProps, twClassName, onPressCancelButton, cancelButtonProps, ...inlineBoxProps } = props;
+    return (<Box {...inlineBoxProps} twClassName={twClassName
+            ? `${baseTwClassName} ml-4 ${twClassName}`
+            : `${baseTwClassName} ml-4`}>
+      <TextFieldSearch {...textFieldSearchProps} twClassName={textFieldSearchProps.twClassName
+            ? `flex-1 ${textFieldSearchProps.twClassName}`
+            : 'flex-1'}/>
+      <Button {...cancelButtonProps} variant={ButtonVariant.Tertiary} onPress={onPressCancelButton} textProps={{
+            ...cancelButtonProps?.textProps,
+            twClassName: cancelButtonProps?.textProps?.twClassName
+                ? `text-default ${cancelButtonProps.textProps.twClassName}`
+                : 'text-default',
+        }}>
+        {CANCEL_LABEL}
+      </Button>
+    </Box>);
+};
+HeaderSearch.displayName = 'HeaderSearch';
+//# sourceMappingURL=HeaderSearch.mjs.map

package/dist/components/HeaderSearch/HeaderSearch.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"HeaderSearch.mjs","sourceRoot":"","sources":["../../../src/components/HeaderSearch/HeaderSearch.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,mBAAmB,EAAE,uCAAuC;AACrE,OAAO,MAAK,cAAc;;AAE1B,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,4BAAkB;AAClD,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,gCAAsB;AAC3D,OAAO,EAAE,QAAQ,EAAE,0BAAgB;AACnC,OAAO,EAAE,eAAe,EAAE,qCAA2B;AAKrD,MAAM,YAAY,GAAG,QAAQ,CAAC;AAE9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,KAAK,EAAE,EAAE;IACjE,MAAM,eAAe,GAAG,4BAA4B,CAAC;IAErD,IAAI,KAAK,CAAC,OAAO,KAAK,mBAAmB,CAAC,MAAM,EAAE;QAChD,MAAM,EACJ,OAAO,EAAE,QAAQ,EACjB,oBAAoB,EACpB,WAAW,EACX,iBAAiB,EACjB,eAAe,EACf,GAAG,cAAc,EAClB,GAAG,KAAK,CAAC;QAEV,OAAO,CACL,CAAC,GAAG,CACF,IAAI,cAAc,CAAC,CACnB,WAAW,CAAC,CACV,WAAW;gBACT,CAAC,CAAC,GAAG,eAAe,oBAAoB,WAAW,EAAE;gBACrD,CAAC,CAAC,GAAG,eAAe,kBAAkB,CACzC,CAED;QAAA,CAAC,UAAU,CACT,IAAI,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC,CACxB,IAAI,eAAe,CAAC,CACpB,QAAQ,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,CAC7B,OAAO,CAAC,CAAC,iBAAiB,CAAC,EAE7B;QAAA,CAAC,eAAe,CACd,IAAK,oBAA6C,CAAC,CACnD,WAAW,CAAC,CACV,oBAAoB,CAAC,WAAW;gBAC9B,CAAC,CAAC,UAAU,oBAAoB,CAAC,WAAW,EAAE;gBAC9C,CAAC,CAAC,QAAQ,CACb,EAEL;MAAA,EAAE,GAAG,CAAC,CACP,CAAC;KACH;IAED,MAAM,EACJ,OAAO,EAAE,QAAQ,EACjB,oBAAoB,EACpB,WAAW,EACX,mBAAmB,EACnB,iBAAiB,EACjB,GAAG,cAAc,EAClB,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,CAAC,GAAG,CACF,IAAI,cAAc,CAAC,CACnB,WAAW,CAAC,CACV,WAAW;YACT,CAAC,CAAC,GAAG,eAAe,SAAS,WAAW,EAAE;YAC1C,CAAC,CAAC,GAAG,eAAe,OAAO,CAC9B,CAED;MAAA,CAAC,eAAe,CACd,IAAK,oBAA6C,CAAC,CACnD,WAAW,CAAC,CACV,oBAAoB,CAAC,WAAW;YAC9B,CAAC,CAAC,UAAU,oBAAoB,CAAC,WAAW,EAAE;YAC9C,CAAC,CAAC,QAAQ,CACb,EAEH;MAAA,CAAC,MAAM,CACL,IAAI,iBAAiB,CAAC,CACtB,OAAO,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,CAChC,OAAO,CAAC,CAAC,mBAAmB,CAAC,CAC7B,SAAS,CAAC,CAAC;YACT,GAAG,iBAAiB,EAAE,SAAS;YAC/B,WAAW,EAAE,iBAAiB,EAAE,SAAS,EAAE,WAAW;gBACpD,CAAC,CAAC,gBAAgB,iBAAiB,CAAC,SAAS,CAAC,WAAW,EAAE;gBAC3D,CAAC,CAAC,cAAc;SACnB,CAAC,CAEF;QAAA,CAAC,YAAY,CACf;MAAA,EAAE,MAAM,CACV;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import { HeaderSearchVariant } from '@metamask/design-system-shared';\nimport React from 'react';\n\nimport { Box } from '../Box';\nimport { Button, ButtonVariant } from '../Button';\nimport { ButtonIcon, ButtonIconSize } from '../ButtonIcon';\nimport { IconName } from '../Icon';\nimport { TextFieldSearch } from '../TextFieldSearch';\nimport type { TextFieldSearchProps } from '../TextFieldSearch';\n\nimport type { HeaderSearchProps } from './HeaderSearch.types';\n\nconst CANCEL_LABEL = 'Cancel';\n\n/**\n * HeaderSearch is a header component that combines a search field\n * with either a back button (screen variant) or cancel button (inline variant).\n *\n * @example\n * // Screen variant with back button\n * <HeaderSearch\n * variant={HeaderSearchVariant.Screen}\n * onPressBackButton={handleBack}\n * textFieldSearchProps={{\n * value: searchText,\n * onChangeText: setSearchText,\n * onPressClearButton: () => setSearchText(''),\n * placeholder: 'Search...',\n * }}\n * />\n *\n * @example\n * // Inline variant with cancel button\n * <HeaderSearch\n * variant={HeaderSearchVariant.Inline}\n * onPressCancelButton={handleCancel}\n * textFieldSearchProps={{\n * value: searchText,\n * onChangeText: setSearchText,\n * onPressClearButton: () => setSearchText(''),\n * placeholder: 'Search...',\n * }}\n * />\n *\n * @param props - Header row props (discriminated by `variant`).\n * @returns The header search UI for the active variant.\n */\nexport const HeaderSearch: React.FC<HeaderSearchProps> = (props) => {\n const baseTwClassName = 'h-14 flex-row items-center';\n\n if (props.variant === HeaderSearchVariant.Screen) {\n const {\n variant: _variant,\n textFieldSearchProps,\n twClassName,\n onPressBackButton,\n backButtonProps,\n ...screenBoxProps\n } = props;\n\n return (\n <Box\n {...screenBoxProps}\n twClassName={\n twClassName\n ? `${baseTwClassName} ml-1 mr-4 gap-2 ${twClassName}`\n : `${baseTwClassName} ml-1 mr-4 gap-2`\n }\n >\n <ButtonIcon\n size={ButtonIconSize.Md}\n {...backButtonProps}\n iconName={IconName.ArrowLeft}\n onPress={onPressBackButton}\n />\n <TextFieldSearch\n {...(textFieldSearchProps as TextFieldSearchProps)}\n twClassName={\n textFieldSearchProps.twClassName\n ? `flex-1 ${textFieldSearchProps.twClassName}`\n : 'flex-1'\n }\n />\n </Box>\n );\n }\n\n const {\n variant: _variant,\n textFieldSearchProps,\n twClassName,\n onPressCancelButton,\n cancelButtonProps,\n ...inlineBoxProps\n } = props;\n\n return (\n <Box\n {...inlineBoxProps}\n twClassName={\n twClassName\n ? `${baseTwClassName} ml-4 ${twClassName}`\n : `${baseTwClassName} ml-4`\n }\n >\n <TextFieldSearch\n {...(textFieldSearchProps as TextFieldSearchProps)}\n twClassName={\n textFieldSearchProps.twClassName\n ? `flex-1 ${textFieldSearchProps.twClassName}`\n : 'flex-1'\n }\n />\n <Button\n {...cancelButtonProps}\n variant={ButtonVariant.Tertiary}\n onPress={onPressCancelButton}\n textProps={{\n ...cancelButtonProps?.textProps,\n twClassName: cancelButtonProps?.textProps?.twClassName\n ? `text-default ${cancelButtonProps.textProps.twClassName}`\n : 'text-default',\n }}\n >\n {CANCEL_LABEL}\n </Button>\n </Box>\n );\n};\n\nHeaderSearch.displayName = 'HeaderSearch';\n"]}

package/dist/components/HeaderSearch/HeaderSearch.types.cjs ADDED Viewed

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

package/dist/components/HeaderSearch/HeaderSearch.types.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"HeaderSearch.types.cjs","sourceRoot":"","sources":["../../../src/components/HeaderSearch/HeaderSearch.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n HeaderSearchInlinePropsShared,\n HeaderSearchScreenPropsShared,\n} from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box';\nimport type { ButtonProps } from '../Button';\nimport type { ButtonIconProps } from '../ButtonIcon';\nimport type { TextFieldSearchProps } from '../TextFieldSearch';\n\ntype HeaderSearchBaseProps = Omit<BoxProps, 'children'> & {\n /**\n * Props to pass to the TextFieldSearch component.\n */\n textFieldSearchProps: Omit<TextFieldSearchProps, 'style'>;\n};\n\n/**\n * Screen variant props.\n * Renders a back button (ArrowLeft) on the left side.\n */\nexport type HeaderSearchScreenProps = HeaderSearchScreenPropsShared &\n HeaderSearchBaseProps & {\n onPressBackButton: () => void;\n backButtonProps?: Omit<ButtonIconProps, 'iconName' | 'onPress'>;\n };\n\n/**\n * Inline variant props.\n * Renders a cancel button on the right side.\n */\nexport type HeaderSearchInlineProps = HeaderSearchInlinePropsShared &\n HeaderSearchBaseProps & {\n onPressCancelButton: () => void;\n cancelButtonProps?: Omit<ButtonProps, 'variant' | 'onPress' | 'children'>;\n };\n\n/**\n * HeaderSearch component props.\n */\nexport type HeaderSearchProps =\n | HeaderSearchScreenProps\n | HeaderSearchInlineProps;\n"]}

package/dist/components/HeaderSearch/HeaderSearch.types.d.cts ADDED Viewed

@@ -0,0 +1,33 @@
+import type { HeaderSearchInlinePropsShared, HeaderSearchScreenPropsShared } from "@metamask/design-system-shared";
+import type { BoxProps } from "../Box/index.cjs";
+import type { ButtonProps } from "../Button/index.cjs";
+import type { ButtonIconProps } from "../ButtonIcon/index.cjs";
+import type { TextFieldSearchProps } from "../TextFieldSearch/index.cjs";
+type HeaderSearchBaseProps = Omit<BoxProps, 'children'> & {
+    /**
+     * Props to pass to the TextFieldSearch component.
+     */
+    textFieldSearchProps: Omit<TextFieldSearchProps, 'style'>;
+};
+/**
+ * Screen variant props.
+ * Renders a back button (ArrowLeft) on the left side.
+ */
+export type HeaderSearchScreenProps = HeaderSearchScreenPropsShared & HeaderSearchBaseProps & {
+    onPressBackButton: () => void;
+    backButtonProps?: Omit<ButtonIconProps, 'iconName' | 'onPress'>;
+};
+/**
+ * Inline variant props.
+ * Renders a cancel button on the right side.
+ */
+export type HeaderSearchInlineProps = HeaderSearchInlinePropsShared & HeaderSearchBaseProps & {
+    onPressCancelButton: () => void;
+    cancelButtonProps?: Omit<ButtonProps, 'variant' | 'onPress' | 'children'>;
+};
+/**
+ * HeaderSearch component props.
+ */
+export type HeaderSearchProps = HeaderSearchScreenProps | HeaderSearchInlineProps;
+export {};
+//# sourceMappingURL=HeaderSearch.types.d.cts.map

package/dist/components/HeaderSearch/HeaderSearch.types.d.cts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"HeaderSearch.types.d.cts","sourceRoot":"","sources":["../../../src/components/HeaderSearch/HeaderSearch.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,6BAA6B,EAC7B,6BAA6B,EAC9B,uCAAuC;AAExC,OAAO,KAAK,EAAE,QAAQ,EAAE,yBAAe;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,4BAAkB;AAC7C,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,oBAAoB,EAAE,qCAA2B;AAE/D,KAAK,qBAAqB,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IACxD;;OAEG;IACH,oBAAoB,EAAE,IAAI,CAAC,oBAAoB,EAAE,OAAO,CAAC,CAAC;CAC3D,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,uBAAuB,GAAG,6BAA6B,GACjE,qBAAqB,GAAG;IACtB,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,eAAe,CAAC,EAAE,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC;CACjE,CAAC;AAEJ;;;GAGG;AACH,MAAM,MAAM,uBAAuB,GAAG,6BAA6B,GACjE,qBAAqB,GAAG;IACtB,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,iBAAiB,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC,CAAC;CAC3E,CAAC;AAEJ;;GAEG;AACH,MAAM,MAAM,iBAAiB,GACzB,uBAAuB,GACvB,uBAAuB,CAAC"}

package/dist/components/HeaderSearch/HeaderSearch.types.d.mts ADDED Viewed

@@ -0,0 +1,33 @@
+import type { HeaderSearchInlinePropsShared, HeaderSearchScreenPropsShared } from "@metamask/design-system-shared";
+import type { BoxProps } from "../Box/index.mjs";
+import type { ButtonProps } from "../Button/index.mjs";
+import type { ButtonIconProps } from "../ButtonIcon/index.mjs";
+import type { TextFieldSearchProps } from "../TextFieldSearch/index.mjs";
+type HeaderSearchBaseProps = Omit<BoxProps, 'children'> & {
+    /**
+     * Props to pass to the TextFieldSearch component.
+     */
+    textFieldSearchProps: Omit<TextFieldSearchProps, 'style'>;
+};
+/**
+ * Screen variant props.
+ * Renders a back button (ArrowLeft) on the left side.
+ */
+export type HeaderSearchScreenProps = HeaderSearchScreenPropsShared & HeaderSearchBaseProps & {
+    onPressBackButton: () => void;
+    backButtonProps?: Omit<ButtonIconProps, 'iconName' | 'onPress'>;
+};
+/**
+ * Inline variant props.
+ * Renders a cancel button on the right side.
+ */
+export type HeaderSearchInlineProps = HeaderSearchInlinePropsShared & HeaderSearchBaseProps & {
+    onPressCancelButton: () => void;
+    cancelButtonProps?: Omit<ButtonProps, 'variant' | 'onPress' | 'children'>;
+};
+/**
+ * HeaderSearch component props.
+ */
+export type HeaderSearchProps = HeaderSearchScreenProps | HeaderSearchInlineProps;
+export {};
+//# sourceMappingURL=HeaderSearch.types.d.mts.map

package/dist/components/HeaderSearch/HeaderSearch.types.d.mts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"HeaderSearch.types.d.mts","sourceRoot":"","sources":["../../../src/components/HeaderSearch/HeaderSearch.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,6BAA6B,EAC7B,6BAA6B,EAC9B,uCAAuC;AAExC,OAAO,KAAK,EAAE,QAAQ,EAAE,yBAAe;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,4BAAkB;AAC7C,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,oBAAoB,EAAE,qCAA2B;AAE/D,KAAK,qBAAqB,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IACxD;;OAEG;IACH,oBAAoB,EAAE,IAAI,CAAC,oBAAoB,EAAE,OAAO,CAAC,CAAC;CAC3D,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,uBAAuB,GAAG,6BAA6B,GACjE,qBAAqB,GAAG;IACtB,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,eAAe,CAAC,EAAE,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,SAAS,CAAC,CAAC;CACjE,CAAC;AAEJ;;;GAGG;AACH,MAAM,MAAM,uBAAuB,GAAG,6BAA6B,GACjE,qBAAqB,GAAG;IACtB,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,iBAAiB,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC,CAAC;CAC3E,CAAC;AAEJ;;GAEG;AACH,MAAM,MAAM,iBAAiB,GACzB,uBAAuB,GACvB,uBAAuB,CAAC"}

package/dist/components/HeaderSearch/HeaderSearch.types.mjs ADDED Viewed

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

package/dist/components/HeaderSearch/HeaderSearch.types.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"HeaderSearch.types.mjs","sourceRoot":"","sources":["../../../src/components/HeaderSearch/HeaderSearch.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n HeaderSearchInlinePropsShared,\n HeaderSearchScreenPropsShared,\n} from '@metamask/design-system-shared';\n\nimport type { BoxProps } from '../Box';\nimport type { ButtonProps } from '../Button';\nimport type { ButtonIconProps } from '../ButtonIcon';\nimport type { TextFieldSearchProps } from '../TextFieldSearch';\n\ntype HeaderSearchBaseProps = Omit<BoxProps, 'children'> & {\n /**\n * Props to pass to the TextFieldSearch component.\n */\n textFieldSearchProps: Omit<TextFieldSearchProps, 'style'>;\n};\n\n/**\n * Screen variant props.\n * Renders a back button (ArrowLeft) on the left side.\n */\nexport type HeaderSearchScreenProps = HeaderSearchScreenPropsShared &\n HeaderSearchBaseProps & {\n onPressBackButton: () => void;\n backButtonProps?: Omit<ButtonIconProps, 'iconName' | 'onPress'>;\n };\n\n/**\n * Inline variant props.\n * Renders a cancel button on the right side.\n */\nexport type HeaderSearchInlineProps = HeaderSearchInlinePropsShared &\n HeaderSearchBaseProps & {\n onPressCancelButton: () => void;\n cancelButtonProps?: Omit<ButtonProps, 'variant' | 'onPress' | 'children'>;\n };\n\n/**\n * HeaderSearch component props.\n */\nexport type HeaderSearchProps =\n | HeaderSearchScreenProps\n | HeaderSearchInlineProps;\n"]}

package/dist/components/HeaderSearch/index.cjs ADDED Viewed

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

package/dist/components/HeaderSearch/index.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/HeaderSearch/index.ts"],"names":[],"mappings":";;;AAAA,uEAKwC;AAJtC,2HAAA,mBAAmB,OAAA;AAKrB,mDAA8C;AAArC,4GAAA,YAAY,OAAA","sourcesContent":["export {\n HeaderSearchVariant,\n type HeaderSearchInlinePropsShared,\n type HeaderSearchPropsShared,\n type HeaderSearchScreenPropsShared,\n} from '@metamask/design-system-shared';\nexport { HeaderSearch } from './HeaderSearch';\nexport type {\n HeaderSearchProps,\n HeaderSearchScreenProps,\n HeaderSearchInlineProps,\n} from './HeaderSearch.types';\n"]}

package/dist/components/HeaderSearch/index.d.cts ADDED Viewed

@@ -0,0 +1,4 @@
+export { HeaderSearchVariant, type HeaderSearchInlinePropsShared, type HeaderSearchPropsShared, type HeaderSearchScreenPropsShared, } from "@metamask/design-system-shared";
+export { HeaderSearch } from "./HeaderSearch.cjs";
+export type { HeaderSearchProps, HeaderSearchScreenProps, HeaderSearchInlineProps, } from "./HeaderSearch.types.cjs";
+//# sourceMappingURL=index.d.cts.map

package/dist/components/HeaderSearch/index.d.cts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/HeaderSearch/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EACnB,KAAK,6BAA6B,EAClC,KAAK,uBAAuB,EAC5B,KAAK,6BAA6B,GACnC,uCAAuC;AACxC,OAAO,EAAE,YAAY,EAAE,2BAAuB;AAC9C,YAAY,EACV,iBAAiB,EACjB,uBAAuB,EACvB,uBAAuB,GACxB,iCAA6B"}

package/dist/components/HeaderSearch/index.d.mts ADDED Viewed

@@ -0,0 +1,4 @@
+export { HeaderSearchVariant, type HeaderSearchInlinePropsShared, type HeaderSearchPropsShared, type HeaderSearchScreenPropsShared, } from "@metamask/design-system-shared";
+export { HeaderSearch } from "./HeaderSearch.mjs";
+export type { HeaderSearchProps, HeaderSearchScreenProps, HeaderSearchInlineProps, } from "./HeaderSearch.types.mjs";
+//# sourceMappingURL=index.d.mts.map

package/dist/components/HeaderSearch/index.d.mts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/HeaderSearch/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EACnB,KAAK,6BAA6B,EAClC,KAAK,uBAAuB,EAC5B,KAAK,6BAA6B,GACnC,uCAAuC;AACxC,OAAO,EAAE,YAAY,EAAE,2BAAuB;AAC9C,YAAY,EACV,iBAAiB,EACjB,uBAAuB,EACvB,uBAAuB,GACxB,iCAA6B"}

package/dist/components/HeaderSearch/index.mjs ADDED Viewed

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

package/dist/components/HeaderSearch/index.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/HeaderSearch/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EAIpB,uCAAuC;AACxC,OAAO,EAAE,YAAY,EAAE,2BAAuB","sourcesContent":["export {\n HeaderSearchVariant,\n type HeaderSearchInlinePropsShared,\n type HeaderSearchPropsShared,\n type HeaderSearchScreenPropsShared,\n} from '@metamask/design-system-shared';\nexport { HeaderSearch } from './HeaderSearch';\nexport type {\n HeaderSearchProps,\n HeaderSearchScreenProps,\n HeaderSearchInlineProps,\n} from './HeaderSearch.types';\n"]}

package/dist/components/HeaderStandard/HeaderStandard.cjs CHANGED Viewed

@@ -28,7 +28,7 @@ exports.HeaderStandard = void 0;
 const react_1 = __importStar(require("react"));
 // External dependencies.
 const Box_1 = require("../Box/index.cjs");
-const BoxVertical_1 = require("../BoxVertical/index.cjs");
+const BoxColumn_1 = require("../BoxColumn/index.cjs");
 const HeaderBase_1 = require("../HeaderBase/index.cjs");
 const Icon_1 = require("../Icon/index.cjs");
 const TextOrChildren_1 = require("../temp-components/TextOrChildren/index.cjs");
@@ -80,7 +80,7 @@ const HeaderStandard = ({ title, titleProps, subtitle, subtitleProps, children,
                         .join(' '),
                 };
             }
-            return (<BoxVertical_1.BoxVertical alignItems={Box_1.BoxAlignItems.Center} textProps={{
+            return (<BoxColumn_1.BoxColumn alignItems={Box_1.BoxAlignItems.Center} textProps={{
                     variant: Text_1.TextVariant.BodyMd,
                     fontWeight: Text_1.FontWeight.Bold,
                     ...titleProps,
@@ -88,7 +88,7 @@ const HeaderStandard = ({ title, titleProps, subtitle, subtitleProps, children,
                 {subtitle}
               </TextOrChildren_1.TextOrChildren>) : undefined}>
           {title}
-        </BoxVertical_1.BoxVertical>);
+        </BoxColumn_1.BoxColumn>);
         }
         return null;
     };

package/dist/components/HeaderStandard/HeaderStandard.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderStandard.cjs","sourceRoot":"","sources":["../../../src/components/HeaderStandard/HeaderStandard.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,4BAA4B;AAC5B,+CAAuC;AAEvC,yBAAyB;AACzB,0CAAuC;AACvC,~~0DAA6C~~;~~AAE7C~~,wDAA2C;AAC3C,4CAAmC;AACnC,gFAAmE;AAEnE,4CAA6D;AAKtD,MAAM,cAAc,GAAkC,CAAC,EAC5D,KAAK,EACL,UAAU,EACV,QAAQ,EACR,aAAa,EACb,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,gBAAgB,EAChB,kBAAkB,EAClB,oBAAoB,EACpB,WAAW,GAAG,EAAE,EAChB,MAAM,EACN,GAAG,eAAe,EACnB,EAAE,EAAE;IACH,MAAM,4BAA4B,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAChD,IAAI,oBAAoB,EAAE;YACxB,OAAO,oBAAoB,CAAC;SAC7B;QACD,IAAI,MAAM,IAAI,eAAe,EAAE;YAC7B,MAAM,UAAU,GAAoB;gBAClC,QAAQ,EAAE,eAAQ,CAAC,SAAS;gBAC5B,GAAG,CAAC,eAAe,IAAI,EAAE,CAAC;gBAC1B,OAAO,EAAE,eAAe,EAAE,OAAO,IAAI,MAAM;aAC5C,CAAC;YACF,OAAO,UAAU,CAAC;SACnB;QACD,OAAO,SAAS,CAAC;IACnB,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAEpD,MAAM,0BAA0B,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC9C,MAAM,KAAK,GAAsB,EAAE,CAAC;QAEpC,IAAI,OAAO,IAAI,gBAAgB,EAAE;YAC/B,MAAM,UAAU,GAAoB;gBAClC,QAAQ,EAAE,eAAQ,CAAC,KAAK;gBACxB,GAAG,CAAC,gBAAgB,IAAI,EAAE,CAAC;gBAC3B,OAAO,EAAE,gBAAgB,EAAE,OAAO,IAAI,OAAO;aAC9C,CAAC;YACF,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;SACxB;QAED,IAAI,kBAAkB,EAAE;YACtB,KAAK,CAAC,IAAI,CAAC,GAAG,kBAAkB,CAAC,CAAC;SACnC;QACD,OAAO,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;IAC9C,CAAC,EAAE,CAAC,kBAAkB,EAAE,OAAO,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAEpD,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,IAAI,QAAQ,EAAE;YACZ,OAAO,QAAQ,CAAC;SACjB;QACD,IAAI,KAAK,EAAE;YACT,IAAI,iBAAmE,CAAC;YACxE,IAAI,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;gBAC5C,MAAM,EAAE,WAAW,EAAE,mBAAmB,EAAE,GAAG,gBAAgB,EAAE,GAC7D,aAAa,IAAI,EAAE,CAAC;gBACtB,iBAAiB,GAAG;oBAClB,OAAO,EAAE,kBAAW,CAAC,MAAM;oBAC3B,KAAK,EAAE,gBAAS,CAAC,eAAe;oBAChC,GAAG,gBAAgB;oBACnB,WAAW,EAAE,CAAC,SAAS,EAAE,mBAAmB,CAAC;yBAC1C,MAAM,CAAC,OAAO,CAAC;yBACf,IAAI,CAAC,GAAG,CAAC;iBACb,CAAC;aACH;YAED,OAAO,CACL,CAAC,~~yBAAW~~,~~CACV~~,UAAU,CAAC,CAAC,mBAAa,CAAC,MAAM,CAAC,CACjC,SAAS,CAAC,CAAC;oBACT,OAAO,EAAE,kBAAW,CAAC,MAAM;oBAC3B,UAAU,EAAE,iBAAU,CAAC,IAAI;oBAC3B,GAAG,UAAU;iBACd,CAAC,CACF,eAAe,CAAC,CACd,QAAQ,CAAC,CAAC,CAAC,CACT,CAAC,+BAAc,CAAC,SAAS,CAAC,CAAC,iBAAiB,CAAC,CAC3C;gBAAA,CAAC,QAAQ,CACX;cAAA,EAAE,+BAAc,CAAC,CAClB,CAAC,CAAC,CAAC,SAAS,CACd,CAED;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,~~yBAAW~~,CAAC,~~CACf~~,CAAC;SACH;QACD,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,uBAAU,CACT,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,oBAAoB,CAAC,CAAC,4BAA4B,CAAC,CACnD,kBAAkB,CAAC,CAAC,0BAA0B,CAAC,CAC/C,IAAI,eAAe,CAAC,CACpB,WAAW,CAAC,CAAC,QAAQ,WAAW,EAAE,CAAC,CAEnC;MAAA,CAAC,aAAa,EAAE,CAClB;IAAA,EAAE,uBAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC;AAtGW,QAAA,cAAc,kBAsGzB;AAEF,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["// Third party dependencies.\nimport React, { useMemo } from 'react';\n\n// External dependencies.\nimport { BoxAlignItems } from '../Box';\nimport { ~~BoxVertical~~ } from '../~~BoxVertical~~';\nimport type { ButtonIconProps } from '../ButtonIcon';\nimport { HeaderBase } from '../HeaderBase';\nimport { IconName } from '../Icon';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\nimport type { TextProps } from '../Text';\nimport { FontWeight, TextColor, TextVariant } from '../Text';\n\n// Internal dependencies.\nimport type { HeaderStandardProps } from './HeaderStandard.types';\n\nexport const HeaderStandard: React.FC<HeaderStandardProps> = ({\n title,\n titleProps,\n subtitle,\n subtitleProps,\n children,\n onBack,\n backButtonProps,\n onClose,\n closeButtonProps,\n endButtonIconProps,\n startButtonIconProps,\n twClassName = '',\n testID,\n ...headerBaseProps\n}) => {\n const resolvedStartButtonIconProps = useMemo(() => {\n if (startButtonIconProps) {\n return startButtonIconProps;\n }\n if (onBack \|\| backButtonProps) {\n const startProps: ButtonIconProps = {\n iconName: IconName.ArrowLeft,\n ...(backButtonProps ?? {}),\n onPress: backButtonProps?.onPress ?? onBack,\n };\n return startProps;\n }\n return undefined;\n }, [onBack, backButtonProps, startButtonIconProps]);\n\n const resolvedEndButtonIconProps = useMemo(() => {\n const props: ButtonIconProps[] = [];\n\n if (onClose \|\| closeButtonProps) {\n const closeProps: ButtonIconProps = {\n iconName: IconName.Close,\n ...(closeButtonProps \|\| {}),\n onPress: closeButtonProps?.onPress ?? onClose,\n };\n props.push(closeProps);\n }\n\n if (endButtonIconProps) {\n props.push(...endButtonIconProps);\n }\n return props.length > 0 ? props : undefined;\n }, [endButtonIconProps, onClose, closeButtonProps]);\n\n const renderContent = () => {\n if (children) {\n return children;\n }\n if (title) {\n let subtitleTextProps: Omit<Partial<TextProps>, 'children'> \| undefined;\n if (subtitle && typeof subtitle === 'string') {\n const { twClassName: subtitleTwClassName, ...subtitleTextRest } =\n subtitleProps ?? {};\n subtitleTextProps = {\n variant: TextVariant.BodySm,\n color: TextColor.TextAlternative,\n ...subtitleTextRest,\n twClassName: ['-mt-0.5', subtitleTwClassName]\n .filter(Boolean)\n .join(' '),\n };\n }\n\n return (\n <~~BoxVertical~~\n alignItems={BoxAlignItems.Center}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Bold,\n ...titleProps,\n }}\n bottomAccessory={\n subtitle ? (\n <TextOrChildren textProps={subtitleTextProps}>\n {subtitle}\n </TextOrChildren>\n ) : undefined\n }\n >\n {title}\n </~~BoxVertical~~>\n );\n }\n return null;\n };\n\n return (\n <HeaderBase\n testID={testID}\n startButtonIconProps={resolvedStartButtonIconProps}\n endButtonIconProps={resolvedEndButtonIconProps}\n {...headerBaseProps}\n twClassName={`px-2 ${twClassName}`}\n >\n {renderContent()}\n </HeaderBase>\n );\n};\n\nHeaderStandard.displayName = 'HeaderStandard';\n"]}
1	+ {"version":3,"file":"HeaderStandard.cjs","sourceRoot":"","sources":["../../../src/components/HeaderStandard/HeaderStandard.tsx"],"names":[],"mappings":"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","sourcesContent":["// Third party dependencies.\nimport React, { useMemo } from 'react';\n\n// External dependencies.\nimport { BoxAlignItems } from '../Box';\nimport { BoxColumn } from '../BoxColumn';\nimport type { ButtonIconProps } from '../ButtonIcon';\nimport { HeaderBase } from '../HeaderBase';\nimport { IconName } from '../Icon';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\nimport type { TextProps } from '../Text';\nimport { FontWeight, TextColor, TextVariant } from '../Text';\n\n// Internal dependencies.\nimport type { HeaderStandardProps } from './HeaderStandard.types';\n\nexport const HeaderStandard: React.FC<HeaderStandardProps> = ({\n title,\n titleProps,\n subtitle,\n subtitleProps,\n children,\n onBack,\n backButtonProps,\n onClose,\n closeButtonProps,\n endButtonIconProps,\n startButtonIconProps,\n twClassName = '',\n testID,\n ...headerBaseProps\n}) => {\n const resolvedStartButtonIconProps = useMemo(() => {\n if (startButtonIconProps) {\n return startButtonIconProps;\n }\n if (onBack \|\| backButtonProps) {\n const startProps: ButtonIconProps = {\n iconName: IconName.ArrowLeft,\n ...(backButtonProps ?? {}),\n onPress: backButtonProps?.onPress ?? onBack,\n };\n return startProps;\n }\n return undefined;\n }, [onBack, backButtonProps, startButtonIconProps]);\n\n const resolvedEndButtonIconProps = useMemo(() => {\n const props: ButtonIconProps[] = [];\n\n if (onClose \|\| closeButtonProps) {\n const closeProps: ButtonIconProps = {\n iconName: IconName.Close,\n ...(closeButtonProps \|\| {}),\n onPress: closeButtonProps?.onPress ?? onClose,\n };\n props.push(closeProps);\n }\n\n if (endButtonIconProps) {\n props.push(...endButtonIconProps);\n }\n return props.length > 0 ? props : undefined;\n }, [endButtonIconProps, onClose, closeButtonProps]);\n\n const renderContent = () => {\n if (children) {\n return children;\n }\n if (title) {\n let subtitleTextProps: Omit<Partial<TextProps>, 'children'> \| undefined;\n if (subtitle && typeof subtitle === 'string') {\n const { twClassName: subtitleTwClassName, ...subtitleTextRest } =\n subtitleProps ?? {};\n subtitleTextProps = {\n variant: TextVariant.BodySm,\n color: TextColor.TextAlternative,\n ...subtitleTextRest,\n twClassName: ['-mt-0.5', subtitleTwClassName]\n .filter(Boolean)\n .join(' '),\n };\n }\n\n return (\n <BoxColumn\n alignItems={BoxAlignItems.Center}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Bold,\n ...titleProps,\n }}\n bottomAccessory={\n subtitle ? (\n <TextOrChildren textProps={subtitleTextProps}>\n {subtitle}\n </TextOrChildren>\n ) : undefined\n }\n >\n {title}\n </BoxColumn>\n );\n }\n return null;\n };\n\n return (\n <HeaderBase\n testID={testID}\n startButtonIconProps={resolvedStartButtonIconProps}\n endButtonIconProps={resolvedEndButtonIconProps}\n {...headerBaseProps}\n twClassName={`px-2 ${twClassName}`}\n >\n {renderContent()}\n </HeaderBase>\n );\n};\n\nHeaderStandard.displayName = 'HeaderStandard';\n"]}

package/dist/components/HeaderStandard/HeaderStandard.mjs CHANGED Viewed

@@ -9,7 +9,7 @@ import $React, { useMemo } from "react";
 const React = $importDefault($React);
 // External dependencies.
 import { BoxAlignItems } from "../Box/index.mjs";
-import { BoxVertical } from "../BoxVertical/index.mjs";
+import { BoxColumn } from "../BoxColumn/index.mjs";
 import { HeaderBase } from "../HeaderBase/index.mjs";
 import { IconName } from "../Icon/index.mjs";
 import { TextOrChildren } from "../temp-components/TextOrChildren/index.mjs";
@@ -61,7 +61,7 @@ export const HeaderStandard = ({ title, titleProps, subtitle, subtitleProps, chi
                         .join(' '),
                 };
             }
-            return (<BoxVertical alignItems={BoxAlignItems.Center} textProps={{
+            return (<BoxColumn alignItems={BoxAlignItems.Center} textProps={{
                     variant: TextVariant.BodyMd,
                     fontWeight: FontWeight.Bold,
                     ...titleProps,
@@ -69,7 +69,7 @@ export const HeaderStandard = ({ title, titleProps, subtitle, subtitleProps, chi
                 {subtitle}
               </TextOrChildren>) : undefined}>
           {title}
-        </BoxVertical>);
+        </BoxColumn>);
         }
         return null;
     };

package/dist/components/HeaderStandard/HeaderStandard.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderStandard.mjs","sourceRoot":"","sources":["../../../src/components/HeaderStandard/HeaderStandard.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,OAAO,QAAO,EAAE,OAAO,EAAE,cAAc;;AAEvC,yBAAyB;AACzB,OAAO,EAAE,aAAa,EAAE,yBAAe;AACvC,OAAO,EAAE,~~WAAW~~,EAAE~~,iCAAuB~~;~~AAE7C~~,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,QAAQ,EAAE,0BAAgB;AACnC,OAAO,EAAE,cAAc,EAAE,oDAA0C;AAEnE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW,EAAE,0BAAgB;AAK7D,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC5D,KAAK,EACL,UAAU,EACV,QAAQ,EACR,aAAa,EACb,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,gBAAgB,EAChB,kBAAkB,EAClB,oBAAoB,EACpB,WAAW,GAAG,EAAE,EAChB,MAAM,EACN,GAAG,eAAe,EACnB,EAAE,EAAE;IACH,MAAM,4BAA4B,GAAG,OAAO,CAAC,GAAG,EAAE;QAChD,IAAI,oBAAoB,EAAE;YACxB,OAAO,oBAAoB,CAAC;SAC7B;QACD,IAAI,MAAM,IAAI,eAAe,EAAE;YAC7B,MAAM,UAAU,GAAoB;gBAClC,QAAQ,EAAE,QAAQ,CAAC,SAAS;gBAC5B,GAAG,CAAC,eAAe,IAAI,EAAE,CAAC;gBAC1B,OAAO,EAAE,eAAe,EAAE,OAAO,IAAI,MAAM;aAC5C,CAAC;YACF,OAAO,UAAU,CAAC;SACnB;QACD,OAAO,SAAS,CAAC;IACnB,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAEpD,MAAM,0BAA0B,GAAG,OAAO,CAAC,GAAG,EAAE;QAC9C,MAAM,KAAK,GAAsB,EAAE,CAAC;QAEpC,IAAI,OAAO,IAAI,gBAAgB,EAAE;YAC/B,MAAM,UAAU,GAAoB;gBAClC,QAAQ,EAAE,QAAQ,CAAC,KAAK;gBACxB,GAAG,CAAC,gBAAgB,IAAI,EAAE,CAAC;gBAC3B,OAAO,EAAE,gBAAgB,EAAE,OAAO,IAAI,OAAO;aAC9C,CAAC;YACF,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;SACxB;QAED,IAAI,kBAAkB,EAAE;YACtB,KAAK,CAAC,IAAI,CAAC,GAAG,kBAAkB,CAAC,CAAC;SACnC;QACD,OAAO,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;IAC9C,CAAC,EAAE,CAAC,kBAAkB,EAAE,OAAO,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAEpD,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,IAAI,QAAQ,EAAE;YACZ,OAAO,QAAQ,CAAC;SACjB;QACD,IAAI,KAAK,EAAE;YACT,IAAI,iBAAmE,CAAC;YACxE,IAAI,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;gBAC5C,MAAM,EAAE,WAAW,EAAE,mBAAmB,EAAE,GAAG,gBAAgB,EAAE,GAC7D,aAAa,IAAI,EAAE,CAAC;gBACtB,iBAAiB,GAAG;oBAClB,OAAO,EAAE,WAAW,CAAC,MAAM;oBAC3B,KAAK,EAAE,SAAS,CAAC,eAAe;oBAChC,GAAG,gBAAgB;oBACnB,WAAW,EAAE,CAAC,SAAS,EAAE,mBAAmB,CAAC;yBAC1C,MAAM,CAAC,OAAO,CAAC;yBACf,IAAI,CAAC,GAAG,CAAC;iBACb,CAAC;aACH;YAED,OAAO,CACL,CAAC,~~WAAW~~,~~CACV~~,UAAU,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,CACjC,SAAS,CAAC,CAAC;oBACT,OAAO,EAAE,WAAW,CAAC,MAAM;oBAC3B,UAAU,EAAE,UAAU,CAAC,IAAI;oBAC3B,GAAG,UAAU;iBACd,CAAC,CACF,eAAe,CAAC,CACd,QAAQ,CAAC,CAAC,CAAC,CACT,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,iBAAiB,CAAC,CAC3C;gBAAA,CAAC,QAAQ,CACX;cAAA,EAAE,cAAc,CAAC,CAClB,CAAC,CAAC,CAAC,SAAS,CACd,CAED;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,~~WAAW~~,CAAC,~~CACf~~,CAAC;SACH;QACD,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,UAAU,CACT,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,oBAAoB,CAAC,CAAC,4BAA4B,CAAC,CACnD,kBAAkB,CAAC,CAAC,0BAA0B,CAAC,CAC/C,IAAI,eAAe,CAAC,CACpB,WAAW,CAAC,CAAC,QAAQ,WAAW,EAAE,CAAC,CAEnC;MAAA,CAAC,aAAa,EAAE,CAClB;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["// Third party dependencies.\nimport React, { useMemo } from 'react';\n\n// External dependencies.\nimport { BoxAlignItems } from '../Box';\nimport { ~~BoxVertical~~ } from '../~~BoxVertical~~';\nimport type { ButtonIconProps } from '../ButtonIcon';\nimport { HeaderBase } from '../HeaderBase';\nimport { IconName } from '../Icon';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\nimport type { TextProps } from '../Text';\nimport { FontWeight, TextColor, TextVariant } from '../Text';\n\n// Internal dependencies.\nimport type { HeaderStandardProps } from './HeaderStandard.types';\n\nexport const HeaderStandard: React.FC<HeaderStandardProps> = ({\n title,\n titleProps,\n subtitle,\n subtitleProps,\n children,\n onBack,\n backButtonProps,\n onClose,\n closeButtonProps,\n endButtonIconProps,\n startButtonIconProps,\n twClassName = '',\n testID,\n ...headerBaseProps\n}) => {\n const resolvedStartButtonIconProps = useMemo(() => {\n if (startButtonIconProps) {\n return startButtonIconProps;\n }\n if (onBack \|\| backButtonProps) {\n const startProps: ButtonIconProps = {\n iconName: IconName.ArrowLeft,\n ...(backButtonProps ?? {}),\n onPress: backButtonProps?.onPress ?? onBack,\n };\n return startProps;\n }\n return undefined;\n }, [onBack, backButtonProps, startButtonIconProps]);\n\n const resolvedEndButtonIconProps = useMemo(() => {\n const props: ButtonIconProps[] = [];\n\n if (onClose \|\| closeButtonProps) {\n const closeProps: ButtonIconProps = {\n iconName: IconName.Close,\n ...(closeButtonProps \|\| {}),\n onPress: closeButtonProps?.onPress ?? onClose,\n };\n props.push(closeProps);\n }\n\n if (endButtonIconProps) {\n props.push(...endButtonIconProps);\n }\n return props.length > 0 ? props : undefined;\n }, [endButtonIconProps, onClose, closeButtonProps]);\n\n const renderContent = () => {\n if (children) {\n return children;\n }\n if (title) {\n let subtitleTextProps: Omit<Partial<TextProps>, 'children'> \| undefined;\n if (subtitle && typeof subtitle === 'string') {\n const { twClassName: subtitleTwClassName, ...subtitleTextRest } =\n subtitleProps ?? {};\n subtitleTextProps = {\n variant: TextVariant.BodySm,\n color: TextColor.TextAlternative,\n ...subtitleTextRest,\n twClassName: ['-mt-0.5', subtitleTwClassName]\n .filter(Boolean)\n .join(' '),\n };\n }\n\n return (\n <~~BoxVertical~~\n alignItems={BoxAlignItems.Center}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Bold,\n ...titleProps,\n }}\n bottomAccessory={\n subtitle ? (\n <TextOrChildren textProps={subtitleTextProps}>\n {subtitle}\n </TextOrChildren>\n ) : undefined\n }\n >\n {title}\n </~~BoxVertical~~>\n );\n }\n return null;\n };\n\n return (\n <HeaderBase\n testID={testID}\n startButtonIconProps={resolvedStartButtonIconProps}\n endButtonIconProps={resolvedEndButtonIconProps}\n {...headerBaseProps}\n twClassName={`px-2 ${twClassName}`}\n >\n {renderContent()}\n </HeaderBase>\n );\n};\n\nHeaderStandard.displayName = 'HeaderStandard';\n"]}
1	+ {"version":3,"file":"HeaderStandard.mjs","sourceRoot":"","sources":["../../../src/components/HeaderStandard/HeaderStandard.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,OAAO,QAAO,EAAE,OAAO,EAAE,cAAc;;AAEvC,yBAAyB;AACzB,OAAO,EAAE,aAAa,EAAE,yBAAe;AACvC,OAAO,EAAE,SAAS,EAAE,+BAAqB;AAEzC,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,QAAQ,EAAE,0BAAgB;AACnC,OAAO,EAAE,cAAc,EAAE,oDAA0C;AAEnE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,WAAW,EAAE,0BAAgB;AAK7D,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC5D,KAAK,EACL,UAAU,EACV,QAAQ,EACR,aAAa,EACb,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,gBAAgB,EAChB,kBAAkB,EAClB,oBAAoB,EACpB,WAAW,GAAG,EAAE,EAChB,MAAM,EACN,GAAG,eAAe,EACnB,EAAE,EAAE;IACH,MAAM,4BAA4B,GAAG,OAAO,CAAC,GAAG,EAAE;QAChD,IAAI,oBAAoB,EAAE;YACxB,OAAO,oBAAoB,CAAC;SAC7B;QACD,IAAI,MAAM,IAAI,eAAe,EAAE;YAC7B,MAAM,UAAU,GAAoB;gBAClC,QAAQ,EAAE,QAAQ,CAAC,SAAS;gBAC5B,GAAG,CAAC,eAAe,IAAI,EAAE,CAAC;gBAC1B,OAAO,EAAE,eAAe,EAAE,OAAO,IAAI,MAAM;aAC5C,CAAC;YACF,OAAO,UAAU,CAAC;SACnB;QACD,OAAO,SAAS,CAAC;IACnB,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAEpD,MAAM,0BAA0B,GAAG,OAAO,CAAC,GAAG,EAAE;QAC9C,MAAM,KAAK,GAAsB,EAAE,CAAC;QAEpC,IAAI,OAAO,IAAI,gBAAgB,EAAE;YAC/B,MAAM,UAAU,GAAoB;gBAClC,QAAQ,EAAE,QAAQ,CAAC,KAAK;gBACxB,GAAG,CAAC,gBAAgB,IAAI,EAAE,CAAC;gBAC3B,OAAO,EAAE,gBAAgB,EAAE,OAAO,IAAI,OAAO;aAC9C,CAAC;YACF,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;SACxB;QAED,IAAI,kBAAkB,EAAE;YACtB,KAAK,CAAC,IAAI,CAAC,GAAG,kBAAkB,CAAC,CAAC;SACnC;QACD,OAAO,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;IAC9C,CAAC,EAAE,CAAC,kBAAkB,EAAE,OAAO,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAEpD,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,IAAI,QAAQ,EAAE;YACZ,OAAO,QAAQ,CAAC;SACjB;QACD,IAAI,KAAK,EAAE;YACT,IAAI,iBAAmE,CAAC;YACxE,IAAI,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;gBAC5C,MAAM,EAAE,WAAW,EAAE,mBAAmB,EAAE,GAAG,gBAAgB,EAAE,GAC7D,aAAa,IAAI,EAAE,CAAC;gBACtB,iBAAiB,GAAG;oBAClB,OAAO,EAAE,WAAW,CAAC,MAAM;oBAC3B,KAAK,EAAE,SAAS,CAAC,eAAe;oBAChC,GAAG,gBAAgB;oBACnB,WAAW,EAAE,CAAC,SAAS,EAAE,mBAAmB,CAAC;yBAC1C,MAAM,CAAC,OAAO,CAAC;yBACf,IAAI,CAAC,GAAG,CAAC;iBACb,CAAC;aACH;YAED,OAAO,CACL,CAAC,SAAS,CACR,UAAU,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,CACjC,SAAS,CAAC,CAAC;oBACT,OAAO,EAAE,WAAW,CAAC,MAAM;oBAC3B,UAAU,EAAE,UAAU,CAAC,IAAI;oBAC3B,GAAG,UAAU;iBACd,CAAC,CACF,eAAe,CAAC,CACd,QAAQ,CAAC,CAAC,CAAC,CACT,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,iBAAiB,CAAC,CAC3C;gBAAA,CAAC,QAAQ,CACX;cAAA,EAAE,cAAc,CAAC,CAClB,CAAC,CAAC,CAAC,SAAS,CACd,CAED;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,SAAS,CAAC,CACb,CAAC;SACH;QACD,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,UAAU,CACT,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,oBAAoB,CAAC,CAAC,4BAA4B,CAAC,CACnD,kBAAkB,CAAC,CAAC,0BAA0B,CAAC,CAC/C,IAAI,eAAe,CAAC,CACpB,WAAW,CAAC,CAAC,QAAQ,WAAW,EAAE,CAAC,CAEnC;MAAA,CAAC,aAAa,EAAE,CAClB;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["// Third party dependencies.\nimport React, { useMemo } from 'react';\n\n// External dependencies.\nimport { BoxAlignItems } from '../Box';\nimport { BoxColumn } from '../BoxColumn';\nimport type { ButtonIconProps } from '../ButtonIcon';\nimport { HeaderBase } from '../HeaderBase';\nimport { IconName } from '../Icon';\nimport { TextOrChildren } from '../temp-components/TextOrChildren';\nimport type { TextProps } from '../Text';\nimport { FontWeight, TextColor, TextVariant } from '../Text';\n\n// Internal dependencies.\nimport type { HeaderStandardProps } from './HeaderStandard.types';\n\nexport const HeaderStandard: React.FC<HeaderStandardProps> = ({\n title,\n titleProps,\n subtitle,\n subtitleProps,\n children,\n onBack,\n backButtonProps,\n onClose,\n closeButtonProps,\n endButtonIconProps,\n startButtonIconProps,\n twClassName = '',\n testID,\n ...headerBaseProps\n}) => {\n const resolvedStartButtonIconProps = useMemo(() => {\n if (startButtonIconProps) {\n return startButtonIconProps;\n }\n if (onBack \|\| backButtonProps) {\n const startProps: ButtonIconProps = {\n iconName: IconName.ArrowLeft,\n ...(backButtonProps ?? {}),\n onPress: backButtonProps?.onPress ?? onBack,\n };\n return startProps;\n }\n return undefined;\n }, [onBack, backButtonProps, startButtonIconProps]);\n\n const resolvedEndButtonIconProps = useMemo(() => {\n const props: ButtonIconProps[] = [];\n\n if (onClose \|\| closeButtonProps) {\n const closeProps: ButtonIconProps = {\n iconName: IconName.Close,\n ...(closeButtonProps \|\| {}),\n onPress: closeButtonProps?.onPress ?? onClose,\n };\n props.push(closeProps);\n }\n\n if (endButtonIconProps) {\n props.push(...endButtonIconProps);\n }\n return props.length > 0 ? props : undefined;\n }, [endButtonIconProps, onClose, closeButtonProps]);\n\n const renderContent = () => {\n if (children) {\n return children;\n }\n if (title) {\n let subtitleTextProps: Omit<Partial<TextProps>, 'children'> \| undefined;\n if (subtitle && typeof subtitle === 'string') {\n const { twClassName: subtitleTwClassName, ...subtitleTextRest } =\n subtitleProps ?? {};\n subtitleTextProps = {\n variant: TextVariant.BodySm,\n color: TextColor.TextAlternative,\n ...subtitleTextRest,\n twClassName: ['-mt-0.5', subtitleTwClassName]\n .filter(Boolean)\n .join(' '),\n };\n }\n\n return (\n <BoxColumn\n alignItems={BoxAlignItems.Center}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Bold,\n ...titleProps,\n }}\n bottomAccessory={\n subtitle ? (\n <TextOrChildren textProps={subtitleTextProps}>\n {subtitle}\n </TextOrChildren>\n ) : undefined\n }\n >\n {title}\n </BoxColumn>\n );\n }\n return null;\n };\n\n return (\n <HeaderBase\n testID={testID}\n startButtonIconProps={resolvedStartButtonIconProps}\n endButtonIconProps={resolvedEndButtonIconProps}\n {...headerBaseProps}\n twClassName={`px-2 ${twClassName}`}\n >\n {renderContent()}\n </HeaderBase>\n );\n};\n\nHeaderStandard.displayName = 'HeaderStandard';\n"]}

package/dist/components/KeyValueColumn/KeyValueColumn.cjs ADDED Viewed

@@ -0,0 +1,43 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.KeyValueColumn = void 0;
+const react_1 = __importDefault(require("react"));
+const types_1 = require("../../types/index.cjs");
+const BoxColumn_1 = require("../BoxColumn/index.cjs");
+const BoxRow_1 = require("../BoxRow/index.cjs");
+const ButtonIcon_1 = require("../ButtonIcon/index.cjs");
+const KeyValueColumn = ({ keyStartAccessory, keyEndAccessory, keyEndButtonIconProps, keyLabel: keyContent, keyTextProps, valueStartAccessory, valueEndAccessory, valueEndButtonIconProps, value: valueContent, valueTextProps, twClassName, ...viewProps }) => {
+    const keyEndAccessoryNode = keyEndButtonIconProps?.iconName !== undefined &&
+        keyEndButtonIconProps.iconName !== null ? (<ButtonIcon_1.ButtonIcon size={types_1.ButtonIconSize.Sm} iconProps={{ color: types_1.IconColor.IconAlternative }} {...keyEndButtonIconProps} iconName={keyEndButtonIconProps.iconName}/>) : (keyEndAccessory);
+    const valueEndAccessoryNode = valueEndButtonIconProps?.iconName !== undefined &&
+        valueEndButtonIconProps.iconName !== null ? (<ButtonIcon_1.ButtonIcon size={types_1.ButtonIconSize.Sm} iconProps={{ color: types_1.IconColor.IconDefault }} {...valueEndButtonIconProps} iconName={valueEndButtonIconProps.iconName}/>) : (valueEndAccessory);
+    const keyBox = (<BoxRow_1.BoxRow startAccessory={keyStartAccessory} endAccessory={keyEndAccessoryNode} textProps={{
+            variant: types_1.TextVariant.BodyMd,
+            fontWeight: types_1.FontWeight.Medium,
+            color: types_1.TextColor.TextAlternative,
+            numberOfLines: 1,
+            ellipsizeMode: 'tail',
+            ...keyTextProps,
+        }} twClassName="w-full min-w-0">
+      {keyContent}
+    </BoxRow_1.BoxRow>);
+    const valueBox = (<BoxRow_1.BoxRow startAccessory={valueStartAccessory} endAccessory={valueEndAccessoryNode} textProps={{
+            variant: types_1.TextVariant.BodyMd,
+            fontWeight: types_1.FontWeight.Medium,
+            color: types_1.TextColor.TextDefault,
+            numberOfLines: 1,
+            ellipsizeMode: 'tail',
+            ...valueTextProps,
+        }} twClassName="w-full min-w-0">
+      {valueContent}
+    </BoxRow_1.BoxRow>);
+    return (<BoxColumn_1.BoxColumn bottomAccessory={valueBox} twClassName={twClassName} {...viewProps}>
+      {keyBox}
+    </BoxColumn_1.BoxColumn>);
+};
+exports.KeyValueColumn = KeyValueColumn;
+exports.KeyValueColumn.displayName = 'KeyValueColumn';
+//# sourceMappingURL=KeyValueColumn.cjs.map

package/dist/components/KeyValueColumn/KeyValueColumn.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"KeyValueColumn.cjs","sourceRoot":"","sources":["../../../src/components/KeyValueColumn/KeyValueColumn.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAE1B,iDAMqB;AACrB,sDAAyC;AACzC,gDAAmC;AACnC,wDAA2C;AAIpC,MAAM,cAAc,GAAG,CAAC,EAC7B,iBAAiB,EACjB,eAAe,EACf,qBAAqB,EACrB,QAAQ,EAAE,UAAU,EACpB,YAAY,EACZ,mBAAmB,EACnB,iBAAiB,EACjB,uBAAuB,EACvB,KAAK,EAAE,YAAY,EACnB,cAAc,EACd,WAAW,EACX,GAAG,SAAS,EACQ,EAAE,EAAE;IACxB,MAAM,mBAAmB,GACvB,qBAAqB,EAAE,QAAQ,KAAK,SAAS;QAC7C,qBAAqB,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,CACxC,CAAC,uBAAU,CACT,IAAI,CAAC,CAAC,sBAAc,CAAC,EAAE,CAAC,CACxB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,iBAAS,CAAC,eAAe,EAAE,CAAC,CAChD,IAAI,qBAAqB,CAAC,CAC1B,QAAQ,CAAC,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EACzC,CACH,CAAC,CAAC,CAAC,CACF,eAAe,CAChB,CAAC;IAEJ,MAAM,qBAAqB,GACzB,uBAAuB,EAAE,QAAQ,KAAK,SAAS;QAC/C,uBAAuB,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,CAC1C,CAAC,uBAAU,CACT,IAAI,CAAC,CAAC,sBAAc,CAAC,EAAE,CAAC,CACxB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,iBAAS,CAAC,WAAW,EAAE,CAAC,CAC5C,IAAI,uBAAuB,CAAC,CAC5B,QAAQ,CAAC,CAAC,uBAAuB,CAAC,QAAQ,CAAC,EAC3C,CACH,CAAC,CAAC,CAAC,CACF,iBAAiB,CAClB,CAAC;IAEJ,MAAM,MAAM,GAAG,CACb,CAAC,eAAM,CACL,cAAc,CAAC,CAAC,iBAAiB,CAAC,CAClC,YAAY,CAAC,CAAC,mBAAmB,CAAC,CAClC,SAAS,CAAC,CAAC;YACT,OAAO,EAAE,mBAAW,CAAC,MAAM;YAC3B,UAAU,EAAE,kBAAU,CAAC,MAAM;YAC7B,KAAK,EAAE,iBAAS,CAAC,eAAe;YAChC,aAAa,EAAE,CAAC;YAChB,aAAa,EAAE,MAAM;YACrB,GAAG,YAAY;SAChB,CAAC,CACF,WAAW,CAAC,gBAAgB,CAE5B;MAAA,CAAC,UAAU,CACb;IAAA,EAAE,eAAM,CAAC,CACV,CAAC;IAEF,MAAM,QAAQ,GAAG,CACf,CAAC,eAAM,CACL,cAAc,CAAC,CAAC,mBAAmB,CAAC,CACpC,YAAY,CAAC,CAAC,qBAAqB,CAAC,CACpC,SAAS,CAAC,CAAC;YACT,OAAO,EAAE,mBAAW,CAAC,MAAM;YAC3B,UAAU,EAAE,kBAAU,CAAC,MAAM;YAC7B,KAAK,EAAE,iBAAS,CAAC,WAAW;YAC5B,aAAa,EAAE,CAAC;YAChB,aAAa,EAAE,MAAM;YACrB,GAAG,cAAc;SAClB,CAAC,CACF,WAAW,CAAC,gBAAgB,CAE5B;MAAA,CAAC,YAAY,CACf;IAAA,EAAE,eAAM,CAAC,CACV,CAAC;IAEF,OAAO,CACL,CAAC,qBAAS,CACR,eAAe,CAAC,CAAC,QAAQ,CAAC,CAC1B,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,IAAI,SAAS,CAAC,CAEd;MAAA,CAAC,MAAM,CACT;IAAA,EAAE,qBAAS,CAAC,CACb,CAAC;AACJ,CAAC,CAAC;AArFW,QAAA,cAAc,kBAqFzB;AAEF,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["import React from 'react';\n\nimport {\n ButtonIconSize,\n FontWeight,\n IconColor,\n TextColor,\n TextVariant,\n} from '../../types';\nimport { BoxColumn } from '../BoxColumn';\nimport { BoxRow } from '../BoxRow';\nimport { ButtonIcon } from '../ButtonIcon';\n\nimport type { KeyValueColumnProps } from './KeyValueColumn.types';\n\nexport const KeyValueColumn = ({\n keyStartAccessory,\n keyEndAccessory,\n keyEndButtonIconProps,\n keyLabel: keyContent,\n keyTextProps,\n valueStartAccessory,\n valueEndAccessory,\n valueEndButtonIconProps,\n value: valueContent,\n valueTextProps,\n twClassName,\n ...viewProps\n}: KeyValueColumnProps) => {\n const keyEndAccessoryNode =\n keyEndButtonIconProps?.iconName !== undefined &&\n keyEndButtonIconProps.iconName !== null ? (\n <ButtonIcon\n size={ButtonIconSize.Sm}\n iconProps={{ color: IconColor.IconAlternative }}\n {...keyEndButtonIconProps}\n iconName={keyEndButtonIconProps.iconName}\n />\n ) : (\n keyEndAccessory\n );\n\n const valueEndAccessoryNode =\n valueEndButtonIconProps?.iconName !== undefined &&\n valueEndButtonIconProps.iconName !== null ? (\n <ButtonIcon\n size={ButtonIconSize.Sm}\n iconProps={{ color: IconColor.IconDefault }}\n {...valueEndButtonIconProps}\n iconName={valueEndButtonIconProps.iconName}\n />\n ) : (\n valueEndAccessory\n );\n\n const keyBox = (\n <BoxRow\n startAccessory={keyStartAccessory}\n endAccessory={keyEndAccessoryNode}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextAlternative,\n numberOfLines: 1,\n ellipsizeMode: 'tail',\n ...keyTextProps,\n }}\n twClassName=\"w-full min-w-0\"\n >\n {keyContent}\n </BoxRow>\n );\n\n const valueBox = (\n <BoxRow\n startAccessory={valueStartAccessory}\n endAccessory={valueEndAccessoryNode}\n textProps={{\n variant: TextVariant.BodyMd,\n fontWeight: FontWeight.Medium,\n color: TextColor.TextDefault,\n numberOfLines: 1,\n ellipsizeMode: 'tail',\n ...valueTextProps,\n }}\n twClassName=\"w-full min-w-0\"\n >\n {valueContent}\n </BoxRow>\n );\n\n return (\n <BoxColumn\n bottomAccessory={valueBox}\n twClassName={twClassName}\n {...viewProps}\n >\n {keyBox}\n </BoxColumn>\n );\n};\n\nKeyValueColumn.displayName = 'KeyValueColumn';\n"]}

package/dist/components/KeyValueColumn/KeyValueColumn.d.cts ADDED Viewed

@@ -0,0 +1,7 @@
+import React from "react";
+import type { KeyValueColumnProps } from "./KeyValueColumn.types.cjs";
+export declare const KeyValueColumn: {
+    ({ keyStartAccessory, keyEndAccessory, keyEndButtonIconProps, keyLabel: keyContent, keyTextProps, valueStartAccessory, valueEndAccessory, valueEndButtonIconProps, value: valueContent, valueTextProps, twClassName, ...viewProps }: KeyValueColumnProps): React.JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=KeyValueColumn.d.cts.map

package/dist/components/KeyValueColumn/KeyValueColumn.d.cts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"KeyValueColumn.d.cts","sourceRoot":"","sources":["../../../src/components/KeyValueColumn/KeyValueColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc;AAa1B,OAAO,KAAK,EAAE,mBAAmB,EAAE,mCAA+B;AAElE,eAAO,MAAM,cAAc;yOAaxB,mBAAmB;;CAwErB,CAAC"}