@metamask-previews/design-system-react-native 0.5.1-preview.ab80aae → 0.6.0-preview.3dc70e1

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

@@ -1,37 +1,13 @@
+import type { BadgeStatusPropsShared } from "@metamask-previews/design-system-shared";
 import type { ViewProps } from "react-native/index.js";
-import type { BadgeStatusStatus, BadgeStatusSize } from "../../types/index.cjs";
 /**
- * BadgeStatus component props.
+ * BadgeStatus component props (React Native platform-specific)
+ * Extends shared props with React Native-specific platform concerns
  */
-export type BadgeStatusProps = {
-    /**
-     * Optional prop to control the status of the badge
-     * Possible values:
-     * - BadgeStatusStatus.Active. (Connected)
-     * - BadgeStatusStatus.Inactive. (Connected)
-     * - BadgeStatusStatus.Disconnected.
-     * - BadgeStatusStatus.New.
-     * - BadgeStatusStatus.Attention.
-     */
-    status: BadgeStatusStatus;
-    /**
-     * Optional prop to determine whether the badge should display a border
-     *
-     * @default true
-     */
-    hasBorder?: boolean;
-    /**
-     * Optional prop to control the size of the BadgeStatus
-     * Possible values:
-     * - BadgeStatusSize.Md (8px),
-     * - BadgeStatusSize.Lg (10px),
-     *
-     * @default AvatarBaseSize.Md
-     */
-    size?: BadgeStatusSize;
+export type BadgeStatusProps = BadgeStatusPropsShared & Omit<ViewProps, 'children'> & {
     /**
      * Optional prop to add twrnc overriding classNames.
      */
     twClassName?: string;
-} & Omit<ViewProps, 'children'>;
+};
 //# sourceMappingURL=BadgeStatus.types.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeStatus.types.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeStatus/BadgeStatus.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,8BAAoB;AAEtE;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;;;;;OAQG;IACH,MAAM,EAAE,iBAAiB,CAAC;IAC1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"BadgeStatus.types.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeStatus/BadgeStatus.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,sBAAsB,EAAE,gDAAgD;AACtF,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GACnD,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,GAAG;IAC5B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}

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

@@ -1,37 +1,13 @@
+import type { BadgeStatusPropsShared } from "@metamask-previews/design-system-shared";
 import type { ViewProps } from "react-native/index.js";
-import type { BadgeStatusStatus, BadgeStatusSize } from "../../types/index.mjs";
 /**
- * BadgeStatus component props.
+ * BadgeStatus component props (React Native platform-specific)
+ * Extends shared props with React Native-specific platform concerns
  */
-export type BadgeStatusProps = {
-    /**
-     * Optional prop to control the status of the badge
-     * Possible values:
-     * - BadgeStatusStatus.Active. (Connected)
-     * - BadgeStatusStatus.Inactive. (Connected)
-     * - BadgeStatusStatus.Disconnected.
-     * - BadgeStatusStatus.New.
-     * - BadgeStatusStatus.Attention.
-     */
-    status: BadgeStatusStatus;
-    /**
-     * Optional prop to determine whether the badge should display a border
-     *
-     * @default true
-     */
-    hasBorder?: boolean;
-    /**
-     * Optional prop to control the size of the BadgeStatus
-     * Possible values:
-     * - BadgeStatusSize.Md (8px),
-     * - BadgeStatusSize.Lg (10px),
-     *
-     * @default AvatarBaseSize.Md
-     */
-    size?: BadgeStatusSize;
+export type BadgeStatusProps = BadgeStatusPropsShared & Omit<ViewProps, 'children'> & {
     /**
      * Optional prop to add twrnc overriding classNames.
      */
     twClassName?: string;
-} & Omit<ViewProps, 'children'>;
+};
 //# sourceMappingURL=BadgeStatus.types.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeStatus.types.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeStatus/BadgeStatus.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C,OAAO,KAAK,EAAE,iBAAiB,EAAE,eAAe,EAAE,8BAAoB;AAEtE;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;;;;;OAQG;IACH,MAAM,EAAE,iBAAiB,CAAC;IAC1B;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC"}
+{"version":3,"file":"BadgeStatus.types.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeStatus/BadgeStatus.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,sBAAsB,EAAE,gDAAgD;AACtF,OAAO,KAAK,EAAE,SAAS,EAAE,8BAAqB;AAE9C;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GACnD,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,GAAG;IAC5B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeStatus.types.mjs","sourceRoot":"","sources":["../../../src/components/BadgeStatus/BadgeStatus.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ViewProps } from 'react-native';\n\nimport type { BadgeStatusStatus, BadgeStatusSize } from '../../types';\n\n/**\n * BadgeStatus component props.\n */\nexport type BadgeStatusProps = {\n  /**\n   * Optional prop to control the status of the badge\n   * Possible values:\n   * - BadgeStatusStatus.Active. (Connected)\n   * - BadgeStatusStatus.Inactive. (Connected)\n   * - BadgeStatusStatus.Disconnected.\n   * - BadgeStatusStatus.New.\n   * - BadgeStatusStatus.Attention.\n   */\n  status: BadgeStatusStatus;\n  /**\n   * Optional prop to determine whether the badge should display a border\n   *\n   * @default true\n   */\n  hasBorder?: boolean;\n  /**\n   * Optional prop to control the size of the BadgeStatus\n   * Possible values:\n   * - BadgeStatusSize.Md (8px),\n   * - BadgeStatusSize.Lg (10px),\n   *\n   * @default AvatarBaseSize.Md\n   */\n  size?: BadgeStatusSize;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n} & Omit<ViewProps, 'children'>;\n"]}
+{"version":3,"file":"BadgeStatus.types.mjs","sourceRoot":"","sources":["../../../src/components/BadgeStatus/BadgeStatus.types.ts"],"names":[],"mappings":"","sourcesContent":["// Import shared type for extension\nimport type { BadgeStatusPropsShared } from '@metamask-previews/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\n/**\n * BadgeStatus component props (React Native platform-specific)\n * Extends shared props with React Native-specific platform concerns\n */\nexport type BadgeStatusProps = BadgeStatusPropsShared &\n  Omit<ViewProps, 'children'> & {\n    /**\n     * Optional prop to add twrnc overriding classNames.\n     */\n    twClassName?: string;\n  };\n"]}

package/dist/components/BadgeStatus/index.cjs

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BadgeStatus/index.ts"],"names":[],"mappings":";;;AAAA,+CAAiE;AAAxD,0GAAA,iBAAiB,OAAA;AAAE,wGAAA,eAAe,OAAA;AAC3C,iDAA4C;AAAnC,0GAAA,WAAW,OAAA","sourcesContent":["export { BadgeStatusStatus, BadgeStatusSize } from '../../types';\nexport { BadgeStatus } from './BadgeStatus';\nexport type { BadgeStatusProps } from './BadgeStatus.types';\n"]}
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BadgeStatus/index.ts"],"names":[],"mappings":";;;AAAA,gFAGiD;AAF/C,uHAAA,eAAe,OAAA;AACf,yHAAA,iBAAiB,OAAA;AAEnB,iDAA4C;AAAnC,0GAAA,WAAW,OAAA","sourcesContent":["export {\n  BadgeStatusSize,\n  BadgeStatusStatus,\n} from '@metamask-previews/design-system-shared';\nexport { BadgeStatus } from './BadgeStatus';\nexport type { BadgeStatusProps } from './BadgeStatus.types';\n"]}

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

@@ -1,4 +1,4 @@
-export { BadgeStatusStatus, BadgeStatusSize } from "../../types/index.cjs";
+export { BadgeStatusSize, BadgeStatusStatus, } from "@metamask-previews/design-system-shared";
 export { BadgeStatus } from "./BadgeStatus.cjs";
 export type { BadgeStatusProps } from "./BadgeStatus.types.cjs";
 //# sourceMappingURL=index.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeStatus/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,8BAAoB;AACjE,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeStatus/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,iBAAiB,GAClB,gDAAgD;AACjD,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}

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

@@ -1,4 +1,4 @@
-export { BadgeStatusStatus, BadgeStatusSize } from "../../types/index.mjs";
+export { BadgeStatusSize, BadgeStatusStatus, } from "@metamask-previews/design-system-shared";
 export { BadgeStatus } from "./BadgeStatus.mjs";
 export type { BadgeStatusProps } from "./BadgeStatus.types.mjs";
 //# sourceMappingURL=index.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeStatus/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,8BAAoB;AACjE,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeStatus/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,iBAAiB,GAClB,gDAAgD;AACjD,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}

package/dist/components/BadgeStatus/index.mjs

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/BadgeStatus/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,8BAAoB;AACjE,OAAO,EAAE,WAAW,EAAE,0BAAsB","sourcesContent":["export { BadgeStatusStatus, BadgeStatusSize } from '../../types';\nexport { BadgeStatus } from './BadgeStatus';\nexport type { BadgeStatusProps } from './BadgeStatus.types';\n"]}
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/BadgeStatus/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,iBAAiB,EAClB,gDAAgD;AACjD,OAAO,EAAE,WAAW,EAAE,0BAAsB","sourcesContent":["export {\n  BadgeStatusSize,\n  BadgeStatusStatus,\n} from '@metamask-previews/design-system-shared';\nexport { BadgeStatus } from './BadgeStatus';\nexport type { BadgeStatusProps } from './BadgeStatus.types';\n"]}

package/dist/components/BadgeWrapper/BadgeWrapper.cjs

@@ -28,7 +28,7 @@ const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-t
 const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native/index.js");
 const types_1 = require("../../types/index.cjs");
-const BadgeWrapper = ({ children, childrenContainerProps, badge, badgeContainerProps, position = types_1.BadgeWrapperPosition.BottomRight, positionAnchorShape = types_1.BadgeWrapperPositionAnchorShape.Circular, positionXOffset = 0, positionYOffset = 0, customPosition, twClassName = '', style, ...props }) => {
+const BadgeWrapper = ({ children, childrenContainerProps, badge, badgeContainerProps, position = types_1.BadgeWrapperPosition.BottomRight, positionAnchorShape = types_1.BadgeWrapperPositionAnchorShape.Circular, positionXOffset = 0, positionYOffset = 0, customPosition, twClassName, style, ...props }) => {
     const tw = (0, design_system_twrnc_preset_1.useTailwind)();
     const [anchorWidth, setAnchorWidth] = (0, react_1.useState)(0);
     const [anchorHeight, setAnchorHeight] = (0, react_1.useState)(0);
@@ -97,11 +97,11 @@ const BadgeWrapper = ({ children, childrenContainerProps, badge, badgeContainerP
         positionYOffset,
         customPosition,
     ]);
-    return (<react_native_1.View style={[tw `relative self-start ${twClassName}`, style]} {...props}>
+    return (<react_native_1.View {...props} style={[tw.style('relative self-start', twClassName), style]}>
       <react_native_1.View onLayout={getAnchorSize} {...childrenContainerProps}>
         {children}
       </react_native_1.View>
-      <react_native_1.View onLayout={getBadgeSize} style={[tw `absolute`, { ...finalPositions }]} {...badgeContainerProps}>
+      <react_native_1.View onLayout={getBadgeSize} style={[tw.style('absolute'), { ...finalPositions }]} {...badgeContainerProps}>
         {badge}
       </react_native_1.View>
     </react_native_1.View>);

package/dist/components/BadgeWrapper/BadgeWrapper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeWrapper.cjs","sourceRoot":"","sources":["../../../src/components/BadgeWrapper/BadgeWrapper.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useCallback, useState, useMemo } from 'react';\nimport type { LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\n\nimport {\n  BadgeWrapperPosition,\n  BadgeWrapperPositionAnchorShape,\n} from '../../types';\n\nimport type { BadgeWrapperProps } from './BadgeWrapper.types';\n\nexport const BadgeWrapper = ({\n  children,\n  childrenContainerProps,\n  badge,\n  badgeContainerProps,\n  position = BadgeWrapperPosition.BottomRight,\n  positionAnchorShape = BadgeWrapperPositionAnchorShape.Circular,\n  positionXOffset = 0,\n  positionYOffset = 0,\n  customPosition,\n  twClassName = '',\n  style,\n  ...props\n}: BadgeWrapperProps) => {\n  const tw = useTailwind();\n  const [anchorWidth, setAnchorWidth] = useState<number>(0);\n  const [anchorHeight, setAnchorHeight] = useState<number>(0);\n  const [badgeWidth, setbadgeWidth] = useState<number>(0);\n  const [badgeHeight, setbadgeHeight] = useState<number>(0);\n\n  // Fetching the dimensions of the anchor and bagde element to properly position the badge\n  const getAnchorSize = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout;\n    setAnchorWidth(width);\n    setAnchorHeight(height);\n  }, []);\n  const getBadgeSize = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout;\n    setbadgeWidth(width);\n    setbadgeHeight(height);\n  }, []);\n\n  const finalPositions = useMemo(() => {\n    if (customPosition) {\n      return customPosition;\n    }\n    // 0.1464 is a mathematical coeeficient to move\n    // from a 0,0 corner of a rectangular shape to the closest \"corner\"\n    // of a circular shape anchor element\n    const anchorShapeXOffset =\n      positionAnchorShape === BadgeWrapperPositionAnchorShape.Rectangular\n        ? 0\n        : anchorWidth * 0.1464;\n    const anchorShapeYOffset =\n      positionAnchorShape === BadgeWrapperPositionAnchorShape.Rectangular\n        ? 0\n        : anchorHeight * 0.1464;\n    // This is to center the badge in the corner of the anchor element\n    const badgeCenteringXOffset = badgeWidth / 2;\n    const badgeCenteringYOffset = badgeHeight / 2;\n\n    const finalXOffset =\n      anchorShapeXOffset - badgeCenteringXOffset + positionXOffset;\n    const finalYOffset =\n      anchorShapeYOffset - badgeCenteringYOffset + positionYOffset;\n    switch (position) {\n      case BadgeWrapperPosition.TopRight:\n        return {\n          top: finalYOffset,\n          right: finalXOffset,\n        };\n      case BadgeWrapperPosition.BottomLeft:\n        return {\n          bottom: finalYOffset,\n          left: finalXOffset,\n        };\n      case BadgeWrapperPosition.TopLeft:\n        return {\n          top: finalYOffset,\n          left: finalXOffset,\n        };\n      case BadgeWrapperPosition.BottomRight:\n      default:\n        return {\n          bottom: finalYOffset,\n          right: finalXOffset,\n        };\n    }\n  }, [\n    position,\n    positionAnchorShape,\n    anchorWidth,\n    anchorHeight,\n    badgeWidth,\n    badgeHeight,\n    positionXOffset,\n    positionYOffset,\n    customPosition,\n  ]);\n\n  return (\n    <View style={[tw`relative self-start ${twClassName}`, style]} {...props}>\n      <View onLayout={getAnchorSize} {...childrenContainerProps}>\n        {children}\n      </View>\n      <View\n        onLayout={getBadgeSize}\n        style={[tw`absolute`, { ...finalPositions }]}\n        {...badgeContainerProps}\n      >\n        {badge}\n      </View>\n    </View>\n  );\n};\n"]}
+{"version":3,"file":"BadgeWrapper.cjs","sourceRoot":"","sources":["../../../src/components/BadgeWrapper/BadgeWrapper.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useCallback, useState, useMemo } from 'react';\nimport type { LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\n\nimport {\n  BadgeWrapperPosition,\n  BadgeWrapperPositionAnchorShape,\n} from '../../types';\n\nimport type { BadgeWrapperProps } from './BadgeWrapper.types';\n\nexport const BadgeWrapper = ({\n  children,\n  childrenContainerProps,\n  badge,\n  badgeContainerProps,\n  position = BadgeWrapperPosition.BottomRight,\n  positionAnchorShape = BadgeWrapperPositionAnchorShape.Circular,\n  positionXOffset = 0,\n  positionYOffset = 0,\n  customPosition,\n  twClassName,\n  style,\n  ...props\n}: BadgeWrapperProps) => {\n  const tw = useTailwind();\n  const [anchorWidth, setAnchorWidth] = useState<number>(0);\n  const [anchorHeight, setAnchorHeight] = useState<number>(0);\n  const [badgeWidth, setbadgeWidth] = useState<number>(0);\n  const [badgeHeight, setbadgeHeight] = useState<number>(0);\n\n  // Fetching the dimensions of the anchor and bagde element to properly position the badge\n  const getAnchorSize = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout;\n    setAnchorWidth(width);\n    setAnchorHeight(height);\n  }, []);\n  const getBadgeSize = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout;\n    setbadgeWidth(width);\n    setbadgeHeight(height);\n  }, []);\n\n  const finalPositions = useMemo(() => {\n    if (customPosition) {\n      return customPosition;\n    }\n    // 0.1464 is a mathematical coeeficient to move\n    // from a 0,0 corner of a rectangular shape to the closest \"corner\"\n    // of a circular shape anchor element\n    const anchorShapeXOffset =\n      positionAnchorShape === BadgeWrapperPositionAnchorShape.Rectangular\n        ? 0\n        : anchorWidth * 0.1464;\n    const anchorShapeYOffset =\n      positionAnchorShape === BadgeWrapperPositionAnchorShape.Rectangular\n        ? 0\n        : anchorHeight * 0.1464;\n    // This is to center the badge in the corner of the anchor element\n    const badgeCenteringXOffset = badgeWidth / 2;\n    const badgeCenteringYOffset = badgeHeight / 2;\n\n    const finalXOffset =\n      anchorShapeXOffset - badgeCenteringXOffset + positionXOffset;\n    const finalYOffset =\n      anchorShapeYOffset - badgeCenteringYOffset + positionYOffset;\n    switch (position) {\n      case BadgeWrapperPosition.TopRight:\n        return {\n          top: finalYOffset,\n          right: finalXOffset,\n        };\n      case BadgeWrapperPosition.BottomLeft:\n        return {\n          bottom: finalYOffset,\n          left: finalXOffset,\n        };\n      case BadgeWrapperPosition.TopLeft:\n        return {\n          top: finalYOffset,\n          left: finalXOffset,\n        };\n      case BadgeWrapperPosition.BottomRight:\n      default:\n        return {\n          bottom: finalYOffset,\n          right: finalXOffset,\n        };\n    }\n  }, [\n    position,\n    positionAnchorShape,\n    anchorWidth,\n    anchorHeight,\n    badgeWidth,\n    badgeHeight,\n    positionXOffset,\n    positionYOffset,\n    customPosition,\n  ]);\n\n  return (\n    <View\n      {...props}\n      style={[tw.style('relative self-start', twClassName), style]}\n    >\n      <View onLayout={getAnchorSize} {...childrenContainerProps}>\n        {children}\n      </View>\n      <View\n        onLayout={getBadgeSize}\n        style={[tw.style('absolute'), { ...finalPositions }]}\n        {...badgeContainerProps}\n      >\n        {badge}\n      </View>\n    </View>\n  );\n};\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeWrapper.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeWrapper/BadgeWrapper.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyC,cAAc;AAS9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAE9D,eAAO,MAAM,YAAY,oLAatB,iBAAiB,sBA2FnB,CAAC"}
+{"version":3,"file":"BadgeWrapper.d.cts","sourceRoot":"","sources":["../../../src/components/BadgeWrapper/BadgeWrapper.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyC,cAAc;AAS9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAE9D,eAAO,MAAM,YAAY,oLAatB,iBAAiB,sBA8FnB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"BadgeWrapper.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeWrapper/BadgeWrapper.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyC,cAAc;AAS9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAE9D,eAAO,MAAM,YAAY,oLAatB,iBAAiB,sBA2FnB,CAAC"}
+{"version":3,"file":"BadgeWrapper.d.mts","sourceRoot":"","sources":["../../../src/components/BadgeWrapper/BadgeWrapper.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyC,cAAc;AAS9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAE9D,eAAO,MAAM,YAAY,oLAatB,iBAAiB,sBA8FnB,CAAC"}

package/dist/components/BadgeWrapper/BadgeWrapper.mjs

@@ -9,7 +9,7 @@ import $React, { useCallback, useState, useMemo } from "react";
 const React = $importDefault($React);
 import { View } from "react-native/index.js";
 import { BadgeWrapperPosition, BadgeWrapperPositionAnchorShape } from "../../types/index.mjs";
-export const BadgeWrapper = ({ children, childrenContainerProps, badge, badgeContainerProps, position = BadgeWrapperPosition.BottomRight, positionAnchorShape = BadgeWrapperPositionAnchorShape.Circular, positionXOffset = 0, positionYOffset = 0, customPosition, twClassName = '', style, ...props }) => {
+export const BadgeWrapper = ({ children, childrenContainerProps, badge, badgeContainerProps, position = BadgeWrapperPosition.BottomRight, positionAnchorShape = BadgeWrapperPositionAnchorShape.Circular, positionXOffset = 0, positionYOffset = 0, customPosition, twClassName, style, ...props }) => {
     const tw = useTailwind();
     const [anchorWidth, setAnchorWidth] = useState(0);
     const [anchorHeight, setAnchorHeight] = useState(0);
@@ -78,11 +78,11 @@ export const BadgeWrapper = ({ children, childrenContainerProps, badge, badgeCon
         positionYOffset,
         customPosition,
     ]);
-    return (<View style={[tw `relative self-start ${twClassName}`, style]} {...props}>
+    return (<View {...props} style={[tw.style('relative self-start', twClassName), style]}>
       <View onLayout={getAnchorSize} {...childrenContainerProps}>
         {children}
       </View>
-      <View onLayout={getBadgeSize} style={[tw `absolute`, { ...finalPositions }]} {...badgeContainerProps}>
+      <View onLayout={getBadgeSize} style={[tw.style('absolute'), { ...finalPositions }]} {...badgeContainerProps}>
         {badge}
       </View>
     </View>);

package/dist/components/BadgeWrapper/BadgeWrapper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeWrapper.mjs","sourceRoot":"","sources":["../../../src/components/BadgeWrapper/BadgeWrapper.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useCallback, useState, useMemo } from 'react';\nimport type { LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\n\nimport {\n  BadgeWrapperPosition,\n  BadgeWrapperPositionAnchorShape,\n} from '../../types';\n\nimport type { BadgeWrapperProps } from './BadgeWrapper.types';\n\nexport const BadgeWrapper = ({\n  children,\n  childrenContainerProps,\n  badge,\n  badgeContainerProps,\n  position = BadgeWrapperPosition.BottomRight,\n  positionAnchorShape = BadgeWrapperPositionAnchorShape.Circular,\n  positionXOffset = 0,\n  positionYOffset = 0,\n  customPosition,\n  twClassName = '',\n  style,\n  ...props\n}: BadgeWrapperProps) => {\n  const tw = useTailwind();\n  const [anchorWidth, setAnchorWidth] = useState<number>(0);\n  const [anchorHeight, setAnchorHeight] = useState<number>(0);\n  const [badgeWidth, setbadgeWidth] = useState<number>(0);\n  const [badgeHeight, setbadgeHeight] = useState<number>(0);\n\n  // Fetching the dimensions of the anchor and bagde element to properly position the badge\n  const getAnchorSize = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout;\n    setAnchorWidth(width);\n    setAnchorHeight(height);\n  }, []);\n  const getBadgeSize = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout;\n    setbadgeWidth(width);\n    setbadgeHeight(height);\n  }, []);\n\n  const finalPositions = useMemo(() => {\n    if (customPosition) {\n      return customPosition;\n    }\n    // 0.1464 is a mathematical coeeficient to move\n    // from a 0,0 corner of a rectangular shape to the closest \"corner\"\n    // of a circular shape anchor element\n    const anchorShapeXOffset =\n      positionAnchorShape === BadgeWrapperPositionAnchorShape.Rectangular\n        ? 0\n        : anchorWidth * 0.1464;\n    const anchorShapeYOffset =\n      positionAnchorShape === BadgeWrapperPositionAnchorShape.Rectangular\n        ? 0\n        : anchorHeight * 0.1464;\n    // This is to center the badge in the corner of the anchor element\n    const badgeCenteringXOffset = badgeWidth / 2;\n    const badgeCenteringYOffset = badgeHeight / 2;\n\n    const finalXOffset =\n      anchorShapeXOffset - badgeCenteringXOffset + positionXOffset;\n    const finalYOffset =\n      anchorShapeYOffset - badgeCenteringYOffset + positionYOffset;\n    switch (position) {\n      case BadgeWrapperPosition.TopRight:\n        return {\n          top: finalYOffset,\n          right: finalXOffset,\n        };\n      case BadgeWrapperPosition.BottomLeft:\n        return {\n          bottom: finalYOffset,\n          left: finalXOffset,\n        };\n      case BadgeWrapperPosition.TopLeft:\n        return {\n          top: finalYOffset,\n          left: finalXOffset,\n        };\n      case BadgeWrapperPosition.BottomRight:\n      default:\n        return {\n          bottom: finalYOffset,\n          right: finalXOffset,\n        };\n    }\n  }, [\n    position,\n    positionAnchorShape,\n    anchorWidth,\n    anchorHeight,\n    badgeWidth,\n    badgeHeight,\n    positionXOffset,\n    positionYOffset,\n    customPosition,\n  ]);\n\n  return (\n    <View style={[tw`relative self-start ${twClassName}`, style]} {...props}>\n      <View onLayout={getAnchorSize} {...childrenContainerProps}>\n        {children}\n      </View>\n      <View\n        onLayout={getBadgeSize}\n        style={[tw`absolute`, { ...finalPositions }]}\n        {...badgeContainerProps}\n      >\n        {badge}\n      </View>\n    </View>\n  );\n};\n"]}
+{"version":3,"file":"BadgeWrapper.mjs","sourceRoot":"","sources":["../../../src/components/BadgeWrapper/BadgeWrapper.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useCallback, useState, useMemo } from 'react';\nimport type { LayoutChangeEvent } from 'react-native';\nimport { View } from 'react-native';\n\nimport {\n  BadgeWrapperPosition,\n  BadgeWrapperPositionAnchorShape,\n} from '../../types';\n\nimport type { BadgeWrapperProps } from './BadgeWrapper.types';\n\nexport const BadgeWrapper = ({\n  children,\n  childrenContainerProps,\n  badge,\n  badgeContainerProps,\n  position = BadgeWrapperPosition.BottomRight,\n  positionAnchorShape = BadgeWrapperPositionAnchorShape.Circular,\n  positionXOffset = 0,\n  positionYOffset = 0,\n  customPosition,\n  twClassName,\n  style,\n  ...props\n}: BadgeWrapperProps) => {\n  const tw = useTailwind();\n  const [anchorWidth, setAnchorWidth] = useState<number>(0);\n  const [anchorHeight, setAnchorHeight] = useState<number>(0);\n  const [badgeWidth, setbadgeWidth] = useState<number>(0);\n  const [badgeHeight, setbadgeHeight] = useState<number>(0);\n\n  // Fetching the dimensions of the anchor and bagde element to properly position the badge\n  const getAnchorSize = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout;\n    setAnchorWidth(width);\n    setAnchorHeight(height);\n  }, []);\n  const getBadgeSize = useCallback((event: LayoutChangeEvent) => {\n    const { width, height } = event.nativeEvent.layout;\n    setbadgeWidth(width);\n    setbadgeHeight(height);\n  }, []);\n\n  const finalPositions = useMemo(() => {\n    if (customPosition) {\n      return customPosition;\n    }\n    // 0.1464 is a mathematical coeeficient to move\n    // from a 0,0 corner of a rectangular shape to the closest \"corner\"\n    // of a circular shape anchor element\n    const anchorShapeXOffset =\n      positionAnchorShape === BadgeWrapperPositionAnchorShape.Rectangular\n        ? 0\n        : anchorWidth * 0.1464;\n    const anchorShapeYOffset =\n      positionAnchorShape === BadgeWrapperPositionAnchorShape.Rectangular\n        ? 0\n        : anchorHeight * 0.1464;\n    // This is to center the badge in the corner of the anchor element\n    const badgeCenteringXOffset = badgeWidth / 2;\n    const badgeCenteringYOffset = badgeHeight / 2;\n\n    const finalXOffset =\n      anchorShapeXOffset - badgeCenteringXOffset + positionXOffset;\n    const finalYOffset =\n      anchorShapeYOffset - badgeCenteringYOffset + positionYOffset;\n    switch (position) {\n      case BadgeWrapperPosition.TopRight:\n        return {\n          top: finalYOffset,\n          right: finalXOffset,\n        };\n      case BadgeWrapperPosition.BottomLeft:\n        return {\n          bottom: finalYOffset,\n          left: finalXOffset,\n        };\n      case BadgeWrapperPosition.TopLeft:\n        return {\n          top: finalYOffset,\n          left: finalXOffset,\n        };\n      case BadgeWrapperPosition.BottomRight:\n      default:\n        return {\n          bottom: finalYOffset,\n          right: finalXOffset,\n        };\n    }\n  }, [\n    position,\n    positionAnchorShape,\n    anchorWidth,\n    anchorHeight,\n    badgeWidth,\n    badgeHeight,\n    positionXOffset,\n    positionYOffset,\n    customPosition,\n  ]);\n\n  return (\n    <View\n      {...props}\n      style={[tw.style('relative self-start', twClassName), style]}\n    >\n      <View onLayout={getAnchorSize} {...childrenContainerProps}>\n        {children}\n      </View>\n      <View\n        onLayout={getBadgeSize}\n        style={[tw.style('absolute'), { ...finalPositions }]}\n        {...badgeContainerProps}\n      >\n        {badge}\n      </View>\n    </View>\n  );\n};\n"]}

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.cjs

@@ -0,0 +1,51 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BottomSheetOverlay = void 0;
+const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-twrnc-preset");
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native/index.js");
+const BottomSheetOverlay_constants_1 = require("./BottomSheetOverlay.constants.cjs");
+const BottomSheetOverlay = ({ style, twClassName, onPress, touchableOpacityProps, ...props }) => {
+    const tw = (0, design_system_twrnc_preset_1.useTailwind)();
+    const opacityVal = (0, react_native_1.useAnimatedValue)(0);
+    (0, react_1.useEffect)(() => {
+        react_native_1.Animated.timing(opacityVal, {
+            toValue: 1,
+            duration: BottomSheetOverlay_constants_1.DEFAULT_OVERLAY_ANIMATION_DURATION,
+            easing: react_native_1.Easing.linear,
+            useNativeDriver: true,
+        }).start();
+    }, [opacityVal]);
+    return (<react_native_1.Animated.View style={[
+            tw.style('absolute inset-0 bg-overlay-default', twClassName),
+            style,
+            { opacity: opacityVal },
+        ]} {...props}>
+      {onPress && (<react_native_1.TouchableOpacity onPress={onPress} {...touchableOpacityProps} style={tw.style('flex-1')}/>)}
+    </react_native_1.Animated.View>);
+};
+exports.BottomSheetOverlay = BottomSheetOverlay;
+//# sourceMappingURL=BottomSheetOverlay.cjs.map

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,8FAA4E;AAC5E,+CAAyC;AACzC,wDAKsB;AAEtB,qFAAoF;AAG7E,MAAM,kBAAkB,GAAsC,CAAC,EACpE,KAAK,EACL,WAAW,EACX,OAAO,EACP,qBAAqB,EACrB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IACzB,MAAM,UAAU,GAAG,IAAA,+BAAgB,EAAC,CAAC,CAAC,CAAC;IAEvC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,uBAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;YAC1B,OAAO,EAAE,CAAC;YACV,QAAQ,EAAE,iEAAkC;YAC5C,MAAM,EAAE,qBAAM,CAAC,MAAM;YACrB,eAAe,EAAE,IAAI;SACtB,CAAC,CAAC,KAAK,EAAE,CAAC;IACb,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACL,CAAC,uBAAQ,CAAC,IAAI,CACZ,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CAAC,qCAAqC,EAAE,WAAW,CAAC;YAC5D,KAAK;YACL,EAAE,OAAO,EAAE,UAAU,EAAE;SACxB,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,OAAO,IAAI,CACV,CAAC,+BAAgB,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,qBAAqB,CAAC,CAC1B,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,EAC1B,CACH,CACH;IAAA,EAAE,uBAAQ,CAAC,IAAI,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC;AArCW,QAAA,kBAAkB,sBAqC7B","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useEffect } from 'react';\nimport {\n  Animated,\n  Easing,\n  TouchableOpacity,\n  useAnimatedValue,\n} from 'react-native';\n\nimport { DEFAULT_OVERLAY_ANIMATION_DURATION } from './BottomSheetOverlay.constants';\nimport { BottomSheetOverlayProps } from './BottomSheetOverlay.types';\n\nexport const BottomSheetOverlay: React.FC<BottomSheetOverlayProps> = ({\n  style,\n  twClassName,\n  onPress,\n  touchableOpacityProps,\n  ...props\n}) => {\n  const tw = useTailwind();\n  const opacityVal = useAnimatedValue(0);\n\n  useEffect(() => {\n    Animated.timing(opacityVal, {\n      toValue: 1,\n      duration: DEFAULT_OVERLAY_ANIMATION_DURATION,\n      easing: Easing.linear,\n      useNativeDriver: true,\n    }).start();\n  }, [opacityVal]);\n\n  return (\n    <Animated.View\n      style={[\n        tw.style('absolute inset-0 bg-overlay-default', twClassName),\n        style,\n        { opacity: opacityVal },\n      ]}\n      {...props}\n    >\n      {onPress && (\n        <TouchableOpacity\n          onPress={onPress}\n          {...touchableOpacityProps}\n          style={tw.style('flex-1')}\n        />\n      )}\n    </Animated.View>\n  );\n};\n"]}

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.cjs

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_OVERLAY_ANIMATION_DURATION = void 0;
+const design_tokens_1 = require("@metamask-previews/design-tokens");
+// Defaults
+exports.DEFAULT_OVERLAY_ANIMATION_DURATION = design_tokens_1.AnimationDuration.Fast;
+//# sourceMappingURL=BottomSheetOverlay.constants.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.constants.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":";;;AAAA,oEAAqE;AAErE,WAAW;AACE,QAAA,kCAAkC,GAAG,iCAAiB,CAAC,IAAI,CAAC","sourcesContent":["import { AnimationDuration } from '@metamask-previews/design-tokens';\n\n// Defaults\nexport const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;\n"]}

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

@@ -0,0 +1,3 @@
+import { AnimationDuration } from "@metamask-previews/design-tokens";
+export declare const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;
+//# sourceMappingURL=BottomSheetOverlay.constants.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.constants.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,yCAAyC;AAGrE,eAAO,MAAM,kCAAkC,yBAAyB,CAAC"}

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

@@ -0,0 +1,3 @@
+import { AnimationDuration } from "@metamask-previews/design-tokens";
+export declare const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;
+//# sourceMappingURL=BottomSheetOverlay.constants.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.constants.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,yCAAyC;AAGrE,eAAO,MAAM,kCAAkC,yBAAyB,CAAC"}

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.constants.mjs

@@ -0,0 +1,4 @@
+import { AnimationDuration } from "@metamask-previews/design-tokens";
+// Defaults
+export const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;
+//# sourceMappingURL=BottomSheetOverlay.constants.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.constants.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,yCAAyC;AAErE,WAAW;AACX,MAAM,CAAC,MAAM,kCAAkC,GAAG,iBAAiB,CAAC,IAAI,CAAC","sourcesContent":["import { AnimationDuration } from '@metamask-previews/design-tokens';\n\n// Defaults\nexport const DEFAULT_OVERLAY_ANIMATION_DURATION = AnimationDuration.Fast;\n"]}

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.d.cts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoB,cAAc;AASzC,OAAO,EAAE,uBAAuB,EAAE,uCAAmC;AAErE,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAqChE,CAAC"}

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.d.mts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoB,cAAc;AASzC,OAAO,EAAE,uBAAuB,EAAE,uCAAmC;AAErE,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAqChE,CAAC"}

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.mjs

@@ -0,0 +1,31 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+import { useTailwind } from "@metamask-previews/design-system-twrnc-preset";
+import $React, { useEffect } from "react";
+const React = $importDefault($React);
+import { Animated, Easing, TouchableOpacity, useAnimatedValue } from "react-native/index.js";
+import { DEFAULT_OVERLAY_ANIMATION_DURATION } from "./BottomSheetOverlay.constants.mjs";
+export const BottomSheetOverlay = ({ style, twClassName, onPress, touchableOpacityProps, ...props }) => {
+    const tw = useTailwind();
+    const opacityVal = useAnimatedValue(0);
+    useEffect(() => {
+        Animated.timing(opacityVal, {
+            toValue: 1,
+            duration: DEFAULT_OVERLAY_ANIMATION_DURATION,
+            easing: Easing.linear,
+            useNativeDriver: true,
+        }).start();
+    }, [opacityVal]);
+    return (<Animated.View style={[
+            tw.style('absolute inset-0 bg-overlay-default', twClassName),
+            style,
+            { opacity: opacityVal },
+        ]} {...props}>
+      {onPress && (<TouchableOpacity onPress={onPress} {...touchableOpacityProps} style={tw.style('flex-1')}/>)}
+    </Animated.View>);
+};
+//# sourceMappingURL=BottomSheetOverlay.mjs.map

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,sDAAsD;AAC5E,OAAO,QAAO,EAAE,SAAS,EAAE,cAAc;;AACzC,OAAO,EACL,QAAQ,EACR,MAAM,EACN,gBAAgB,EAChB,gBAAgB,EACjB,8BAAqB;AAEtB,OAAO,EAAE,kCAAkC,EAAE,2CAAuC;AAGpF,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,EACpE,KAAK,EACL,WAAW,EACX,OAAO,EACP,qBAAqB,EACrB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,WAAW,EAAE,CAAC;IACzB,MAAM,UAAU,GAAG,gBAAgB,CAAC,CAAC,CAAC,CAAC;IAEvC,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;YAC1B,OAAO,EAAE,CAAC;YACV,QAAQ,EAAE,kCAAkC;YAC5C,MAAM,EAAE,MAAM,CAAC,MAAM;YACrB,eAAe,EAAE,IAAI;SACtB,CAAC,CAAC,KAAK,EAAE,CAAC;IACb,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACL,CAAC,QAAQ,CAAC,IAAI,CACZ,KAAK,CAAC,CAAC;YACL,EAAE,CAAC,KAAK,CAAC,qCAAqC,EAAE,WAAW,CAAC;YAC5D,KAAK;YACL,EAAE,OAAO,EAAE,UAAU,EAAE;SACxB,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,OAAO,IAAI,CACV,CAAC,gBAAgB,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,IAAI,qBAAqB,CAAC,CAC1B,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,EAC1B,CACH,CACH;IAAA,EAAE,QAAQ,CAAC,IAAI,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useEffect } from 'react';\nimport {\n  Animated,\n  Easing,\n  TouchableOpacity,\n  useAnimatedValue,\n} from 'react-native';\n\nimport { DEFAULT_OVERLAY_ANIMATION_DURATION } from './BottomSheetOverlay.constants';\nimport { BottomSheetOverlayProps } from './BottomSheetOverlay.types';\n\nexport const BottomSheetOverlay: React.FC<BottomSheetOverlayProps> = ({\n  style,\n  twClassName,\n  onPress,\n  touchableOpacityProps,\n  ...props\n}) => {\n  const tw = useTailwind();\n  const opacityVal = useAnimatedValue(0);\n\n  useEffect(() => {\n    Animated.timing(opacityVal, {\n      toValue: 1,\n      duration: DEFAULT_OVERLAY_ANIMATION_DURATION,\n      easing: Easing.linear,\n      useNativeDriver: true,\n    }).start();\n  }, [opacityVal]);\n\n  return (\n    <Animated.View\n      style={[\n        tw.style('absolute inset-0 bg-overlay-default', twClassName),\n        style,\n        { opacity: opacityVal },\n      ]}\n      {...props}\n    >\n      {onPress && (\n        <TouchableOpacity\n          onPress={onPress}\n          {...touchableOpacityProps}\n          style={tw.style('flex-1')}\n        />\n      )}\n    </Animated.View>\n  );\n};\n"]}

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.types.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.types.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { TouchableOpacityProps, ViewProps } from 'react-native';\n\n/**\n * Overlay component props.\n */\nexport type BottomSheetOverlayProps = {\n  /**\n   * Tailwind CSS classes for the overlay container.\n   */\n  twClassName?: string;\n  /**\n   * Callback function triggered when the overlay is pressed.\n   */\n  onPress?: () => void;\n  /**\n   * Props spread to the TouchableOpacity component (e.g., testID for the button).\n   * Note: onPress should be passed as a top-level prop, not through this object.\n   */\n  touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;\n} & ViewProps;\n"]}

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

@@ -0,0 +1,20 @@
+import type { TouchableOpacityProps, ViewProps } from "react-native/index.js";
+/**
+ * Overlay component props.
+ */
+export type BottomSheetOverlayProps = {
+    /**
+     * Tailwind CSS classes for the overlay container.
+     */
+    twClassName?: string;
+    /**
+     * Callback function triggered when the overlay is pressed.
+     */
+    onPress?: () => void;
+    /**
+     * Props spread to the TouchableOpacity component (e.g., testID for the button).
+     * Note: onPress should be passed as a top-level prop, not through this object.
+     */
+    touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;
+} & ViewProps;
+//# sourceMappingURL=BottomSheetOverlay.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.types.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,8BAAqB;AAErE;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,qBAAqB,CAAC,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,GAAG,OAAO,CAAC,CAAC;CAC1E,GAAG,SAAS,CAAC"}

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

@@ -0,0 +1,20 @@
+import type { TouchableOpacityProps, ViewProps } from "react-native/index.js";
+/**
+ * Overlay component props.
+ */
+export type BottomSheetOverlayProps = {
+    /**
+     * Tailwind CSS classes for the overlay container.
+     */
+    twClassName?: string;
+    /**
+     * Callback function triggered when the overlay is pressed.
+     */
+    onPress?: () => void;
+    /**
+     * Props spread to the TouchableOpacity component (e.g., testID for the button).
+     * Note: onPress should be passed as a top-level prop, not through this object.
+     */
+    touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;
+} & ViewProps;
+//# sourceMappingURL=BottomSheetOverlay.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.types.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,8BAAqB;AAErE;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,qBAAqB,CAAC,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,GAAG,OAAO,CAAC,CAAC;CAC1E,GAAG,SAAS,CAAC"}

package/dist/components/BottomSheetOverlay/BottomSheetOverlay.types.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BottomSheetOverlay.types.mjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/BottomSheetOverlay.types.ts"],"names":[],"mappings":"","sourcesContent":["// Third party dependencies.\nimport type { TouchableOpacityProps, ViewProps } from 'react-native';\n\n/**\n * Overlay component props.\n */\nexport type BottomSheetOverlayProps = {\n  /**\n   * Tailwind CSS classes for the overlay container.\n   */\n  twClassName?: string;\n  /**\n   * Callback function triggered when the overlay is pressed.\n   */\n  onPress?: () => void;\n  /**\n   * Props spread to the TouchableOpacity component (e.g., testID for the button).\n   * Note: onPress should be passed as a top-level prop, not through this object.\n   */\n  touchableOpacityProps?: Omit<TouchableOpacityProps, 'onPress' | 'style'>;\n} & ViewProps;\n"]}

package/dist/components/BottomSheetOverlay/index.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/index.ts"],"names":[],"mappings":";;;AAAA,+DAA0D;AAAjD,wHAAA,kBAAkB,OAAA","sourcesContent":["export { BottomSheetOverlay } from './BottomSheetOverlay';\nexport type { BottomSheetOverlayProps } from './BottomSheetOverlay.types';\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,iCAA6B;AAC1D,YAAY,EAAE,uBAAuB,EAAE,uCAAmC"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/BottomSheetOverlay/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,iCAA6B;AAC1D,YAAY,EAAE,uBAAuB,EAAE,uCAAmC"}

package/dist/components/BottomSheetOverlay/index.mjs

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

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

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