@metamask/design-system-react-native 0.9.0 → 0.11.0

package/dist/components/BadgeCount/BadgeCount.constants.mjs

@@ -1,16 +1,12 @@
-import { BadgeCountSize } from "../../types/index.mjs";
+import { BadgeCountSize } from "@metamask/design-system-shared";
 import { TextVariant } from "../Text/index.mjs";
 // Mappings
 export const MAP_BADGECOUNT_SIZE_TEXTVARIANT = {
     [BadgeCountSize.Md]: TextVariant.BodyXs,
     [BadgeCountSize.Lg]: TextVariant.BodySm,
 };
-export const MAP_BADGECOUNT_SIZE_LINEHEIGHT = {
-    [BadgeCountSize.Md]: 'leading-[14px]',
-    [BadgeCountSize.Lg]: 'leading-4', // line-height 16px
-};
 export const TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER = {
-    [BadgeCountSize.Md]: 'min-w-4 h-3.5 py-0 px-1',
-    [BadgeCountSize.Lg]: 'min-w-6 h-5 py-0.5 px-1.5', // min-width 24px, height 20px, padding-vertical 2, padding-horizontal 6
+    [BadgeCountSize.Md]: 'min-w-4 h-4 px-1',
+    [BadgeCountSize.Lg]: 'min-w-6 h-5 px-1.5', // min-width 24px, height 20px, padding-horizontal 6
 };
 //# sourceMappingURL=BadgeCount.constants.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeCount.constants.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,WAAW,EAAE,0BAAgB;AAEtC,WAAW;AACX,MAAM,CAAC,MAAM,+BAA+B,GAGxC;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,CAAC,MAAM;IACvC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,CAAC,MAAM;CACxC,CAAC;AACF,MAAM,CAAC,MAAM,8BAA8B,GAAmC;IAC5E,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,gBAAgB;IACrC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,EAAE,mBAAmB;CACtD,CAAC;AAEF,MAAM,CAAC,MAAM,oCAAoC,GAG7C;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,yBAAyB;IAC9C,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,2BAA2B,EAAE,wEAAwE;CAC3H,CAAC","sourcesContent":["import { BadgeCountSize } from '../../types';\nimport { TextVariant } from '../Text';\n\n// Mappings\nexport const MAP_BADGECOUNT_SIZE_TEXTVARIANT: Record<\n  BadgeCountSize,\n  TextVariant\n> = {\n  [BadgeCountSize.Md]: TextVariant.BodyXs,\n  [BadgeCountSize.Lg]: TextVariant.BodySm,\n};\nexport const MAP_BADGECOUNT_SIZE_LINEHEIGHT: Record<BadgeCountSize, string> = {\n  [BadgeCountSize.Md]: 'leading-[14px]', // line-height 14px\n  [BadgeCountSize.Lg]: 'leading-4', // line-height 16px\n};\n\nexport const TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER: Record<\n  BadgeCountSize,\n  string\n> = {\n  [BadgeCountSize.Md]: 'min-w-4 h-3.5 py-0 px-1', // min-width 16px, height 14px, padding-vertical 0, padding-horizontal 4\n  [BadgeCountSize.Lg]: 'min-w-6 h-5 py-0.5 px-1.5', // min-width 24px, height 20px, padding-vertical 2, padding-horizontal 6\n};\n"]}
+{"version":3,"file":"BadgeCount.constants.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,uCAAuC;AAEhE,OAAO,EAAE,WAAW,EAAE,0BAAgB;AAEtC,WAAW;AACX,MAAM,CAAC,MAAM,+BAA+B,GAGxC;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,CAAC,MAAM;IACvC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,CAAC,MAAM;CACxC,CAAC;AAEF,MAAM,CAAC,MAAM,oCAAoC,GAG7C;IACF,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,kBAAkB;IACvC,CAAC,cAAc,CAAC,EAAE,CAAC,EAAE,oBAAoB,EAAE,oDAAoD;CAChG,CAAC","sourcesContent":["import { BadgeCountSize } from '@metamask/design-system-shared';\n\nimport { TextVariant } from '../Text';\n\n// Mappings\nexport const MAP_BADGECOUNT_SIZE_TEXTVARIANT: Record<\n  BadgeCountSize,\n  TextVariant\n> = {\n  [BadgeCountSize.Md]: TextVariant.BodyXs,\n  [BadgeCountSize.Lg]: TextVariant.BodySm,\n};\n\nexport const TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER: Record<\n  BadgeCountSize,\n  string\n> = {\n  [BadgeCountSize.Md]: 'min-w-4 h-4 px-1', // min-width 16px, height 14px, padding-horizontal 4\n  [BadgeCountSize.Lg]: 'min-w-6 h-5 px-1.5', // min-width 24px, height 20px, padding-horizontal 6\n};\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeCount.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAW1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,kEAQpB,eAAe,sBA0BjB,CAAC"}
+{"version":3,"file":"BadgeCount.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,cAAc;AAS1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,kEAQpB,eAAe,sBA0BjB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeCount.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,cAAc;AAW1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,kEAQpB,eAAe,sBA0BjB,CAAC"}
+{"version":3,"file":"BadgeCount.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,cAAc;AAS1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAE1D,eAAO,MAAM,UAAU,kEAQpB,eAAe,sBA0BjB,CAAC"}

package/dist/components/BadgeCount/BadgeCount.mjs

@@ -4,20 +4,20 @@ function $importDefault(module) {
     }
     return module;
 }
+import { BadgeCountSize } from "@metamask/design-system-shared";
 import { useTailwind } from "@metamask/design-system-twrnc-preset";
 import $React from "react";
 const React = $importDefault($React);
 import { View } from "react-native/index.js";
-import { BadgeCountSize } from "../../types/index.mjs";
 import { Text, TextColor, FontWeight } from "../Text/index.mjs";
-import { MAP_BADGECOUNT_SIZE_TEXTVARIANT, TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER, MAP_BADGECOUNT_SIZE_LINEHEIGHT } from "./BadgeCount.constants.mjs";
+import { MAP_BADGECOUNT_SIZE_TEXTVARIANT, TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER } from "./BadgeCount.constants.mjs";
 export const BadgeCount = ({ size = BadgeCountSize.Md, count, max = 99, textProps, twClassName, style, ...props }) => {
     const tw = useTailwind();
     return (<View {...props} style={[
             tw.style('bg-error-default rounded-lg items-center justify-center self-start', TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER[size], twClassName),
             style,
         ]}>
-      <Text variant={MAP_BADGECOUNT_SIZE_TEXTVARIANT[size]} color={TextColor.ErrorInverse} fontWeight={FontWeight.Medium} {...textProps} twClassName={`${MAP_BADGECOUNT_SIZE_LINEHEIGHT[size]} ${textProps?.twClassName || ''}`}>
+      <Text variant={MAP_BADGECOUNT_SIZE_TEXTVARIANT[size]} color={TextColor.ErrorInverse} fontWeight={FontWeight.Medium} {...textProps} twClassName={`leading-0 ${textProps?.twClassName || ''}`}>
         {count > max ? `${max}+` : `${count}`}
       </Text>
     </View>);

package/dist/components/BadgeCount/BadgeCount.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeCount.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,6CAA6C;AACnE,OAAO,MAAK,cAAc;;AAC1B,OAAO,EAAE,IAAI,EAAE,8BAAqB;AAEpC,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,UAAU,EAAE,0BAAgB;AAEtD,OAAO,EACL,+BAA+B,EAC/B,oCAAoC,EACpC,8BAA8B,EAC/B,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,KAAK,EACL,GAAG,GAAG,EAAE,EACR,SAAS,EACT,WAAW,EACX,KAAK,EACL,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,OAAO,CACL,CAAC,IAAI,CACH,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CACN,oEAAoE,EACpE,oCAAoC,CAAC,IAAI,CAAC,EAC1C,WAAW,CACZ;YACD,KAAK;SACN,CAAC,CAEF;MAAA,CAAC,IAAI,CACH,OAAO,CAAC,CAAC,+BAA+B,CAAC,IAAsB,CAAC,CAAC,CACjE,KAAK,CAAC,CAAC,SAAS,CAAC,YAAY,CAAC,CAC9B,UAAU,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,CAC9B,IAAI,SAAS,CAAC,CACd,WAAW,CAAC,CAAC,GAAG,8BAA8B,CAAC,IAAI,CAAC,IAAI,SAAS,EAAE,WAAW,IAAI,EAAE,EAAE,CAAC,CAEvF;QAAA,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,KAAK,EAAE,CACvC;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React from 'react';\nimport { View } from 'react-native';\n\nimport { BadgeCountSize } from '../../types';\nimport { Text, TextColor, FontWeight } from '../Text';\n\nimport {\n  MAP_BADGECOUNT_SIZE_TEXTVARIANT,\n  TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER,\n  MAP_BADGECOUNT_SIZE_LINEHEIGHT,\n} from './BadgeCount.constants';\nimport type { BadgeCountProps } from './BadgeCount.types';\n\nexport const BadgeCount = ({\n  size = BadgeCountSize.Md,\n  count,\n  max = 99,\n  textProps,\n  twClassName,\n  style,\n  ...props\n}: BadgeCountProps) => {\n  const tw = useTailwind();\n\n  return (\n    <View\n      {...props}\n      style={[\n        tw.style(\n          'bg-error-default rounded-lg items-center justify-center self-start',\n          TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER[size],\n          twClassName,\n        ),\n        style,\n      ]}\n    >\n      <Text\n        variant={MAP_BADGECOUNT_SIZE_TEXTVARIANT[size as BadgeCountSize]}\n        color={TextColor.ErrorInverse}\n        fontWeight={FontWeight.Medium}\n        {...textProps}\n        twClassName={`${MAP_BADGECOUNT_SIZE_LINEHEIGHT[size]} ${textProps?.twClassName || ''}`}\n      >\n        {count > max ? `${max}+` : `${count}`}\n      </Text>\n    </View>\n  );\n};\n"]}
+{"version":3,"file":"BadgeCount.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,cAAc,EAAE,uCAAuC;AAChE,OAAO,EAAE,WAAW,EAAE,6CAA6C;AACnE,OAAO,MAAK,cAAc;;AAC1B,OAAO,EAAE,IAAI,EAAE,8BAAqB;AAEpC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,UAAU,EAAE,0BAAgB;AAEtD,OAAO,EACL,+BAA+B,EAC/B,oCAAoC,EACrC,mCAA+B;AAGhC,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,IAAI,GAAG,cAAc,CAAC,EAAE,EACxB,KAAK,EACL,GAAG,GAAG,EAAE,EACR,SAAS,EACT,WAAW,EACX,KAAK,EACL,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IAEzB,OAAO,CACL,CAAC,IAAI,CACH,IAAI,KAAK,CAAC,CACV,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CACN,oEAAoE,EACpE,oCAAoC,CAAC,IAAI,CAAC,EAC1C,WAAW,CACZ;YACD,KAAK;SACN,CAAC,CAEF;MAAA,CAAC,IAAI,CACH,OAAO,CAAC,CAAC,+BAA+B,CAAC,IAAI,CAAC,CAAC,CAC/C,KAAK,CAAC,CAAC,SAAS,CAAC,YAAY,CAAC,CAC9B,UAAU,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,CAC9B,IAAI,SAAS,CAAC,CACd,WAAW,CAAC,CAAC,aAAa,SAAS,EAAE,WAAW,IAAI,EAAE,EAAE,CAAC,CAEzD;QAAA,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,KAAK,EAAE,CACvC;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { BadgeCountSize } from '@metamask/design-system-shared';\nimport { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React from 'react';\nimport { View } from 'react-native';\n\nimport { Text, TextColor, FontWeight } from '../Text';\n\nimport {\n  MAP_BADGECOUNT_SIZE_TEXTVARIANT,\n  TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER,\n} from './BadgeCount.constants';\nimport type { BadgeCountProps } from './BadgeCount.types';\n\nexport const BadgeCount = ({\n  size = BadgeCountSize.Md,\n  count,\n  max = 99,\n  textProps,\n  twClassName,\n  style,\n  ...props\n}: BadgeCountProps) => {\n  const tw = useTailwind();\n\n  return (\n    <View\n      {...props}\n      style={[\n        tw.style(\n          'bg-error-default rounded-lg items-center justify-center self-start',\n          TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER[size],\n          twClassName,\n        ),\n        style,\n      ]}\n    >\n      <Text\n        variant={MAP_BADGECOUNT_SIZE_TEXTVARIANT[size]}\n        color={TextColor.ErrorInverse}\n        fontWeight={FontWeight.Medium}\n        {...textProps}\n        twClassName={`leading-0 ${textProps?.twClassName || ''}`}\n      >\n        {count > max ? `${max}+` : `${count}`}\n      </Text>\n    </View>\n  );\n};\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeCount.types.cjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ViewProps, StyleProp, ViewStyle } from 'react-native';\n\nimport type { BadgeCountSize } from '../../types';\nimport type { TextProps } from '../Text';\n\n/**\n * BadgeCount component props.\n */\nexport type BadgeCountProps = {\n  /**\n   * Optional prop to control the size of the BadgeCount\n   * Different sizes map to specific height\n   *\n   * @default IconSize.Md\n   */\n  size?: BadgeCountSize;\n  /**\n   * Required prop to show the count number\n   */\n  count: number;\n  /**\n   * Optional prop to determine the max the count can go up to.\n   * If count > max, the count will be shown as \"max+\"\n   *\n   * @default 99\n   */\n  max?: number;\n  /**\n   * Optional props to be passed to the Text component used by count\n   */\n  textProps?: Partial<TextProps>;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n  /**\n   * Optional prop to control the style.\n   */\n  style?: StyleProp<ViewStyle>;\n} & Omit<ViewProps, 'children'>;\n"]}
+{"version":3,"file":"BadgeCount.types.cjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.types.ts"],"names":[],"mappings":"","sourcesContent":["// Import shared type for extension\nimport type { BadgeCountPropsShared } from '@metamask/design-system-shared';\nimport type { ViewProps, StyleProp, ViewStyle } from 'react-native';\n\nimport type { TextProps } from '../Text';\n\n/**\n * BadgeCount component props (React Native platform-specific)\n * Extends shared props with React Native-specific platform concerns\n */\nexport type BadgeCountProps = BadgeCountPropsShared &\n  Omit<ViewProps, 'children'> & {\n    /**\n     * Optional props to be passed to the Text component used by count\n     */\n    textProps?: Partial<TextProps>;\n    /**\n     * Optional prop to add twrnc overriding classNames.\n     */\n    twClassName?: string;\n    /**\n     * Optional prop to control the style.\n     */\n    style?: StyleProp<ViewStyle>;\n  };\n"]}

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

@@ -1,28 +1,11 @@
+import type { BadgeCountPropsShared } from "@metamask/design-system-shared";
 import type { ViewProps, StyleProp, ViewStyle } from "react-native/index.js";
-import type { BadgeCountSize } from "../../types/index.cjs";
 import type { TextProps } from "../Text/index.cjs";
 /**
- * BadgeCount component props.
+ * BadgeCount component props (React Native platform-specific)
+ * Extends shared props with React Native-specific platform concerns
  */
-export type BadgeCountProps = {
-    /**
-     * Optional prop to control the size of the BadgeCount
-     * Different sizes map to specific height
-     *
-     * @default IconSize.Md
-     */
-    size?: BadgeCountSize;
-    /**
-     * Required prop to show the count number
-     */
-    count: number;
-    /**
-     * Optional prop to determine the max the count can go up to.
-     * If count > max, the count will be shown as "max+"
-     *
-     * @default 99
-     */
-    max?: number;
+export type BadgeCountProps = BadgeCountPropsShared & Omit<ViewProps, 'children'> & {
     /**
      * Optional props to be passed to the Text component used by count
      */
@@ -35,5 +18,5 @@ export type BadgeCountProps = {
      * Optional prop to control the style.
      */
     style?: StyleProp<ViewStyle>;
-} & Omit<ViewProps, 'children'>;
+};
 //# sourceMappingURL=BadgeCount.types.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeCount.types.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,8BAAqB;AAEpE,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAoB;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"BadgeCount.types.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uCAAuC;AAC5E,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,8BAAqB;AAEpE,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,qBAAqB,GACjD,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,GAAG;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC"}

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

@@ -1,28 +1,11 @@
+import type { BadgeCountPropsShared } from "@metamask/design-system-shared";
 import type { ViewProps, StyleProp, ViewStyle } from "react-native/index.js";
-import type { BadgeCountSize } from "../../types/index.mjs";
 import type { TextProps } from "../Text/index.mjs";
 /**
- * BadgeCount component props.
+ * BadgeCount component props (React Native platform-specific)
+ * Extends shared props with React Native-specific platform concerns
  */
-export type BadgeCountProps = {
-    /**
-     * Optional prop to control the size of the BadgeCount
-     * Different sizes map to specific height
-     *
-     * @default IconSize.Md
-     */
-    size?: BadgeCountSize;
-    /**
-     * Required prop to show the count number
-     */
-    count: number;
-    /**
-     * Optional prop to determine the max the count can go up to.
-     * If count > max, the count will be shown as "max+"
-     *
-     * @default 99
-     */
-    max?: number;
+export type BadgeCountProps = BadgeCountPropsShared & Omit<ViewProps, 'children'> & {
     /**
      * Optional props to be passed to the Text component used by count
      */
@@ -35,5 +18,5 @@ export type BadgeCountProps = {
      * Optional prop to control the style.
      */
     style?: StyleProp<ViewStyle>;
-} & Omit<ViewProps, 'children'>;
+};
 //# sourceMappingURL=BadgeCount.types.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeCount.types.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,8BAAqB;AAEpE,OAAO,KAAK,EAAE,cAAc,EAAE,8BAAoB;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"BadgeCount.types.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uCAAuC;AAC5E,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,8BAAqB;AAEpE,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,qBAAqB,GACjD,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,GAAG;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeCount.types.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ViewProps, StyleProp, ViewStyle } from 'react-native';\n\nimport type { BadgeCountSize } from '../../types';\nimport type { TextProps } from '../Text';\n\n/**\n * BadgeCount component props.\n */\nexport type BadgeCountProps = {\n  /**\n   * Optional prop to control the size of the BadgeCount\n   * Different sizes map to specific height\n   *\n   * @default IconSize.Md\n   */\n  size?: BadgeCountSize;\n  /**\n   * Required prop to show the count number\n   */\n  count: number;\n  /**\n   * Optional prop to determine the max the count can go up to.\n   * If count > max, the count will be shown as \"max+\"\n   *\n   * @default 99\n   */\n  max?: number;\n  /**\n   * Optional props to be passed to the Text component used by count\n   */\n  textProps?: Partial<TextProps>;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n  /**\n   * Optional prop to control the style.\n   */\n  style?: StyleProp<ViewStyle>;\n} & Omit<ViewProps, 'children'>;\n"]}
+{"version":3,"file":"BadgeCount.types.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/BadgeCount.types.ts"],"names":[],"mappings":"","sourcesContent":["// Import shared type for extension\nimport type { BadgeCountPropsShared } from '@metamask/design-system-shared';\nimport type { ViewProps, StyleProp, ViewStyle } from 'react-native';\n\nimport type { TextProps } from '../Text';\n\n/**\n * BadgeCount component props (React Native platform-specific)\n * Extends shared props with React Native-specific platform concerns\n */\nexport type BadgeCountProps = BadgeCountPropsShared &\n  Omit<ViewProps, 'children'> & {\n    /**\n     * Optional props to be passed to the Text component used by count\n     */\n    textProps?: Partial<TextProps>;\n    /**\n     * Optional prop to add twrnc overriding classNames.\n     */\n    twClassName?: string;\n    /**\n     * Optional prop to control the style.\n     */\n    style?: StyleProp<ViewStyle>;\n  };\n"]}

package/dist/components/BadgeCount/index.cjs

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/index.ts"],"names":[],"mappings":";;;AAAA,+CAA6C;AAApC,uGAAA,cAAc,OAAA;AACvB,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export { BadgeCountSize } from '../../types';\nexport { BadgeCount } from './BadgeCount';\nexport type { BadgeCountProps } from './BadgeCount.types';\n"]}
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/index.ts"],"names":[],"mappings":";;;AAAA,uEAAgE;AAAvD,sHAAA,cAAc,OAAA;AACvB,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export { BadgeCountSize } from '@metamask/design-system-shared';\nexport { BadgeCount } from './BadgeCount';\nexport type { BadgeCountProps } from './BadgeCount.types';\n"]}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeCount/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeCount/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,uCAAuC;AAChE,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeCount/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeCount/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,uCAAuC;AAChE,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,eAAe,EAAE,+BAA2B"}

package/dist/components/BadgeCount/index.mjs

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,8BAAoB;AAC7C,OAAO,EAAE,UAAU,EAAE,yBAAqB","sourcesContent":["export { BadgeCountSize } from '../../types';\nexport { BadgeCount } from './BadgeCount';\nexport type { BadgeCountProps } from './BadgeCount.types';\n"]}
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/BadgeCount/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,uCAAuC;AAChE,OAAO,EAAE,UAAU,EAAE,yBAAqB","sourcesContent":["export { BadgeCountSize } from '@metamask/design-system-shared';\nexport { BadgeCount } from './BadgeCount';\nexport type { BadgeCountProps } from './BadgeCount.types';\n"]}

package/dist/components/BannerBase/BannerBase.cjs

@@ -0,0 +1,63 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BannerBase = void 0;
+const react_1 = __importDefault(require("react"));
+const types_1 = require("../../types/index.cjs");
+const Box_1 = require("../Box/index.cjs");
+const Button_1 = require("../Button/index.cjs");
+const ButtonIcon_1 = require("../ButtonIcon/index.cjs");
+const Text_1 = require("../Text/index.cjs");
+const isTextContent = (content) => typeof content === 'string' || typeof content === 'number';
+const hasContent = (content) => content !== null && content !== undefined;
+const BannerBase = ({ title, titleProps, description, descriptionProps, children, childrenWrapperProps, actionButtonLabel, actionButtonOnPress, actionButtonProps, startAccessory, onClose, closeButtonProps, twClassName, ...props }) => {
+    const resolvedActionButtonProps = actionButtonProps ?? {};
+    const { accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner', onPress: closeButtonPropsOnPress, twClassName: closeButtonTwClassName, ...resolvedCloseButtonProps } = closeButtonProps ?? {};
+    const shouldShowCloseButton = Boolean(onClose || closeButtonProps);
+    const shouldShowActionButton = Boolean(actionButtonOnPress);
+    const handleClosePress = onClose || closeButtonPropsOnPress
+        ? (event) => {
+            if (onClose) {
+                onClose();
+                return;
+            }
+            closeButtonPropsOnPress?.(event);
+        }
+        : undefined;
+    const mergedCloseButtonTwClassName = closeButtonTwClassName
+        ? `ml-3 ${closeButtonTwClassName}`
+        : 'ml-3';
+    return (<Box_1.Box flexDirection={types_1.BoxFlexDirection.Row} alignItems={types_1.BoxAlignItems.Start} gap={2} backgroundColor={types_1.BoxBackgroundColor.BackgroundDefault} padding={3} twClassName={twClassName ? `rounded-sm ${twClassName}` : 'rounded-sm'} {...props}>
+      {startAccessory}
+
+      <Box_1.Box twClassName="flex-1">
+        {hasContent(title) &&
+            (isTextContent(title) ? (<Text_1.Text variant={types_1.TextVariant.BodyMd} fontWeight={types_1.FontWeight.Medium} {...titleProps}>
+              {title}
+            </Text_1.Text>) : (title))}
+
+        {hasContent(description) && (<Box_1.Box twClassName={hasContent(title) ? 'mt-1' : undefined}>
+            {isTextContent(description) ? (<Text_1.Text variant={types_1.TextVariant.BodySm} {...descriptionProps}>
+                {description}
+              </Text_1.Text>) : (description)}
+          </Box_1.Box>)}
+
+        {hasContent(children) &&
+            (isTextContent(children) ? (<Text_1.Text variant={types_1.TextVariant.BodyMd} {...childrenWrapperProps}>
+              {children}
+            </Text_1.Text>) : (children))}
+
+        {shouldShowActionButton && (<Box_1.Box twClassName="mt-4">
+            <Button_1.Button size={types_1.ButtonSize.Md} onPress={actionButtonOnPress} {...resolvedActionButtonProps}>
+              {actionButtonLabel}
+            </Button_1.Button>
+          </Box_1.Box>)}
+      </Box_1.Box>
+
+      {shouldShowCloseButton && (<ButtonIcon_1.ButtonIcon twClassName={mergedCloseButtonTwClassName} iconName={types_1.IconName.Close} size={types_1.ButtonIconSize.Sm} accessibilityLabel={closeButtonAccessibilityLabel} onPress={handleClosePress} {...resolvedCloseButtonProps}/>)}
+    </Box_1.Box>);
+};
+exports.BannerBase = BannerBase;
+//# sourceMappingURL=BannerBase.cjs.map

package/dist/components/BannerBase/BannerBase.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerBase.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { GestureResponderEvent } from 'react-native';\n\nimport {\n  BoxAlignItems,\n  BoxBackgroundColor,\n  ButtonIconSize,\n  ButtonSize,\n  FontWeight,\n  BoxFlexDirection,\n  IconName,\n  TextVariant,\n} from '../../types';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Text } from '../Text';\n\nimport type { BannerBaseProps } from './BannerBase.types';\n\nconst isTextContent = (content: React.ReactNode): content is string | number =>\n  typeof content === 'string' || typeof content === 'number';\n\nconst hasContent = (content: React.ReactNode) =>\n  content !== null && content !== undefined;\n\nexport const BannerBase: React.FC<BannerBaseProps> = ({\n  title,\n  titleProps,\n  description,\n  descriptionProps,\n  children,\n  childrenWrapperProps,\n  actionButtonLabel,\n  actionButtonOnPress,\n  actionButtonProps,\n  startAccessory,\n  onClose,\n  closeButtonProps,\n  twClassName,\n  ...props\n}) => {\n  const resolvedActionButtonProps = actionButtonProps ?? {};\n\n  const {\n    accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner',\n    onPress: closeButtonPropsOnPress,\n    twClassName: closeButtonTwClassName,\n    ...resolvedCloseButtonProps\n  } = closeButtonProps ?? {};\n\n  const shouldShowCloseButton = Boolean(onClose || closeButtonProps);\n  const shouldShowActionButton = Boolean(actionButtonOnPress);\n\n  const handleClosePress =\n    onClose || closeButtonPropsOnPress\n      ? (event: GestureResponderEvent) => {\n          if (onClose) {\n            onClose();\n            return;\n          }\n          closeButtonPropsOnPress?.(event);\n        }\n      : undefined;\n\n  const mergedCloseButtonTwClassName = closeButtonTwClassName\n    ? `ml-3 ${closeButtonTwClassName}`\n    : 'ml-3';\n\n  return (\n    <Box\n      flexDirection={BoxFlexDirection.Row}\n      alignItems={BoxAlignItems.Start}\n      gap={2}\n      backgroundColor={BoxBackgroundColor.BackgroundDefault}\n      padding={3}\n      twClassName={twClassName ? `rounded-sm ${twClassName}` : 'rounded-sm'}\n      {...props}\n    >\n      {startAccessory}\n\n      <Box twClassName=\"flex-1\">\n        {hasContent(title) &&\n          (isTextContent(title) ? (\n            <Text\n              variant={TextVariant.BodyMd}\n              fontWeight={FontWeight.Medium}\n              {...titleProps}\n            >\n              {title}\n            </Text>\n          ) : (\n            title\n          ))}\n\n        {hasContent(description) && (\n          <Box twClassName={hasContent(title) ? 'mt-1' : undefined}>\n            {isTextContent(description) ? (\n              <Text variant={TextVariant.BodySm} {...descriptionProps}>\n                {description}\n              </Text>\n            ) : (\n              description\n            )}\n          </Box>\n        )}\n\n        {hasContent(children) &&\n          (isTextContent(children) ? (\n            <Text variant={TextVariant.BodyMd} {...childrenWrapperProps}>\n              {children}\n            </Text>\n          ) : (\n            children\n          ))}\n\n        {shouldShowActionButton && (\n          <Box twClassName=\"mt-4\">\n            <Button\n              size={ButtonSize.Md}\n              onPress={actionButtonOnPress}\n              {...resolvedActionButtonProps}\n            >\n              {actionButtonLabel}\n            </Button>\n          </Box>\n        )}\n      </Box>\n\n      {shouldShowCloseButton && (\n        <ButtonIcon\n          twClassName={mergedCloseButtonTwClassName}\n          iconName={IconName.Close}\n          size={ButtonIconSize.Sm}\n          accessibilityLabel={closeButtonAccessibilityLabel}\n          onPress={handleClosePress}\n          {...resolvedCloseButtonProps}\n        />\n      )}\n    </Box>\n  );\n};\n"]}

package/dist/components/BannerBase/BannerBase.d.cts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerBase.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc;AAkB1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAmHhD,CAAC"}

package/dist/components/BannerBase/BannerBase.d.mts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerBase.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc;AAkB1B,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAQ1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAmHhD,CAAC"}

package/dist/components/BannerBase/BannerBase.mjs

@@ -0,0 +1,63 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+import $React from "react";
+const React = $importDefault($React);
+import { BoxAlignItems, BoxBackgroundColor, ButtonIconSize, ButtonSize, FontWeight, BoxFlexDirection, IconName, TextVariant } from "../../types/index.mjs";
+import { Box } from "../Box/index.mjs";
+import { Button } from "../Button/index.mjs";
+import { ButtonIcon } from "../ButtonIcon/index.mjs";
+import { Text } from "../Text/index.mjs";
+const isTextContent = (content) => typeof content === 'string' || typeof content === 'number';
+const hasContent = (content) => content !== null && content !== undefined;
+export const BannerBase = ({ title, titleProps, description, descriptionProps, children, childrenWrapperProps, actionButtonLabel, actionButtonOnPress, actionButtonProps, startAccessory, onClose, closeButtonProps, twClassName, ...props }) => {
+    const resolvedActionButtonProps = actionButtonProps ?? {};
+    const { accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner', onPress: closeButtonPropsOnPress, twClassName: closeButtonTwClassName, ...resolvedCloseButtonProps } = closeButtonProps ?? {};
+    const shouldShowCloseButton = Boolean(onClose || closeButtonProps);
+    const shouldShowActionButton = Boolean(actionButtonOnPress);
+    const handleClosePress = onClose || closeButtonPropsOnPress
+        ? (event) => {
+            if (onClose) {
+                onClose();
+                return;
+            }
+            closeButtonPropsOnPress?.(event);
+        }
+        : undefined;
+    const mergedCloseButtonTwClassName = closeButtonTwClassName
+        ? `ml-3 ${closeButtonTwClassName}`
+        : 'ml-3';
+    return (<Box flexDirection={BoxFlexDirection.Row} alignItems={BoxAlignItems.Start} gap={2} backgroundColor={BoxBackgroundColor.BackgroundDefault} padding={3} twClassName={twClassName ? `rounded-sm ${twClassName}` : 'rounded-sm'} {...props}>
+      {startAccessory}
+
+      <Box twClassName="flex-1">
+        {hasContent(title) &&
+            (isTextContent(title) ? (<Text variant={TextVariant.BodyMd} fontWeight={FontWeight.Medium} {...titleProps}>
+              {title}
+            </Text>) : (title))}
+
+        {hasContent(description) && (<Box twClassName={hasContent(title) ? 'mt-1' : undefined}>
+            {isTextContent(description) ? (<Text variant={TextVariant.BodySm} {...descriptionProps}>
+                {description}
+              </Text>) : (description)}
+          </Box>)}
+
+        {hasContent(children) &&
+            (isTextContent(children) ? (<Text variant={TextVariant.BodyMd} {...childrenWrapperProps}>
+              {children}
+            </Text>) : (children))}
+
+        {shouldShowActionButton && (<Box twClassName="mt-4">
+            <Button size={ButtonSize.Md} onPress={actionButtonOnPress} {...resolvedActionButtonProps}>
+              {actionButtonLabel}
+            </Button>
+          </Box>)}
+      </Box>
+
+      {shouldShowCloseButton && (<ButtonIcon twClassName={mergedCloseButtonTwClassName} iconName={IconName.Close} size={ButtonIconSize.Sm} accessibilityLabel={closeButtonAccessibilityLabel} onPress={handleClosePress} {...resolvedCloseButtonProps}/>)}
+    </Box>);
+};
+//# sourceMappingURL=BannerBase.mjs.map

package/dist/components/BannerBase/BannerBase.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerBase.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,MAAK,cAAc;;AAG1B,OAAO,EACL,aAAa,EACb,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,QAAQ,EACR,WAAW,EACZ,8BAAoB;AACrB,OAAO,EAAE,GAAG,EAAE,yBAAe;AAC7B,OAAO,EAAE,MAAM,EAAE,4BAAkB;AACnC,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,IAAI,EAAE,0BAAgB;AAI/B,MAAM,aAAa,GAAG,CAAC,OAAwB,EAA8B,EAAE,CAC7E,OAAO,OAAO,KAAK,QAAQ,IAAI,OAAO,OAAO,KAAK,QAAQ,CAAC;AAE7D,MAAM,UAAU,GAAG,CAAC,OAAwB,EAAE,EAAE,CAC9C,OAAO,KAAK,IAAI,IAAI,OAAO,KAAK,SAAS,CAAC;AAE5C,MAAM,CAAC,MAAM,UAAU,GAA8B,CAAC,EACpD,KAAK,EACL,UAAU,EACV,WAAW,EACX,gBAAgB,EAChB,QAAQ,EACR,oBAAoB,EACpB,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,EACd,OAAO,EACP,gBAAgB,EAChB,WAAW,EACX,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,yBAAyB,GAAG,iBAAiB,IAAI,EAAE,CAAC;IAE1D,MAAM,EACJ,kBAAkB,EAAE,6BAA6B,GAAG,cAAc,EAClE,OAAO,EAAE,uBAAuB,EAChC,WAAW,EAAE,sBAAsB,EACnC,GAAG,wBAAwB,EAC5B,GAAG,gBAAgB,IAAI,EAAE,CAAC;IAE3B,MAAM,qBAAqB,GAAG,OAAO,CAAC,OAAO,IAAI,gBAAgB,CAAC,CAAC;IACnE,MAAM,sBAAsB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAE5D,MAAM,gBAAgB,GACpB,OAAO,IAAI,uBAAuB;QAChC,CAAC,CAAC,CAAC,KAA4B,EAAE,EAAE;YAC/B,IAAI,OAAO,EAAE;gBACX,OAAO,EAAE,CAAC;gBACV,OAAO;aACR;YACD,uBAAuB,EAAE,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC;QACH,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,4BAA4B,GAAG,sBAAsB;QACzD,CAAC,CAAC,QAAQ,sBAAsB,EAAE;QAClC,CAAC,CAAC,MAAM,CAAC;IAEX,OAAO,CACL,CAAC,GAAG,CACF,aAAa,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,CACpC,UAAU,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,CAChC,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,eAAe,CAAC,CAAC,kBAAkB,CAAC,iBAAiB,CAAC,CACtD,OAAO,CAAC,CAAC,CAAC,CAAC,CACX,WAAW,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,cAAc,WAAW,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CACtE,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,cAAc,CAEf;;MAAA,CAAC,GAAG,CAAC,WAAW,CAAC,QAAQ,CACvB;QAAA,CAAC,UAAU,CAAC,KAAK,CAAC;YAChB,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CACtB,CAAC,IAAI,CACH,OAAO,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAC5B,UAAU,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,CAC9B,IAAI,UAAU,CAAC,CAEf;cAAA,CAAC,KAAK,CACR;YAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,CACF,KAAK,CACN,CAAC,CAEJ;;QAAA,CAAC,UAAU,CAAC,WAAW,CAAC,IAAI,CAC1B,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CACvD;YAAA,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAC5B,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,IAAI,gBAAgB,CAAC,CACtD;gBAAA,CAAC,WAAW,CACd;cAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,CACF,WAAW,CACZ,CACH;UAAA,EAAE,GAAG,CAAC,CACP,CAED;;QAAA,CAAC,UAAU,CAAC,QAAQ,CAAC;YACnB,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CACzB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,IAAI,oBAAoB,CAAC,CAC1D;cAAA,CAAC,QAAQ,CACX;YAAA,EAAE,IAAI,CAAC,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CAAC,CAEJ;;QAAA,CAAC,sBAAsB,IAAI,CACzB,CAAC,GAAG,CAAC,WAAW,CAAC,MAAM,CACrB;YAAA,CAAC,MAAM,CACL,IAAI,CAAC,CAAC,UAAU,CAAC,EAAE,CAAC,CACpB,OAAO,CAAC,CAAC,mBAAmB,CAAC,CAC7B,IAAI,yBAAyB,CAAC,CAE9B;cAAA,CAAC,iBAAiB,CACpB;YAAA,EAAE,MAAM,CACV;UAAA,EAAE,GAAG,CAAC,CACP,CACH;MAAA,EAAE,GAAG,CAEL;;MAAA,CAAC,qBAAqB,IAAI,CACxB,CAAC,UAAU,CACT,WAAW,CAAC,CAAC,4BAA4B,CAAC,CAC1C,QAAQ,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CACzB,IAAI,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC,CACxB,kBAAkB,CAAC,CAAC,6BAA6B,CAAC,CAClD,OAAO,CAAC,CAAC,gBAAgB,CAAC,CAC1B,IAAI,wBAAwB,CAAC,EAC7B,CACH,CACH;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { GestureResponderEvent } from 'react-native';\n\nimport {\n  BoxAlignItems,\n  BoxBackgroundColor,\n  ButtonIconSize,\n  ButtonSize,\n  FontWeight,\n  BoxFlexDirection,\n  IconName,\n  TextVariant,\n} from '../../types';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Text } from '../Text';\n\nimport type { BannerBaseProps } from './BannerBase.types';\n\nconst isTextContent = (content: React.ReactNode): content is string | number =>\n  typeof content === 'string' || typeof content === 'number';\n\nconst hasContent = (content: React.ReactNode) =>\n  content !== null && content !== undefined;\n\nexport const BannerBase: React.FC<BannerBaseProps> = ({\n  title,\n  titleProps,\n  description,\n  descriptionProps,\n  children,\n  childrenWrapperProps,\n  actionButtonLabel,\n  actionButtonOnPress,\n  actionButtonProps,\n  startAccessory,\n  onClose,\n  closeButtonProps,\n  twClassName,\n  ...props\n}) => {\n  const resolvedActionButtonProps = actionButtonProps ?? {};\n\n  const {\n    accessibilityLabel: closeButtonAccessibilityLabel = 'Close banner',\n    onPress: closeButtonPropsOnPress,\n    twClassName: closeButtonTwClassName,\n    ...resolvedCloseButtonProps\n  } = closeButtonProps ?? {};\n\n  const shouldShowCloseButton = Boolean(onClose || closeButtonProps);\n  const shouldShowActionButton = Boolean(actionButtonOnPress);\n\n  const handleClosePress =\n    onClose || closeButtonPropsOnPress\n      ? (event: GestureResponderEvent) => {\n          if (onClose) {\n            onClose();\n            return;\n          }\n          closeButtonPropsOnPress?.(event);\n        }\n      : undefined;\n\n  const mergedCloseButtonTwClassName = closeButtonTwClassName\n    ? `ml-3 ${closeButtonTwClassName}`\n    : 'ml-3';\n\n  return (\n    <Box\n      flexDirection={BoxFlexDirection.Row}\n      alignItems={BoxAlignItems.Start}\n      gap={2}\n      backgroundColor={BoxBackgroundColor.BackgroundDefault}\n      padding={3}\n      twClassName={twClassName ? `rounded-sm ${twClassName}` : 'rounded-sm'}\n      {...props}\n    >\n      {startAccessory}\n\n      <Box twClassName=\"flex-1\">\n        {hasContent(title) &&\n          (isTextContent(title) ? (\n            <Text\n              variant={TextVariant.BodyMd}\n              fontWeight={FontWeight.Medium}\n              {...titleProps}\n            >\n              {title}\n            </Text>\n          ) : (\n            title\n          ))}\n\n        {hasContent(description) && (\n          <Box twClassName={hasContent(title) ? 'mt-1' : undefined}>\n            {isTextContent(description) ? (\n              <Text variant={TextVariant.BodySm} {...descriptionProps}>\n                {description}\n              </Text>\n            ) : (\n              description\n            )}\n          </Box>\n        )}\n\n        {hasContent(children) &&\n          (isTextContent(children) ? (\n            <Text variant={TextVariant.BodyMd} {...childrenWrapperProps}>\n              {children}\n            </Text>\n          ) : (\n            children\n          ))}\n\n        {shouldShowActionButton && (\n          <Box twClassName=\"mt-4\">\n            <Button\n              size={ButtonSize.Md}\n              onPress={actionButtonOnPress}\n              {...resolvedActionButtonProps}\n            >\n              {actionButtonLabel}\n            </Button>\n          </Box>\n        )}\n      </Box>\n\n      {shouldShowCloseButton && (\n        <ButtonIcon\n          twClassName={mergedCloseButtonTwClassName}\n          iconName={IconName.Close}\n          size={ButtonIconSize.Sm}\n          accessibilityLabel={closeButtonAccessibilityLabel}\n          onPress={handleClosePress}\n          {...resolvedCloseButtonProps}\n        />\n      )}\n    </Box>\n  );\n};\n"]}

package/dist/components/BannerBase/BannerBase.types.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerBase.types.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BannerBasePropsShared } from '@metamask/design-system-shared';\nimport type { GestureResponderEvent } from 'react-native';\n\nimport type { BoxProps } from '../Box';\nimport type { ButtonProps } from '../Button';\nimport type { ButtonIconProps } from '../ButtonIcon';\nimport type { TextProps } from '../Text';\n\ntype BannerBaseActionButtonProps = Omit<\n  Partial<ButtonProps>,\n  'children' | 'onPress' | 'variant'\n>;\n\ntype BannerBaseCloseButtonProps = Omit<\n  Partial<ButtonIconProps>,\n  'iconName' | 'onPress'\n> & {\n  /**\n   * Optional press handler for the close button.\n   */\n  onPress?: (event: GestureResponderEvent) => void;\n};\n\ntype BannerBasePropsBase = BannerBasePropsShared &\n  Omit<BoxProps, 'children'> & {\n    /**\n     * Optional props for the title `Text` when title is a string.\n     */\n    titleProps?: Omit<Partial<TextProps>, 'children'>;\n    /**\n     * Optional props for the description `Text` when description is a string.\n     */\n    descriptionProps?: Omit<Partial<TextProps>, 'children'>;\n    /**\n     * Optional props for the children wrapper `Text` when children is a string.\n     */\n    childrenWrapperProps?: Omit<Partial<TextProps>, 'children'>;\n    /**\n     * Optional callback for the close button.\n     * If provided, a close button is shown.\n     */\n    onClose?: () => void;\n    /**\n     * Optional props for the close `ButtonIcon`.\n     * Providing this also shows a close button.\n     */\n    closeButtonProps?: BannerBaseCloseButtonProps;\n  };\n\ntype BannerBaseActionPropsWithHandler = {\n  actionButtonOnPress: (event: GestureResponderEvent) => void;\n  actionButtonLabel: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\ntype BannerBaseActionPropsWithoutHandler = {\n  actionButtonOnPress?: undefined;\n  actionButtonLabel?: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\n/**\n * BannerBase component props.\n */\nexport type BannerBaseProps = BannerBasePropsBase &\n  (BannerBaseActionPropsWithHandler | BannerBaseActionPropsWithoutHandler);\n"]}

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

@@ -0,0 +1,53 @@
+import type { BannerBasePropsShared } from "@metamask/design-system-shared";
+import type { GestureResponderEvent } from "react-native/index.js";
+import type { BoxProps } from "../Box/index.cjs";
+import type { ButtonProps } from "../Button/index.cjs";
+import type { ButtonIconProps } from "../ButtonIcon/index.cjs";
+import type { TextProps } from "../Text/index.cjs";
+type BannerBaseActionButtonProps = Omit<Partial<ButtonProps>, 'children' | 'onPress' | 'variant'>;
+type BannerBaseCloseButtonProps = Omit<Partial<ButtonIconProps>, 'iconName' | 'onPress'> & {
+    /**
+     * Optional press handler for the close button.
+     */
+    onPress?: (event: GestureResponderEvent) => void;
+};
+type BannerBasePropsBase = BannerBasePropsShared & Omit<BoxProps, 'children'> & {
+    /**
+     * Optional props for the title `Text` when title is a string.
+     */
+    titleProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional props for the description `Text` when description is a string.
+     */
+    descriptionProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional props for the children wrapper `Text` when children is a string.
+     */
+    childrenWrapperProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional callback for the close button.
+     * If provided, a close button is shown.
+     */
+    onClose?: () => void;
+    /**
+     * Optional props for the close `ButtonIcon`.
+     * Providing this also shows a close button.
+     */
+    closeButtonProps?: BannerBaseCloseButtonProps;
+};
+type BannerBaseActionPropsWithHandler = {
+    actionButtonOnPress: (event: GestureResponderEvent) => void;
+    actionButtonLabel: string;
+    actionButtonProps?: BannerBaseActionButtonProps;
+};
+type BannerBaseActionPropsWithoutHandler = {
+    actionButtonOnPress?: undefined;
+    actionButtonLabel?: string;
+    actionButtonProps?: BannerBaseActionButtonProps;
+};
+/**
+ * BannerBase component props.
+ */
+export type BannerBaseProps = BannerBasePropsBase & (BannerBaseActionPropsWithHandler | BannerBaseActionPropsWithoutHandler);
+export {};
+//# sourceMappingURL=BannerBase.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerBase.types.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uCAAuC;AAC5E,OAAO,KAAK,EAAE,qBAAqB,EAAE,8BAAqB;AAE1D,OAAO,KAAK,EAAE,QAAQ,EAAE,yBAAe;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,4BAAkB;AAC7C,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,KAAK,2BAA2B,GAAG,IAAI,CACrC,OAAO,CAAC,WAAW,CAAC,EACpB,UAAU,GAAG,SAAS,GAAG,SAAS,CACnC,CAAC;AAEF,KAAK,0BAA0B,GAAG,IAAI,CACpC,OAAO,CAAC,eAAe,CAAC,EACxB,UAAU,GAAG,SAAS,CACvB,GAAG;IACF;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,KAAK,mBAAmB,GAAG,qBAAqB,GAC9C,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAClD;;OAEG;IACH,gBAAgB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IACxD;;OAEG;IACH,oBAAoB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAC5D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,0BAA0B,CAAC;CAC/C,CAAC;AAEJ,KAAK,gCAAgC,GAAG;IACtC,mBAAmB,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAC5D,iBAAiB,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,2BAA2B,CAAC;CACjD,CAAC;AAEF,KAAK,mCAAmC,GAAG;IACzC,mBAAmB,CAAC,EAAE,SAAS,CAAC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,2BAA2B,CAAC;CACjD,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAC/C,CAAC,gCAAgC,GAAG,mCAAmC,CAAC,CAAC"}

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

@@ -0,0 +1,53 @@
+import type { BannerBasePropsShared } from "@metamask/design-system-shared";
+import type { GestureResponderEvent } from "react-native/index.js";
+import type { BoxProps } from "../Box/index.mjs";
+import type { ButtonProps } from "../Button/index.mjs";
+import type { ButtonIconProps } from "../ButtonIcon/index.mjs";
+import type { TextProps } from "../Text/index.mjs";
+type BannerBaseActionButtonProps = Omit<Partial<ButtonProps>, 'children' | 'onPress' | 'variant'>;
+type BannerBaseCloseButtonProps = Omit<Partial<ButtonIconProps>, 'iconName' | 'onPress'> & {
+    /**
+     * Optional press handler for the close button.
+     */
+    onPress?: (event: GestureResponderEvent) => void;
+};
+type BannerBasePropsBase = BannerBasePropsShared & Omit<BoxProps, 'children'> & {
+    /**
+     * Optional props for the title `Text` when title is a string.
+     */
+    titleProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional props for the description `Text` when description is a string.
+     */
+    descriptionProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional props for the children wrapper `Text` when children is a string.
+     */
+    childrenWrapperProps?: Omit<Partial<TextProps>, 'children'>;
+    /**
+     * Optional callback for the close button.
+     * If provided, a close button is shown.
+     */
+    onClose?: () => void;
+    /**
+     * Optional props for the close `ButtonIcon`.
+     * Providing this also shows a close button.
+     */
+    closeButtonProps?: BannerBaseCloseButtonProps;
+};
+type BannerBaseActionPropsWithHandler = {
+    actionButtonOnPress: (event: GestureResponderEvent) => void;
+    actionButtonLabel: string;
+    actionButtonProps?: BannerBaseActionButtonProps;
+};
+type BannerBaseActionPropsWithoutHandler = {
+    actionButtonOnPress?: undefined;
+    actionButtonLabel?: string;
+    actionButtonProps?: BannerBaseActionButtonProps;
+};
+/**
+ * BannerBase component props.
+ */
+export type BannerBaseProps = BannerBasePropsBase & (BannerBaseActionPropsWithHandler | BannerBaseActionPropsWithoutHandler);
+export {};
+//# sourceMappingURL=BannerBase.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerBase.types.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uCAAuC;AAC5E,OAAO,KAAK,EAAE,qBAAqB,EAAE,8BAAqB;AAE1D,OAAO,KAAK,EAAE,QAAQ,EAAE,yBAAe;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,4BAAkB;AAC7C,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,KAAK,2BAA2B,GAAG,IAAI,CACrC,OAAO,CAAC,WAAW,CAAC,EACpB,UAAU,GAAG,SAAS,GAAG,SAAS,CACnC,CAAC;AAEF,KAAK,0BAA0B,GAAG,IAAI,CACpC,OAAO,CAAC,eAAe,CAAC,EACxB,UAAU,GAAG,SAAS,CACvB,GAAG;IACF;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,KAAK,mBAAmB,GAAG,qBAAqB,GAC9C,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAClD;;OAEG;IACH,gBAAgB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IACxD;;OAEG;IACH,oBAAoB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC;IAC5D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,0BAA0B,CAAC;CAC/C,CAAC;AAEJ,KAAK,gCAAgC,GAAG;IACtC,mBAAmB,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAC5D,iBAAiB,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,2BAA2B,CAAC;CACjD,CAAC;AAEF,KAAK,mCAAmC,GAAG;IACzC,mBAAmB,CAAC,EAAE,SAAS,CAAC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,2BAA2B,CAAC;CACjD,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAC/C,CAAC,gCAAgC,GAAG,mCAAmC,CAAC,CAAC"}

package/dist/components/BannerBase/BannerBase.types.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerBase.types.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BannerBasePropsShared } from '@metamask/design-system-shared';\nimport type { GestureResponderEvent } from 'react-native';\n\nimport type { BoxProps } from '../Box';\nimport type { ButtonProps } from '../Button';\nimport type { ButtonIconProps } from '../ButtonIcon';\nimport type { TextProps } from '../Text';\n\ntype BannerBaseActionButtonProps = Omit<\n  Partial<ButtonProps>,\n  'children' | 'onPress' | 'variant'\n>;\n\ntype BannerBaseCloseButtonProps = Omit<\n  Partial<ButtonIconProps>,\n  'iconName' | 'onPress'\n> & {\n  /**\n   * Optional press handler for the close button.\n   */\n  onPress?: (event: GestureResponderEvent) => void;\n};\n\ntype BannerBasePropsBase = BannerBasePropsShared &\n  Omit<BoxProps, 'children'> & {\n    /**\n     * Optional props for the title `Text` when title is a string.\n     */\n    titleProps?: Omit<Partial<TextProps>, 'children'>;\n    /**\n     * Optional props for the description `Text` when description is a string.\n     */\n    descriptionProps?: Omit<Partial<TextProps>, 'children'>;\n    /**\n     * Optional props for the children wrapper `Text` when children is a string.\n     */\n    childrenWrapperProps?: Omit<Partial<TextProps>, 'children'>;\n    /**\n     * Optional callback for the close button.\n     * If provided, a close button is shown.\n     */\n    onClose?: () => void;\n    /**\n     * Optional props for the close `ButtonIcon`.\n     * Providing this also shows a close button.\n     */\n    closeButtonProps?: BannerBaseCloseButtonProps;\n  };\n\ntype BannerBaseActionPropsWithHandler = {\n  actionButtonOnPress: (event: GestureResponderEvent) => void;\n  actionButtonLabel: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\ntype BannerBaseActionPropsWithoutHandler = {\n  actionButtonOnPress?: undefined;\n  actionButtonLabel?: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\n/**\n * BannerBase component props.\n */\nexport type BannerBaseProps = BannerBasePropsBase &\n  (BannerBaseActionPropsWithHandler | BannerBaseActionPropsWithoutHandler);\n"]}

package/dist/components/BannerBase/index.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/index.ts"],"names":[],"mappings":";;;AAAA,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export { BannerBase } from './BannerBase';\nexport type { BannerBaseProps } from './BannerBase.types';\n"]}

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

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