@metamask-previews/design-system-react 0.24.0-preview.f5c2542 → 0.25.0-preview.1f40f69f

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (172) hide show
  1. package/CHANGELOG.md +16 -1
  2. package/dist/components/AvatarBase/AvatarBase.cjs +1 -1
  3. package/dist/components/AvatarBase/AvatarBase.cjs.map +1 -1
  4. package/dist/components/AvatarBase/AvatarBase.mjs +1 -1
  5. package/dist/components/AvatarBase/AvatarBase.mjs.map +1 -1
  6. package/dist/components/AvatarFavicon/AvatarFavicon.cjs +1 -1
  7. package/dist/components/AvatarFavicon/AvatarFavicon.cjs.map +1 -1
  8. package/dist/components/AvatarFavicon/AvatarFavicon.mjs +1 -1
  9. package/dist/components/AvatarFavicon/AvatarFavicon.mjs.map +1 -1
  10. package/dist/components/AvatarNetwork/AvatarNetwork.cjs +1 -1
  11. package/dist/components/AvatarNetwork/AvatarNetwork.cjs.map +1 -1
  12. package/dist/components/AvatarNetwork/AvatarNetwork.mjs +1 -1
  13. package/dist/components/AvatarNetwork/AvatarNetwork.mjs.map +1 -1
  14. package/dist/components/AvatarToken/AvatarToken.cjs +2 -2
  15. package/dist/components/AvatarToken/AvatarToken.cjs.map +1 -1
  16. package/dist/components/AvatarToken/AvatarToken.mjs +2 -2
  17. package/dist/components/AvatarToken/AvatarToken.mjs.map +1 -1
  18. package/dist/components/FormTextField/FormTextField.cjs +38 -0
  19. package/dist/components/FormTextField/FormTextField.cjs.map +1 -0
  20. package/dist/components/FormTextField/FormTextField.d.cts +4 -0
  21. package/dist/components/FormTextField/FormTextField.d.cts.map +1 -0
  22. package/dist/components/FormTextField/FormTextField.d.mts +4 -0
  23. package/dist/components/FormTextField/FormTextField.d.mts.map +1 -0
  24. package/dist/components/FormTextField/FormTextField.mjs +19 -0
  25. package/dist/components/FormTextField/FormTextField.mjs.map +1 -0
  26. package/dist/components/FormTextField/FormTextField.types.cjs +3 -0
  27. package/dist/components/FormTextField/FormTextField.types.cjs.map +1 -0
  28. package/dist/components/FormTextField/FormTextField.types.d.cts +50 -0
  29. package/dist/components/FormTextField/FormTextField.types.d.cts.map +1 -0
  30. package/dist/components/FormTextField/FormTextField.types.d.mts +50 -0
  31. package/dist/components/FormTextField/FormTextField.types.d.mts.map +1 -0
  32. package/dist/components/FormTextField/FormTextField.types.mjs +2 -0
  33. package/dist/components/FormTextField/FormTextField.types.mjs.map +1 -0
  34. package/dist/components/FormTextField/index.cjs +6 -0
  35. package/dist/components/FormTextField/index.cjs.map +1 -0
  36. package/dist/components/FormTextField/index.d.cts +3 -0
  37. package/dist/components/FormTextField/index.d.cts.map +1 -0
  38. package/dist/components/FormTextField/index.d.mts +3 -0
  39. package/dist/components/FormTextField/index.d.mts.map +1 -0
  40. package/dist/components/FormTextField/index.mjs +2 -0
  41. package/dist/components/FormTextField/index.mjs.map +1 -0
  42. package/dist/components/Popover/Popover.cjs +129 -0
  43. package/dist/components/Popover/Popover.cjs.map +1 -0
  44. package/dist/components/Popover/Popover.constants.cjs +28 -0
  45. package/dist/components/Popover/Popover.constants.cjs.map +1 -0
  46. package/dist/components/Popover/Popover.constants.d.cts +12 -0
  47. package/dist/components/Popover/Popover.constants.d.cts.map +1 -0
  48. package/dist/components/Popover/Popover.constants.d.mts +12 -0
  49. package/dist/components/Popover/Popover.constants.d.mts.map +1 -0
  50. package/dist/components/Popover/Popover.constants.mjs +25 -0
  51. package/dist/components/Popover/Popover.constants.mjs.map +1 -0
  52. package/dist/components/Popover/Popover.d.cts +4 -0
  53. package/dist/components/Popover/Popover.d.cts.map +1 -0
  54. package/dist/components/Popover/Popover.d.mts +4 -0
  55. package/dist/components/Popover/Popover.d.mts.map +1 -0
  56. package/dist/components/Popover/Popover.mjs +110 -0
  57. package/dist/components/Popover/Popover.mjs.map +1 -0
  58. package/dist/components/Popover/Popover.types.cjs +33 -0
  59. package/dist/components/Popover/Popover.types.cjs.map +1 -0
  60. package/dist/components/Popover/Popover.types.d.cts +128 -0
  61. package/dist/components/Popover/Popover.types.d.cts.map +1 -0
  62. package/dist/components/Popover/Popover.types.d.mts +128 -0
  63. package/dist/components/Popover/Popover.types.d.mts.map +1 -0
  64. package/dist/components/Popover/Popover.types.mjs +30 -0
  65. package/dist/components/Popover/Popover.types.mjs.map +1 -0
  66. package/dist/components/Popover/index.cjs +9 -0
  67. package/dist/components/Popover/index.cjs.map +1 -0
  68. package/dist/components/Popover/index.d.cts +4 -0
  69. package/dist/components/Popover/index.d.cts.map +1 -0
  70. package/dist/components/Popover/index.d.mts +4 -0
  71. package/dist/components/Popover/index.d.mts.map +1 -0
  72. package/dist/components/Popover/index.mjs +3 -0
  73. package/dist/components/Popover/index.mjs.map +1 -0
  74. package/dist/components/TextArea/TextArea.cjs +37 -0
  75. package/dist/components/TextArea/TextArea.cjs.map +1 -0
  76. package/dist/components/TextArea/TextArea.constants.cjs +35 -0
  77. package/dist/components/TextArea/TextArea.constants.cjs.map +1 -0
  78. package/dist/components/TextArea/TextArea.constants.d.cts +28 -0
  79. package/dist/components/TextArea/TextArea.constants.d.cts.map +1 -0
  80. package/dist/components/TextArea/TextArea.constants.d.mts +28 -0
  81. package/dist/components/TextArea/TextArea.constants.d.mts.map +1 -0
  82. package/dist/components/TextArea/TextArea.constants.mjs +32 -0
  83. package/dist/components/TextArea/TextArea.constants.mjs.map +1 -0
  84. package/dist/components/TextArea/TextArea.d.cts +9 -0
  85. package/dist/components/TextArea/TextArea.d.cts.map +1 -0
  86. package/dist/components/TextArea/TextArea.d.mts +9 -0
  87. package/dist/components/TextArea/TextArea.d.mts.map +1 -0
  88. package/dist/components/TextArea/TextArea.mjs +18 -0
  89. package/dist/components/TextArea/TextArea.mjs.map +1 -0
  90. package/dist/components/TextArea/TextArea.types.cjs +3 -0
  91. package/dist/components/TextArea/TextArea.types.cjs.map +1 -0
  92. package/dist/components/TextArea/TextArea.types.d.cts +33 -0
  93. package/dist/components/TextArea/TextArea.types.d.cts.map +1 -0
  94. package/dist/components/TextArea/TextArea.types.d.mts +33 -0
  95. package/dist/components/TextArea/TextArea.types.d.mts.map +1 -0
  96. package/dist/components/TextArea/TextArea.types.mjs +2 -0
  97. package/dist/components/TextArea/TextArea.types.mjs.map +1 -0
  98. package/dist/components/TextArea/index.cjs +8 -0
  99. package/dist/components/TextArea/index.cjs.map +1 -0
  100. package/dist/components/TextArea/index.d.cts +4 -0
  101. package/dist/components/TextArea/index.d.cts.map +1 -0
  102. package/dist/components/TextArea/index.d.mts +4 -0
  103. package/dist/components/TextArea/index.d.mts.map +1 -0
  104. package/dist/components/TextArea/index.mjs +3 -0
  105. package/dist/components/TextArea/index.mjs.map +1 -0
  106. package/dist/components/TextFieldSearch/TextFieldSearch.cjs +40 -0
  107. package/dist/components/TextFieldSearch/TextFieldSearch.cjs.map +1 -0
  108. package/dist/components/TextFieldSearch/TextFieldSearch.d.cts +6 -0
  109. package/dist/components/TextFieldSearch/TextFieldSearch.d.cts.map +1 -0
  110. package/dist/components/TextFieldSearch/TextFieldSearch.d.mts +6 -0
  111. package/dist/components/TextFieldSearch/TextFieldSearch.d.mts.map +1 -0
  112. package/dist/components/TextFieldSearch/TextFieldSearch.mjs +21 -0
  113. package/dist/components/TextFieldSearch/TextFieldSearch.mjs.map +1 -0
  114. package/dist/components/TextFieldSearch/TextFieldSearch.types.cjs +3 -0
  115. package/dist/components/TextFieldSearch/TextFieldSearch.types.cjs.map +1 -0
  116. package/dist/components/TextFieldSearch/TextFieldSearch.types.d.cts +17 -0
  117. package/dist/components/TextFieldSearch/TextFieldSearch.types.d.cts.map +1 -0
  118. package/dist/components/TextFieldSearch/TextFieldSearch.types.d.mts +17 -0
  119. package/dist/components/TextFieldSearch/TextFieldSearch.types.d.mts.map +1 -0
  120. package/dist/components/TextFieldSearch/TextFieldSearch.types.mjs +2 -0
  121. package/dist/components/TextFieldSearch/TextFieldSearch.types.mjs.map +1 -0
  122. package/dist/components/TextFieldSearch/index.cjs +6 -0
  123. package/dist/components/TextFieldSearch/index.cjs.map +1 -0
  124. package/dist/components/TextFieldSearch/index.d.cts +3 -0
  125. package/dist/components/TextFieldSearch/index.d.cts.map +1 -0
  126. package/dist/components/TextFieldSearch/index.d.mts +3 -0
  127. package/dist/components/TextFieldSearch/index.d.mts.map +1 -0
  128. package/dist/components/TextFieldSearch/index.mjs +2 -0
  129. package/dist/components/TextFieldSearch/index.mjs.map +1 -0
  130. package/dist/components/Toast/Toast.cjs +7 -1
  131. package/dist/components/Toast/Toast.cjs.map +1 -1
  132. package/dist/components/Toast/Toast.constants.cjs +6 -4
  133. package/dist/components/Toast/Toast.constants.cjs.map +1 -1
  134. package/dist/components/Toast/Toast.constants.d.cts +1 -3
  135. package/dist/components/Toast/Toast.constants.d.cts.map +1 -1
  136. package/dist/components/Toast/Toast.constants.d.mts +1 -3
  137. package/dist/components/Toast/Toast.constants.d.mts.map +1 -1
  138. package/dist/components/Toast/Toast.constants.mjs +3 -3
  139. package/dist/components/Toast/Toast.constants.mjs.map +1 -1
  140. package/dist/components/Toast/Toast.d.cts.map +1 -1
  141. package/dist/components/Toast/Toast.d.mts.map +1 -1
  142. package/dist/components/Toast/Toast.mjs +7 -1
  143. package/dist/components/Toast/Toast.mjs.map +1 -1
  144. package/dist/components/Toast/Toast.types.cjs.map +1 -1
  145. package/dist/components/Toast/Toast.types.d.cts +4 -0
  146. package/dist/components/Toast/Toast.types.d.cts.map +1 -1
  147. package/dist/components/Toast/Toast.types.d.mts +4 -0
  148. package/dist/components/Toast/Toast.types.d.mts.map +1 -1
  149. package/dist/components/Toast/Toast.types.mjs.map +1 -1
  150. package/dist/components/Toast/Toaster.cjs +124 -54
  151. package/dist/components/Toast/Toaster.cjs.map +1 -1
  152. package/dist/components/Toast/Toaster.d.cts.map +1 -1
  153. package/dist/components/Toast/Toaster.d.mts.map +1 -1
  154. package/dist/components/Toast/Toaster.mjs +125 -55
  155. package/dist/components/Toast/Toaster.mjs.map +1 -1
  156. package/dist/components/Toast/index.cjs +1 -4
  157. package/dist/components/Toast/index.cjs.map +1 -1
  158. package/dist/components/Toast/index.d.cts +1 -2
  159. package/dist/components/Toast/index.d.cts.map +1 -1
  160. package/dist/components/Toast/index.d.mts +1 -2
  161. package/dist/components/Toast/index.d.mts.map +1 -1
  162. package/dist/components/Toast/index.mjs +0 -1
  163. package/dist/components/Toast/index.mjs.map +1 -1
  164. package/dist/components/index.cjs +13 -4
  165. package/dist/components/index.cjs.map +1 -1
  166. package/dist/components/index.d.cts +9 -2
  167. package/dist/components/index.d.cts.map +1 -1
  168. package/dist/components/index.d.mts +9 -2
  169. package/dist/components/index.d.mts.map +1 -1
  170. package/dist/components/index.mjs +4 -1
  171. package/dist/components/index.mjs.map +1 -1
  172. package/package.json +6 -5
@@ -0,0 +1,40 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ Object.defineProperty(exports, "__esModule", { value: true });
26
+ exports.TextFieldSearch = void 0;
27
+ const react_1 = __importStar(require("react"));
28
+ const tw_merge_1 = require("../../utils/tw-merge.cjs");
29
+ const ButtonIcon_1 = require("../ButtonIcon/index.cjs");
30
+ const Icon_1 = require("../Icon/index.cjs");
31
+ const TextField_1 = require("../TextField/index.cjs");
32
+ exports.TextFieldSearch = (0, react_1.forwardRef)(({ clearButtonOnClick, clearButtonProps, endAccessory, value, startAccessory, isDisabled = false, className, ...props }, ref) => {
33
+ const clearButton = value ? (react_1.default.createElement(ButtonIcon_1.ButtonIcon, { "data-testid": "text-field-search-clear-button", ariaLabel: "Clear", iconName: Icon_1.IconName.CircleX, size: ButtonIcon_1.ButtonIconSize.Md, iconProps: { color: Icon_1.IconColor.IconAlternative }, ...clearButtonProps, isDisabled: isDisabled || clearButtonProps?.isDisabled, onClick: clearButtonOnClick })) : null;
34
+ const resolvedEndAccessory = clearButton || endAccessory ? (react_1.default.createElement(react_1.default.Fragment, null,
35
+ clearButton,
36
+ endAccessory)) : undefined;
37
+ return (react_1.default.createElement(TextField_1.TextField, { ref: ref, value: value, isDisabled: isDisabled, type: TextField_1.TextFieldType.Search, className: (0, tw_merge_1.twMerge)('rounded-full', className), startAccessory: startAccessory ?? (react_1.default.createElement(Icon_1.Icon, { name: Icon_1.IconName.Search, size: Icon_1.IconSize.Md, color: Icon_1.IconColor.IconAlternative })), endAccessory: resolvedEndAccessory, ...props }));
38
+ });
39
+ exports.TextFieldSearch.displayName = 'TextFieldSearch';
40
+ //# sourceMappingURL=TextFieldSearch.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextFieldSearch.cjs","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/TextFieldSearch.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,uDAA+C;AAC/C,wDAA2D;AAC3D,4CAA8D;AAC9D,sDAAwD;AAI3C,QAAA,eAAe,GAAG,IAAA,kBAAU,EACvC,CACE,EACE,kBAAkB,EAClB,gBAAgB,EAChB,YAAY,EACZ,KAAK,EACL,cAAc,EACd,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,WAAW,GAAG,KAAK,CAAC,CAAC,CAAC,CAC1B,8BAAC,uBAAU,mBACG,gCAAgC,EAC5C,SAAS,EAAC,OAAO,EACjB,QAAQ,EAAE,eAAQ,CAAC,OAAO,EAC1B,IAAI,EAAE,2BAAc,CAAC,EAAE,EACvB,SAAS,EAAE,EAAE,KAAK,EAAE,gBAAS,CAAC,eAAe,EAAE,KAC3C,gBAAgB,EACpB,UAAU,EAAE,UAAU,IAAI,gBAAgB,EAAE,UAAU,EACtD,OAAO,EAAE,kBAAkB,GAC3B,CACH,CAAC,CAAC,CAAC,IAAI,CAAC;IAET,MAAM,oBAAoB,GACxB,WAAW,IAAI,YAAY,CAAC,CAAC,CAAC,CAC5B;QACG,WAAW;QACX,YAAY,CACZ,CACJ,CAAC,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,CACL,8BAAC,qBAAS,IACR,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,yBAAa,CAAC,MAAM,EAC1B,SAAS,EAAE,IAAA,kBAAO,EAAC,cAAc,EAAE,SAAS,CAAC,EAC7C,cAAc,EACZ,cAAc,IAAI,CAChB,8BAAC,WAAI,IACH,IAAI,EAAE,eAAQ,CAAC,MAAM,EACrB,IAAI,EAAE,eAAQ,CAAC,EAAE,EACjB,KAAK,EAAE,gBAAS,CAAC,eAAe,GAChC,CACH,EAEH,YAAY,EAAE,oBAAoB,KAC9B,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,uBAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { ButtonIcon, ButtonIconSize } from '../ButtonIcon';\nimport { Icon, IconColor, IconName, IconSize } from '../Icon';\nimport { TextField, TextFieldType } from '../TextField';\n\nimport type { TextFieldSearchProps } from './TextFieldSearch.types';\n\nexport const TextFieldSearch = forwardRef<HTMLDivElement, TextFieldSearchProps>(\n (\n {\n clearButtonOnClick,\n clearButtonProps,\n endAccessory,\n value,\n startAccessory,\n isDisabled = false,\n className,\n ...props\n },\n ref,\n ) => {\n const clearButton = value ? (\n <ButtonIcon\n data-testid=\"text-field-search-clear-button\"\n ariaLabel=\"Clear\"\n iconName={IconName.CircleX}\n size={ButtonIconSize.Md}\n iconProps={{ color: IconColor.IconAlternative }}\n {...clearButtonProps}\n isDisabled={isDisabled || clearButtonProps?.isDisabled}\n onClick={clearButtonOnClick}\n />\n ) : null;\n\n const resolvedEndAccessory =\n clearButton || endAccessory ? (\n <>\n {clearButton}\n {endAccessory}\n </>\n ) : undefined;\n\n return (\n <TextField\n ref={ref}\n value={value}\n isDisabled={isDisabled}\n type={TextFieldType.Search}\n className={twMerge('rounded-full', className)}\n startAccessory={\n startAccessory ?? (\n <Icon\n name={IconName.Search}\n size={IconSize.Md}\n color={IconColor.IconAlternative}\n />\n )\n }\n endAccessory={resolvedEndAccessory}\n {...props}\n />\n );\n },\n);\n\nTextFieldSearch.displayName = 'TextFieldSearch';\n"]}
@@ -0,0 +1,6 @@
1
+ import React from "react";
2
+ export declare const TextFieldSearch: React.ForwardRefExoticComponent<Omit<import("../TextField/index.cjs").TextFieldProps, "type"> & {
3
+ clearButtonOnClick: React.MouseEventHandler<HTMLButtonElement>;
4
+ clearButtonProps?: Partial<import("../ButtonIcon/index.cjs").ButtonIconProps> | undefined;
5
+ } & React.RefAttributes<HTMLDivElement>>;
6
+ //# sourceMappingURL=TextFieldSearch.d.cts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextFieldSearch.d.cts","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/TextFieldSearch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAS1C,eAAO,MAAM,eAAe;;;wCAwD3B,CAAC"}
@@ -0,0 +1,6 @@
1
+ import React from "react";
2
+ export declare const TextFieldSearch: React.ForwardRefExoticComponent<Omit<import("../TextField/index.mjs").TextFieldProps, "type"> & {
3
+ clearButtonOnClick: React.MouseEventHandler<HTMLButtonElement>;
4
+ clearButtonProps?: Partial<import("../ButtonIcon/index.mjs").ButtonIconProps> | undefined;
5
+ } & React.RefAttributes<HTMLDivElement>>;
6
+ //# sourceMappingURL=TextFieldSearch.d.mts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextFieldSearch.d.mts","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/TextFieldSearch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAS1C,eAAO,MAAM,eAAe;;;wCAwD3B,CAAC"}
@@ -0,0 +1,21 @@
1
+ function $importDefault(module) {
2
+ if (module?.__esModule) {
3
+ return module.default;
4
+ }
5
+ return module;
6
+ }
7
+ import $React, { forwardRef } from "react";
8
+ const React = $importDefault($React);
9
+ import { twMerge } from "../../utils/tw-merge.mjs";
10
+ import { ButtonIcon, ButtonIconSize } from "../ButtonIcon/index.mjs";
11
+ import { Icon, IconColor, IconName, IconSize } from "../Icon/index.mjs";
12
+ import { TextField, TextFieldType } from "../TextField/index.mjs";
13
+ export const TextFieldSearch = forwardRef(({ clearButtonOnClick, clearButtonProps, endAccessory, value, startAccessory, isDisabled = false, className, ...props }, ref) => {
14
+ const clearButton = value ? (React.createElement(ButtonIcon, { "data-testid": "text-field-search-clear-button", ariaLabel: "Clear", iconName: IconName.CircleX, size: ButtonIconSize.Md, iconProps: { color: IconColor.IconAlternative }, ...clearButtonProps, isDisabled: isDisabled || clearButtonProps?.isDisabled, onClick: clearButtonOnClick })) : null;
15
+ const resolvedEndAccessory = clearButton || endAccessory ? (React.createElement(React.Fragment, null,
16
+ clearButton,
17
+ endAccessory)) : undefined;
18
+ return (React.createElement(TextField, { ref: ref, value: value, isDisabled: isDisabled, type: TextFieldType.Search, className: twMerge('rounded-full', className), startAccessory: startAccessory ?? (React.createElement(Icon, { name: IconName.Search, size: IconSize.Md, color: IconColor.IconAlternative })), endAccessory: resolvedEndAccessory, ...props }));
19
+ });
20
+ TextFieldSearch.displayName = 'TextFieldSearch';
21
+ //# sourceMappingURL=TextFieldSearch.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextFieldSearch.mjs","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/TextFieldSearch.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,gCAAsB;AAC3D,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,0BAAgB;AAC9D,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,+BAAqB;AAIxD,MAAM,CAAC,MAAM,eAAe,GAAG,UAAU,CACvC,CACE,EACE,kBAAkB,EAClB,gBAAgB,EAChB,YAAY,EACZ,KAAK,EACL,cAAc,EACd,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,WAAW,GAAG,KAAK,CAAC,CAAC,CAAC,CAC1B,oBAAC,UAAU,mBACG,gCAAgC,EAC5C,SAAS,EAAC,OAAO,EACjB,QAAQ,EAAE,QAAQ,CAAC,OAAO,EAC1B,IAAI,EAAE,cAAc,CAAC,EAAE,EACvB,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,CAAC,eAAe,EAAE,KAC3C,gBAAgB,EACpB,UAAU,EAAE,UAAU,IAAI,gBAAgB,EAAE,UAAU,EACtD,OAAO,EAAE,kBAAkB,GAC3B,CACH,CAAC,CAAC,CAAC,IAAI,CAAC;IAET,MAAM,oBAAoB,GACxB,WAAW,IAAI,YAAY,CAAC,CAAC,CAAC,CAC5B;QACG,WAAW;QACX,YAAY,CACZ,CACJ,CAAC,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,aAAa,CAAC,MAAM,EAC1B,SAAS,EAAE,OAAO,CAAC,cAAc,EAAE,SAAS,CAAC,EAC7C,cAAc,EACZ,cAAc,IAAI,CAChB,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,CAAC,MAAM,EACrB,IAAI,EAAE,QAAQ,CAAC,EAAE,EACjB,KAAK,EAAE,SAAS,CAAC,eAAe,GAChC,CACH,EAEH,YAAY,EAAE,oBAAoB,KAC9B,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { ButtonIcon, ButtonIconSize } from '../ButtonIcon';\nimport { Icon, IconColor, IconName, IconSize } from '../Icon';\nimport { TextField, TextFieldType } from '../TextField';\n\nimport type { TextFieldSearchProps } from './TextFieldSearch.types';\n\nexport const TextFieldSearch = forwardRef<HTMLDivElement, TextFieldSearchProps>(\n (\n {\n clearButtonOnClick,\n clearButtonProps,\n endAccessory,\n value,\n startAccessory,\n isDisabled = false,\n className,\n ...props\n },\n ref,\n ) => {\n const clearButton = value ? (\n <ButtonIcon\n data-testid=\"text-field-search-clear-button\"\n ariaLabel=\"Clear\"\n iconName={IconName.CircleX}\n size={ButtonIconSize.Md}\n iconProps={{ color: IconColor.IconAlternative }}\n {...clearButtonProps}\n isDisabled={isDisabled || clearButtonProps?.isDisabled}\n onClick={clearButtonOnClick}\n />\n ) : null;\n\n const resolvedEndAccessory =\n clearButton || endAccessory ? (\n <>\n {clearButton}\n {endAccessory}\n </>\n ) : undefined;\n\n return (\n <TextField\n ref={ref}\n value={value}\n isDisabled={isDisabled}\n type={TextFieldType.Search}\n className={twMerge('rounded-full', className)}\n startAccessory={\n startAccessory ?? (\n <Icon\n name={IconName.Search}\n size={IconSize.Md}\n color={IconColor.IconAlternative}\n />\n )\n }\n endAccessory={resolvedEndAccessory}\n {...props}\n />\n );\n },\n);\n\nTextFieldSearch.displayName = 'TextFieldSearch';\n"]}
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ //# sourceMappingURL=TextFieldSearch.types.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextFieldSearch.types.cjs","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/TextFieldSearch.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconProps } from '../ButtonIcon';\nimport type { TextFieldProps } from '../TextField';\n\nexport type TextFieldSearchProps = Omit<TextFieldProps, 'type'> & {\n /**\n * Click handler for the clear button. Use it to reset the controlled `value`.\n * Required: the clear button always renders when `value` is truthy.\n */\n clearButtonOnClick: React.MouseEventHandler<HTMLButtonElement>;\n /**\n * Additional props forwarded to the clear `ButtonIcon`. `ariaLabel` is\n * defaulted to `'Clear'` and can be overridden here to provide a localized\n * label.\n */\n clearButtonProps?: Partial<ButtonIconProps>;\n};\n"]}
@@ -0,0 +1,17 @@
1
+ /// <reference types="react" />
2
+ import type { ButtonIconProps } from "../ButtonIcon/index.cjs";
3
+ import type { TextFieldProps } from "../TextField/index.cjs";
4
+ export type TextFieldSearchProps = Omit<TextFieldProps, 'type'> & {
5
+ /**
6
+ * Click handler for the clear button. Use it to reset the controlled `value`.
7
+ * Required: the clear button always renders when `value` is truthy.
8
+ */
9
+ clearButtonOnClick: React.MouseEventHandler<HTMLButtonElement>;
10
+ /**
11
+ * Additional props forwarded to the clear `ButtonIcon`. `ariaLabel` is
12
+ * defaulted to `'Clear'` and can be overridden here to provide a localized
13
+ * label.
14
+ */
15
+ clearButtonProps?: Partial<ButtonIconProps>;
16
+ };
17
+ //# sourceMappingURL=TextFieldSearch.types.d.cts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextFieldSearch.types.d.cts","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/TextFieldSearch.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,cAAc,EAAE,+BAAqB;AAEnD,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IAChE;;;OAGG;IACH,kBAAkB,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/D;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CAC7C,CAAC"}
@@ -0,0 +1,17 @@
1
+ /// <reference types="react" />
2
+ import type { ButtonIconProps } from "../ButtonIcon/index.mjs";
3
+ import type { TextFieldProps } from "../TextField/index.mjs";
4
+ export type TextFieldSearchProps = Omit<TextFieldProps, 'type'> & {
5
+ /**
6
+ * Click handler for the clear button. Use it to reset the controlled `value`.
7
+ * Required: the clear button always renders when `value` is truthy.
8
+ */
9
+ clearButtonOnClick: React.MouseEventHandler<HTMLButtonElement>;
10
+ /**
11
+ * Additional props forwarded to the clear `ButtonIcon`. `ariaLabel` is
12
+ * defaulted to `'Clear'` and can be overridden here to provide a localized
13
+ * label.
14
+ */
15
+ clearButtonProps?: Partial<ButtonIconProps>;
16
+ };
17
+ //# sourceMappingURL=TextFieldSearch.types.d.mts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextFieldSearch.types.d.mts","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/TextFieldSearch.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,cAAc,EAAE,+BAAqB;AAEnD,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IAChE;;;OAGG;IACH,kBAAkB,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/D;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CAC7C,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=TextFieldSearch.types.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TextFieldSearch.types.mjs","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/TextFieldSearch.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonIconProps } from '../ButtonIcon';\nimport type { TextFieldProps } from '../TextField';\n\nexport type TextFieldSearchProps = Omit<TextFieldProps, 'type'> & {\n /**\n * Click handler for the clear button. Use it to reset the controlled `value`.\n * Required: the clear button always renders when `value` is truthy.\n */\n clearButtonOnClick: React.MouseEventHandler<HTMLButtonElement>;\n /**\n * Additional props forwarded to the clear `ButtonIcon`. `ariaLabel` is\n * defaulted to `'Clear'` and can be overridden here to provide a localized\n * label.\n */\n clearButtonProps?: Partial<ButtonIconProps>;\n};\n"]}
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.TextFieldSearch = void 0;
4
+ var TextFieldSearch_1 = require("./TextFieldSearch.cjs");
5
+ Object.defineProperty(exports, "TextFieldSearch", { enumerable: true, get: function () { return TextFieldSearch_1.TextFieldSearch; } });
6
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/index.ts"],"names":[],"mappings":";;;AAAA,yDAAoD;AAA3C,kHAAA,eAAe,OAAA","sourcesContent":["export { TextFieldSearch } from './TextFieldSearch';\nexport type { TextFieldSearchProps } from './TextFieldSearch.types';\n"]}
@@ -0,0 +1,3 @@
1
+ export { TextFieldSearch } from "./TextFieldSearch.cjs";
2
+ export type { TextFieldSearchProps } from "./TextFieldSearch.types.cjs";
3
+ //# sourceMappingURL=index.d.cts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,8BAA0B;AACpD,YAAY,EAAE,oBAAoB,EAAE,oCAAgC"}
@@ -0,0 +1,3 @@
1
+ export { TextFieldSearch } from "./TextFieldSearch.mjs";
2
+ export type { TextFieldSearchProps } from "./TextFieldSearch.types.mjs";
3
+ //# sourceMappingURL=index.d.mts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,8BAA0B;AACpD,YAAY,EAAE,oBAAoB,EAAE,oCAAgC"}
@@ -0,0 +1,2 @@
1
+ export { TextFieldSearch } from "./TextFieldSearch.mjs";
2
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/TextFieldSearch/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,8BAA0B","sourcesContent":["export { TextFieldSearch } from './TextFieldSearch';\nexport type { TextFieldSearchProps } from './TextFieldSearch.types';\n"]}
@@ -42,6 +42,8 @@ const renderSeverityAccessory = ({ severity, startAccessory, iconProps, }) => {
42
42
  return react_1.default.createElement(Icon_1.Icon, { name: name, color: color, size: types_1.IconSize.Lg, ...iconProps });
43
43
  };
44
44
  exports.Toast = (0, react_1.forwardRef)(({ actionButtonLabel, actionButtonOnClick, actionButtonProps, className, closeButtonProps, iconProps, onClose, severity = design_system_shared_1.ToastSeverity.Default, startAccessory, ...props }, ref) => {
45
+ // Only pass action props through when both the label and handler are set so
46
+ // BannerBase can keep its action button contract simple.
45
47
  const resolvedActionProps = actionButtonLabel && actionButtonOnClick
46
48
  ? {
47
49
  actionButtonLabel,
@@ -52,13 +54,17 @@ exports.Toast = (0, react_1.forwardRef)(({ actionButtonLabel, actionButtonOnClic
52
54
  },
53
55
  }
54
56
  : {};
57
+ // Derive the close button config from the Toast API, keeping the button
58
+ // visible whenever the consumer provides dismiss behavior or overrides.
55
59
  const resolvedCloseButtonProps = onClose || closeButtonProps
56
60
  ? {
57
61
  ariaLabel: 'Close toast',
58
62
  ...closeButtonProps,
59
63
  }
60
64
  : undefined;
61
- return (react_1.default.createElement(BannerBase_1.BannerBase, { ref: ref, ...resolvedActionProps, ...props, backgroundColor: design_system_shared_1.BoxBackgroundColor.BackgroundSection, borderColor: design_system_shared_1.BoxBorderColor.BorderMuted, borderWidth: 1, className: (0, tw_merge_1.twMerge)('rounded-xl', className), closeButtonProps: resolvedCloseButtonProps, onClose: onClose ? () => onClose() : undefined, startAccessory: renderSeverityAccessory({
65
+ // Toast reuses BannerBase so the web surface stays aligned with the shared
66
+ // banner layout and the React Native Toast API.
67
+ return (react_1.default.createElement(BannerBase_1.BannerBase, { ref: ref, ...resolvedActionProps, ...props, backgroundColor: design_system_shared_1.BoxBackgroundColor.BackgroundSection, borderColor: design_system_shared_1.BoxBorderColor.BorderMuted, borderWidth: 1, className: (0, tw_merge_1.twMerge)('rounded-xl', className), closeButtonProps: resolvedCloseButtonProps, onClose: onClose, startAccessory: renderSeverityAccessory({
62
68
  severity,
63
69
  startAccessory,
64
70
  iconProps,
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kFAKiD;AACjD,+CAA0C;AAE1C,iDAAuC;AACvC,uDAA+C;AAC/C,wDAA2C;AAC3C,4CAA+B;AAE/B,2DAA4D;AAG5D,MAAM,uBAAuB,GAAG,CAAC,EAC/B,QAAQ,EACR,cAAc,EACd,SAAS,GACqD,EAAE,EAAE;IAClE,IAAI,cAAc,KAAK,IAAI,IAAI,cAAc,KAAK,SAAS,EAAE;QAC3D,OAAO,cAAc,CAAC;KACvB;IAED,IAAI,CAAC,QAAQ,IAAI,QAAQ,KAAK,oCAAa,CAAC,OAAO,EAAE;QACnD,OAAO,SAAS,CAAC;KAClB;IAED,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,yCAAuB,CAAC,QAAQ,CAAC,CAAC;IAE1D,OAAO,8BAAC,WAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,gBAAQ,CAAC,EAAE,KAAM,SAAS,GAAI,CAAC;AAC9E,CAAC,CAAC;AAEW,QAAA,KAAK,GAAG,IAAA,kBAAU,EAC7B,CACE,EACE,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,SAAS,EACT,gBAAgB,EAChB,SAAS,EACT,OAAO,EACP,QAAQ,GAAG,oCAAa,CAAC,OAAO,EAChC,cAAc,EACd,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,mBAAmB,GACvB,iBAAiB,IAAI,mBAAmB;QACtC,CAAC,CAAC;YACE,iBAAiB;YACjB,mBAAmB;YACnB,iBAAiB,EAAE;gBACjB,IAAI,EAAE,iCAAU,CAAC,EAAE;gBACnB,GAAG,iBAAiB;aACrB;SACF;QACH,CAAC,CAAC,EAAE,CAAC;IAET,MAAM,wBAAwB,GAC5B,OAAO,IAAI,gBAAgB;QACzB,CAAC,CAAC;YACE,SAAS,EAAE,aAAa;YACxB,GAAG,gBAAgB;SACpB;QACH,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,CACL,8BAAC,uBAAU,IACT,GAAG,EAAE,GAAG,KACJ,mBAAmB,KACnB,KAAK,EACT,eAAe,EAAE,yCAAkB,CAAC,iBAAiB,EACrD,WAAW,EAAE,qCAAc,CAAC,WAAW,EACvC,WAAW,EAAE,CAAC,EACd,SAAS,EAAE,IAAA,kBAAO,EAAC,YAAY,EAAE,SAAS,CAAC,EAC3C,gBAAgB,EAAE,wBAAwB,EAC1C,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,SAAS,EAC9C,cAAc,EAAE,uBAAuB,CAAC;YACtC,QAAQ;YACR,cAAc;YACd,SAAS;SACV,CAAC,GACF,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,aAAK,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["import {\n BoxBackgroundColor,\n BoxBorderColor,\n ButtonSize,\n ToastSeverity,\n} 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 { TOAST_SEVERITY_ICON_MAP } from './Toast.constants';\nimport type { ToastProps } from './Toast.types';\n\nconst renderSeverityAccessory = ({\n severity,\n startAccessory,\n iconProps,\n}: Pick<ToastProps, 'severity' | 'startAccessory' | 'iconProps'>) => {\n if (startAccessory !== null && startAccessory !== undefined) {\n return startAccessory;\n }\n\n if (!severity || severity === ToastSeverity.Default) {\n return undefined;\n }\n\n const { name, color } = TOAST_SEVERITY_ICON_MAP[severity];\n\n return <Icon name={name} color={color} size={IconSize.Lg} {...iconProps} />;\n};\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(\n (\n {\n actionButtonLabel,\n actionButtonOnClick,\n actionButtonProps,\n className,\n closeButtonProps,\n iconProps,\n onClose,\n severity = ToastSeverity.Default,\n startAccessory,\n ...props\n },\n ref,\n ) => {\n const resolvedActionProps =\n actionButtonLabel && actionButtonOnClick\n ? {\n actionButtonLabel,\n actionButtonOnClick,\n actionButtonProps: {\n size: ButtonSize.Sm,\n ...actionButtonProps,\n },\n }\n : {};\n\n const resolvedCloseButtonProps =\n onClose || closeButtonProps\n ? {\n ariaLabel: 'Close toast',\n ...closeButtonProps,\n }\n : undefined;\n\n return (\n <BannerBase\n ref={ref}\n {...resolvedActionProps}\n {...props}\n backgroundColor={BoxBackgroundColor.BackgroundSection}\n borderColor={BoxBorderColor.BorderMuted}\n borderWidth={1}\n className={twMerge('rounded-xl', className)}\n closeButtonProps={resolvedCloseButtonProps}\n onClose={onClose ? () => onClose() : undefined}\n startAccessory={renderSeverityAccessory({\n severity,\n startAccessory,\n iconProps,\n })}\n />\n );\n },\n);\n\nToast.displayName = 'Toast';\n"]}
1
+ {"version":3,"file":"Toast.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kFAKiD;AACjD,+CAA0C;AAE1C,iDAAuC;AACvC,uDAA+C;AAC/C,wDAA2C;AAC3C,4CAA+B;AAE/B,2DAA4D;AAG5D,MAAM,uBAAuB,GAAG,CAAC,EAC/B,QAAQ,EACR,cAAc,EACd,SAAS,GACqD,EAAE,EAAE;IAClE,IAAI,cAAc,KAAK,IAAI,IAAI,cAAc,KAAK,SAAS,EAAE;QAC3D,OAAO,cAAc,CAAC;KACvB;IAED,IAAI,CAAC,QAAQ,IAAI,QAAQ,KAAK,oCAAa,CAAC,OAAO,EAAE;QACnD,OAAO,SAAS,CAAC;KAClB;IAED,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,yCAAuB,CAAC,QAAQ,CAAC,CAAC;IAE1D,OAAO,8BAAC,WAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,gBAAQ,CAAC,EAAE,KAAM,SAAS,GAAI,CAAC;AAC9E,CAAC,CAAC;AAEW,QAAA,KAAK,GAAG,IAAA,kBAAU,EAC7B,CACE,EACE,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,SAAS,EACT,gBAAgB,EAChB,SAAS,EACT,OAAO,EACP,QAAQ,GAAG,oCAAa,CAAC,OAAO,EAChC,cAAc,EACd,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,4EAA4E;IAC5E,yDAAyD;IACzD,MAAM,mBAAmB,GACvB,iBAAiB,IAAI,mBAAmB;QACtC,CAAC,CAAC;YACE,iBAAiB;YACjB,mBAAmB;YACnB,iBAAiB,EAAE;gBACjB,IAAI,EAAE,iCAAU,CAAC,EAAE;gBACnB,GAAG,iBAAiB;aACrB;SACF;QACH,CAAC,CAAC,EAAE,CAAC;IAET,wEAAwE;IACxE,wEAAwE;IACxE,MAAM,wBAAwB,GAC5B,OAAO,IAAI,gBAAgB;QACzB,CAAC,CAAC;YACE,SAAS,EAAE,aAAa;YACxB,GAAG,gBAAgB;SACpB;QACH,CAAC,CAAC,SAAS,CAAC;IAEhB,2EAA2E;IAC3E,gDAAgD;IAChD,OAAO,CACL,8BAAC,uBAAU,IACT,GAAG,EAAE,GAAG,KACJ,mBAAmB,KACnB,KAAK,EACT,eAAe,EAAE,yCAAkB,CAAC,iBAAiB,EACrD,WAAW,EAAE,qCAAc,CAAC,WAAW,EACvC,WAAW,EAAE,CAAC,EACd,SAAS,EAAE,IAAA,kBAAO,EAAC,YAAY,EAAE,SAAS,CAAC,EAC3C,gBAAgB,EAAE,wBAAwB,EAC1C,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,uBAAuB,CAAC;YACtC,QAAQ;YACR,cAAc;YACd,SAAS;SACV,CAAC,GACF,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,aAAK,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["import {\n BoxBackgroundColor,\n BoxBorderColor,\n ButtonSize,\n ToastSeverity,\n} 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 { TOAST_SEVERITY_ICON_MAP } from './Toast.constants';\nimport type { ToastProps } from './Toast.types';\n\nconst renderSeverityAccessory = ({\n severity,\n startAccessory,\n iconProps,\n}: Pick<ToastProps, 'severity' | 'startAccessory' | 'iconProps'>) => {\n if (startAccessory !== null && startAccessory !== undefined) {\n return startAccessory;\n }\n\n if (!severity || severity === ToastSeverity.Default) {\n return undefined;\n }\n\n const { name, color } = TOAST_SEVERITY_ICON_MAP[severity];\n\n return <Icon name={name} color={color} size={IconSize.Lg} {...iconProps} />;\n};\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(\n (\n {\n actionButtonLabel,\n actionButtonOnClick,\n actionButtonProps,\n className,\n closeButtonProps,\n iconProps,\n onClose,\n severity = ToastSeverity.Default,\n startAccessory,\n ...props\n },\n ref,\n ) => {\n // Only pass action props through when both the label and handler are set so\n // BannerBase can keep its action button contract simple.\n const resolvedActionProps =\n actionButtonLabel && actionButtonOnClick\n ? {\n actionButtonLabel,\n actionButtonOnClick,\n actionButtonProps: {\n size: ButtonSize.Sm,\n ...actionButtonProps,\n },\n }\n : {};\n\n // Derive the close button config from the Toast API, keeping the button\n // visible whenever the consumer provides dismiss behavior or overrides.\n const resolvedCloseButtonProps =\n onClose || closeButtonProps\n ? {\n ariaLabel: 'Close toast',\n ...closeButtonProps,\n }\n : undefined;\n\n // Toast reuses BannerBase so the web surface stays aligned with the shared\n // banner layout and the React Native Toast API.\n return (\n <BannerBase\n ref={ref}\n {...resolvedActionProps}\n {...props}\n backgroundColor={BoxBackgroundColor.BackgroundSection}\n borderColor={BoxBorderColor.BorderMuted}\n borderWidth={1}\n className={twMerge('rounded-xl', className)}\n closeButtonProps={resolvedCloseButtonProps}\n onClose={onClose}\n startAccessory={renderSeverityAccessory({\n severity,\n startAccessory,\n iconProps,\n })}\n />\n );\n },\n);\n\nToast.displayName = 'Toast';\n"]}
@@ -1,11 +1,13 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.TOAST_SEVERITY_ICON_MAP = exports.TOAST_ANIMATION_DURATION = exports.TOAST_VISIBILITY_DURATION = void 0;
3
+ exports.TOAST_SEVERITY_ICON_MAP = exports.TOAST_VISIBILITY_DURATION = exports.TOAST_ANIMATION_DURATION = void 0;
4
4
  const design_system_shared_1 = require("@metamask-previews/design-system-shared");
5
5
  const types_1 = require("../../types/index.cjs");
6
- exports.TOAST_VISIBILITY_DURATION = 2750;
7
- /** Duration of the enter/exit CSS transition in milliseconds. */
8
- exports.TOAST_ANIMATION_DURATION = 200;
6
+ var design_system_shared_2 = require("@metamask-previews/design-system-shared");
7
+ Object.defineProperty(exports, "TOAST_ANIMATION_DURATION", { enumerable: true, get: function () { return design_system_shared_2.TOAST_ANIMATION_DURATION; } });
8
+ Object.defineProperty(exports, "TOAST_VISIBILITY_DURATION", { enumerable: true, get: function () { return design_system_shared_2.TOAST_VISIBILITY_DURATION; } });
9
+ // TODO: Replace this map with a web IconAlert component once the shared
10
+ // alert-icon primitive exists in React.
9
11
  exports.TOAST_SEVERITY_ICON_MAP = {
10
12
  [design_system_shared_1.ToastSeverity.Success]: {
11
13
  name: types_1.IconName.Confirmation,
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.constants.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":";;;AAAA,kFAAwE;AAExE,iDAAkD;AAErC,QAAA,yBAAyB,GAAG,IAAI,CAAC;AAC9C,iEAAiE;AACpD,QAAA,wBAAwB,GAAG,GAAG,CAAC;AAE/B,QAAA,uBAAuB,GAAG;IACrC,CAAC,oCAAa,CAAC,OAAO,CAAC,EAAE;QACvB,IAAI,EAAE,gBAAQ,CAAC,YAAY;QAC3B,KAAK,EAAE,iBAAS,CAAC,cAAc;KAChC;IACD,CAAC,oCAAa,CAAC,OAAO,CAAC,EAAE;QACvB,IAAI,EAAE,gBAAQ,CAAC,MAAM;QACrB,KAAK,EAAE,iBAAS,CAAC,cAAc;KAChC;IACD,CAAC,oCAAa,CAAC,MAAM,CAAC,EAAE;QACtB,IAAI,EAAE,gBAAQ,CAAC,MAAM;QACrB,KAAK,EAAE,iBAAS,CAAC,YAAY;KAC9B;CACO,CAAC","sourcesContent":["import { ToastSeverity } from '@metamask-previews/design-system-shared';\n\nimport { IconColor, IconName } from '../../types';\n\nexport const TOAST_VISIBILITY_DURATION = 2750;\n/** Duration of the enter/exit CSS transition in milliseconds. */\nexport const TOAST_ANIMATION_DURATION = 200;\n\nexport const TOAST_SEVERITY_ICON_MAP = {\n [ToastSeverity.Success]: {\n name: IconName.Confirmation,\n color: IconColor.SuccessDefault,\n },\n [ToastSeverity.Warning]: {\n name: IconName.Danger,\n color: IconColor.WarningDefault,\n },\n [ToastSeverity.Danger]: {\n name: IconName.Danger,\n color: IconColor.ErrorDefault,\n },\n} as const;\n"]}
1
+ {"version":3,"file":"Toast.constants.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":";;;AAAA,kFAAwE;AAExE,iDAAkD;AAElD,gFAGiD;AAF/C,gIAAA,wBAAwB,OAAA;AACxB,iIAAA,yBAAyB,OAAA;AAG3B,wEAAwE;AACxE,wCAAwC;AAC3B,QAAA,uBAAuB,GAAG;IACrC,CAAC,oCAAa,CAAC,OAAO,CAAC,EAAE;QACvB,IAAI,EAAE,gBAAQ,CAAC,YAAY;QAC3B,KAAK,EAAE,iBAAS,CAAC,cAAc;KAChC;IACD,CAAC,oCAAa,CAAC,OAAO,CAAC,EAAE;QACvB,IAAI,EAAE,gBAAQ,CAAC,MAAM;QACrB,KAAK,EAAE,iBAAS,CAAC,cAAc;KAChC;IACD,CAAC,oCAAa,CAAC,MAAM,CAAC,EAAE;QACtB,IAAI,EAAE,gBAAQ,CAAC,MAAM;QACrB,KAAK,EAAE,iBAAS,CAAC,YAAY;KAC9B;CACO,CAAC","sourcesContent":["import { ToastSeverity } from '@metamask-previews/design-system-shared';\n\nimport { IconColor, IconName } from '../../types';\n\nexport {\n TOAST_ANIMATION_DURATION,\n TOAST_VISIBILITY_DURATION,\n} from '@metamask-previews/design-system-shared';\n\n// TODO: Replace this map with a web IconAlert component once the shared\n// alert-icon primitive exists in React.\nexport const TOAST_SEVERITY_ICON_MAP = {\n [ToastSeverity.Success]: {\n name: IconName.Confirmation,\n color: IconColor.SuccessDefault,\n },\n [ToastSeverity.Warning]: {\n name: IconName.Danger,\n color: IconColor.WarningDefault,\n },\n [ToastSeverity.Danger]: {\n name: IconName.Danger,\n color: IconColor.ErrorDefault,\n },\n} as const;\n"]}
@@ -1,6 +1,4 @@
1
- export declare const TOAST_VISIBILITY_DURATION = 2750;
2
- /** Duration of the enter/exit CSS transition in milliseconds. */
3
- export declare const TOAST_ANIMATION_DURATION = 200;
1
+ export { TOAST_ANIMATION_DURATION, TOAST_VISIBILITY_DURATION, } from "@metamask-previews/design-system-shared";
4
2
  export declare const TOAST_SEVERITY_ICON_MAP: {
5
3
  readonly success: {
6
4
  readonly name: "Confirmation";
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.constants.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,yBAAyB,OAAO,CAAC;AAC9C,iEAAiE;AACjE,eAAO,MAAM,wBAAwB,MAAM,CAAC;AAE5C,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;CAa1B,CAAC"}
1
+ {"version":3,"file":"Toast.constants.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAIA,OAAO,EACL,wBAAwB,EACxB,yBAAyB,GAC1B,gDAAgD;AAIjD,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;CAa1B,CAAC"}
@@ -1,6 +1,4 @@
1
- export declare const TOAST_VISIBILITY_DURATION = 2750;
2
- /** Duration of the enter/exit CSS transition in milliseconds. */
3
- export declare const TOAST_ANIMATION_DURATION = 200;
1
+ export { TOAST_ANIMATION_DURATION, TOAST_VISIBILITY_DURATION, } from "@metamask-previews/design-system-shared";
4
2
  export declare const TOAST_SEVERITY_ICON_MAP: {
5
3
  readonly success: {
6
4
  readonly name: "Confirmation";
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.constants.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,yBAAyB,OAAO,CAAC;AAC9C,iEAAiE;AACjE,eAAO,MAAM,wBAAwB,MAAM,CAAC;AAE5C,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;CAa1B,CAAC"}
1
+ {"version":3,"file":"Toast.constants.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAIA,OAAO,EACL,wBAAwB,EACxB,yBAAyB,GAC1B,gDAAgD;AAIjD,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;CAa1B,CAAC"}
@@ -1,8 +1,8 @@
1
1
  import { ToastSeverity } from "@metamask-previews/design-system-shared";
2
2
  import { IconColor, IconName } from "../../types/index.mjs";
3
- export const TOAST_VISIBILITY_DURATION = 2750;
4
- /** Duration of the enter/exit CSS transition in milliseconds. */
5
- export const TOAST_ANIMATION_DURATION = 200;
3
+ export { TOAST_ANIMATION_DURATION, TOAST_VISIBILITY_DURATION } from "@metamask-previews/design-system-shared";
4
+ // TODO: Replace this map with a web IconAlert component once the shared
5
+ // alert-icon primitive exists in React.
6
6
  export const TOAST_SEVERITY_ICON_MAP = {
7
7
  [ToastSeverity.Success]: {
8
8
  name: IconName.Confirmation,
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.constants.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,gDAAgD;AAExE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,8BAAoB;AAElD,MAAM,CAAC,MAAM,yBAAyB,GAAG,IAAI,CAAC;AAC9C,iEAAiE;AACjE,MAAM,CAAC,MAAM,wBAAwB,GAAG,GAAG,CAAC;AAE5C,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE;QACvB,IAAI,EAAE,QAAQ,CAAC,YAAY;QAC3B,KAAK,EAAE,SAAS,CAAC,cAAc;KAChC;IACD,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE;QACvB,IAAI,EAAE,QAAQ,CAAC,MAAM;QACrB,KAAK,EAAE,SAAS,CAAC,cAAc;KAChC;IACD,CAAC,aAAa,CAAC,MAAM,CAAC,EAAE;QACtB,IAAI,EAAE,QAAQ,CAAC,MAAM;QACrB,KAAK,EAAE,SAAS,CAAC,YAAY;KAC9B;CACO,CAAC","sourcesContent":["import { ToastSeverity } from '@metamask-previews/design-system-shared';\n\nimport { IconColor, IconName } from '../../types';\n\nexport const TOAST_VISIBILITY_DURATION = 2750;\n/** Duration of the enter/exit CSS transition in milliseconds. */\nexport const TOAST_ANIMATION_DURATION = 200;\n\nexport const TOAST_SEVERITY_ICON_MAP = {\n [ToastSeverity.Success]: {\n name: IconName.Confirmation,\n color: IconColor.SuccessDefault,\n },\n [ToastSeverity.Warning]: {\n name: IconName.Danger,\n color: IconColor.WarningDefault,\n },\n [ToastSeverity.Danger]: {\n name: IconName.Danger,\n color: IconColor.ErrorDefault,\n },\n} as const;\n"]}
1
+ {"version":3,"file":"Toast.constants.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,gDAAgD;AAExE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,8BAAoB;AAElD,OAAO,EACL,wBAAwB,EACxB,yBAAyB,EAC1B,gDAAgD;AAEjD,wEAAwE;AACxE,wCAAwC;AACxC,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE;QACvB,IAAI,EAAE,QAAQ,CAAC,YAAY;QAC3B,KAAK,EAAE,SAAS,CAAC,cAAc;KAChC;IACD,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE;QACvB,IAAI,EAAE,QAAQ,CAAC,MAAM;QACrB,KAAK,EAAE,SAAS,CAAC,cAAc;KAChC;IACD,CAAC,aAAa,CAAC,MAAM,CAAC,EAAE;QACtB,IAAI,EAAE,QAAQ,CAAC,MAAM;QACrB,KAAK,EAAE,SAAS,CAAC,YAAY;KAC9B;CACO,CAAC","sourcesContent":["import { ToastSeverity } from '@metamask-previews/design-system-shared';\n\nimport { IconColor, IconName } from '../../types';\n\nexport {\n TOAST_ANIMATION_DURATION,\n TOAST_VISIBILITY_DURATION,\n} from '@metamask-previews/design-system-shared';\n\n// TODO: Replace this map with a web IconAlert component once the shared\n// alert-icon primitive exists in React.\nexport const TOAST_SEVERITY_ICON_MAP = {\n [ToastSeverity.Success]: {\n name: IconName.Confirmation,\n color: IconColor.SuccessDefault,\n },\n [ToastSeverity.Warning]: {\n name: IconName.Danger,\n color: IconColor.WarningDefault,\n },\n [ToastSeverity.Danger]: {\n name: IconName.Danger,\n color: IconColor.ErrorDefault,\n },\n} as const;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAqB,cAAc;AAQ1C,OAAO,KAAK,EAAE,UAAU,EAAE,0BAAsB;AAoBhD,eAAO,MAAM,KAAK,gGAuDjB,CAAC"}
1
+ {"version":3,"file":"Toast.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAqB,cAAc;AAQ1C,OAAO,KAAK,EAAE,UAAU,EAAE,0BAAsB;AAoBhD,eAAO,MAAM,KAAK,gGA6DjB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAqB,cAAc;AAQ1C,OAAO,KAAK,EAAE,UAAU,EAAE,0BAAsB;AAoBhD,eAAO,MAAM,KAAK,gGAuDjB,CAAC"}
1
+ {"version":3,"file":"Toast.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAqB,cAAc;AAQ1C,OAAO,KAAK,EAAE,UAAU,EAAE,0BAAsB;AAoBhD,eAAO,MAAM,KAAK,gGA6DjB,CAAC"}
@@ -23,6 +23,8 @@ const renderSeverityAccessory = ({ severity, startAccessory, iconProps, }) => {
23
23
  return React.createElement(Icon, { name: name, color: color, size: IconSize.Lg, ...iconProps });
24
24
  };
25
25
  export const Toast = forwardRef(({ actionButtonLabel, actionButtonOnClick, actionButtonProps, className, closeButtonProps, iconProps, onClose, severity = ToastSeverity.Default, startAccessory, ...props }, ref) => {
26
+ // Only pass action props through when both the label and handler are set so
27
+ // BannerBase can keep its action button contract simple.
26
28
  const resolvedActionProps = actionButtonLabel && actionButtonOnClick
27
29
  ? {
28
30
  actionButtonLabel,
@@ -33,13 +35,17 @@ export const Toast = forwardRef(({ actionButtonLabel, actionButtonOnClick, actio
33
35
  },
34
36
  }
35
37
  : {};
38
+ // Derive the close button config from the Toast API, keeping the button
39
+ // visible whenever the consumer provides dismiss behavior or overrides.
36
40
  const resolvedCloseButtonProps = onClose || closeButtonProps
37
41
  ? {
38
42
  ariaLabel: 'Close toast',
39
43
  ...closeButtonProps,
40
44
  }
41
45
  : undefined;
42
- return (React.createElement(BannerBase, { ref: ref, ...resolvedActionProps, ...props, backgroundColor: BoxBackgroundColor.BackgroundSection, borderColor: BoxBorderColor.BorderMuted, borderWidth: 1, className: twMerge('rounded-xl', className), closeButtonProps: resolvedCloseButtonProps, onClose: onClose ? () => onClose() : undefined, startAccessory: renderSeverityAccessory({
46
+ // Toast reuses BannerBase so the web surface stays aligned with the shared
47
+ // banner layout and the React Native Toast API.
48
+ return (React.createElement(BannerBase, { ref: ref, ...resolvedActionProps, ...props, backgroundColor: BoxBackgroundColor.BackgroundSection, borderColor: BoxBorderColor.BorderMuted, borderWidth: 1, className: twMerge('rounded-xl', className), closeButtonProps: resolvedCloseButtonProps, onClose: onClose, startAccessory: renderSeverityAccessory({
43
49
  severity,
44
50
  startAccessory,
45
51
  iconProps,
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,aAAa,EACd,gDAAgD;AACjD,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,EAAE,uBAAuB,EAAE,8BAA0B;AAG5D,MAAM,uBAAuB,GAAG,CAAC,EAC/B,QAAQ,EACR,cAAc,EACd,SAAS,GACqD,EAAE,EAAE;IAClE,IAAI,cAAc,KAAK,IAAI,IAAI,cAAc,KAAK,SAAS,EAAE;QAC3D,OAAO,cAAc,CAAC;KACvB;IAED,IAAI,CAAC,QAAQ,IAAI,QAAQ,KAAK,aAAa,CAAC,OAAO,EAAE;QACnD,OAAO,SAAS,CAAC;KAClB;IAED,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,uBAAuB,CAAC,QAAQ,CAAC,CAAC;IAE1D,OAAO,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,KAAM,SAAS,GAAI,CAAC;AAC9E,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EACE,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,SAAS,EACT,gBAAgB,EAChB,SAAS,EACT,OAAO,EACP,QAAQ,GAAG,aAAa,CAAC,OAAO,EAChC,cAAc,EACd,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,mBAAmB,GACvB,iBAAiB,IAAI,mBAAmB;QACtC,CAAC,CAAC;YACE,iBAAiB;YACjB,mBAAmB;YACnB,iBAAiB,EAAE;gBACjB,IAAI,EAAE,UAAU,CAAC,EAAE;gBACnB,GAAG,iBAAiB;aACrB;SACF;QACH,CAAC,CAAC,EAAE,CAAC;IAET,MAAM,wBAAwB,GAC5B,OAAO,IAAI,gBAAgB;QACzB,CAAC,CAAC;YACE,SAAS,EAAE,aAAa;YACxB,GAAG,gBAAgB;SACpB;QACH,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,CACL,oBAAC,UAAU,IACT,GAAG,EAAE,GAAG,KACJ,mBAAmB,KACnB,KAAK,EACT,eAAe,EAAE,kBAAkB,CAAC,iBAAiB,EACrD,WAAW,EAAE,cAAc,CAAC,WAAW,EACvC,WAAW,EAAE,CAAC,EACd,SAAS,EAAE,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC,EAC3C,gBAAgB,EAAE,wBAAwB,EAC1C,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,SAAS,EAC9C,cAAc,EAAE,uBAAuB,CAAC;YACtC,QAAQ;YACR,cAAc;YACd,SAAS;SACV,CAAC,GACF,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["import {\n BoxBackgroundColor,\n BoxBorderColor,\n ButtonSize,\n ToastSeverity,\n} 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 { TOAST_SEVERITY_ICON_MAP } from './Toast.constants';\nimport type { ToastProps } from './Toast.types';\n\nconst renderSeverityAccessory = ({\n severity,\n startAccessory,\n iconProps,\n}: Pick<ToastProps, 'severity' | 'startAccessory' | 'iconProps'>) => {\n if (startAccessory !== null && startAccessory !== undefined) {\n return startAccessory;\n }\n\n if (!severity || severity === ToastSeverity.Default) {\n return undefined;\n }\n\n const { name, color } = TOAST_SEVERITY_ICON_MAP[severity];\n\n return <Icon name={name} color={color} size={IconSize.Lg} {...iconProps} />;\n};\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(\n (\n {\n actionButtonLabel,\n actionButtonOnClick,\n actionButtonProps,\n className,\n closeButtonProps,\n iconProps,\n onClose,\n severity = ToastSeverity.Default,\n startAccessory,\n ...props\n },\n ref,\n ) => {\n const resolvedActionProps =\n actionButtonLabel && actionButtonOnClick\n ? {\n actionButtonLabel,\n actionButtonOnClick,\n actionButtonProps: {\n size: ButtonSize.Sm,\n ...actionButtonProps,\n },\n }\n : {};\n\n const resolvedCloseButtonProps =\n onClose || closeButtonProps\n ? {\n ariaLabel: 'Close toast',\n ...closeButtonProps,\n }\n : undefined;\n\n return (\n <BannerBase\n ref={ref}\n {...resolvedActionProps}\n {...props}\n backgroundColor={BoxBackgroundColor.BackgroundSection}\n borderColor={BoxBorderColor.BorderMuted}\n borderWidth={1}\n className={twMerge('rounded-xl', className)}\n closeButtonProps={resolvedCloseButtonProps}\n onClose={onClose ? () => onClose() : undefined}\n startAccessory={renderSeverityAccessory({\n severity,\n startAccessory,\n iconProps,\n })}\n />\n );\n },\n);\n\nToast.displayName = 'Toast';\n"]}
1
+ {"version":3,"file":"Toast.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EACL,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,aAAa,EACd,gDAAgD;AACjD,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,EAAE,uBAAuB,EAAE,8BAA0B;AAG5D,MAAM,uBAAuB,GAAG,CAAC,EAC/B,QAAQ,EACR,cAAc,EACd,SAAS,GACqD,EAAE,EAAE;IAClE,IAAI,cAAc,KAAK,IAAI,IAAI,cAAc,KAAK,SAAS,EAAE;QAC3D,OAAO,cAAc,CAAC;KACvB;IAED,IAAI,CAAC,QAAQ,IAAI,QAAQ,KAAK,aAAa,CAAC,OAAO,EAAE;QACnD,OAAO,SAAS,CAAC;KAClB;IAED,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,uBAAuB,CAAC,QAAQ,CAAC,CAAC;IAE1D,OAAO,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,KAAM,SAAS,GAAI,CAAC;AAC9E,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EACE,iBAAiB,EACjB,mBAAmB,EACnB,iBAAiB,EACjB,SAAS,EACT,gBAAgB,EAChB,SAAS,EACT,OAAO,EACP,QAAQ,GAAG,aAAa,CAAC,OAAO,EAChC,cAAc,EACd,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,4EAA4E;IAC5E,yDAAyD;IACzD,MAAM,mBAAmB,GACvB,iBAAiB,IAAI,mBAAmB;QACtC,CAAC,CAAC;YACE,iBAAiB;YACjB,mBAAmB;YACnB,iBAAiB,EAAE;gBACjB,IAAI,EAAE,UAAU,CAAC,EAAE;gBACnB,GAAG,iBAAiB;aACrB;SACF;QACH,CAAC,CAAC,EAAE,CAAC;IAET,wEAAwE;IACxE,wEAAwE;IACxE,MAAM,wBAAwB,GAC5B,OAAO,IAAI,gBAAgB;QACzB,CAAC,CAAC;YACE,SAAS,EAAE,aAAa;YACxB,GAAG,gBAAgB;SACpB;QACH,CAAC,CAAC,SAAS,CAAC;IAEhB,2EAA2E;IAC3E,gDAAgD;IAChD,OAAO,CACL,oBAAC,UAAU,IACT,GAAG,EAAE,GAAG,KACJ,mBAAmB,KACnB,KAAK,EACT,eAAe,EAAE,kBAAkB,CAAC,iBAAiB,EACrD,WAAW,EAAE,cAAc,CAAC,WAAW,EACvC,WAAW,EAAE,CAAC,EACd,SAAS,EAAE,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC,EAC3C,gBAAgB,EAAE,wBAAwB,EAC1C,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,uBAAuB,CAAC;YACtC,QAAQ;YACR,cAAc;YACd,SAAS;SACV,CAAC,GACF,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["import {\n BoxBackgroundColor,\n BoxBorderColor,\n ButtonSize,\n ToastSeverity,\n} 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 { TOAST_SEVERITY_ICON_MAP } from './Toast.constants';\nimport type { ToastProps } from './Toast.types';\n\nconst renderSeverityAccessory = ({\n severity,\n startAccessory,\n iconProps,\n}: Pick<ToastProps, 'severity' | 'startAccessory' | 'iconProps'>) => {\n if (startAccessory !== null && startAccessory !== undefined) {\n return startAccessory;\n }\n\n if (!severity || severity === ToastSeverity.Default) {\n return undefined;\n }\n\n const { name, color } = TOAST_SEVERITY_ICON_MAP[severity];\n\n return <Icon name={name} color={color} size={IconSize.Lg} {...iconProps} />;\n};\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(\n (\n {\n actionButtonLabel,\n actionButtonOnClick,\n actionButtonProps,\n className,\n closeButtonProps,\n iconProps,\n onClose,\n severity = ToastSeverity.Default,\n startAccessory,\n ...props\n },\n ref,\n ) => {\n // Only pass action props through when both the label and handler are set so\n // BannerBase can keep its action button contract simple.\n const resolvedActionProps =\n actionButtonLabel && actionButtonOnClick\n ? {\n actionButtonLabel,\n actionButtonOnClick,\n actionButtonProps: {\n size: ButtonSize.Sm,\n ...actionButtonProps,\n },\n }\n : {};\n\n // Derive the close button config from the Toast API, keeping the button\n // visible whenever the consumer provides dismiss behavior or overrides.\n const resolvedCloseButtonProps =\n onClose || closeButtonProps\n ? {\n ariaLabel: 'Close toast',\n ...closeButtonProps,\n }\n : undefined;\n\n // Toast reuses BannerBase so the web surface stays aligned with the shared\n // banner layout and the React Native Toast API.\n return (\n <BannerBase\n ref={ref}\n {...resolvedActionProps}\n {...props}\n backgroundColor={BoxBackgroundColor.BackgroundSection}\n borderColor={BoxBorderColor.BorderMuted}\n borderWidth={1}\n className={twMerge('rounded-xl', className)}\n closeButtonProps={resolvedCloseButtonProps}\n onClose={onClose}\n startAccessory={renderSeverityAccessory({\n severity,\n startAccessory,\n iconProps,\n })}\n />\n );\n },\n);\n\nToast.displayName = 'Toast';\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.types.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ToastPropsShared } from '@metamask-previews/design-system-shared';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon';\n\ntype ToastCloseButtonProps = Omit<\n NonNullable<BannerBaseProps['closeButtonProps']>,\n 'onClick'\n>;\n\n/**\n * Props for the Toast visual component.\n * Extends the platform BannerBase props with severity and an icon override.\n * `onClose` is simplified to `() => void` (no MouseEvent) to align with the\n * React Native API and the imperative `toast()` pattern.\n */\nexport type ToastProps = Omit<BannerBaseProps, 'closeButtonProps' | 'onClose'> &\n ToastPropsShared & {\n /**\n * Optional handler called when the close button is pressed.\n * When provided, a close button is shown.\n */\n onClose?: () => void;\n /**\n * Optional props passed to the severity `Icon`.\n * Only used when `severity` is not `Default` and `startAccessory` is not provided.\n */\n iconProps?: Omit<IconProps, 'name' | 'color'>;\n /**\n * Optional props for the close `ButtonIcon`.\n * `ariaLabel` defaults to `'Close toast'`.\n */\n closeButtonProps?: ToastCloseButtonProps;\n };\n\n/**\n * Options passed to the imperative `toast(...)` API.\n */\nexport type ToastOptions = ToastProps & {\n /**\n * When true the toast stays visible until explicitly dismissed.\n * Defaults to false.\n */\n hasNoTimeout?: boolean;\n};\n\n/**\n * Imperative handle exposed by `<Toaster ref={...} />`.\n */\nexport type ToasterRef = {\n showToast: (options: ToastOptions) => void;\n closeToast: () => void;\n};\n\n/**\n * Props for the `<Toaster />` container component.\n */\nexport type ToasterProps = {\n /**\n * Optional extra CSS classes applied to the fixed outer container.\n */\n className?: string;\n} & Omit<React.HTMLAttributes<HTMLDivElement>, 'style'>;\n"]}
1
+ {"version":3,"file":"Toast.types.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ToastPropsShared } from '@metamask-previews/design-system-shared';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon';\n\ntype ToastCloseButtonProps = Omit<\n NonNullable<BannerBaseProps['closeButtonProps']>,\n 'onClick'\n>;\n\n/**\n * Props for the Toast visual component.\n * Extends the platform BannerBase props with severity and an icon override.\n * `onClose` is simplified to `() => void` (no MouseEvent) to align with the\n * React Native API and the imperative `toast()` pattern.\n */\nexport type ToastProps = Omit<BannerBaseProps, 'closeButtonProps' | 'onClose'> &\n ToastPropsShared & {\n /**\n * Optional handler called when the close button is pressed.\n * When provided, a close button is shown.\n */\n onClose?: () => void;\n /**\n * Optional props passed to the severity `Icon`.\n * Only used when `severity` is not `Default` and `startAccessory` is not provided.\n */\n iconProps?: Omit<IconProps, 'name' | 'color'>;\n /**\n * Optional props for the close `ButtonIcon`.\n * `ariaLabel` defaults to `'Close toast'`.\n */\n closeButtonProps?: ToastCloseButtonProps;\n /**\n * Optional test identifier forwarded to the root Toast element.\n */\n 'data-testid'?: string;\n };\n\n/**\n * Options passed to the imperative `toast(...)` API.\n */\nexport type ToastOptions = ToastProps & {\n /**\n * When true the toast stays visible until explicitly dismissed.\n * Defaults to false.\n */\n hasNoTimeout?: boolean;\n};\n\n/**\n * Imperative handle exposed by `<Toaster ref={...} />`.\n */\nexport type ToasterRef = {\n showToast: (options: ToastOptions) => void;\n closeToast: () => void;\n};\n\n/**\n * Props for the `<Toaster />` container component.\n */\nexport type ToasterProps = {\n /**\n * Optional extra CSS classes applied to the fixed outer container.\n */\n className?: string;\n} & Omit<React.HTMLAttributes<HTMLDivElement>, 'style'>;\n"]}
@@ -25,6 +25,10 @@ export type ToastProps = Omit<BannerBaseProps, 'closeButtonProps' | 'onClose'> &
25
25
  * `ariaLabel` defaults to `'Close toast'`.
26
26
  */
27
27
  closeButtonProps?: ToastCloseButtonProps;
28
+ /**
29
+ * Optional test identifier forwarded to the root Toast element.
30
+ */
31
+ 'data-testid'?: string;
28
32
  };
29
33
  /**
30
34
  * Options passed to the imperative `toast(...)` API.
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.types.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gDAAgD;AAEhF,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,KAAK,qBAAqB,GAAG,IAAI,CAC/B,WAAW,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC,EAChD,SAAS,CACV,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,kBAAkB,GAAG,SAAS,CAAC,GAC5E,gBAAgB,GAAG;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC;IAC9C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;CAC1C,CAAC;AAEJ;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,GAAG;IACtC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,SAAS,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC3C,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC"}
1
+ {"version":3,"file":"Toast.types.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gDAAgD;AAEhF,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,KAAK,qBAAqB,GAAG,IAAI,CAC/B,WAAW,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC,EAChD,SAAS,CACV,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,kBAAkB,GAAG,SAAS,CAAC,GAC5E,gBAAgB,GAAG;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC;IAC9C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEJ;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,GAAG;IACtC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,SAAS,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC3C,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC"}
@@ -25,6 +25,10 @@ export type ToastProps = Omit<BannerBaseProps, 'closeButtonProps' | 'onClose'> &
25
25
  * `ariaLabel` defaults to `'Close toast'`.
26
26
  */
27
27
  closeButtonProps?: ToastCloseButtonProps;
28
+ /**
29
+ * Optional test identifier forwarded to the root Toast element.
30
+ */
31
+ 'data-testid'?: string;
28
32
  };
29
33
  /**
30
34
  * Options passed to the imperative `toast(...)` API.
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.types.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gDAAgD;AAEhF,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,KAAK,qBAAqB,GAAG,IAAI,CAC/B,WAAW,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC,EAChD,SAAS,CACV,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,kBAAkB,GAAG,SAAS,CAAC,GAC5E,gBAAgB,GAAG;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC;IAC9C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;CAC1C,CAAC;AAEJ;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,GAAG;IACtC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,SAAS,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC3C,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC"}
1
+ {"version":3,"file":"Toast.types.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gDAAgD;AAEhF,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,0BAAgB;AAEzC,KAAK,qBAAqB,GAAG,IAAI,CAC/B,WAAW,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC,EAChD,SAAS,CACV,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,EAAE,kBAAkB,GAAG,SAAS,CAAC,GAC5E,gBAAgB,GAAG;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC;IAC9C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,qBAAqB,CAAC;IACzC;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEJ;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,GAAG;IACtC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,SAAS,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC3C,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.types.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ToastPropsShared } from '@metamask-previews/design-system-shared';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon';\n\ntype ToastCloseButtonProps = Omit<\n NonNullable<BannerBaseProps['closeButtonProps']>,\n 'onClick'\n>;\n\n/**\n * Props for the Toast visual component.\n * Extends the platform BannerBase props with severity and an icon override.\n * `onClose` is simplified to `() => void` (no MouseEvent) to align with the\n * React Native API and the imperative `toast()` pattern.\n */\nexport type ToastProps = Omit<BannerBaseProps, 'closeButtonProps' | 'onClose'> &\n ToastPropsShared & {\n /**\n * Optional handler called when the close button is pressed.\n * When provided, a close button is shown.\n */\n onClose?: () => void;\n /**\n * Optional props passed to the severity `Icon`.\n * Only used when `severity` is not `Default` and `startAccessory` is not provided.\n */\n iconProps?: Omit<IconProps, 'name' | 'color'>;\n /**\n * Optional props for the close `ButtonIcon`.\n * `ariaLabel` defaults to `'Close toast'`.\n */\n closeButtonProps?: ToastCloseButtonProps;\n };\n\n/**\n * Options passed to the imperative `toast(...)` API.\n */\nexport type ToastOptions = ToastProps & {\n /**\n * When true the toast stays visible until explicitly dismissed.\n * Defaults to false.\n */\n hasNoTimeout?: boolean;\n};\n\n/**\n * Imperative handle exposed by `<Toaster ref={...} />`.\n */\nexport type ToasterRef = {\n showToast: (options: ToastOptions) => void;\n closeToast: () => void;\n};\n\n/**\n * Props for the `<Toaster />` container component.\n */\nexport type ToasterProps = {\n /**\n * Optional extra CSS classes applied to the fixed outer container.\n */\n className?: string;\n} & Omit<React.HTMLAttributes<HTMLDivElement>, 'style'>;\n"]}
1
+ {"version":3,"file":"Toast.types.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ToastPropsShared } from '@metamask-previews/design-system-shared';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon';\n\ntype ToastCloseButtonProps = Omit<\n NonNullable<BannerBaseProps['closeButtonProps']>,\n 'onClick'\n>;\n\n/**\n * Props for the Toast visual component.\n * Extends the platform BannerBase props with severity and an icon override.\n * `onClose` is simplified to `() => void` (no MouseEvent) to align with the\n * React Native API and the imperative `toast()` pattern.\n */\nexport type ToastProps = Omit<BannerBaseProps, 'closeButtonProps' | 'onClose'> &\n ToastPropsShared & {\n /**\n * Optional handler called when the close button is pressed.\n * When provided, a close button is shown.\n */\n onClose?: () => void;\n /**\n * Optional props passed to the severity `Icon`.\n * Only used when `severity` is not `Default` and `startAccessory` is not provided.\n */\n iconProps?: Omit<IconProps, 'name' | 'color'>;\n /**\n * Optional props for the close `ButtonIcon`.\n * `ariaLabel` defaults to `'Close toast'`.\n */\n closeButtonProps?: ToastCloseButtonProps;\n /**\n * Optional test identifier forwarded to the root Toast element.\n */\n 'data-testid'?: string;\n };\n\n/**\n * Options passed to the imperative `toast(...)` API.\n */\nexport type ToastOptions = ToastProps & {\n /**\n * When true the toast stays visible until explicitly dismissed.\n * Defaults to false.\n */\n hasNoTimeout?: boolean;\n};\n\n/**\n * Imperative handle exposed by `<Toaster ref={...} />`.\n */\nexport type ToasterRef = {\n showToast: (options: ToastOptions) => void;\n closeToast: () => void;\n};\n\n/**\n * Props for the `<Toaster />` container component.\n */\nexport type ToasterProps = {\n /**\n * Optional extra CSS classes applied to the fixed outer container.\n */\n className?: string;\n} & Omit<React.HTMLAttributes<HTMLDivElement>, 'style'>;\n"]}