@metamask/design-system-react-native 0.36.0 → 0.37.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +16 -1
- package/dist/components/Toast/Toast.cjs +12 -3
- package/dist/components/Toast/Toast.cjs.map +1 -1
- package/dist/components/Toast/Toast.constants.cjs +10 -2
- package/dist/components/Toast/Toast.constants.cjs.map +1 -1
- package/dist/components/Toast/Toast.constants.d.cts +7 -1
- package/dist/components/Toast/Toast.constants.d.cts.map +1 -1
- package/dist/components/Toast/Toast.constants.d.mts +7 -1
- package/dist/components/Toast/Toast.constants.d.mts.map +1 -1
- package/dist/components/Toast/Toast.constants.mjs +9 -1
- package/dist/components/Toast/Toast.constants.mjs.map +1 -1
- package/dist/components/Toast/Toast.d.cts.map +1 -1
- package/dist/components/Toast/Toast.d.mts.map +1 -1
- package/dist/components/Toast/Toast.mjs +13 -4
- package/dist/components/Toast/Toast.mjs.map +1 -1
- package/dist/components/Toast/Toast.types.cjs.map +1 -1
- package/dist/components/Toast/Toast.types.d.cts +1 -1
- package/dist/components/Toast/Toast.types.d.cts.map +1 -1
- package/dist/components/Toast/Toast.types.d.mts +1 -1
- package/dist/components/Toast/Toast.types.d.mts.map +1 -1
- package/dist/components/Toast/Toast.types.mjs.map +1 -1
- package/dist/components/Toast/Toaster.cjs +18 -14
- package/dist/components/Toast/Toaster.cjs.map +1 -1
- package/dist/components/Toast/Toaster.d.cts.map +1 -1
- package/dist/components/Toast/Toaster.d.mts.map +1 -1
- package/dist/components/Toast/Toaster.mjs +20 -16
- package/dist/components/Toast/Toaster.mjs.map +1 -1
- package/dist/components/Toast/index.cjs +2 -2
- package/dist/components/Toast/index.cjs.map +1 -1
- package/dist/components/Toast/index.d.cts +1 -1
- package/dist/components/Toast/index.d.cts.map +1 -1
- package/dist/components/Toast/index.d.mts +1 -1
- package/dist/components/Toast/index.d.mts.map +1 -1
- package/dist/components/Toast/index.mjs +1 -1
- package/dist/components/Toast/index.mjs.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -7,6 +7,20 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
7
7
|
|
|
8
8
|
## [Unreleased]
|
|
9
9
|
|
|
10
|
+
## [0.37.0]
|
|
11
|
+
|
|
12
|
+
### Changed
|
|
13
|
+
|
|
14
|
+
- **BREAKING:** Updated `Toast` / `Toaster` to slide in from the top of the screen (below the safe area) with spring-based enter/exit motion ([#1304](https://github.com/MetaMask/metamask-design-system/pull/1304))
|
|
15
|
+
- Renamed `bottomOffset` and `customTopOffset` to `topOffset` (extra offset from the top, in addition to the safe-area inset and default top padding)
|
|
16
|
+
- Renamed exported `TOAST_BOTTOM_PADDING` to `TOAST_TOP_PADDING` and changed the default padding value from 36 to 8
|
|
17
|
+
- See [Migration Guide](./MIGRATION.md#toast-bottomoffset-to-topoffset)
|
|
18
|
+
- Updated `Toast` surface styling for light/dark themes: light uses `background.default` with medium shadow; dark uses `background.section` with no shadow; border radius updated from 12px to 16px; description defaults to `TextColor.TextAlternative` ([#1391](https://github.com/MetaMask/metamask-design-system/pull/1391))
|
|
19
|
+
|
|
20
|
+
### Fixed
|
|
21
|
+
|
|
22
|
+
- Fixed `Toast` `descriptionProps` so partial consumer props merge with the default `TextAlternative` color instead of replacing it ([#1396](https://github.com/MetaMask/metamask-design-system/pull/1396))
|
|
23
|
+
|
|
10
24
|
## [0.36.0]
|
|
11
25
|
|
|
12
26
|
### Added
|
|
@@ -607,7 +621,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
607
621
|
- Full TypeScript support with type definitions and enums
|
|
608
622
|
- React Native integration with TWRNC preset support
|
|
609
623
|
|
|
610
|
-
[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.
|
|
624
|
+
[Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.37.0...HEAD
|
|
625
|
+
[0.37.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.36.0...@metamask/design-system-react-native@0.37.0
|
|
611
626
|
[0.36.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.35.0...@metamask/design-system-react-native@0.36.0
|
|
612
627
|
[0.35.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.34.0...@metamask/design-system-react-native@0.35.0
|
|
613
628
|
[0.34.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-react-native@0.33.0...@metamask/design-system-react-native@0.34.0
|
|
@@ -6,6 +6,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
6
6
|
exports.Toast = void 0;
|
|
7
7
|
// Third party dependencies.
|
|
8
8
|
const design_system_shared_1 = require("@metamask/design-system-shared");
|
|
9
|
+
const design_system_twrnc_preset_1 = require("@metamask/design-system-twrnc-preset");
|
|
10
|
+
const design_tokens_1 = require("@metamask/design-tokens");
|
|
9
11
|
const react_1 = __importDefault(require("react"));
|
|
10
12
|
// External dependencies.
|
|
11
13
|
const BannerBase_1 = require("../BannerBase/index.cjs");
|
|
@@ -23,7 +25,9 @@ const renderSeverityAccessory = ({ iconAlertProps, severity, startAccessory, })
|
|
|
23
25
|
const iconAlertSeverity = Toast_constants_1.TOAST_SEVERITY_ICON_MAP[severity];
|
|
24
26
|
return (<IconAlert_1.IconAlert severity={iconAlertSeverity} size={design_system_shared_1.IconSize.Lg} {...iconAlertProps}/>);
|
|
25
27
|
};
|
|
26
|
-
const Toast = ({ actionButtonLabel, actionButtonOnPress, actionButtonProps, children, childrenWrapperProps, closeButtonProps, description, descriptionProps, onClose, iconAlertProps, severity = Toast_types_1.ToastSeverity.Default, startAccessory, title, titleProps, twClassName, ...props }) => {
|
|
28
|
+
const Toast = ({ actionButtonLabel, actionButtonOnPress, actionButtonProps, children, childrenWrapperProps, closeButtonProps, description, descriptionProps, onClose, iconAlertProps, severity = Toast_types_1.ToastSeverity.Default, startAccessory, style, title, titleProps, twClassName, ...props }) => {
|
|
29
|
+
const theme = (0, design_system_twrnc_preset_1.useTheme)();
|
|
30
|
+
const isLightTheme = theme === design_system_twrnc_preset_1.Theme.Light;
|
|
27
31
|
const actionProps = actionButtonLabel && actionButtonOnPress
|
|
28
32
|
? {
|
|
29
33
|
actionButtonLabel,
|
|
@@ -42,11 +46,16 @@ const Toast = ({ actionButtonLabel, actionButtonOnPress, actionButtonProps, chil
|
|
|
42
46
|
...closeButtonProps,
|
|
43
47
|
}
|
|
44
48
|
: undefined;
|
|
45
|
-
return (<BannerBase_1.BannerBase {...actionProps} {...props} backgroundColor={
|
|
49
|
+
return (<BannerBase_1.BannerBase {...actionProps} {...props} backgroundColor={isLightTheme
|
|
50
|
+
? design_system_shared_1.BoxBackgroundColor.BackgroundDefault
|
|
51
|
+
: design_system_shared_1.BoxBackgroundColor.BackgroundSection} borderColor={design_system_shared_1.BoxBorderColor.BorderMuted} borderWidth={1} children={children} childrenWrapperProps={childrenWrapperProps} closeButtonProps={resolvedCloseButtonProps} description={description} descriptionProps={{
|
|
52
|
+
color: design_system_shared_1.TextColor.TextAlternative,
|
|
53
|
+
...descriptionProps,
|
|
54
|
+
}} onClose={onClose} startAccessory={renderSeverityAccessory({
|
|
46
55
|
iconAlertProps,
|
|
47
56
|
severity,
|
|
48
57
|
startAccessory,
|
|
49
|
-
})} title={title} titleProps={titleProps} twClassName={(0, design_system_shared_1.mergeTwClassName)('rounded-
|
|
58
|
+
})} style={[isLightTheme ? design_tokens_1.lightTheme.shadows.size.md : undefined, style]} title={title} titleProps={titleProps} twClassName={(0, design_system_shared_1.mergeTwClassName)('rounded-2xl', twClassName)}/>);
|
|
50
59
|
};
|
|
51
60
|
exports.Toast = Toast;
|
|
52
61
|
//# sourceMappingURL=Toast.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,
|
|
1
|
+
{"version":3,"file":"Toast.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"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","sourcesContent":["// Third party dependencies.\nimport {\n BoxBackgroundColor,\n BoxBorderColor,\n ButtonSize,\n IconSize,\n mergeTwClassName,\n TextColor,\n} from '@metamask/design-system-shared';\nimport { Theme, useTheme } from '@metamask/design-system-twrnc-preset';\nimport { lightTheme } from '@metamask/design-tokens';\nimport React from 'react';\n\n// External dependencies.\nimport { BannerBase } from '../BannerBase';\nimport { IconAlert } from '../IconAlert';\n\n// Internal dependencies.\nimport { TOAST_SEVERITY_ICON_MAP } from './Toast.constants';\nimport { ToastSeverity } from './Toast.types';\nimport type { ToastProps } from './Toast.types';\n\nconst renderSeverityAccessory = ({\n iconAlertProps,\n severity,\n startAccessory,\n}: Pick<ToastProps, 'iconAlertProps' | 'severity' | 'startAccessory'>) => {\n if (startAccessory !== null && startAccessory !== undefined) {\n return startAccessory;\n }\n\n if (!severity || severity === ToastSeverity.Default) {\n return undefined;\n }\n\n const iconAlertSeverity = TOAST_SEVERITY_ICON_MAP[severity];\n\n return (\n <IconAlert\n severity={iconAlertSeverity}\n size={IconSize.Lg}\n {...iconAlertProps}\n />\n );\n};\n\nexport const Toast: React.FC<ToastProps> = ({\n actionButtonLabel,\n actionButtonOnPress,\n actionButtonProps,\n children,\n childrenWrapperProps,\n closeButtonProps,\n description,\n descriptionProps,\n onClose,\n iconAlertProps,\n severity = ToastSeverity.Default,\n startAccessory,\n style,\n title,\n titleProps,\n twClassName,\n ...props\n}) => {\n const theme = useTheme();\n const isLightTheme = theme === Theme.Light;\n const actionProps =\n actionButtonLabel && actionButtonOnPress\n ? {\n actionButtonLabel,\n actionButtonOnPress,\n actionButtonProps: {\n size: ButtonSize.Sm,\n ...actionButtonProps,\n },\n }\n : {};\n // TODO: Remove this conditional once BannerBase only renders a close button\n // from onClose. At that point Toast can pass closeButtonProps directly.\n const resolvedCloseButtonProps =\n onClose || closeButtonProps\n ? {\n accessibilityLabel: 'Close toast',\n ...closeButtonProps,\n }\n : undefined;\n\n return (\n <BannerBase\n {...actionProps}\n {...props}\n backgroundColor={\n isLightTheme\n ? BoxBackgroundColor.BackgroundDefault\n : BoxBackgroundColor.BackgroundSection\n }\n borderColor={BoxBorderColor.BorderMuted}\n borderWidth={1}\n children={children}\n childrenWrapperProps={childrenWrapperProps}\n closeButtonProps={resolvedCloseButtonProps}\n description={description}\n descriptionProps={{\n color: TextColor.TextAlternative,\n ...descriptionProps,\n }}\n onClose={onClose}\n startAccessory={renderSeverityAccessory({\n iconAlertProps,\n severity,\n startAccessory,\n })}\n style={[isLightTheme ? lightTheme.shadows.size.md : undefined, style]}\n title={title}\n titleProps={titleProps}\n twClassName={mergeTwClassName('rounded-2xl', twClassName)}\n />\n );\n};\n"]}
|
|
@@ -1,13 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.TOAST_SEVERITY_ICON_MAP = exports.
|
|
3
|
+
exports.TOAST_SEVERITY_ICON_MAP = exports.TOAST_SPRING_CONFIG = exports.TOAST_TOP_PADDING = exports.TOAST_VISIBILITY_DURATION = exports.TOAST_ANIMATION_DURATION = void 0;
|
|
4
4
|
// External dependencies.
|
|
5
5
|
const design_system_shared_1 = require("@metamask/design-system-shared");
|
|
6
6
|
const Toast_types_1 = require("./Toast.types.cjs");
|
|
7
7
|
var design_system_shared_2 = require("@metamask/design-system-shared");
|
|
8
8
|
Object.defineProperty(exports, "TOAST_ANIMATION_DURATION", { enumerable: true, get: function () { return design_system_shared_2.TOAST_ANIMATION_DURATION; } });
|
|
9
9
|
Object.defineProperty(exports, "TOAST_VISIBILITY_DURATION", { enumerable: true, get: function () { return design_system_shared_2.TOAST_VISIBILITY_DURATION; } });
|
|
10
|
-
exports.
|
|
10
|
+
exports.TOAST_TOP_PADDING = 8;
|
|
11
|
+
/**
|
|
12
|
+
* Spring tuned to approximate iOS system banner motion (inspired by UIKit
|
|
13
|
+
* spring with dampingRatio ~0.7-0.85 / SwiftUI .snappy).
|
|
14
|
+
*/
|
|
15
|
+
exports.TOAST_SPRING_CONFIG = {
|
|
16
|
+
dampingRatio: 0.85,
|
|
17
|
+
duration: 500,
|
|
18
|
+
};
|
|
11
19
|
exports.TOAST_SEVERITY_ICON_MAP = {
|
|
12
20
|
[Toast_types_1.ToastSeverity.Success]: design_system_shared_1.IconAlertSeverity.Success,
|
|
13
21
|
[Toast_types_1.ToastSeverity.Warning]: design_system_shared_1.IconAlertSeverity.Warning,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.constants.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":";;;AAAA,yBAAyB;AACzB,yEAAmE;
|
|
1
|
+
{"version":3,"file":"Toast.constants.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":";;;AAAA,yBAAyB;AACzB,yEAAmE;AAGnE,mDAA8C;AAE9C,uEAGwC;AAFtC,gIAAA,wBAAwB,OAAA;AACxB,iIAAA,yBAAyB,OAAA;AAGd,QAAA,iBAAiB,GAAG,CAAC,CAAC;AAEnC;;;GAGG;AACU,QAAA,mBAAmB,GAAqB;IACnD,YAAY,EAAE,IAAI;IAClB,QAAQ,EAAE,GAAG;CACd,CAAC;AAEW,QAAA,uBAAuB,GAAG;IACrC,CAAC,2BAAa,CAAC,OAAO,CAAC,EAAE,wCAAiB,CAAC,OAAO;IAClD,CAAC,2BAAa,CAAC,OAAO,CAAC,EAAE,wCAAiB,CAAC,OAAO;IAClD,CAAC,2BAAa,CAAC,MAAM,CAAC,EAAE,wCAAiB,CAAC,MAAM;CACxC,CAAC","sourcesContent":["// External dependencies.\nimport { IconAlertSeverity } from '@metamask/design-system-shared';\nimport type { WithSpringConfig } from 'react-native-reanimated';\n\nimport { ToastSeverity } from './Toast.types';\n\nexport {\n TOAST_ANIMATION_DURATION,\n TOAST_VISIBILITY_DURATION,\n} from '@metamask/design-system-shared';\n\nexport const TOAST_TOP_PADDING = 8;\n\n/**\n * Spring tuned to approximate iOS system banner motion (inspired by UIKit\n * spring with dampingRatio ~0.7-0.85 / SwiftUI .snappy).\n */\nexport const TOAST_SPRING_CONFIG: WithSpringConfig = {\n dampingRatio: 0.85,\n duration: 500,\n};\n\nexport const TOAST_SEVERITY_ICON_MAP = {\n [ToastSeverity.Success]: IconAlertSeverity.Success,\n [ToastSeverity.Warning]: IconAlertSeverity.Warning,\n [ToastSeverity.Danger]: IconAlertSeverity.Danger,\n} as const;\n"]}
|
|
@@ -1,5 +1,11 @@
|
|
|
1
|
+
import type { WithSpringConfig } from "react-native-reanimated";
|
|
1
2
|
export { TOAST_ANIMATION_DURATION, TOAST_VISIBILITY_DURATION, } from "@metamask/design-system-shared";
|
|
2
|
-
export declare const
|
|
3
|
+
export declare const TOAST_TOP_PADDING = 8;
|
|
4
|
+
/**
|
|
5
|
+
* Spring tuned to approximate iOS system banner motion (inspired by UIKit
|
|
6
|
+
* spring with dampingRatio ~0.7-0.85 / SwiftUI .snappy).
|
|
7
|
+
*/
|
|
8
|
+
export declare const TOAST_SPRING_CONFIG: WithSpringConfig;
|
|
3
9
|
export declare const TOAST_SEVERITY_ICON_MAP: {
|
|
4
10
|
readonly success: "success";
|
|
5
11
|
readonly warning: "warning";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.constants.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Toast.constants.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAAgC;AAIhE,OAAO,EACL,wBAAwB,EACxB,yBAAyB,GAC1B,uCAAuC;AAExC,eAAO,MAAM,iBAAiB,IAAI,CAAC;AAEnC;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,gBAGjC,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;CAI1B,CAAC"}
|
|
@@ -1,5 +1,11 @@
|
|
|
1
|
+
import type { WithSpringConfig } from "react-native-reanimated";
|
|
1
2
|
export { TOAST_ANIMATION_DURATION, TOAST_VISIBILITY_DURATION, } from "@metamask/design-system-shared";
|
|
2
|
-
export declare const
|
|
3
|
+
export declare const TOAST_TOP_PADDING = 8;
|
|
4
|
+
/**
|
|
5
|
+
* Spring tuned to approximate iOS system banner motion (inspired by UIKit
|
|
6
|
+
* spring with dampingRatio ~0.7-0.85 / SwiftUI .snappy).
|
|
7
|
+
*/
|
|
8
|
+
export declare const TOAST_SPRING_CONFIG: WithSpringConfig;
|
|
3
9
|
export declare const TOAST_SEVERITY_ICON_MAP: {
|
|
4
10
|
readonly success: "success";
|
|
5
11
|
readonly warning: "warning";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.constants.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Toast.constants.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gCAAgC;AAIhE,OAAO,EACL,wBAAwB,EACxB,yBAAyB,GAC1B,uCAAuC;AAExC,eAAO,MAAM,iBAAiB,IAAI,CAAC;AAEnC;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,gBAGjC,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;CAI1B,CAAC"}
|
|
@@ -2,7 +2,15 @@
|
|
|
2
2
|
import { IconAlertSeverity } from "@metamask/design-system-shared";
|
|
3
3
|
import { ToastSeverity } from "./Toast.types.mjs";
|
|
4
4
|
export { TOAST_ANIMATION_DURATION, TOAST_VISIBILITY_DURATION } from "@metamask/design-system-shared";
|
|
5
|
-
export const
|
|
5
|
+
export const TOAST_TOP_PADDING = 8;
|
|
6
|
+
/**
|
|
7
|
+
* Spring tuned to approximate iOS system banner motion (inspired by UIKit
|
|
8
|
+
* spring with dampingRatio ~0.7-0.85 / SwiftUI .snappy).
|
|
9
|
+
*/
|
|
10
|
+
export const TOAST_SPRING_CONFIG = {
|
|
11
|
+
dampingRatio: 0.85,
|
|
12
|
+
duration: 500,
|
|
13
|
+
};
|
|
6
14
|
export const TOAST_SEVERITY_ICON_MAP = {
|
|
7
15
|
[ToastSeverity.Success]: IconAlertSeverity.Success,
|
|
8
16
|
[ToastSeverity.Warning]: IconAlertSeverity.Warning,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.constants.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAAA,yBAAyB;AACzB,OAAO,EAAE,iBAAiB,EAAE,uCAAuC;
|
|
1
|
+
{"version":3,"file":"Toast.constants.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.constants.ts"],"names":[],"mappings":"AAAA,yBAAyB;AACzB,OAAO,EAAE,iBAAiB,EAAE,uCAAuC;AAGnE,OAAO,EAAE,aAAa,EAAE,0BAAsB;AAE9C,OAAO,EACL,wBAAwB,EACxB,yBAAyB,EAC1B,uCAAuC;AAExC,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,CAAC;AAEnC;;;GAGG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAqB;IACnD,YAAY,EAAE,IAAI;IAClB,QAAQ,EAAE,GAAG;CACd,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO;IAClD,CAAC,aAAa,CAAC,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO;IAClD,CAAC,aAAa,CAAC,MAAM,CAAC,EAAE,iBAAiB,CAAC,MAAM;CACxC,CAAC","sourcesContent":["// External dependencies.\nimport { IconAlertSeverity } from '@metamask/design-system-shared';\nimport type { WithSpringConfig } from 'react-native-reanimated';\n\nimport { ToastSeverity } from './Toast.types';\n\nexport {\n TOAST_ANIMATION_DURATION,\n TOAST_VISIBILITY_DURATION,\n} from '@metamask/design-system-shared';\n\nexport const TOAST_TOP_PADDING = 8;\n\n/**\n * Spring tuned to approximate iOS system banner motion (inspired by UIKit\n * spring with dampingRatio ~0.7-0.85 / SwiftUI .snappy).\n */\nexport const TOAST_SPRING_CONFIG: WithSpringConfig = {\n dampingRatio: 0.85,\n duration: 500,\n};\n\nexport const TOAST_SEVERITY_ICON_MAP = {\n [ToastSeverity.Success]: IconAlertSeverity.Success,\n [ToastSeverity.Warning]: IconAlertSeverity.Warning,\n [ToastSeverity.Danger]: IconAlertSeverity.Danger,\n} as const;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Toast.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,cAAc;AAS1B,OAAO,KAAK,EAAE,UAAU,EAAE,0BAAsB;AA0BhD,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAyEtC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Toast.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,cAAc;AAS1B,OAAO,KAAK,EAAE,UAAU,EAAE,0BAAsB;AA0BhD,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAyEtC,CAAC"}
|
|
@@ -5,7 +5,9 @@ function $importDefault(module) {
|
|
|
5
5
|
return module;
|
|
6
6
|
}
|
|
7
7
|
// Third party dependencies.
|
|
8
|
-
import { BoxBackgroundColor, BoxBorderColor, ButtonSize, IconSize, mergeTwClassName } from "@metamask/design-system-shared";
|
|
8
|
+
import { BoxBackgroundColor, BoxBorderColor, ButtonSize, IconSize, mergeTwClassName, TextColor } from "@metamask/design-system-shared";
|
|
9
|
+
import { Theme, useTheme } from "@metamask/design-system-twrnc-preset";
|
|
10
|
+
import { lightTheme } from "@metamask/design-tokens";
|
|
9
11
|
import $React from "react";
|
|
10
12
|
const React = $importDefault($React);
|
|
11
13
|
// External dependencies.
|
|
@@ -24,7 +26,9 @@ const renderSeverityAccessory = ({ iconAlertProps, severity, startAccessory, })
|
|
|
24
26
|
const iconAlertSeverity = TOAST_SEVERITY_ICON_MAP[severity];
|
|
25
27
|
return (<IconAlert severity={iconAlertSeverity} size={IconSize.Lg} {...iconAlertProps}/>);
|
|
26
28
|
};
|
|
27
|
-
export const Toast = ({ actionButtonLabel, actionButtonOnPress, actionButtonProps, children, childrenWrapperProps, closeButtonProps, description, descriptionProps, onClose, iconAlertProps, severity = ToastSeverity.Default, startAccessory, title, titleProps, twClassName, ...props }) => {
|
|
29
|
+
export const Toast = ({ actionButtonLabel, actionButtonOnPress, actionButtonProps, children, childrenWrapperProps, closeButtonProps, description, descriptionProps, onClose, iconAlertProps, severity = ToastSeverity.Default, startAccessory, style, title, titleProps, twClassName, ...props }) => {
|
|
30
|
+
const theme = useTheme();
|
|
31
|
+
const isLightTheme = theme === Theme.Light;
|
|
28
32
|
const actionProps = actionButtonLabel && actionButtonOnPress
|
|
29
33
|
? {
|
|
30
34
|
actionButtonLabel,
|
|
@@ -43,10 +47,15 @@ export const Toast = ({ actionButtonLabel, actionButtonOnPress, actionButtonProp
|
|
|
43
47
|
...closeButtonProps,
|
|
44
48
|
}
|
|
45
49
|
: undefined;
|
|
46
|
-
return (<BannerBase {...actionProps} {...props} backgroundColor={
|
|
50
|
+
return (<BannerBase {...actionProps} {...props} backgroundColor={isLightTheme
|
|
51
|
+
? BoxBackgroundColor.BackgroundDefault
|
|
52
|
+
: BoxBackgroundColor.BackgroundSection} borderColor={BoxBorderColor.BorderMuted} borderWidth={1} children={children} childrenWrapperProps={childrenWrapperProps} closeButtonProps={resolvedCloseButtonProps} description={description} descriptionProps={{
|
|
53
|
+
color: TextColor.TextAlternative,
|
|
54
|
+
...descriptionProps,
|
|
55
|
+
}} onClose={onClose} startAccessory={renderSeverityAccessory({
|
|
47
56
|
iconAlertProps,
|
|
48
57
|
severity,
|
|
49
58
|
startAccessory,
|
|
50
|
-
})} title={title} titleProps={titleProps} twClassName={mergeTwClassName('rounded-
|
|
59
|
+
})} style={[isLightTheme ? lightTheme.shadows.size.md : undefined, style]} title={title} titleProps={titleProps} twClassName={mergeTwClassName('rounded-2xl', twClassName)}/>);
|
|
51
60
|
};
|
|
52
61
|
//# sourceMappingURL=Toast.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":";;;;;;AAAA,4BAA4B;AAC5B,OAAO,EACL,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,QAAQ,EACR,gBAAgB,
|
|
1
|
+
{"version":3,"file":"Toast.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.tsx"],"names":[],"mappings":"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","sourcesContent":["// Third party dependencies.\nimport {\n BoxBackgroundColor,\n BoxBorderColor,\n ButtonSize,\n IconSize,\n mergeTwClassName,\n TextColor,\n} from '@metamask/design-system-shared';\nimport { Theme, useTheme } from '@metamask/design-system-twrnc-preset';\nimport { lightTheme } from '@metamask/design-tokens';\nimport React from 'react';\n\n// External dependencies.\nimport { BannerBase } from '../BannerBase';\nimport { IconAlert } from '../IconAlert';\n\n// Internal dependencies.\nimport { TOAST_SEVERITY_ICON_MAP } from './Toast.constants';\nimport { ToastSeverity } from './Toast.types';\nimport type { ToastProps } from './Toast.types';\n\nconst renderSeverityAccessory = ({\n iconAlertProps,\n severity,\n startAccessory,\n}: Pick<ToastProps, 'iconAlertProps' | 'severity' | 'startAccessory'>) => {\n if (startAccessory !== null && startAccessory !== undefined) {\n return startAccessory;\n }\n\n if (!severity || severity === ToastSeverity.Default) {\n return undefined;\n }\n\n const iconAlertSeverity = TOAST_SEVERITY_ICON_MAP[severity];\n\n return (\n <IconAlert\n severity={iconAlertSeverity}\n size={IconSize.Lg}\n {...iconAlertProps}\n />\n );\n};\n\nexport const Toast: React.FC<ToastProps> = ({\n actionButtonLabel,\n actionButtonOnPress,\n actionButtonProps,\n children,\n childrenWrapperProps,\n closeButtonProps,\n description,\n descriptionProps,\n onClose,\n iconAlertProps,\n severity = ToastSeverity.Default,\n startAccessory,\n style,\n title,\n titleProps,\n twClassName,\n ...props\n}) => {\n const theme = useTheme();\n const isLightTheme = theme === Theme.Light;\n const actionProps =\n actionButtonLabel && actionButtonOnPress\n ? {\n actionButtonLabel,\n actionButtonOnPress,\n actionButtonProps: {\n size: ButtonSize.Sm,\n ...actionButtonProps,\n },\n }\n : {};\n // TODO: Remove this conditional once BannerBase only renders a close button\n // from onClose. At that point Toast can pass closeButtonProps directly.\n const resolvedCloseButtonProps =\n onClose || closeButtonProps\n ? {\n accessibilityLabel: 'Close toast',\n ...closeButtonProps,\n }\n : undefined;\n\n return (\n <BannerBase\n {...actionProps}\n {...props}\n backgroundColor={\n isLightTheme\n ? BoxBackgroundColor.BackgroundDefault\n : BoxBackgroundColor.BackgroundSection\n }\n borderColor={BoxBorderColor.BorderMuted}\n borderWidth={1}\n children={children}\n childrenWrapperProps={childrenWrapperProps}\n closeButtonProps={resolvedCloseButtonProps}\n description={description}\n descriptionProps={{\n color: TextColor.TextAlternative,\n ...descriptionProps,\n }}\n onClose={onClose}\n startAccessory={renderSeverityAccessory({\n iconAlertProps,\n severity,\n startAccessory,\n })}\n style={[isLightTheme ? lightTheme.shadows.size.md : undefined, style]}\n title={title}\n titleProps={titleProps}\n twClassName={mergeTwClassName('rounded-2xl', twClassName)}\n />\n );\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.types.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":";;;AACA,yEAA+D;AAMtD,8FANA,oCAAa,OAMA","sourcesContent":["import type { ToastPropsShared } from '@metamask/design-system-shared';\nimport { ToastSeverity } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon/Icon.types';\n\nexport { ToastSeverity };\nexport type { ToastPropsShared };\n\n/**\n * Optional props for the leading severity `Icon`.\n */\nexport type ToastIconProps = Omit<IconProps, 'name' | 'size' | 'color'>;\n\n/**\n * Shared toast props aligned with BannerBase, plus optional severity/icon props.\n */\nexport type ToastSharedProps = Omit<BannerBaseProps, 'closeButtonProps'> & {\n closeButtonProps?: Omit<\n NonNullable<BannerBaseProps['closeButtonProps']>,\n 'onPress'\n >;\n severity?: ToastSeverity;\n iconAlertProps?: ToastIconProps;\n};\n\n/**\n * Toast options used by the imperative `toast(...)` API.\n */\nexport type ToastOptions = ToastSharedProps & {\n hasNoTimeout?: boolean;\n
|
|
1
|
+
{"version":3,"file":"Toast.types.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":";;;AACA,yEAA+D;AAMtD,8FANA,oCAAa,OAMA","sourcesContent":["import type { ToastPropsShared } from '@metamask/design-system-shared';\nimport { ToastSeverity } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon/Icon.types';\n\nexport { ToastSeverity };\nexport type { ToastPropsShared };\n\n/**\n * Optional props for the leading severity `Icon`.\n */\nexport type ToastIconProps = Omit<IconProps, 'name' | 'size' | 'color'>;\n\n/**\n * Shared toast props aligned with BannerBase, plus optional severity/icon props.\n */\nexport type ToastSharedProps = Omit<BannerBaseProps, 'closeButtonProps'> & {\n closeButtonProps?: Omit<\n NonNullable<BannerBaseProps['closeButtonProps']>,\n 'onPress'\n >;\n severity?: ToastSeverity;\n iconAlertProps?: ToastIconProps;\n};\n\n/**\n * Toast options used by the imperative `toast(...)` API.\n */\nexport type ToastOptions = ToastSharedProps & {\n hasNoTimeout?: boolean;\n topOffset?: number;\n};\n\n/**\n * Toaster component reference.\n */\nexport type ToasterRef = {\n showToast: (toastOptions: ToastOptions) => void;\n closeToast: () => void;\n};\n\n/**\n * Toast component props intended for direct rendering of a single toast surface.\n */\nexport type ToastProps = ToastSharedProps;\n\n/**\n * Toaster component props.\n * Extends ViewProps to inherit standard React Native props such as testID and accessibilityLabel.\n */\nexport type ToasterProps = {\n /**\n * Optional Tailwind CSS classes for the toast container.\n */\n twClassName?: string;\n} & Omit<ViewProps, 'style'>;\n"]}
|
|
@@ -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,uCAAuC;AACvE,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,qBAAqB;AAE9C,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD,OAAO,EAAE,aAAa,EAAE,CAAC;AACzB,YAAY,EAAE,gBAAgB,EAAE,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;AAExE;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG;IACzE,gBAAgB,CAAC,EAAE,IAAI,CACrB,WAAW,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC,EAChD,SAAS,CACV,CAAC;IACF,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,gBAAgB,GAAG;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,
|
|
1
|
+
{"version":3,"file":"Toast.types.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,uCAAuC;AACvE,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,qBAAqB;AAE9C,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD,OAAO,EAAE,aAAa,EAAE,CAAC;AACzB,YAAY,EAAE,gBAAgB,EAAE,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;AAExE;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG;IACzE,gBAAgB,CAAC,EAAE,IAAI,CACrB,WAAW,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC,EAChD,SAAS,CACV,CAAC;IACF,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,gBAAgB,GAAG;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,SAAS,EAAE,CAAC,YAAY,EAAE,YAAY,KAAK,IAAI,CAAC;IAChD,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,gBAAgB,CAAC;AAE1C;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC"}
|
|
@@ -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,uCAAuC;AACvE,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,qBAAqB;AAE9C,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD,OAAO,EAAE,aAAa,EAAE,CAAC;AACzB,YAAY,EAAE,gBAAgB,EAAE,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;AAExE;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG;IACzE,gBAAgB,CAAC,EAAE,IAAI,CACrB,WAAW,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC,EAChD,SAAS,CACV,CAAC;IACF,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,gBAAgB,GAAG;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,
|
|
1
|
+
{"version":3,"file":"Toast.types.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,uCAAuC;AACvE,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAC/D,OAAO,KAAK,EAAE,SAAS,EAAE,qBAAqB;AAE9C,OAAO,KAAK,EAAE,eAAe,EAAE,gCAAsB;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA2B;AAEpD,OAAO,EAAE,aAAa,EAAE,CAAC;AACzB,YAAY,EAAE,gBAAgB,EAAE,CAAC;AAEjC;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;AAExE;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG;IACzE,gBAAgB,CAAC,EAAE,IAAI,CACrB,WAAW,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC,EAChD,SAAS,CACV,CAAC;IACF,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,gBAAgB,GAAG;IAC5C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,SAAS,EAAE,CAAC,YAAY,EAAE,YAAY,KAAK,IAAI,CAAC;IAChD,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,gBAAgB,CAAC;AAE1C;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.types.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAM/D,OAAO,EAAE,aAAa,EAAE,CAAC","sourcesContent":["import type { ToastPropsShared } from '@metamask/design-system-shared';\nimport { ToastSeverity } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon/Icon.types';\n\nexport { ToastSeverity };\nexport type { ToastPropsShared };\n\n/**\n * Optional props for the leading severity `Icon`.\n */\nexport type ToastIconProps = Omit<IconProps, 'name' | 'size' | 'color'>;\n\n/**\n * Shared toast props aligned with BannerBase, plus optional severity/icon props.\n */\nexport type ToastSharedProps = Omit<BannerBaseProps, 'closeButtonProps'> & {\n closeButtonProps?: Omit<\n NonNullable<BannerBaseProps['closeButtonProps']>,\n 'onPress'\n >;\n severity?: ToastSeverity;\n iconAlertProps?: ToastIconProps;\n};\n\n/**\n * Toast options used by the imperative `toast(...)` API.\n */\nexport type ToastOptions = ToastSharedProps & {\n hasNoTimeout?: boolean;\n
|
|
1
|
+
{"version":3,"file":"Toast.types.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toast.types.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAM/D,OAAO,EAAE,aAAa,EAAE,CAAC","sourcesContent":["import type { ToastPropsShared } from '@metamask/design-system-shared';\nimport { ToastSeverity } from '@metamask/design-system-shared';\nimport type { ViewProps } from 'react-native';\n\nimport type { BannerBaseProps } from '../BannerBase';\nimport type { IconProps } from '../Icon/Icon.types';\n\nexport { ToastSeverity };\nexport type { ToastPropsShared };\n\n/**\n * Optional props for the leading severity `Icon`.\n */\nexport type ToastIconProps = Omit<IconProps, 'name' | 'size' | 'color'>;\n\n/**\n * Shared toast props aligned with BannerBase, plus optional severity/icon props.\n */\nexport type ToastSharedProps = Omit<BannerBaseProps, 'closeButtonProps'> & {\n closeButtonProps?: Omit<\n NonNullable<BannerBaseProps['closeButtonProps']>,\n 'onPress'\n >;\n severity?: ToastSeverity;\n iconAlertProps?: ToastIconProps;\n};\n\n/**\n * Toast options used by the imperative `toast(...)` API.\n */\nexport type ToastOptions = ToastSharedProps & {\n hasNoTimeout?: boolean;\n topOffset?: number;\n};\n\n/**\n * Toaster component reference.\n */\nexport type ToasterRef = {\n showToast: (toastOptions: ToastOptions) => void;\n closeToast: () => void;\n};\n\n/**\n * Toast component props intended for direct rendering of a single toast surface.\n */\nexport type ToastProps = ToastSharedProps;\n\n/**\n * Toaster component props.\n * Extends ViewProps to inherit standard React Native props such as testID and accessibilityLabel.\n */\nexport type ToasterProps = {\n /**\n * Optional Tailwind CSS classes for the toast container.\n */\n twClassName?: string;\n} & Omit<ViewProps, 'style'>;\n"]}
|
|
@@ -43,19 +43,21 @@ const assertRegisteredRef = (method) => {
|
|
|
43
43
|
}
|
|
44
44
|
return registeredRef.current;
|
|
45
45
|
};
|
|
46
|
-
const getToastProps = ({
|
|
46
|
+
const getToastProps = ({ hasNoTimeout: _hasNoTimeout, onClose: _onClose, topOffset: _topOffset, twClassName: _twClassName, ...toastProps }) => toastProps;
|
|
47
|
+
const getHiddenTranslateY = (height, offset) => -(height + offset);
|
|
47
48
|
const ToasterComponent = (0, react_1.forwardRef)(({ twClassName, ...props }, ref) => {
|
|
48
49
|
const tw = (0, design_system_twrnc_preset_1.useTailwind)();
|
|
49
50
|
const [toastOptions, setToastOptions] = (0, react_1.useState)(undefined);
|
|
50
51
|
const replacementTimerRef = (0, react_1.useRef)(null);
|
|
51
|
-
const {
|
|
52
|
-
const
|
|
53
|
-
const
|
|
52
|
+
const { top: topInset } = (0, react_native_safe_area_context_1.useSafeAreaInsets)();
|
|
53
|
+
const toastHeight = (0, react_native_reanimated_1.useSharedValue)(screenHeight);
|
|
54
|
+
const translateYProgress = (0, react_native_reanimated_1.useSharedValue)(-screenHeight);
|
|
55
|
+
const topOffset = toastOptions?.topOffset ?? 0;
|
|
54
56
|
const animatedStyle = (0, react_native_reanimated_1.useAnimatedStyle)(() => ({
|
|
55
|
-
transform: [{ translateY: translateYProgress.value
|
|
57
|
+
transform: [{ translateY: translateYProgress.value + topOffset }],
|
|
56
58
|
}));
|
|
57
59
|
const baseStyle = (0, react_1.useMemo)(() => [
|
|
58
|
-
tw.style('absolute left-4 right-4
|
|
60
|
+
tw.style('absolute left-4 right-4 top-0'),
|
|
59
61
|
animatedStyle,
|
|
60
62
|
], [tw, animatedStyle]);
|
|
61
63
|
const innerRef = (0, react_1.useRef)(null);
|
|
@@ -84,7 +86,7 @@ const ToasterComponent = (0, react_1.forwardRef)(({ twClassName, ...props }, ref
|
|
|
84
86
|
clearTimeout(replacementTimerRef.current);
|
|
85
87
|
replacementTimerRef.current = null;
|
|
86
88
|
}
|
|
87
|
-
translateYProgress.value = (0, react_native_reanimated_1.
|
|
89
|
+
translateYProgress.value = (0, react_native_reanimated_1.withSpring)(getHiddenTranslateY(toastHeight.value, topOffset), Toast_constants_1.TOAST_SPRING_CONFIG, () => {
|
|
88
90
|
(0, react_native_worklets_1.scheduleOnRN)(resetState);
|
|
89
91
|
});
|
|
90
92
|
};
|
|
@@ -112,16 +114,18 @@ const ToasterComponent = (0, react_1.forwardRef)(({ twClassName, ...props }, ref
|
|
|
112
114
|
.join(' ');
|
|
113
115
|
const onAnimatedViewLayout = (e) => {
|
|
114
116
|
const { height } = e.nativeEvent.layout;
|
|
115
|
-
const
|
|
116
|
-
|
|
117
|
+
const hiddenTranslateY = getHiddenTranslateY(height, topOffset);
|
|
118
|
+
const visibleTranslateY = topInset + Toast_constants_1.TOAST_TOP_PADDING;
|
|
119
|
+
toastHeight.value = height;
|
|
120
|
+
translateYProgress.value = hiddenTranslateY;
|
|
117
121
|
if (toastOptions.hasNoTimeout) {
|
|
118
|
-
translateYProgress.value = (0, react_native_reanimated_1.
|
|
119
|
-
duration: Toast_constants_1.TOAST_ANIMATION_DURATION,
|
|
120
|
-
});
|
|
122
|
+
translateYProgress.value = (0, react_native_reanimated_1.withSpring)(visibleTranslateY, Toast_constants_1.TOAST_SPRING_CONFIG);
|
|
121
123
|
}
|
|
122
124
|
else {
|
|
123
|
-
translateYProgress.value = (0, react_native_reanimated_1.
|
|
124
|
-
translateYProgress.value = (0, react_native_reanimated_1.withDelay)(Toast_constants_1.TOAST_VISIBILITY_DURATION, (0, react_native_reanimated_1.
|
|
125
|
+
translateYProgress.value = (0, react_native_reanimated_1.withSpring)(visibleTranslateY, Toast_constants_1.TOAST_SPRING_CONFIG, () => {
|
|
126
|
+
translateYProgress.value = (0, react_native_reanimated_1.withDelay)(Toast_constants_1.TOAST_VISIBILITY_DURATION, (0, react_native_reanimated_1.withSpring)(hiddenTranslateY, Toast_constants_1.TOAST_SPRING_CONFIG, () => {
|
|
127
|
+
(0, react_native_worklets_1.scheduleOnRN)(resetState);
|
|
128
|
+
}));
|
|
125
129
|
});
|
|
126
130
|
}
|
|
127
131
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toaster.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toaster.tsx"],"names":[],"mappings":"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","sourcesContent":["// Third party dependencies.\nimport { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useImperativeHandle,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { RefObject } from 'react';\nimport { Dimensions } from 'react-native';\nimport type { LayoutChangeEvent, StyleProp, ViewStyle } from 'react-native';\nimport Animated, {\n cancelAnimation,\n useAnimatedStyle,\n useSharedValue,\n withDelay,\n withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { scheduleOnRN } from 'react-native-worklets';\n\n// Internal dependencies.\nimport { Toast } from './Toast';\nimport {\n TOAST_ANIMATION_DURATION,\n TOAST_BOTTOM_PADDING,\n TOAST_VISIBILITY_DURATION,\n} from './Toast.constants';\nimport type {\n ToastOptions,\n ToastProps,\n ToasterProps,\n ToasterRef,\n} from './Toast.types';\n\nconst screenHeight = Dimensions.get('window').height;\n\nlet registeredRef: RefObject<ToasterRef | null> | null = null;\n\nconst assertRegisteredRef = (method: 'dismiss' | 'toast'): ToasterRef => {\n if (!registeredRef?.current) {\n const invocation = method === 'toast' ? 'toast()' : `toast.${method}()`;\n throw new Error(\n `${invocation} called before <Toaster /> mounted. Render <Toaster /> once at the root of your app.`,\n );\n }\n return registeredRef.current;\n};\n\nconst getToastProps = ({\n bottomOffset: _bottomOffset,\n hasNoTimeout: _hasNoTimeout,\n onClose: _onClose,\n twClassName: _twClassName,\n ...toastProps\n}: ToastOptions): Omit<ToastProps, 'twClassName'> => toastProps;\n\nconst ToasterComponent = forwardRef<ToasterRef, ToasterProps>(\n ({ twClassName, ...props }, ref) => {\n const tw = useTailwind();\n const [toastOptions, setToastOptions] = useState<ToastOptions | undefined>(\n undefined,\n );\n const replacementTimerRef = useRef<ReturnType<typeof setTimeout> | null>(\n null,\n );\n const { bottom: bottomNotchSpacing } = useSafeAreaInsets();\n const translateYProgress = useSharedValue(screenHeight);\n const bottomOffset = toastOptions?.bottomOffset ?? 0;\n const animatedStyle = useAnimatedStyle(() => ({\n transform: [{ translateY: translateYProgress.value - bottomOffset }],\n }));\n const baseStyle = useMemo(\n () =>\n [\n tw.style('absolute left-4 right-4 bottom-0'),\n animatedStyle,\n ] as StyleProp<ViewStyle>,\n [tw, animatedStyle],\n );\n const innerRef = useRef<ToasterRef | null>(null);\n\n const resetState = () => setToastOptions(undefined);\n\n const showToast = (options: ToastOptions) => {\n let timeoutDuration = 0;\n const normalizedOptions = {\n hasNoTimeout: false,\n ...options,\n };\n if (toastOptions) {\n cancelAnimation(translateYProgress);\n timeoutDuration = 100;\n setToastOptions(undefined);\n }\n if (replacementTimerRef.current !== null) {\n clearTimeout(replacementTimerRef.current);\n }\n replacementTimerRef.current = setTimeout(() => {\n replacementTimerRef.current = null;\n setToastOptions(normalizedOptions);\n }, timeoutDuration);\n };\n\n const closeToast = () => {\n if (replacementTimerRef.current !== null) {\n clearTimeout(replacementTimerRef.current);\n replacementTimerRef.current = null;\n }\n translateYProgress.value = withTiming(\n screenHeight,\n { duration: TOAST_ANIMATION_DURATION },\n () => {\n scheduleOnRN(resetState);\n },\n );\n };\n\n innerRef.current = {\n closeToast,\n showToast,\n };\n\n useImperativeHandle(ref, () => innerRef.current as ToasterRef);\n\n useLayoutEffect(() => {\n registeredRef = innerRef;\n return () => {\n if (registeredRef === innerRef) {\n registeredRef = null;\n }\n };\n }, []);\n\n if (!toastOptions) {\n return null;\n }\n\n const { onClose: toastOnClose, twClassName: toastTwClassName } =\n toastOptions;\n const toastProps = getToastProps(toastOptions);\n const { actionButtonLabel, actionButtonOnPress, ...restToastProps } =\n toastProps;\n const toastTwClassNames = [twClassName, toastTwClassName]\n .filter(Boolean)\n .join(' ');\n\n const onAnimatedViewLayout = (e: LayoutChangeEvent) => {\n const { height } = e.nativeEvent.layout;\n const translateYToValue = -(TOAST_BOTTOM_PADDING + bottomNotchSpacing);\n\n translateYProgress.value = height;\n\n if (toastOptions.hasNoTimeout) {\n translateYProgress.value = withTiming(translateYToValue, {\n duration: TOAST_ANIMATION_DURATION,\n });\n } else {\n translateYProgress.value = withTiming(\n translateYToValue,\n { duration: TOAST_ANIMATION_DURATION },\n () => {\n translateYProgress.value = withDelay(\n TOAST_VISIBILITY_DURATION,\n withTiming(height, { duration: TOAST_ANIMATION_DURATION }, () =>\n scheduleOnRN(resetState),\n ),\n );\n },\n );\n }\n };\n\n return (\n <Animated.View\n onLayout={onAnimatedViewLayout}\n style={baseStyle}\n {...props}\n >\n {actionButtonLabel && actionButtonOnPress ? (\n <Toast\n {...toastProps}\n actionButtonLabel={actionButtonLabel}\n actionButtonOnPress={actionButtonOnPress}\n onClose={() => {\n closeToast();\n toastOnClose?.();\n }}\n twClassName={toastTwClassNames}\n />\n ) : (\n <Toast\n {...restToastProps}\n onClose={() => {\n closeToast();\n toastOnClose?.();\n }}\n twClassName={toastTwClassNames}\n />\n )}\n </Animated.View>\n );\n },\n);\n\nToasterComponent.displayName = 'Toaster';\n\ntype ToastFunction = ((options: ToastOptions) => void) & {\n dismiss: () => void;\n};\n\nexport const Toaster = ToasterComponent;\n\nexport const toast = ((options: ToastOptions) => {\n assertRegisteredRef('toast').showToast(options);\n}) as ToastFunction;\n\ntoast.dismiss = () => {\n assertRegisteredRef('dismiss').closeToast();\n};\n"]}
|
|
1
|
+
{"version":3,"file":"Toaster.cjs","sourceRoot":"","sources":["../../../src/components/Toast/Toaster.tsx"],"names":[],"mappings":"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","sourcesContent":["// Third party dependencies.\nimport { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useImperativeHandle,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { RefObject } from 'react';\nimport { Dimensions } from 'react-native';\nimport type { LayoutChangeEvent, StyleProp, ViewStyle } from 'react-native';\nimport Animated, {\n cancelAnimation,\n useAnimatedStyle,\n useSharedValue,\n withDelay,\n withSpring,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { scheduleOnRN } from 'react-native-worklets';\n\n// Internal dependencies.\nimport { Toast } from './Toast';\nimport {\n TOAST_SPRING_CONFIG,\n TOAST_TOP_PADDING,\n TOAST_VISIBILITY_DURATION,\n} from './Toast.constants';\nimport type {\n ToastOptions,\n ToastProps,\n ToasterProps,\n ToasterRef,\n} from './Toast.types';\n\nconst screenHeight = Dimensions.get('window').height;\n\nlet registeredRef: RefObject<ToasterRef | null> | null = null;\n\nconst assertRegisteredRef = (method: 'dismiss' | 'toast'): ToasterRef => {\n if (!registeredRef?.current) {\n const invocation = method === 'toast' ? 'toast()' : `toast.${method}()`;\n throw new Error(\n `${invocation} called before <Toaster /> mounted. Render <Toaster /> once at the root of your app.`,\n );\n }\n return registeredRef.current;\n};\n\nconst getToastProps = ({\n hasNoTimeout: _hasNoTimeout,\n onClose: _onClose,\n topOffset: _topOffset,\n twClassName: _twClassName,\n ...toastProps\n}: ToastOptions): Omit<ToastProps, 'twClassName'> => toastProps;\n\nconst getHiddenTranslateY = (height: number, offset: number) =>\n -(height + offset);\n\nconst ToasterComponent = forwardRef<ToasterRef, ToasterProps>(\n ({ twClassName, ...props }, ref) => {\n const tw = useTailwind();\n const [toastOptions, setToastOptions] = useState<ToastOptions | undefined>(\n undefined,\n );\n const replacementTimerRef = useRef<ReturnType<typeof setTimeout> | null>(\n null,\n );\n const { top: topInset } = useSafeAreaInsets();\n const toastHeight = useSharedValue(screenHeight);\n const translateYProgress = useSharedValue(-screenHeight);\n const topOffset = toastOptions?.topOffset ?? 0;\n const animatedStyle = useAnimatedStyle(() => ({\n transform: [{ translateY: translateYProgress.value + topOffset }],\n }));\n const baseStyle = useMemo(\n () =>\n [\n tw.style('absolute left-4 right-4 top-0'),\n animatedStyle,\n ] as StyleProp<ViewStyle>,\n [tw, animatedStyle],\n );\n const innerRef = useRef<ToasterRef | null>(null);\n\n const resetState = () => setToastOptions(undefined);\n\n const showToast = (options: ToastOptions) => {\n let timeoutDuration = 0;\n const normalizedOptions = {\n hasNoTimeout: false,\n ...options,\n };\n if (toastOptions) {\n cancelAnimation(translateYProgress);\n timeoutDuration = 100;\n setToastOptions(undefined);\n }\n if (replacementTimerRef.current !== null) {\n clearTimeout(replacementTimerRef.current);\n }\n replacementTimerRef.current = setTimeout(() => {\n replacementTimerRef.current = null;\n setToastOptions(normalizedOptions);\n }, timeoutDuration);\n };\n\n const closeToast = () => {\n if (replacementTimerRef.current !== null) {\n clearTimeout(replacementTimerRef.current);\n replacementTimerRef.current = null;\n }\n translateYProgress.value = withSpring(\n getHiddenTranslateY(toastHeight.value, topOffset),\n TOAST_SPRING_CONFIG,\n () => {\n scheduleOnRN(resetState);\n },\n );\n };\n\n innerRef.current = {\n closeToast,\n showToast,\n };\n\n useImperativeHandle(ref, () => innerRef.current as ToasterRef);\n\n useLayoutEffect(() => {\n registeredRef = innerRef;\n return () => {\n if (registeredRef === innerRef) {\n registeredRef = null;\n }\n };\n }, []);\n\n if (!toastOptions) {\n return null;\n }\n\n const { onClose: toastOnClose, twClassName: toastTwClassName } =\n toastOptions;\n const toastProps = getToastProps(toastOptions);\n const { actionButtonLabel, actionButtonOnPress, ...restToastProps } =\n toastProps;\n const toastTwClassNames = [twClassName, toastTwClassName]\n .filter(Boolean)\n .join(' ');\n\n const onAnimatedViewLayout = (e: LayoutChangeEvent) => {\n const { height } = e.nativeEvent.layout;\n const hiddenTranslateY = getHiddenTranslateY(height, topOffset);\n const visibleTranslateY = topInset + TOAST_TOP_PADDING;\n\n toastHeight.value = height;\n translateYProgress.value = hiddenTranslateY;\n\n if (toastOptions.hasNoTimeout) {\n translateYProgress.value = withSpring(\n visibleTranslateY,\n TOAST_SPRING_CONFIG,\n );\n } else {\n translateYProgress.value = withSpring(\n visibleTranslateY,\n TOAST_SPRING_CONFIG,\n () => {\n translateYProgress.value = withDelay(\n TOAST_VISIBILITY_DURATION,\n withSpring(hiddenTranslateY, TOAST_SPRING_CONFIG, () => {\n scheduleOnRN(resetState);\n }),\n );\n },\n );\n }\n };\n\n return (\n <Animated.View\n onLayout={onAnimatedViewLayout}\n style={baseStyle}\n {...props}\n >\n {actionButtonLabel && actionButtonOnPress ? (\n <Toast\n {...toastProps}\n actionButtonLabel={actionButtonLabel}\n actionButtonOnPress={actionButtonOnPress}\n onClose={() => {\n closeToast();\n toastOnClose?.();\n }}\n twClassName={toastTwClassNames}\n />\n ) : (\n <Toast\n {...restToastProps}\n onClose={() => {\n closeToast();\n toastOnClose?.();\n }}\n twClassName={toastTwClassNames}\n />\n )}\n </Animated.View>\n );\n },\n);\n\nToasterComponent.displayName = 'Toaster';\n\ntype ToastFunction = ((options: ToastOptions) => void) & {\n dismiss: () => void;\n};\n\nexport const Toaster = ToasterComponent;\n\nexport const toast = ((options: ToastOptions) => {\n assertRegisteredRef('toast').showToast(options);\n}) as ToastFunction;\n\ntoast.dismiss = () => {\n assertRegisteredRef('dismiss').closeToast();\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toaster.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toaster.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,cAAc;AAqBf,OAAO,KAAK,EACV,YAAY,EAGZ,UAAU,EACX,0BAAsB;
|
|
1
|
+
{"version":3,"file":"Toaster.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/Toaster.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,cAAc;AAqBf,OAAO,KAAK,EACV,YAAY,EAGZ,UAAU,EACX,0BAAsB;AAqLvB,KAAK,aAAa,GAAG,CAAC,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC,GAAG;IACvD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,OAAO;;sFAAmB,CAAC;AAExC,eAAO,MAAM,KAAK,eAEC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toaster.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toaster.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,cAAc;AAqBf,OAAO,KAAK,EACV,YAAY,EAGZ,UAAU,EACX,0BAAsB;
|
|
1
|
+
{"version":3,"file":"Toaster.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/Toaster.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,cAAc;AAqBf,OAAO,KAAK,EACV,YAAY,EAGZ,UAAU,EACX,0BAAsB;AAqLvB,KAAK,aAAa,GAAG,CAAC,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC,GAAG;IACvD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,OAAO;;sFAAmB,CAAC;AAExC,eAAO,MAAM,KAAK,eAEC,CAAC"}
|
|
@@ -9,12 +9,12 @@ import { useTailwind } from "@metamask/design-system-twrnc-preset";
|
|
|
9
9
|
import $React, { forwardRef, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
|
|
10
10
|
const React = $importDefault($React);
|
|
11
11
|
import { Dimensions } from "react-native";
|
|
12
|
-
import Animated, { cancelAnimation, useAnimatedStyle, useSharedValue, withDelay,
|
|
12
|
+
import Animated, { cancelAnimation, useAnimatedStyle, useSharedValue, withDelay, withSpring } from "react-native-reanimated";
|
|
13
13
|
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
|
14
14
|
import { scheduleOnRN } from "react-native-worklets";
|
|
15
15
|
// Internal dependencies.
|
|
16
16
|
import { Toast } from "./Toast.mjs";
|
|
17
|
-
import {
|
|
17
|
+
import { TOAST_SPRING_CONFIG, TOAST_TOP_PADDING, TOAST_VISIBILITY_DURATION } from "./Toast.constants.mjs";
|
|
18
18
|
const screenHeight = Dimensions.get('window').height;
|
|
19
19
|
let registeredRef = null;
|
|
20
20
|
const assertRegisteredRef = (method) => {
|
|
@@ -24,19 +24,21 @@ const assertRegisteredRef = (method) => {
|
|
|
24
24
|
}
|
|
25
25
|
return registeredRef.current;
|
|
26
26
|
};
|
|
27
|
-
const getToastProps = ({
|
|
27
|
+
const getToastProps = ({ hasNoTimeout: _hasNoTimeout, onClose: _onClose, topOffset: _topOffset, twClassName: _twClassName, ...toastProps }) => toastProps;
|
|
28
|
+
const getHiddenTranslateY = (height, offset) => -(height + offset);
|
|
28
29
|
const ToasterComponent = forwardRef(({ twClassName, ...props }, ref) => {
|
|
29
30
|
const tw = useTailwind();
|
|
30
31
|
const [toastOptions, setToastOptions] = useState(undefined);
|
|
31
32
|
const replacementTimerRef = useRef(null);
|
|
32
|
-
const {
|
|
33
|
-
const
|
|
34
|
-
const
|
|
33
|
+
const { top: topInset } = useSafeAreaInsets();
|
|
34
|
+
const toastHeight = useSharedValue(screenHeight);
|
|
35
|
+
const translateYProgress = useSharedValue(-screenHeight);
|
|
36
|
+
const topOffset = toastOptions?.topOffset ?? 0;
|
|
35
37
|
const animatedStyle = useAnimatedStyle(() => ({
|
|
36
|
-
transform: [{ translateY: translateYProgress.value
|
|
38
|
+
transform: [{ translateY: translateYProgress.value + topOffset }],
|
|
37
39
|
}));
|
|
38
40
|
const baseStyle = useMemo(() => [
|
|
39
|
-
tw.style('absolute left-4 right-4
|
|
41
|
+
tw.style('absolute left-4 right-4 top-0'),
|
|
40
42
|
animatedStyle,
|
|
41
43
|
], [tw, animatedStyle]);
|
|
42
44
|
const innerRef = useRef(null);
|
|
@@ -65,7 +67,7 @@ const ToasterComponent = forwardRef(({ twClassName, ...props }, ref) => {
|
|
|
65
67
|
clearTimeout(replacementTimerRef.current);
|
|
66
68
|
replacementTimerRef.current = null;
|
|
67
69
|
}
|
|
68
|
-
translateYProgress.value =
|
|
70
|
+
translateYProgress.value = withSpring(getHiddenTranslateY(toastHeight.value, topOffset), TOAST_SPRING_CONFIG, () => {
|
|
69
71
|
scheduleOnRN(resetState);
|
|
70
72
|
});
|
|
71
73
|
};
|
|
@@ -93,16 +95,18 @@ const ToasterComponent = forwardRef(({ twClassName, ...props }, ref) => {
|
|
|
93
95
|
.join(' ');
|
|
94
96
|
const onAnimatedViewLayout = (e) => {
|
|
95
97
|
const { height } = e.nativeEvent.layout;
|
|
96
|
-
const
|
|
97
|
-
|
|
98
|
+
const hiddenTranslateY = getHiddenTranslateY(height, topOffset);
|
|
99
|
+
const visibleTranslateY = topInset + TOAST_TOP_PADDING;
|
|
100
|
+
toastHeight.value = height;
|
|
101
|
+
translateYProgress.value = hiddenTranslateY;
|
|
98
102
|
if (toastOptions.hasNoTimeout) {
|
|
99
|
-
translateYProgress.value =
|
|
100
|
-
duration: TOAST_ANIMATION_DURATION,
|
|
101
|
-
});
|
|
103
|
+
translateYProgress.value = withSpring(visibleTranslateY, TOAST_SPRING_CONFIG);
|
|
102
104
|
}
|
|
103
105
|
else {
|
|
104
|
-
translateYProgress.value =
|
|
105
|
-
translateYProgress.value = withDelay(TOAST_VISIBILITY_DURATION,
|
|
106
|
+
translateYProgress.value = withSpring(visibleTranslateY, TOAST_SPRING_CONFIG, () => {
|
|
107
|
+
translateYProgress.value = withDelay(TOAST_VISIBILITY_DURATION, withSpring(hiddenTranslateY, TOAST_SPRING_CONFIG, () => {
|
|
108
|
+
scheduleOnRN(resetState);
|
|
109
|
+
}));
|
|
106
110
|
});
|
|
107
111
|
}
|
|
108
112
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toaster.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toaster.tsx"],"names":[],"mappings":"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","sourcesContent":["// Third party dependencies.\nimport { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useImperativeHandle,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { RefObject } from 'react';\nimport { Dimensions } from 'react-native';\nimport type { LayoutChangeEvent, StyleProp, ViewStyle } from 'react-native';\nimport Animated, {\n cancelAnimation,\n useAnimatedStyle,\n useSharedValue,\n withDelay,\n withTiming,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { scheduleOnRN } from 'react-native-worklets';\n\n// Internal dependencies.\nimport { Toast } from './Toast';\nimport {\n TOAST_ANIMATION_DURATION,\n TOAST_BOTTOM_PADDING,\n TOAST_VISIBILITY_DURATION,\n} from './Toast.constants';\nimport type {\n ToastOptions,\n ToastProps,\n ToasterProps,\n ToasterRef,\n} from './Toast.types';\n\nconst screenHeight = Dimensions.get('window').height;\n\nlet registeredRef: RefObject<ToasterRef | null> | null = null;\n\nconst assertRegisteredRef = (method: 'dismiss' | 'toast'): ToasterRef => {\n if (!registeredRef?.current) {\n const invocation = method === 'toast' ? 'toast()' : `toast.${method}()`;\n throw new Error(\n `${invocation} called before <Toaster /> mounted. Render <Toaster /> once at the root of your app.`,\n );\n }\n return registeredRef.current;\n};\n\nconst getToastProps = ({\n bottomOffset: _bottomOffset,\n hasNoTimeout: _hasNoTimeout,\n onClose: _onClose,\n twClassName: _twClassName,\n ...toastProps\n}: ToastOptions): Omit<ToastProps, 'twClassName'> => toastProps;\n\nconst ToasterComponent = forwardRef<ToasterRef, ToasterProps>(\n ({ twClassName, ...props }, ref) => {\n const tw = useTailwind();\n const [toastOptions, setToastOptions] = useState<ToastOptions | undefined>(\n undefined,\n );\n const replacementTimerRef = useRef<ReturnType<typeof setTimeout> | null>(\n null,\n );\n const { bottom: bottomNotchSpacing } = useSafeAreaInsets();\n const translateYProgress = useSharedValue(screenHeight);\n const bottomOffset = toastOptions?.bottomOffset ?? 0;\n const animatedStyle = useAnimatedStyle(() => ({\n transform: [{ translateY: translateYProgress.value - bottomOffset }],\n }));\n const baseStyle = useMemo(\n () =>\n [\n tw.style('absolute left-4 right-4 bottom-0'),\n animatedStyle,\n ] as StyleProp<ViewStyle>,\n [tw, animatedStyle],\n );\n const innerRef = useRef<ToasterRef | null>(null);\n\n const resetState = () => setToastOptions(undefined);\n\n const showToast = (options: ToastOptions) => {\n let timeoutDuration = 0;\n const normalizedOptions = {\n hasNoTimeout: false,\n ...options,\n };\n if (toastOptions) {\n cancelAnimation(translateYProgress);\n timeoutDuration = 100;\n setToastOptions(undefined);\n }\n if (replacementTimerRef.current !== null) {\n clearTimeout(replacementTimerRef.current);\n }\n replacementTimerRef.current = setTimeout(() => {\n replacementTimerRef.current = null;\n setToastOptions(normalizedOptions);\n }, timeoutDuration);\n };\n\n const closeToast = () => {\n if (replacementTimerRef.current !== null) {\n clearTimeout(replacementTimerRef.current);\n replacementTimerRef.current = null;\n }\n translateYProgress.value = withTiming(\n screenHeight,\n { duration: TOAST_ANIMATION_DURATION },\n () => {\n scheduleOnRN(resetState);\n },\n );\n };\n\n innerRef.current = {\n closeToast,\n showToast,\n };\n\n useImperativeHandle(ref, () => innerRef.current as ToasterRef);\n\n useLayoutEffect(() => {\n registeredRef = innerRef;\n return () => {\n if (registeredRef === innerRef) {\n registeredRef = null;\n }\n };\n }, []);\n\n if (!toastOptions) {\n return null;\n }\n\n const { onClose: toastOnClose, twClassName: toastTwClassName } =\n toastOptions;\n const toastProps = getToastProps(toastOptions);\n const { actionButtonLabel, actionButtonOnPress, ...restToastProps } =\n toastProps;\n const toastTwClassNames = [twClassName, toastTwClassName]\n .filter(Boolean)\n .join(' ');\n\n const onAnimatedViewLayout = (e: LayoutChangeEvent) => {\n const { height } = e.nativeEvent.layout;\n const translateYToValue = -(TOAST_BOTTOM_PADDING + bottomNotchSpacing);\n\n translateYProgress.value = height;\n\n if (toastOptions.hasNoTimeout) {\n translateYProgress.value = withTiming(translateYToValue, {\n duration: TOAST_ANIMATION_DURATION,\n });\n } else {\n translateYProgress.value = withTiming(\n translateYToValue,\n { duration: TOAST_ANIMATION_DURATION },\n () => {\n translateYProgress.value = withDelay(\n TOAST_VISIBILITY_DURATION,\n withTiming(height, { duration: TOAST_ANIMATION_DURATION }, () =>\n scheduleOnRN(resetState),\n ),\n );\n },\n );\n }\n };\n\n return (\n <Animated.View\n onLayout={onAnimatedViewLayout}\n style={baseStyle}\n {...props}\n >\n {actionButtonLabel && actionButtonOnPress ? (\n <Toast\n {...toastProps}\n actionButtonLabel={actionButtonLabel}\n actionButtonOnPress={actionButtonOnPress}\n onClose={() => {\n closeToast();\n toastOnClose?.();\n }}\n twClassName={toastTwClassNames}\n />\n ) : (\n <Toast\n {...restToastProps}\n onClose={() => {\n closeToast();\n toastOnClose?.();\n }}\n twClassName={toastTwClassNames}\n />\n )}\n </Animated.View>\n );\n },\n);\n\nToasterComponent.displayName = 'Toaster';\n\ntype ToastFunction = ((options: ToastOptions) => void) & {\n dismiss: () => void;\n};\n\nexport const Toaster = ToasterComponent;\n\nexport const toast = ((options: ToastOptions) => {\n assertRegisteredRef('toast').showToast(options);\n}) as ToastFunction;\n\ntoast.dismiss = () => {\n assertRegisteredRef('dismiss').closeToast();\n};\n"]}
|
|
1
|
+
{"version":3,"file":"Toaster.mjs","sourceRoot":"","sources":["../../../src/components/Toast/Toaster.tsx"],"names":[],"mappings":"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","sourcesContent":["// Third party dependencies.\nimport { useTailwind } from '@metamask/design-system-twrnc-preset';\nimport React, {\n forwardRef,\n useImperativeHandle,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { RefObject } from 'react';\nimport { Dimensions } from 'react-native';\nimport type { LayoutChangeEvent, StyleProp, ViewStyle } from 'react-native';\nimport Animated, {\n cancelAnimation,\n useAnimatedStyle,\n useSharedValue,\n withDelay,\n withSpring,\n} from 'react-native-reanimated';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport { scheduleOnRN } from 'react-native-worklets';\n\n// Internal dependencies.\nimport { Toast } from './Toast';\nimport {\n TOAST_SPRING_CONFIG,\n TOAST_TOP_PADDING,\n TOAST_VISIBILITY_DURATION,\n} from './Toast.constants';\nimport type {\n ToastOptions,\n ToastProps,\n ToasterProps,\n ToasterRef,\n} from './Toast.types';\n\nconst screenHeight = Dimensions.get('window').height;\n\nlet registeredRef: RefObject<ToasterRef | null> | null = null;\n\nconst assertRegisteredRef = (method: 'dismiss' | 'toast'): ToasterRef => {\n if (!registeredRef?.current) {\n const invocation = method === 'toast' ? 'toast()' : `toast.${method}()`;\n throw new Error(\n `${invocation} called before <Toaster /> mounted. Render <Toaster /> once at the root of your app.`,\n );\n }\n return registeredRef.current;\n};\n\nconst getToastProps = ({\n hasNoTimeout: _hasNoTimeout,\n onClose: _onClose,\n topOffset: _topOffset,\n twClassName: _twClassName,\n ...toastProps\n}: ToastOptions): Omit<ToastProps, 'twClassName'> => toastProps;\n\nconst getHiddenTranslateY = (height: number, offset: number) =>\n -(height + offset);\n\nconst ToasterComponent = forwardRef<ToasterRef, ToasterProps>(\n ({ twClassName, ...props }, ref) => {\n const tw = useTailwind();\n const [toastOptions, setToastOptions] = useState<ToastOptions | undefined>(\n undefined,\n );\n const replacementTimerRef = useRef<ReturnType<typeof setTimeout> | null>(\n null,\n );\n const { top: topInset } = useSafeAreaInsets();\n const toastHeight = useSharedValue(screenHeight);\n const translateYProgress = useSharedValue(-screenHeight);\n const topOffset = toastOptions?.topOffset ?? 0;\n const animatedStyle = useAnimatedStyle(() => ({\n transform: [{ translateY: translateYProgress.value + topOffset }],\n }));\n const baseStyle = useMemo(\n () =>\n [\n tw.style('absolute left-4 right-4 top-0'),\n animatedStyle,\n ] as StyleProp<ViewStyle>,\n [tw, animatedStyle],\n );\n const innerRef = useRef<ToasterRef | null>(null);\n\n const resetState = () => setToastOptions(undefined);\n\n const showToast = (options: ToastOptions) => {\n let timeoutDuration = 0;\n const normalizedOptions = {\n hasNoTimeout: false,\n ...options,\n };\n if (toastOptions) {\n cancelAnimation(translateYProgress);\n timeoutDuration = 100;\n setToastOptions(undefined);\n }\n if (replacementTimerRef.current !== null) {\n clearTimeout(replacementTimerRef.current);\n }\n replacementTimerRef.current = setTimeout(() => {\n replacementTimerRef.current = null;\n setToastOptions(normalizedOptions);\n }, timeoutDuration);\n };\n\n const closeToast = () => {\n if (replacementTimerRef.current !== null) {\n clearTimeout(replacementTimerRef.current);\n replacementTimerRef.current = null;\n }\n translateYProgress.value = withSpring(\n getHiddenTranslateY(toastHeight.value, topOffset),\n TOAST_SPRING_CONFIG,\n () => {\n scheduleOnRN(resetState);\n },\n );\n };\n\n innerRef.current = {\n closeToast,\n showToast,\n };\n\n useImperativeHandle(ref, () => innerRef.current as ToasterRef);\n\n useLayoutEffect(() => {\n registeredRef = innerRef;\n return () => {\n if (registeredRef === innerRef) {\n registeredRef = null;\n }\n };\n }, []);\n\n if (!toastOptions) {\n return null;\n }\n\n const { onClose: toastOnClose, twClassName: toastTwClassName } =\n toastOptions;\n const toastProps = getToastProps(toastOptions);\n const { actionButtonLabel, actionButtonOnPress, ...restToastProps } =\n toastProps;\n const toastTwClassNames = [twClassName, toastTwClassName]\n .filter(Boolean)\n .join(' ');\n\n const onAnimatedViewLayout = (e: LayoutChangeEvent) => {\n const { height } = e.nativeEvent.layout;\n const hiddenTranslateY = getHiddenTranslateY(height, topOffset);\n const visibleTranslateY = topInset + TOAST_TOP_PADDING;\n\n toastHeight.value = height;\n translateYProgress.value = hiddenTranslateY;\n\n if (toastOptions.hasNoTimeout) {\n translateYProgress.value = withSpring(\n visibleTranslateY,\n TOAST_SPRING_CONFIG,\n );\n } else {\n translateYProgress.value = withSpring(\n visibleTranslateY,\n TOAST_SPRING_CONFIG,\n () => {\n translateYProgress.value = withDelay(\n TOAST_VISIBILITY_DURATION,\n withSpring(hiddenTranslateY, TOAST_SPRING_CONFIG, () => {\n scheduleOnRN(resetState);\n }),\n );\n },\n );\n }\n };\n\n return (\n <Animated.View\n onLayout={onAnimatedViewLayout}\n style={baseStyle}\n {...props}\n >\n {actionButtonLabel && actionButtonOnPress ? (\n <Toast\n {...toastProps}\n actionButtonLabel={actionButtonLabel}\n actionButtonOnPress={actionButtonOnPress}\n onClose={() => {\n closeToast();\n toastOnClose?.();\n }}\n twClassName={toastTwClassNames}\n />\n ) : (\n <Toast\n {...restToastProps}\n onClose={() => {\n closeToast();\n toastOnClose?.();\n }}\n twClassName={toastTwClassNames}\n />\n )}\n </Animated.View>\n );\n },\n);\n\nToasterComponent.displayName = 'Toaster';\n\ntype ToastFunction = ((options: ToastOptions) => void) & {\n dismiss: () => void;\n};\n\nexport const Toaster = ToasterComponent;\n\nexport const toast = ((options: ToastOptions) => {\n assertRegisteredRef('toast').showToast(options);\n}) as ToastFunction;\n\ntoast.dismiss = () => {\n assertRegisteredRef('dismiss').closeToast();\n};\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.
|
|
3
|
+
exports.TOAST_TOP_PADDING = exports.ToastSeverity = exports.toast = exports.Toaster = exports.Toast = void 0;
|
|
4
4
|
var Toast_1 = require("./Toast.cjs");
|
|
5
5
|
Object.defineProperty(exports, "Toast", { enumerable: true, get: function () { return Toast_1.Toast; } });
|
|
6
6
|
var Toaster_1 = require("./Toaster.cjs");
|
|
@@ -9,5 +9,5 @@ Object.defineProperty(exports, "toast", { enumerable: true, get: function () { r
|
|
|
9
9
|
var design_system_shared_1 = require("@metamask/design-system-shared");
|
|
10
10
|
Object.defineProperty(exports, "ToastSeverity", { enumerable: true, get: function () { return design_system_shared_1.ToastSeverity; } });
|
|
11
11
|
var Toast_constants_1 = require("./Toast.constants.cjs");
|
|
12
|
-
Object.defineProperty(exports, "
|
|
12
|
+
Object.defineProperty(exports, "TOAST_TOP_PADDING", { enumerable: true, get: function () { return Toast_constants_1.TOAST_TOP_PADDING; } });
|
|
13
13
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/Toast/index.ts"],"names":[],"mappings":";;;AAAA,qCAAgC;AAAvB,8FAAA,KAAK,OAAA;AACd,yCAA2C;AAAlC,kGAAA,OAAO,OAAA;AAAE,gGAAA,KAAK,OAAA;AACvB,uEAA+D;AAAtD,qHAAA,aAAa,OAAA;AAQtB,
|
|
1
|
+
{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/Toast/index.ts"],"names":[],"mappings":";;;AAAA,qCAAgC;AAAvB,8FAAA,KAAK,OAAA;AACd,yCAA2C;AAAlC,kGAAA,OAAO,OAAA;AAAE,gGAAA,KAAK,OAAA;AACvB,uEAA+D;AAAtD,qHAAA,aAAa,OAAA;AAQtB,yDAAsD;AAA7C,oHAAA,iBAAiB,OAAA","sourcesContent":["export { Toast } from './Toast';\nexport { Toaster, toast } from './Toaster';\nexport { ToastSeverity } from '@metamask/design-system-shared';\nexport type {\n ToastOptions,\n ToastProps,\n ToastIconProps,\n ToasterProps,\n ToasterRef,\n} from './Toast.types';\nexport { TOAST_TOP_PADDING } from './Toast.constants';\n"]}
|
|
@@ -2,5 +2,5 @@ export { Toast } from "./Toast.cjs";
|
|
|
2
2
|
export { Toaster, toast } from "./Toaster.cjs";
|
|
3
3
|
export { ToastSeverity } from "@metamask/design-system-shared";
|
|
4
4
|
export type { ToastOptions, ToastProps, ToastIconProps, ToasterProps, ToasterRef, } from "./Toast.types.cjs";
|
|
5
|
-
export {
|
|
5
|
+
export { TOAST_TOP_PADDING } from "./Toast.constants.cjs";
|
|
6
6
|
//# sourceMappingURL=index.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,oBAAgB;AAChC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,sBAAkB;AAC3C,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAC/D,YAAY,EACV,YAAY,EACZ,UAAU,EACV,cAAc,EACd,YAAY,EACZ,UAAU,GACX,0BAAsB;AACvB,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/Toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,oBAAgB;AAChC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,sBAAkB;AAC3C,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAC/D,YAAY,EACV,YAAY,EACZ,UAAU,EACV,cAAc,EACd,YAAY,EACZ,UAAU,GACX,0BAAsB;AACvB,OAAO,EAAE,iBAAiB,EAAE,8BAA0B"}
|
|
@@ -2,5 +2,5 @@ export { Toast } from "./Toast.mjs";
|
|
|
2
2
|
export { Toaster, toast } from "./Toaster.mjs";
|
|
3
3
|
export { ToastSeverity } from "@metamask/design-system-shared";
|
|
4
4
|
export type { ToastOptions, ToastProps, ToastIconProps, ToasterProps, ToasterRef, } from "./Toast.types.mjs";
|
|
5
|
-
export {
|
|
5
|
+
export { TOAST_TOP_PADDING } from "./Toast.constants.mjs";
|
|
6
6
|
//# sourceMappingURL=index.d.mts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,oBAAgB;AAChC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,sBAAkB;AAC3C,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAC/D,YAAY,EACV,YAAY,EACZ,UAAU,EACV,cAAc,EACd,YAAY,EACZ,UAAU,GACX,0BAAsB;AACvB,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/Toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,oBAAgB;AAChC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,sBAAkB;AAC3C,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAC/D,YAAY,EACV,YAAY,EACZ,UAAU,EACV,cAAc,EACd,YAAY,EACZ,UAAU,GACX,0BAAsB;AACvB,OAAO,EAAE,iBAAiB,EAAE,8BAA0B"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { Toast } from "./Toast.mjs";
|
|
2
2
|
export { Toaster, toast } from "./Toaster.mjs";
|
|
3
3
|
export { ToastSeverity } from "@metamask/design-system-shared";
|
|
4
|
-
export {
|
|
4
|
+
export { TOAST_TOP_PADDING } from "./Toast.constants.mjs";
|
|
5
5
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/Toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,oBAAgB;AAChC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,sBAAkB;AAC3C,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAQ/D,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/Toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,oBAAgB;AAChC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,sBAAkB;AAC3C,OAAO,EAAE,aAAa,EAAE,uCAAuC;AAQ/D,OAAO,EAAE,iBAAiB,EAAE,8BAA0B","sourcesContent":["export { Toast } from './Toast';\nexport { Toaster, toast } from './Toaster';\nexport { ToastSeverity } from '@metamask/design-system-shared';\nexport type {\n ToastOptions,\n ToastProps,\n ToastIconProps,\n ToasterProps,\n ToasterRef,\n} from './Toast.types';\nexport { TOAST_TOP_PADDING } from './Toast.constants';\n"]}
|