@metamask-previews/design-system-react 0.9.0-preview.694a8ed → 0.11.0-preview.23cc337

package/dist/components/BannerAlert/BannerAlert.mjs

@@ -0,0 +1,24 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+import { BannerAlertSeverity } from "@metamask-previews/design-system-shared";
+import $React, { forwardRef } from "react";
+const React = $importDefault($React);
+import { IconSize } from "../../types/index.mjs";
+import { twMerge } from "../../utils/tw-merge.mjs";
+import { BannerBase } from "../BannerBase/index.mjs";
+import { Icon } from "../Icon/index.mjs";
+import { MAP_BANNER_ALERT_SEVERITY_BACKGROUND_COLOR, MAP_BANNER_ALERT_SEVERITY_BORDER_COLOR, MAP_BANNER_ALERT_SEVERITY_ICON_COLOR, MAP_BANNER_ALERT_SEVERITY_ICON_NAME } from "./BannerAlert.constants.mjs";
+export const BannerAlert = forwardRef(({ severity = BannerAlertSeverity.Info, iconProps, className, ...props }, ref) => {
+    const iconName = MAP_BANNER_ALERT_SEVERITY_ICON_NAME[severity];
+    const iconColor = MAP_BANNER_ALERT_SEVERITY_ICON_COLOR[severity];
+    const backgroundColor = MAP_BANNER_ALERT_SEVERITY_BACKGROUND_COLOR[severity];
+    const borderColorClass = MAP_BANNER_ALERT_SEVERITY_BORDER_COLOR[severity];
+    const mergedClassName = twMerge('border-l-4', borderColorClass, className);
+    return (React.createElement(BannerBase, { ref: ref, startAccessory: React.createElement(Icon, { name: iconName, color: iconColor, size: IconSize.Lg, ...iconProps }), backgroundColor: backgroundColor, paddingLeft: 2, className: mergedClassName, ...props }));
+});
+BannerAlert.displayName = 'BannerAlert';
+//# sourceMappingURL=BannerAlert.mjs.map

package/dist/components/BannerAlert/BannerAlert.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerAlert.mjs","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,mBAAmB,EAAE,gDAAgD;AAC9E,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,QAAQ,EAAE,8BAAoB;AACvC,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAC3C,OAAO,EAAE,IAAI,EAAE,0BAAgB;AAE/B,OAAO,EACL,0CAA0C,EAC1C,sCAAsC,EACtC,oCAAoC,EACpC,mCAAmC,EACpC,oCAAgC;AAGjC,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CACnC,CACE,EAAE,QAAQ,GAAG,mBAAmB,CAAC,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EACvE,GAAG,EACH,EAAE;IACF,MAAM,QAAQ,GAAG,mCAAmC,CAAC,QAAQ,CAAC,CAAC;IAC/D,MAAM,SAAS,GAAG,oCAAoC,CAAC,QAAQ,CAAC,CAAC;IACjE,MAAM,eAAe,GACnB,0CAA0C,CAAC,QAAQ,CAAC,CAAC;IACvD,MAAM,gBAAgB,GAAG,sCAAsC,CAAC,QAAQ,CAAC,CAAC;IAC1E,MAAM,eAAe,GAAG,OAAO,CAAC,YAAY,EAAE,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAE3E,OAAO,CACL,oBAAC,UAAU,IACT,GAAG,EAAE,GAAG,EACR,cAAc,EACZ,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,SAAS,EAChB,IAAI,EAAE,QAAQ,CAAC,EAAE,KACb,SAAS,GACb,EAEJ,eAAe,EAAE,eAAe,EAChC,WAAW,EAAE,CAAC,EACd,SAAS,EAAE,eAAe,KACtB,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,WAAW,CAAC,WAAW,GAAG,aAAa,CAAC","sourcesContent":["import { BannerAlertSeverity } from '@metamask-previews/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { IconSize } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { BannerBase } from '../BannerBase';\nimport { Icon } from '../Icon';\n\nimport {\n  MAP_BANNER_ALERT_SEVERITY_BACKGROUND_COLOR,\n  MAP_BANNER_ALERT_SEVERITY_BORDER_COLOR,\n  MAP_BANNER_ALERT_SEVERITY_ICON_COLOR,\n  MAP_BANNER_ALERT_SEVERITY_ICON_NAME,\n} from './BannerAlert.constants';\nimport type { BannerAlertProps } from './BannerAlert.types';\n\nexport const BannerAlert = forwardRef<HTMLDivElement, BannerAlertProps>(\n  (\n    { severity = BannerAlertSeverity.Info, iconProps, className, ...props },\n    ref,\n  ) => {\n    const iconName = MAP_BANNER_ALERT_SEVERITY_ICON_NAME[severity];\n    const iconColor = MAP_BANNER_ALERT_SEVERITY_ICON_COLOR[severity];\n    const backgroundColor =\n      MAP_BANNER_ALERT_SEVERITY_BACKGROUND_COLOR[severity];\n    const borderColorClass = MAP_BANNER_ALERT_SEVERITY_BORDER_COLOR[severity];\n    const mergedClassName = twMerge('border-l-4', borderColorClass, className);\n\n    return (\n      <BannerBase\n        ref={ref}\n        startAccessory={\n          <Icon\n            name={iconName}\n            color={iconColor}\n            size={IconSize.Lg}\n            {...iconProps}\n          />\n        }\n        backgroundColor={backgroundColor}\n        paddingLeft={2}\n        className={mergedClassName}\n        {...props}\n      />\n    );\n  },\n);\n\nBannerAlert.displayName = 'BannerAlert';\n"]}

package/dist/components/BannerAlert/BannerAlert.types.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerAlert.types.cjs","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BannerAlertPropsShared } from '@metamask-previews/design-system-shared';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon/Icon.types';\n\n/**\n * BannerAlert component props (React platform-specific).\n */\nexport type BannerAlertProps = BannerAlertPropsShared &\n  BannerBaseProps & {\n    iconProps?: Omit<IconProps, 'name' | 'size' | 'color'>;\n  };\n"]}

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

@@ -0,0 +1,10 @@
+import type { BannerAlertPropsShared } from "@metamask-previews/design-system-shared";
+import type { BannerBaseProps } from "../BannerBase/index.cjs";
+import type { IconProps } from "../Icon/Icon.types.cjs";
+/**
+ * BannerAlert component props (React platform-specific).
+ */
+export type BannerAlertProps = BannerAlertPropsShared & BannerBaseProps & {
+    iconProps?: Omit<IconProps, 'name' | 'size' | 'color'>;
+};
+//# sourceMappingURL=BannerAlert.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerAlert.types.d.cts","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,gDAAgD;AAEtF,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GACnD,eAAe,GAAG;IAChB,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;CACxD,CAAC"}

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

@@ -0,0 +1,10 @@
+import type { BannerAlertPropsShared } from "@metamask-previews/design-system-shared";
+import type { BannerBaseProps } from "../BannerBase/index.mjs";
+import type { IconProps } from "../Icon/Icon.types.mjs";
+/**
+ * BannerAlert component props (React platform-specific).
+ */
+export type BannerAlertProps = BannerAlertPropsShared & BannerBaseProps & {
+    iconProps?: Omit<IconProps, 'name' | 'size' | 'color'>;
+};
+//# sourceMappingURL=BannerAlert.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerAlert.types.d.mts","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,gDAAgD;AAEtF,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GACnD,eAAe,GAAG;IAChB,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;CACxD,CAAC"}

package/dist/components/BannerAlert/BannerAlert.types.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"BannerAlert.types.mjs","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BannerAlertPropsShared } from '@metamask-previews/design-system-shared';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon/Icon.types';\n\n/**\n * BannerAlert component props (React platform-specific).\n */\nexport type BannerAlertProps = BannerAlertPropsShared &\n  BannerBaseProps & {\n    iconProps?: Omit<IconProps, 'name' | 'size' | 'color'>;\n  };\n"]}

package/dist/components/BannerAlert/index.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/BannerAlert/index.ts"],"names":[],"mappings":";;;AAAA,gFAA8E;AAArE,2HAAA,mBAAmB,OAAA;AAC5B,iDAA4C;AAAnC,0GAAA,WAAW,OAAA","sourcesContent":["export { BannerAlertSeverity } from '@metamask-previews/design-system-shared';\nexport { BannerAlert } from './BannerAlert';\nexport type { BannerAlertProps } from './BannerAlert.types';\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/BannerAlert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,gDAAgD;AAC9E,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/BannerAlert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,gDAAgD;AAC9E,OAAO,EAAE,WAAW,EAAE,0BAAsB;AAC5C,YAAY,EAAE,gBAAgB,EAAE,gCAA4B"}

package/dist/components/BannerAlert/index.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/BannerAlert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,gDAAgD;AAC9E,OAAO,EAAE,WAAW,EAAE,0BAAsB","sourcesContent":["export { BannerAlertSeverity } from '@metamask-previews/design-system-shared';\nexport { BannerAlert } from './BannerAlert';\nexport type { BannerAlertProps } from './BannerAlert.types';\n"]}

package/dist/components/BannerBase/BannerBase.cjs

@@ -48,7 +48,7 @@ exports.BannerBase = (0, react_1.forwardRef)(({ title, titleProps, description,
                 (isTextContent(children) ? (react_1.default.createElement(Text_1.Text, { variant: types_1.TextVariant.BodyMd, ...childrenWrapperProps }, children)) : (children)),
             shouldShowActionButton && (react_1.default.createElement(Box_1.Box, { className: "mt-4" },
                 react_1.default.createElement(Button_1.Button, { size: types_1.ButtonSize.Md, onClick: actionButtonOnClick, ...resolvedActionButtonProps }, actionButtonLabel)))),
-        shouldShowCloseButton && (react_1.default.createElement(ButtonIcon_1.ButtonIcon, { "data-testid": "banner-base-close-button", className: (0, tw_merge_1.twMerge)('ml-3 self-start', closeButtonClassName), iconName: types_1.IconName.Close, size: types_1.ButtonIconSize.Sm, ariaLabel: closeButtonAriaLabel, onClick: onClose ?? closeButtonPropsOnClick, ...resolvedCloseButtonProps }))));
+        shouldShowCloseButton && (react_1.default.createElement(ButtonIcon_1.ButtonIcon, { className: (0, tw_merge_1.twMerge)('ml-3 self-start', closeButtonClassName), iconName: types_1.IconName.Close, size: types_1.ButtonIconSize.Sm, ariaLabel: closeButtonAriaLabel, onClick: onClose ?? closeButtonPropsOnClick, ...resolvedCloseButtonProps }))));
 });
 exports.BannerBase.displayName = 'BannerBase';
 //# sourceMappingURL=BannerBase.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"BannerBase.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,iDASqB;AACrB,uDAA+C;AAC/C,0CAA6B;AAC7B,gDAAmC;AACnC,wDAA2C;AAC3C,4CAA+B;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;AAE/B,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CACE,EACE,KAAK,EACL,UAAU,EACV,WAAW,EACX,gBAAgB,EAChB,QAAQ,EACR,oBAAoB,EACpB,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,EACd,OAAO,EACP,gBAAgB,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,yBAAyB,GAAG,iBAAiB,IAAI,EAAE,CAAC;IAE1D,MAAM,EACJ,SAAS,EAAE,oBAAoB,GAAG,cAAc,EAChD,OAAO,EAAE,uBAAuB,EAChC,SAAS,EAAE,oBAAoB,EAC/B,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,OAAO,CACL,8BAAC,SAAG,IACF,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,wBAAgB,CAAC,GAAG,EACnC,UAAU,EAAE,qBAAa,CAAC,KAAK,EAC/B,GAAG,EAAE,CAAC,EACN,eAAe,EAAE,0BAAkB,CAAC,iBAAiB,EACrD,OAAO,EAAE,CAAC,EACV,SAAS,EAAE,IAAA,kBAAO,EAAC,YAAY,EAAE,SAAS,CAAC,KACvC,KAAK;QAER,cAAc;QAEf,8BAAC,SAAG,IAAC,SAAS,EAAC,gBAAgB;YAC5B,UAAU,CAAC,KAAK,CAAC;gBAChB,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CACtB,8BAAC,WAAI,IACH,OAAO,EAAE,mBAAW,CAAC,MAAM,EAC3B,UAAU,EAAE,kBAAU,CAAC,MAAM,KACzB,UAAU,IAEb,KAAK,CACD,CACR,CAAC,CAAC,CAAC,CACF,KAAK,CACN,CAAC;YAEH,UAAU,CAAC,WAAW,CAAC,IAAI,CAC1B,8BAAC,SAAG,IAAC,SAAS,EAAE,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,IACnD,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAC5B,8BAAC,WAAI,IAAC,OAAO,EAAE,mBAAW,CAAC,MAAM,KAAM,gBAAgB,IACpD,WAAW,CACP,CACR,CAAC,CAAC,CAAC,CACF,WAAW,CACZ,CACG,CACP;YAEA,UAAU,CAAC,QAAQ,CAAC;gBACnB,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CACzB,8BAAC,WAAI,IAAC,OAAO,EAAE,mBAAW,CAAC,MAAM,KAAM,oBAAoB,IACxD,QAAQ,CACJ,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CAAC;YAEH,sBAAsB,IAAI,CACzB,8BAAC,SAAG,IAAC,SAAS,EAAC,MAAM;gBACnB,8BAAC,eAAM,IACL,IAAI,EAAE,kBAAU,CAAC,EAAE,EACnB,OAAO,EAAE,mBAAmB,KACxB,yBAAyB,IAE5B,iBAAiB,CACX,CACL,CACP,CACG;QAEL,qBAAqB,IAAI,CACxB,8BAAC,uBAAU,mBACG,0BAA0B,EACtC,SAAS,EAAE,IAAA,kBAAO,EAAC,iBAAiB,EAAE,oBAAoB,CAAC,EAC3D,QAAQ,EAAE,gBAAQ,CAAC,KAAK,EACxB,IAAI,EAAE,sBAAc,CAAC,EAAE,EACvB,SAAS,EAAE,oBAAoB,EAC/B,OAAO,EAAE,OAAO,IAAI,uBAAuB,KACvC,wBAAwB,GAC5B,CACH,CACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport {\n  BoxAlignItems,\n  BoxBackgroundColor,\n  ButtonIconSize,\n  ButtonSize,\n  FontWeight,\n  BoxFlexDirection,\n  IconName,\n  TextVariant,\n} from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\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 = forwardRef<HTMLDivElement, BannerBaseProps>(\n  (\n    {\n      title,\n      titleProps,\n      description,\n      descriptionProps,\n      children,\n      childrenWrapperProps,\n      actionButtonLabel,\n      actionButtonOnClick,\n      actionButtonProps,\n      startAccessory,\n      onClose,\n      closeButtonProps,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedActionButtonProps = actionButtonProps ?? {};\n\n    const {\n      ariaLabel: closeButtonAriaLabel = 'Close banner',\n      onClick: closeButtonPropsOnClick,\n      className: closeButtonClassName,\n      ...resolvedCloseButtonProps\n    } = closeButtonProps ?? {};\n\n    const shouldShowCloseButton = Boolean(onClose || closeButtonProps);\n    const shouldShowActionButton = Boolean(actionButtonOnClick);\n\n    return (\n      <Box\n        ref={ref}\n        flexDirection={BoxFlexDirection.Row}\n        alignItems={BoxAlignItems.Start}\n        gap={2}\n        backgroundColor={BoxBackgroundColor.BackgroundDefault}\n        padding={3}\n        className={twMerge('rounded-sm', className)}\n        {...props}\n      >\n        {startAccessory}\n\n        <Box className=\"min-w-0 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 className={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 className=\"mt-4\">\n              <Button\n                size={ButtonSize.Md}\n                onClick={actionButtonOnClick}\n                {...resolvedActionButtonProps}\n              >\n                {actionButtonLabel}\n              </Button>\n            </Box>\n          )}\n        </Box>\n\n        {shouldShowCloseButton && (\n          <ButtonIcon\n            data-testid=\"banner-base-close-button\"\n            className={twMerge('ml-3 self-start', closeButtonClassName)}\n            iconName={IconName.Close}\n            size={ButtonIconSize.Sm}\n            ariaLabel={closeButtonAriaLabel}\n            onClick={onClose ?? closeButtonPropsOnClick}\n            {...resolvedCloseButtonProps}\n          />\n        )}\n      </Box>\n    );\n  },\n);\n\nBannerBase.displayName = 'BannerBase';\n"]}
+{"version":3,"file":"BannerBase.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport {\n  BoxAlignItems,\n  BoxBackgroundColor,\n  ButtonIconSize,\n  ButtonSize,\n  FontWeight,\n  BoxFlexDirection,\n  IconName,\n  TextVariant,\n} from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\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 = forwardRef<HTMLDivElement, BannerBaseProps>(\n  (\n    {\n      title,\n      titleProps,\n      description,\n      descriptionProps,\n      children,\n      childrenWrapperProps,\n      actionButtonLabel,\n      actionButtonOnClick,\n      actionButtonProps,\n      startAccessory,\n      onClose,\n      closeButtonProps,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedActionButtonProps = actionButtonProps ?? {};\n\n    const {\n      ariaLabel: closeButtonAriaLabel = 'Close banner',\n      onClick: closeButtonPropsOnClick,\n      className: closeButtonClassName,\n      ...resolvedCloseButtonProps\n    } = closeButtonProps ?? {};\n\n    const shouldShowCloseButton = Boolean(onClose || closeButtonProps);\n    const shouldShowActionButton = Boolean(actionButtonOnClick);\n\n    return (\n      <Box\n        ref={ref}\n        flexDirection={BoxFlexDirection.Row}\n        alignItems={BoxAlignItems.Start}\n        gap={2}\n        backgroundColor={BoxBackgroundColor.BackgroundDefault}\n        padding={3}\n        className={twMerge('rounded-sm', className)}\n        {...props}\n      >\n        {startAccessory}\n\n        <Box className=\"min-w-0 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 className={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 className=\"mt-4\">\n              <Button\n                size={ButtonSize.Md}\n                onClick={actionButtonOnClick}\n                {...resolvedActionButtonProps}\n              >\n                {actionButtonLabel}\n              </Button>\n            </Box>\n          )}\n        </Box>\n\n        {shouldShowCloseButton && (\n          <ButtonIcon\n            className={twMerge('ml-3 self-start', closeButtonClassName)}\n            iconName={IconName.Close}\n            size={ButtonIconSize.Sm}\n            ariaLabel={closeButtonAriaLabel}\n            onClick={onClose ?? closeButtonPropsOnClick}\n            {...resolvedCloseButtonProps}\n          />\n        )}\n      </Box>\n    );\n  },\n);\n\nBannerBase.displayName = 'BannerBase';\n"]}

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

@@ -6,6 +6,7 @@ export declare const BannerBase: React.ForwardRefExoticComponent<(Omit<import("@
     childrenWrapperProps?: Partial<import("../Text/index.cjs").TextProps> | undefined;
     onClose?: React.MouseEventHandler<HTMLButtonElement> | undefined;
     closeButtonProps?: (Omit<Partial<import("../ButtonIcon/index.cjs").ButtonIconProps>, "onClick" | "iconName"> & {
+        'data-testid'?: string | undefined;
         onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined;
     }) | undefined;
 } & {
@@ -311,6 +312,7 @@ export declare const BannerBase: React.ForwardRefExoticComponent<(Omit<import("@
     childrenWrapperProps?: Partial<import("../Text/index.cjs").TextProps> | undefined;
     onClose?: React.MouseEventHandler<HTMLButtonElement> | undefined;
     closeButtonProps?: (Omit<Partial<import("../ButtonIcon/index.cjs").ButtonIconProps>, "onClick" | "iconName"> & {
+        'data-testid'?: string | undefined;
         onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined;
     }) | undefined;
 } & {

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

@@ -1 +1 @@
-{"version":3,"file":"BannerBase.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAE1C,OAAO,EAIL,UAAU,EAGV,QAAQ,EAET,8BAAoB;AAerB,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iDA2GtB,CAAC"}
+{"version":3,"file":"BannerBase.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAE1C,OAAO,EAIL,UAAU,EAGV,QAAQ,EAET,8BAAoB;AAerB,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iDA0GtB,CAAC"}

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

@@ -6,6 +6,7 @@ export declare const BannerBase: React.ForwardRefExoticComponent<(Omit<import("@
     childrenWrapperProps?: Partial<import("../Text/index.mjs").TextProps> | undefined;
     onClose?: React.MouseEventHandler<HTMLButtonElement> | undefined;
     closeButtonProps?: (Omit<Partial<import("../ButtonIcon/index.mjs").ButtonIconProps>, "onClick" | "iconName"> & {
+        'data-testid'?: string | undefined;
         onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined;
     }) | undefined;
 } & {
@@ -311,6 +312,7 @@ export declare const BannerBase: React.ForwardRefExoticComponent<(Omit<import("@
     childrenWrapperProps?: Partial<import("../Text/index.mjs").TextProps> | undefined;
     onClose?: React.MouseEventHandler<HTMLButtonElement> | undefined;
     closeButtonProps?: (Omit<Partial<import("../ButtonIcon/index.mjs").ButtonIconProps>, "onClick" | "iconName"> & {
+        'data-testid'?: string | undefined;
         onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined;
     }) | undefined;
 } & {

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

@@ -1 +1 @@
-{"version":3,"file":"BannerBase.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAE1C,OAAO,EAIL,UAAU,EAGV,QAAQ,EAET,8BAAoB;AAerB,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iDA2GtB,CAAC"}
+{"version":3,"file":"BannerBase.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAE1C,OAAO,EAIL,UAAU,EAGV,QAAQ,EAET,8BAAoB;AAerB,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iDA0GtB,CAAC"}

package/dist/components/BannerBase/BannerBase.mjs

@@ -29,7 +29,7 @@ export const BannerBase = forwardRef(({ title, titleProps, description, descript
                 (isTextContent(children) ? (React.createElement(Text, { variant: TextVariant.BodyMd, ...childrenWrapperProps }, children)) : (children)),
             shouldShowActionButton && (React.createElement(Box, { className: "mt-4" },
                 React.createElement(Button, { size: ButtonSize.Md, onClick: actionButtonOnClick, ...resolvedActionButtonProps }, actionButtonLabel)))),
-        shouldShowCloseButton && (React.createElement(ButtonIcon, { "data-testid": "banner-base-close-button", className: twMerge('ml-3 self-start', closeButtonClassName), iconName: IconName.Close, size: ButtonIconSize.Sm, ariaLabel: closeButtonAriaLabel, onClick: onClose ?? closeButtonPropsOnClick, ...resolvedCloseButtonProps }))));
+        shouldShowCloseButton && (React.createElement(ButtonIcon, { className: twMerge('ml-3 self-start', closeButtonClassName), iconName: IconName.Close, size: ButtonIconSize.Sm, ariaLabel: closeButtonAriaLabel, onClick: onClose ?? closeButtonPropsOnClick, ...resolvedCloseButtonProps }))));
 });
 BannerBase.displayName = 'BannerBase';
 //# sourceMappingURL=BannerBase.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"BannerBase.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EACL,aAAa,EACb,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,QAAQ,EACR,WAAW,EACZ,8BAAoB;AACrB,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,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,GAAG,UAAU,CAClC,CACE,EACE,KAAK,EACL,UAAU,EACV,WAAW,EACX,gBAAgB,EAChB,QAAQ,EACR,oBAAoB,EACpB,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,cAAc,EACd,OAAO,EACP,gBAAgB,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,yBAAyB,GAAG,iBAAiB,IAAI,EAAE,CAAC;IAE1D,MAAM,EACJ,SAAS,EAAE,oBAAoB,GAAG,cAAc,EAChD,OAAO,EAAE,uBAAuB,EAChC,SAAS,EAAE,oBAAoB,EAC/B,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,OAAO,CACL,oBAAC,GAAG,IACF,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,gBAAgB,CAAC,GAAG,EACnC,UAAU,EAAE,aAAa,CAAC,KAAK,EAC/B,GAAG,EAAE,CAAC,EACN,eAAe,EAAE,kBAAkB,CAAC,iBAAiB,EACrD,OAAO,EAAE,CAAC,EACV,SAAS,EAAE,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC,KACvC,KAAK;QAER,cAAc;QAEf,oBAAC,GAAG,IAAC,SAAS,EAAC,gBAAgB;YAC5B,UAAU,CAAC,KAAK,CAAC;gBAChB,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CACtB,oBAAC,IAAI,IACH,OAAO,EAAE,WAAW,CAAC,MAAM,EAC3B,UAAU,EAAE,UAAU,CAAC,MAAM,KACzB,UAAU,IAEb,KAAK,CACD,CACR,CAAC,CAAC,CAAC,CACF,KAAK,CACN,CAAC;YAEH,UAAU,CAAC,WAAW,CAAC,IAAI,CAC1B,oBAAC,GAAG,IAAC,SAAS,EAAE,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,IACnD,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAC5B,oBAAC,IAAI,IAAC,OAAO,EAAE,WAAW,CAAC,MAAM,KAAM,gBAAgB,IACpD,WAAW,CACP,CACR,CAAC,CAAC,CAAC,CACF,WAAW,CACZ,CACG,CACP;YAEA,UAAU,CAAC,QAAQ,CAAC;gBACnB,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CACzB,oBAAC,IAAI,IAAC,OAAO,EAAE,WAAW,CAAC,MAAM,KAAM,oBAAoB,IACxD,QAAQ,CACJ,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CAAC;YAEH,sBAAsB,IAAI,CACzB,oBAAC,GAAG,IAAC,SAAS,EAAC,MAAM;gBACnB,oBAAC,MAAM,IACL,IAAI,EAAE,UAAU,CAAC,EAAE,EACnB,OAAO,EAAE,mBAAmB,KACxB,yBAAyB,IAE5B,iBAAiB,CACX,CACL,CACP,CACG;QAEL,qBAAqB,IAAI,CACxB,oBAAC,UAAU,mBACG,0BAA0B,EACtC,SAAS,EAAE,OAAO,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,EAC3D,QAAQ,EAAE,QAAQ,CAAC,KAAK,EACxB,IAAI,EAAE,cAAc,CAAC,EAAE,EACvB,SAAS,EAAE,oBAAoB,EAC/B,OAAO,EAAE,OAAO,IAAI,uBAAuB,KACvC,wBAAwB,GAC5B,CACH,CACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport {\n  BoxAlignItems,\n  BoxBackgroundColor,\n  ButtonIconSize,\n  ButtonSize,\n  FontWeight,\n  BoxFlexDirection,\n  IconName,\n  TextVariant,\n} from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\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 = forwardRef<HTMLDivElement, BannerBaseProps>(\n  (\n    {\n      title,\n      titleProps,\n      description,\n      descriptionProps,\n      children,\n      childrenWrapperProps,\n      actionButtonLabel,\n      actionButtonOnClick,\n      actionButtonProps,\n      startAccessory,\n      onClose,\n      closeButtonProps,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedActionButtonProps = actionButtonProps ?? {};\n\n    const {\n      ariaLabel: closeButtonAriaLabel = 'Close banner',\n      onClick: closeButtonPropsOnClick,\n      className: closeButtonClassName,\n      ...resolvedCloseButtonProps\n    } = closeButtonProps ?? {};\n\n    const shouldShowCloseButton = Boolean(onClose || closeButtonProps);\n    const shouldShowActionButton = Boolean(actionButtonOnClick);\n\n    return (\n      <Box\n        ref={ref}\n        flexDirection={BoxFlexDirection.Row}\n        alignItems={BoxAlignItems.Start}\n        gap={2}\n        backgroundColor={BoxBackgroundColor.BackgroundDefault}\n        padding={3}\n        className={twMerge('rounded-sm', className)}\n        {...props}\n      >\n        {startAccessory}\n\n        <Box className=\"min-w-0 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 className={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 className=\"mt-4\">\n              <Button\n                size={ButtonSize.Md}\n                onClick={actionButtonOnClick}\n                {...resolvedActionButtonProps}\n              >\n                {actionButtonLabel}\n              </Button>\n            </Box>\n          )}\n        </Box>\n\n        {shouldShowCloseButton && (\n          <ButtonIcon\n            data-testid=\"banner-base-close-button\"\n            className={twMerge('ml-3 self-start', closeButtonClassName)}\n            iconName={IconName.Close}\n            size={ButtonIconSize.Sm}\n            ariaLabel={closeButtonAriaLabel}\n            onClick={onClose ?? closeButtonPropsOnClick}\n            {...resolvedCloseButtonProps}\n          />\n        )}\n      </Box>\n    );\n  },\n);\n\nBannerBase.displayName = 'BannerBase';\n"]}
+{"version":3,"file":"BannerBase.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport {\n  BoxAlignItems,\n  BoxBackgroundColor,\n  ButtonIconSize,\n  ButtonSize,\n  FontWeight,\n  BoxFlexDirection,\n  IconName,\n  TextVariant,\n} from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\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 = forwardRef<HTMLDivElement, BannerBaseProps>(\n  (\n    {\n      title,\n      titleProps,\n      description,\n      descriptionProps,\n      children,\n      childrenWrapperProps,\n      actionButtonLabel,\n      actionButtonOnClick,\n      actionButtonProps,\n      startAccessory,\n      onClose,\n      closeButtonProps,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const resolvedActionButtonProps = actionButtonProps ?? {};\n\n    const {\n      ariaLabel: closeButtonAriaLabel = 'Close banner',\n      onClick: closeButtonPropsOnClick,\n      className: closeButtonClassName,\n      ...resolvedCloseButtonProps\n    } = closeButtonProps ?? {};\n\n    const shouldShowCloseButton = Boolean(onClose || closeButtonProps);\n    const shouldShowActionButton = Boolean(actionButtonOnClick);\n\n    return (\n      <Box\n        ref={ref}\n        flexDirection={BoxFlexDirection.Row}\n        alignItems={BoxAlignItems.Start}\n        gap={2}\n        backgroundColor={BoxBackgroundColor.BackgroundDefault}\n        padding={3}\n        className={twMerge('rounded-sm', className)}\n        {...props}\n      >\n        {startAccessory}\n\n        <Box className=\"min-w-0 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 className={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 className=\"mt-4\">\n              <Button\n                size={ButtonSize.Md}\n                onClick={actionButtonOnClick}\n                {...resolvedActionButtonProps}\n              >\n                {actionButtonLabel}\n              </Button>\n            </Box>\n          )}\n        </Box>\n\n        {shouldShowCloseButton && (\n          <ButtonIcon\n            className={twMerge('ml-3 self-start', closeButtonClassName)}\n            iconName={IconName.Close}\n            size={ButtonIconSize.Sm}\n            ariaLabel={closeButtonAriaLabel}\n            onClick={onClose ?? closeButtonPropsOnClick}\n            {...resolvedCloseButtonProps}\n          />\n        )}\n      </Box>\n    );\n  },\n);\n\nBannerBase.displayName = 'BannerBase';\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"BannerBase.types.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BannerBasePropsShared } from '@metamask-previews/design-system-shared';\nimport type { MouseEventHandler } from 'react';\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' | 'onClick' | 'variant'\n>;\n\ntype BannerBaseCloseButtonProps = Omit<\n  Partial<ButtonIconProps>,\n  'iconName' | 'onClick'\n> & {\n  /**\n   * Optional click handler for the close button.\n   */\n  onClick?: MouseEventHandler<HTMLButtonElement>;\n};\n\ntype BannerBasePropsBase = BannerBasePropsShared &\n  Omit<BoxProps, 'children'> & {\n    /**\n     * Optional props for the title `Text` when the title is a string.\n     */\n    titleProps?: Partial<TextProps>;\n    /**\n     * Optional props for the description `Text` when description is a string.\n     */\n    descriptionProps?: Partial<TextProps>;\n    /**\n     * Optional props for the children wrapper `Text` when children is a string.\n     */\n    childrenWrapperProps?: Partial<TextProps>;\n    /**\n     * Optional click handler for the close button.\n     * If provided, a close button is shown.\n     */\n    onClose?: MouseEventHandler<HTMLButtonElement>;\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  actionButtonOnClick: MouseEventHandler<HTMLButtonElement>;\n  actionButtonLabel: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\ntype BannerBaseActionPropsWithoutHandler = {\n  actionButtonOnClick?: undefined;\n  actionButtonLabel?: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\nexport type BannerBaseProps = BannerBasePropsBase &\n  (BannerBaseActionPropsWithHandler | BannerBaseActionPropsWithoutHandler);\n"]}
+{"version":3,"file":"BannerBase.types.cjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BannerBasePropsShared } from '@metamask-previews/design-system-shared';\nimport type { MouseEventHandler } from 'react';\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' | 'onClick' | 'variant'\n>;\n\ntype BannerBaseCloseButtonProps = Omit<\n  Partial<ButtonIconProps>,\n  'iconName' | 'onClick'\n> & {\n  /**\n   * Optional test id for the close button element.\n   */\n  'data-testid'?: string;\n  /**\n   * Optional click handler for the close button.\n   */\n  onClick?: MouseEventHandler<HTMLButtonElement>;\n};\n\ntype BannerBasePropsBase = BannerBasePropsShared &\n  Omit<BoxProps, 'children'> & {\n    /**\n     * Optional props for the title `Text` when the title is a string.\n     */\n    titleProps?: Partial<TextProps>;\n    /**\n     * Optional props for the description `Text` when description is a string.\n     */\n    descriptionProps?: Partial<TextProps>;\n    /**\n     * Optional props for the children wrapper `Text` when children is a string.\n     */\n    childrenWrapperProps?: Partial<TextProps>;\n    /**\n     * Optional click handler for the close button.\n     * If provided, a close button is shown.\n     */\n    onClose?: MouseEventHandler<HTMLButtonElement>;\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  actionButtonOnClick: MouseEventHandler<HTMLButtonElement>;\n  actionButtonLabel: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\ntype BannerBaseActionPropsWithoutHandler = {\n  actionButtonOnClick?: undefined;\n  actionButtonLabel?: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\nexport type BannerBaseProps = BannerBasePropsBase &\n  (BannerBaseActionPropsWithHandler | BannerBaseActionPropsWithoutHandler);\n"]}

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

@@ -6,6 +6,10 @@ import type { ButtonIconProps } from "../ButtonIcon/index.cjs";
 import type { TextProps } from "../Text/index.cjs";
 type BannerBaseActionButtonProps = Omit<Partial<ButtonProps>, 'children' | 'onClick' | 'variant'>;
 type BannerBaseCloseButtonProps = Omit<Partial<ButtonIconProps>, 'iconName' | 'onClick'> & {
+    /**
+     * Optional test id for the close button element.
+     */
+    'data-testid'?: string;
     /**
      * Optional click handler for the close button.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"BannerBase.types.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,gDAAgD;AACrF,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc;AAE/C,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,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CAChD,CAAC;AAEF,KAAK,mBAAmB,GAAG,qBAAqB,GAC9C,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAChC;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACtC;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC1C;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,0BAA0B,CAAC;CAC/C,CAAC;AAEJ,KAAK,gCAAgC,GAAG;IACtC,mBAAmB,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC1D,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,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAC/C,CAAC,gCAAgC,GAAG,mCAAmC,CAAC,CAAC"}
+{"version":3,"file":"BannerBase.types.d.cts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,gDAAgD;AACrF,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc;AAE/C,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,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CAChD,CAAC;AAEF,KAAK,mBAAmB,GAAG,qBAAqB,GAC9C,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAChC;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACtC;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC1C;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,0BAA0B,CAAC;CAC/C,CAAC;AAEJ,KAAK,gCAAgC,GAAG;IACtC,mBAAmB,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC1D,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,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAC/C,CAAC,gCAAgC,GAAG,mCAAmC,CAAC,CAAC"}

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

@@ -6,6 +6,10 @@ import type { ButtonIconProps } from "../ButtonIcon/index.mjs";
 import type { TextProps } from "../Text/index.mjs";
 type BannerBaseActionButtonProps = Omit<Partial<ButtonProps>, 'children' | 'onClick' | 'variant'>;
 type BannerBaseCloseButtonProps = Omit<Partial<ButtonIconProps>, 'iconName' | 'onClick'> & {
+    /**
+     * Optional test id for the close button element.
+     */
+    'data-testid'?: string;
     /**
      * Optional click handler for the close button.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"BannerBase.types.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,gDAAgD;AACrF,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc;AAE/C,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,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CAChD,CAAC;AAEF,KAAK,mBAAmB,GAAG,qBAAqB,GAC9C,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAChC;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACtC;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC1C;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,0BAA0B,CAAC;CAC/C,CAAC;AAEJ,KAAK,gCAAgC,GAAG;IACtC,mBAAmB,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC1D,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,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAC/C,CAAC,gCAAgC,GAAG,mCAAmC,CAAC,CAAC"}
+{"version":3,"file":"BannerBase.types.d.mts","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,gDAAgD;AACrF,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc;AAE/C,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,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CAChD,CAAC;AAEF,KAAK,mBAAmB,GAAG,qBAAqB,GAC9C,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAChC;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACtC;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC1C;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,0BAA0B,CAAC;CAC/C,CAAC;AAEJ,KAAK,gCAAgC,GAAG;IACtC,mBAAmB,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC1D,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,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAC/C,CAAC,gCAAgC,GAAG,mCAAmC,CAAC,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"BannerBase.types.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BannerBasePropsShared } from '@metamask-previews/design-system-shared';\nimport type { MouseEventHandler } from 'react';\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' | 'onClick' | 'variant'\n>;\n\ntype BannerBaseCloseButtonProps = Omit<\n  Partial<ButtonIconProps>,\n  'iconName' | 'onClick'\n> & {\n  /**\n   * Optional click handler for the close button.\n   */\n  onClick?: MouseEventHandler<HTMLButtonElement>;\n};\n\ntype BannerBasePropsBase = BannerBasePropsShared &\n  Omit<BoxProps, 'children'> & {\n    /**\n     * Optional props for the title `Text` when the title is a string.\n     */\n    titleProps?: Partial<TextProps>;\n    /**\n     * Optional props for the description `Text` when description is a string.\n     */\n    descriptionProps?: Partial<TextProps>;\n    /**\n     * Optional props for the children wrapper `Text` when children is a string.\n     */\n    childrenWrapperProps?: Partial<TextProps>;\n    /**\n     * Optional click handler for the close button.\n     * If provided, a close button is shown.\n     */\n    onClose?: MouseEventHandler<HTMLButtonElement>;\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  actionButtonOnClick: MouseEventHandler<HTMLButtonElement>;\n  actionButtonLabel: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\ntype BannerBaseActionPropsWithoutHandler = {\n  actionButtonOnClick?: undefined;\n  actionButtonLabel?: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\nexport type BannerBaseProps = BannerBasePropsBase &\n  (BannerBaseActionPropsWithHandler | BannerBaseActionPropsWithoutHandler);\n"]}
+{"version":3,"file":"BannerBase.types.mjs","sourceRoot":"","sources":["../../../src/components/BannerBase/BannerBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BannerBasePropsShared } from '@metamask-previews/design-system-shared';\nimport type { MouseEventHandler } from 'react';\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' | 'onClick' | 'variant'\n>;\n\ntype BannerBaseCloseButtonProps = Omit<\n  Partial<ButtonIconProps>,\n  'iconName' | 'onClick'\n> & {\n  /**\n   * Optional test id for the close button element.\n   */\n  'data-testid'?: string;\n  /**\n   * Optional click handler for the close button.\n   */\n  onClick?: MouseEventHandler<HTMLButtonElement>;\n};\n\ntype BannerBasePropsBase = BannerBasePropsShared &\n  Omit<BoxProps, 'children'> & {\n    /**\n     * Optional props for the title `Text` when the title is a string.\n     */\n    titleProps?: Partial<TextProps>;\n    /**\n     * Optional props for the description `Text` when description is a string.\n     */\n    descriptionProps?: Partial<TextProps>;\n    /**\n     * Optional props for the children wrapper `Text` when children is a string.\n     */\n    childrenWrapperProps?: Partial<TextProps>;\n    /**\n     * Optional click handler for the close button.\n     * If provided, a close button is shown.\n     */\n    onClose?: MouseEventHandler<HTMLButtonElement>;\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  actionButtonOnClick: MouseEventHandler<HTMLButtonElement>;\n  actionButtonLabel: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\ntype BannerBaseActionPropsWithoutHandler = {\n  actionButtonOnClick?: undefined;\n  actionButtonLabel?: string;\n  actionButtonProps?: BannerBaseActionButtonProps;\n};\n\nexport type BannerBaseProps = BannerBasePropsBase &\n  (BannerBaseActionPropsWithHandler | BannerBaseActionPropsWithoutHandler);\n"]}

package/dist/components/ButtonFilter/ButtonFilter.cjs

@@ -0,0 +1,37 @@
+"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.ButtonFilter = void 0;
+const react_1 = __importStar(require("react"));
+const tw_merge_1 = require("../../utils/tw-merge.cjs");
+const ButtonBase_1 = require("../ButtonBase/index.cjs");
+exports.ButtonFilter = (0, react_1.forwardRef)(({ className, isActive = false, ...props }, ref) => {
+    const mergedClassName = (0, tw_merge_1.twMerge)(isActive
+        ? 'bg-icon-default text-icon-inverse'
+        : 'bg-background-muted text-default', className);
+    return react_1.default.createElement(ButtonBase_1.ButtonBase, { ref: ref, className: mergedClassName, ...props });
+});
+exports.ButtonFilter.displayName = 'ButtonFilter';
+//# sourceMappingURL=ButtonFilter.cjs.map

package/dist/components/ButtonFilter/ButtonFilter.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonFilter.cjs","sourceRoot":"","sources":["../../../src/components/ButtonFilter/ButtonFilter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,uDAA+C;AAC/C,wDAA2C;AAI9B,QAAA,YAAY,GAAG,IAAA,kBAAU,EACpC,CAAC,EAAE,SAAS,EAAE,QAAQ,GAAG,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjD,MAAM,eAAe,GAAG,IAAA,kBAAO,EAC7B,QAAQ;QACN,CAAC,CAAC,mCAAmC;QACrC,CAAC,CAAC,kCAAkC,EACtC,SAAS,CACV,CAAC;IAEF,OAAO,8BAAC,uBAAU,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,KAAM,KAAK,GAAI,CAAC;AACzE,CAAC,CACF,CAAC;AAEF,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { ButtonBase } from '../ButtonBase';\n\nimport type { ButtonFilterProps } from './ButtonFilter.types';\n\nexport const ButtonFilter = forwardRef<HTMLButtonElement, ButtonFilterProps>(\n  ({ className, isActive = false, ...props }, ref) => {\n    const mergedClassName = twMerge(\n      isActive\n        ? 'bg-icon-default text-icon-inverse'\n        : 'bg-background-muted text-default',\n      className,\n    );\n\n    return <ButtonBase ref={ref} className={mergedClassName} {...props} />;\n  },\n);\n\nButtonFilter.displayName = 'ButtonFilter';\n"]}

package/dist/components/ButtonFilter/ButtonFilter.d.cts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ButtonFilterProps } from "./ButtonFilter.types.cjs";
+export declare const ButtonFilter: React.ForwardRefExoticComponent<Omit<ButtonFilterProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=ButtonFilter.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonFilter.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonFilter/ButtonFilter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAK1C,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAE9D,eAAO,MAAM,YAAY,0GAWxB,CAAC"}

package/dist/components/ButtonFilter/ButtonFilter.d.mts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { ButtonFilterProps } from "./ButtonFilter.types.mjs";
+export declare const ButtonFilter: React.ForwardRefExoticComponent<Omit<ButtonFilterProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=ButtonFilter.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonFilter.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonFilter/ButtonFilter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAK1C,OAAO,KAAK,EAAE,iBAAiB,EAAE,iCAA6B;AAE9D,eAAO,MAAM,YAAY,0GAWxB,CAAC"}

package/dist/components/ButtonFilter/ButtonFilter.mjs

@@ -0,0 +1,18 @@
+function $importDefault(module) {
+    if (module?.__esModule) {
+        return module.default;
+    }
+    return module;
+}
+import $React, { forwardRef } from "react";
+const React = $importDefault($React);
+import { twMerge } from "../../utils/tw-merge.mjs";
+import { ButtonBase } from "../ButtonBase/index.mjs";
+export const ButtonFilter = forwardRef(({ className, isActive = false, ...props }, ref) => {
+    const mergedClassName = twMerge(isActive
+        ? 'bg-icon-default text-icon-inverse'
+        : 'bg-background-muted text-default', className);
+    return React.createElement(ButtonBase, { ref: ref, className: mergedClassName, ...props });
+});
+ButtonFilter.displayName = 'ButtonFilter';
+//# sourceMappingURL=ButtonFilter.mjs.map

package/dist/components/ButtonFilter/ButtonFilter.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonFilter.mjs","sourceRoot":"","sources":["../../../src/components/ButtonFilter/ButtonFilter.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,UAAU,EAAE,gCAAsB;AAI3C,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,CAAC,EAAE,SAAS,EAAE,QAAQ,GAAG,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjD,MAAM,eAAe,GAAG,OAAO,CAC7B,QAAQ;QACN,CAAC,CAAC,mCAAmC;QACrC,CAAC,CAAC,kCAAkC,EACtC,SAAS,CACV,CAAC;IAEF,OAAO,oBAAC,UAAU,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,KAAM,KAAK,GAAI,CAAC;AACzE,CAAC,CACF,CAAC;AAEF,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { ButtonBase } from '../ButtonBase';\n\nimport type { ButtonFilterProps } from './ButtonFilter.types';\n\nexport const ButtonFilter = forwardRef<HTMLButtonElement, ButtonFilterProps>(\n  ({ className, isActive = false, ...props }, ref) => {\n    const mergedClassName = twMerge(\n      isActive\n        ? 'bg-icon-default text-icon-inverse'\n        : 'bg-background-muted text-default',\n      className,\n    );\n\n    return <ButtonBase ref={ref} className={mergedClassName} {...props} />;\n  },\n);\n\nButtonFilter.displayName = 'ButtonFilter';\n"]}

package/dist/components/ButtonFilter/ButtonFilter.types.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonFilter.types.cjs","sourceRoot":"","sources":["../../../src/components/ButtonFilter/ButtonFilter.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonFilterPropsShared } from '@metamask-previews/design-system-shared';\n\nimport type { ButtonBaseProps } from '../ButtonBase';\n\nexport type ButtonFilterProps = ButtonBaseProps & ButtonFilterPropsShared;\n"]}

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

@@ -0,0 +1,4 @@
+import type { ButtonFilterPropsShared } from "@metamask-previews/design-system-shared";
+import type { ButtonBaseProps } from "../ButtonBase/index.cjs";
+export type ButtonFilterProps = ButtonBaseProps & ButtonFilterPropsShared;
+//# sourceMappingURL=ButtonFilter.types.d.cts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonFilter.types.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonFilter/ButtonFilter.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,gDAAgD;AAEvF,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AAErD,MAAM,MAAM,iBAAiB,GAAG,eAAe,GAAG,uBAAuB,CAAC"}

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

@@ -0,0 +1,4 @@
+import type { ButtonFilterPropsShared } from "@metamask-previews/design-system-shared";
+import type { ButtonBaseProps } from "../ButtonBase/index.mjs";
+export type ButtonFilterProps = ButtonBaseProps & ButtonFilterPropsShared;
+//# sourceMappingURL=ButtonFilter.types.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonFilter.types.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonFilter/ButtonFilter.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,gDAAgD;AAEvF,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AAErD,MAAM,MAAM,iBAAiB,GAAG,eAAe,GAAG,uBAAuB,CAAC"}

package/dist/components/ButtonFilter/ButtonFilter.types.mjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonFilter.types.mjs","sourceRoot":"","sources":["../../../src/components/ButtonFilter/ButtonFilter.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonFilterPropsShared } from '@metamask-previews/design-system-shared';\n\nimport type { ButtonBaseProps } from '../ButtonBase';\n\nexport type ButtonFilterProps = ButtonBaseProps & ButtonFilterPropsShared;\n"]}

package/dist/components/ButtonFilter/index.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ButtonFilter/index.ts"],"names":[],"mappings":";;;AAAA,mDAA8C;AAArC,4GAAA,YAAY,OAAA","sourcesContent":["export { ButtonFilter } from './ButtonFilter';\nexport type { ButtonFilterProps } from './ButtonFilter.types';\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ButtonFilter/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,2BAAuB;AAC9C,YAAY,EAAE,iBAAiB,EAAE,iCAA6B"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/ButtonFilter/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,2BAAuB;AAC9C,YAAY,EAAE,iBAAiB,EAAE,iCAA6B"}

package/dist/components/ButtonFilter/index.mjs

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

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

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

package/dist/components/ButtonIcon/ButtonIcon.cjs

@@ -29,26 +29,25 @@ const types_1 = require("../../types/index.cjs");
 const tw_merge_1 = require("../../utils/tw-merge.cjs");
 const Icon_1 = require("../Icon/index.cjs");
 const ButtonIcon_constants_1 = require("./ButtonIcon.constants.cjs");
-exports.ButtonIcon = (0, react_1.forwardRef)(({ className, iconName, iconProps, ariaLabel, isDisabled = false, isInverse = false, isFloating = false, size = types_1.ButtonIconSize.Md, style, ...props }, ref) => {
+exports.ButtonIcon = (0, react_1.forwardRef)(({ className, iconName, iconProps, ariaLabel, isDisabled = false, variant = types_1.ButtonIconVariant.Default, size = types_1.ButtonIconSize.Md, style, ...props }, ref) => {
     const isInteractive = !isDisabled;
     const mergedClassName = (0, tw_merge_1.twMerge)(
     // Base styles
     'inline-flex items-center justify-center p-0', 
     // Size styles
     ButtonIcon_constants_1.TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size], 
-    // Floating styles
-    isFloating && [
-        'rounded-full',
-        !isInverse && 'bg-icon-default text-background-default',
-        isInverse && 'bg-icon-default text-background-default',
-    ], 
-    // Non-floating styles
-    !isFloating && [
+    // Variant styles
+    variant === types_1.ButtonIconVariant.Default && [
         'rounded-lg bg-transparent',
-        // Only apply hover/active styles when interactive
         isInteractive && 'hover:bg-hover active:bg-pressed',
-        !isInverse && 'text-icon-default',
-        isInverse && 'text-background-default',
+        'text-icon-default',
+    ], variant === types_1.ButtonIconVariant.Floating && [
+        'rounded-full',
+        'bg-icon-default text-background-default',
+    ], variant === types_1.ButtonIconVariant.Filled && [
+        'rounded-full',
+        'bg-muted text-icon-default',
+        isInteractive && 'hover:bg-muted-hover active:bg-muted-pressed',
     ], 
     // Disabled state
     isDisabled && 'cursor-not-allowed opacity-50', className);

package/dist/components/ButtonIcon/ButtonIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonIcon.cjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,iDAA6C;AAC7C,uDAA+C;AAC/C,4CAA+B;AAE/B,qEAGgC;AAGnB,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CACE,EACE,SAAS,EACT,QAAQ,EACR,SAAS,EACT,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,sBAAc,CAAC,EAAE,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,aAAa,GAAG,CAAC,UAAU,CAAC;IAElC,MAAM,eAAe,GAAG,IAAA,kBAAO;IAC7B,cAAc;IACd,6CAA6C;IAC7C,cAAc;IACd,2DAAoC,CAAC,IAAI,CAAC;IAC1C,kBAAkB;IAClB,UAAU,IAAI;QACZ,cAAc;QACd,CAAC,SAAS,IAAI,yCAAyC;QACvD,SAAS,IAAI,yCAAyC;KACvD;IACD,sBAAsB;IACtB,CAAC,UAAU,IAAI;QACb,2BAA2B;QAC3B,kDAAkD;QAClD,aAAa,IAAI,kCAAkC;QACnD,CAAC,SAAS,IAAI,mBAAmB;QACjC,SAAS,IAAI,yBAAyB;KACvC;IACD,iBAAiB;IACjB,UAAU,IAAI,+BAA+B,EAC7C,SAAS,CACV,CAAC;IAEF,OAAO,CACL,0CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,QAAQ,EAAE,UAAU,gBACR,SAAS,EACrB,KAAK,EAAE,KAAK,KACR,KAAK;QAET,8BAAC,WAAI,IACH,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,mDAA4B,CAAC,IAAI,CAAC,EACxC,SAAS,EAAE,IAAA,kBAAO,EAAC,cAAc,EAAE,SAAS,EAAE,SAAS,CAAC,KACpD,SAAS,GACb,CACK,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ButtonIconSize } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { Icon } from '../Icon';\n\nimport {\n  TWCLASSMAP_BUTTONICON_SIZE_DIMENSION,\n  MAP_BUTTONICON_SIZE_ICONSIZE,\n} from './ButtonIcon.constants';\nimport type { ButtonIconProps } from './ButtonIcon.types';\n\nexport const ButtonIcon = forwardRef<HTMLButtonElement, ButtonIconProps>(\n  (\n    {\n      className,\n      iconName,\n      iconProps,\n      ariaLabel,\n      isDisabled = false,\n      isInverse = false,\n      isFloating = false,\n      size = ButtonIconSize.Md,\n      style,\n      ...props\n    },\n    ref,\n  ) => {\n    const isInteractive = !isDisabled;\n\n    const mergedClassName = twMerge(\n      // Base styles\n      'inline-flex items-center justify-center p-0',\n      // Size styles\n      TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size],\n      // Floating styles\n      isFloating && [\n        'rounded-full',\n        !isInverse && 'bg-icon-default text-background-default',\n        isInverse && 'bg-icon-default text-background-default',\n      ],\n      // Non-floating styles\n      !isFloating && [\n        'rounded-lg bg-transparent',\n        // Only apply hover/active styles when interactive\n        isInteractive && 'hover:bg-hover active:bg-pressed',\n        !isInverse && 'text-icon-default',\n        isInverse && 'text-background-default',\n      ],\n      // Disabled state\n      isDisabled && 'cursor-not-allowed opacity-50',\n      className,\n    );\n\n    return (\n      <button\n        ref={ref}\n        className={mergedClassName}\n        disabled={isDisabled}\n        aria-label={ariaLabel}\n        style={style}\n        {...props}\n      >\n        <Icon\n          name={iconName}\n          size={MAP_BUTTONICON_SIZE_ICONSIZE[size]}\n          className={twMerge('text-inherit', iconProps?.className)}\n          {...iconProps}\n        />\n      </button>\n    );\n  },\n);\n\nButtonIcon.displayName = 'ButtonIcon';\n"]}
+{"version":3,"file":"ButtonIcon.cjs","sourceRoot":"","sources":["../../../src/components/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,iDAAgE;AAChE,uDAA+C;AAC/C,4CAA+B;AAE/B,qEAGgC;AAGnB,QAAA,UAAU,GAAG,IAAA,kBAAU,EAClC,CACE,EACE,SAAS,EACT,QAAQ,EACR,SAAS,EACT,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,OAAO,GAAG,yBAAiB,CAAC,OAAO,EACnC,IAAI,GAAG,sBAAc,CAAC,EAAE,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,aAAa,GAAG,CAAC,UAAU,CAAC;IAElC,MAAM,eAAe,GAAG,IAAA,kBAAO;IAC7B,cAAc;IACd,6CAA6C;IAC7C,cAAc;IACd,2DAAoC,CAAC,IAAI,CAAC;IAC1C,iBAAiB;IACjB,OAAO,KAAK,yBAAiB,CAAC,OAAO,IAAI;QACvC,2BAA2B;QAC3B,aAAa,IAAI,kCAAkC;QACnD,mBAAmB;KACpB,EACD,OAAO,KAAK,yBAAiB,CAAC,QAAQ,IAAI;QACxC,cAAc;QACd,yCAAyC;KAC1C,EACD,OAAO,KAAK,yBAAiB,CAAC,MAAM,IAAI;QACtC,cAAc;QACd,4BAA4B;QAC5B,aAAa,IAAI,8CAA8C;KAChE;IACD,iBAAiB;IACjB,UAAU,IAAI,+BAA+B,EAC7C,SAAS,CACV,CAAC;IAEF,OAAO,CACL,0CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,QAAQ,EAAE,UAAU,gBACR,SAAS,EACrB,KAAK,EAAE,KAAK,KACR,KAAK;QAET,8BAAC,WAAI,IACH,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,mDAA4B,CAAC,IAAI,CAAC,EACxC,SAAS,EAAE,IAAA,kBAAO,EAAC,cAAc,EAAE,SAAS,EAAE,SAAS,CAAC,KACpD,SAAS,GACb,CACK,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ButtonIconSize, ButtonIconVariant } from '../../types';\nimport { twMerge } from '../../utils/tw-merge';\nimport { Icon } from '../Icon';\n\nimport {\n  TWCLASSMAP_BUTTONICON_SIZE_DIMENSION,\n  MAP_BUTTONICON_SIZE_ICONSIZE,\n} from './ButtonIcon.constants';\nimport type { ButtonIconProps } from './ButtonIcon.types';\n\nexport const ButtonIcon = forwardRef<HTMLButtonElement, ButtonIconProps>(\n  (\n    {\n      className,\n      iconName,\n      iconProps,\n      ariaLabel,\n      isDisabled = false,\n      variant = ButtonIconVariant.Default,\n      size = ButtonIconSize.Md,\n      style,\n      ...props\n    },\n    ref,\n  ) => {\n    const isInteractive = !isDisabled;\n\n    const mergedClassName = twMerge(\n      // Base styles\n      'inline-flex items-center justify-center p-0',\n      // Size styles\n      TWCLASSMAP_BUTTONICON_SIZE_DIMENSION[size],\n      // Variant styles\n      variant === ButtonIconVariant.Default && [\n        'rounded-lg bg-transparent',\n        isInteractive && 'hover:bg-hover active:bg-pressed',\n        'text-icon-default',\n      ],\n      variant === ButtonIconVariant.Floating && [\n        'rounded-full',\n        'bg-icon-default text-background-default',\n      ],\n      variant === ButtonIconVariant.Filled && [\n        'rounded-full',\n        'bg-muted text-icon-default',\n        isInteractive && 'hover:bg-muted-hover active:bg-muted-pressed',\n      ],\n      // Disabled state\n      isDisabled && 'cursor-not-allowed opacity-50',\n      className,\n    );\n\n    return (\n      <button\n        ref={ref}\n        className={mergedClassName}\n        disabled={isDisabled}\n        aria-label={ariaLabel}\n        style={style}\n        {...props}\n      >\n        <Icon\n          name={iconName}\n          size={MAP_BUTTONICON_SIZE_ICONSIZE[size]}\n          className={twMerge('text-inherit', iconProps?.className)}\n          {...iconProps}\n        />\n      </button>\n    );\n  },\n);\n\nButtonIcon.displayName = 'ButtonIcon';\n"]}