@xfers/design-system 4.4.2-dev.fe0cf9b6aa → 4.4.2-dev.ff0d6744f6
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/cjs/StraitsXPersonalAccountLightLogo-b6f06da0.js.map +1 -1
- package/cjs/index.js +9 -9
- package/cjs/index.js.map +1 -1
- package/dist/components/Tag/const.js +79 -0
- package/dist/components/Tag/const.js.map +1 -0
- package/dist/components/Tag/index.js +39 -0
- package/dist/components/Tag/index.js.map +1 -0
- package/dist/constants/Colors/colors.js +7 -7
- package/dist/index.js +4 -9
- package/dist/index.js.map +1 -1
- package/dist/logos/EmptyStraitsX.js.map +1 -1
- package/dist/types/components/Tag/const.d.ts +21 -0
- package/dist/types/components/Tag/index.d.ts +11 -0
- package/dist/types/constants/Colors/colors.d.ts +7 -7
- package/dist/types/index.d.ts +1 -3
- package/es/StraitsXPersonalAccountLightLogo-88865b98.js.map +1 -1
- package/es/index.js +9 -9
- package/es/index.js.map +1 -1
- package/package.json +1 -1
- package/dist/components/Coachmark/getJoyrideConfig.js +0 -37
- package/dist/components/Coachmark/getJoyrideConfig.js.map +0 -1
- package/dist/components/Coachmark/index.js +0 -64
- package/dist/components/Coachmark/index.js.map +0 -1
- package/dist/components/Label/index.js +0 -91
- package/dist/components/Label/index.js.map +0 -1
- package/dist/types/components/Coachmark/getJoyrideConfig.d.ts +0 -33
- package/dist/types/components/Coachmark/index.d.ts +0 -49
- package/dist/types/components/Label/index.d.ts +0 -9
package/package.json
CHANGED
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.getCoachmarkJoyrideConfig = getCoachmarkJoyrideConfig;
|
|
4
|
-
var theme_1 = require("src/theme/theme");
|
|
5
|
-
/**
|
|
6
|
-
* Get the default Joyride configuration for Coachmark component.
|
|
7
|
-
* This includes the arrow styling that matches the Coachmark design.
|
|
8
|
-
*
|
|
9
|
-
* @param options - Optional configuration overrides
|
|
10
|
-
* @returns Joyride configuration object with floaterProps and styles
|
|
11
|
-
*
|
|
12
|
-
* @example
|
|
13
|
-
* ```tsx
|
|
14
|
-
* import { Coachmark, getCoachmarkJoyrideConfig } from '@xfers/design-system'
|
|
15
|
-
* import Joyride from 'react-joyride'
|
|
16
|
-
*
|
|
17
|
-
* <Joyride
|
|
18
|
-
* tooltipComponent={Coachmark}
|
|
19
|
-
* {...getCoachmarkJoyrideConfig()}
|
|
20
|
-
* />
|
|
21
|
-
* ```
|
|
22
|
-
*/
|
|
23
|
-
function getCoachmarkJoyrideConfig(options) {
|
|
24
|
-
var _a = options || {}, _b = _a.arrowColor, arrowColor = _b === void 0 ? theme_1.straitsXTheme.color.surface.secondaryNeutral : _b, _c = _a.arrowLength, arrowLength = _c === void 0 ? 8 : _c, _d = _a.arrowSpread, arrowSpread = _d === void 0 ? 16 : _d;
|
|
25
|
-
return {
|
|
26
|
-
floaterProps: {
|
|
27
|
-
styles: {
|
|
28
|
-
arrow: {
|
|
29
|
-
length: arrowLength,
|
|
30
|
-
spread: arrowSpread,
|
|
31
|
-
color: arrowColor,
|
|
32
|
-
},
|
|
33
|
-
},
|
|
34
|
-
},
|
|
35
|
-
};
|
|
36
|
-
}
|
|
37
|
-
//# sourceMappingURL=getJoyrideConfig.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"getJoyrideConfig.js","sourceRoot":"","sources":["../../../src/components/Coachmark/getJoyrideConfig.ts"],"names":[],"mappings":";;AAoBA,8DAsBC;AA1CD,yCAA+C;AAE/C;;;;;;;;;;;;;;;;;GAiBG;AACH,SAAgB,yBAAyB,CAAC,OAIzC;IACO,IAAA,KAIF,OAAO,IAAI,EAAE,EAHf,kBAAyD,EAAzD,UAAU,mBAAG,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,KAAA,EACzD,mBAAe,EAAf,WAAW,mBAAG,CAAC,KAAA,EACf,mBAAgB,EAAhB,WAAW,mBAAG,EAAE,KACD,CAAA;IAEjB,OAAO;QACL,YAAY,EAAE;YACZ,MAAM,EAAE;gBACN,KAAK,EAAE;oBACL,MAAM,EAAE,WAAW;oBACnB,MAAM,EAAE,WAAW;oBACnB,KAAK,EAAE,UAAU;iBAClB;aACF;SACF;KACF,CAAA;AACH,CAAC"}
|
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
-
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
-
return cooked;
|
|
5
|
-
};
|
|
6
|
-
var __assign = (this && this.__assign) || function () {
|
|
7
|
-
__assign = Object.assign || function(t) {
|
|
8
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
-
s = arguments[i];
|
|
10
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
11
|
-
t[p] = s[p];
|
|
12
|
-
}
|
|
13
|
-
return t;
|
|
14
|
-
};
|
|
15
|
-
return __assign.apply(this, arguments);
|
|
16
|
-
};
|
|
17
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
18
|
-
exports.default = Coachmark;
|
|
19
|
-
var styled_1 = require("@emotion/styled");
|
|
20
|
-
var react_1 = require("react");
|
|
21
|
-
var Typography_1 = require("src/constants/Typography/Typography");
|
|
22
|
-
var MaterialSymbols_1 = require("src/icons/MaterialSymbols");
|
|
23
|
-
var theme_1 = require("src/theme/theme");
|
|
24
|
-
var Link_1 = require("../Link");
|
|
25
|
-
function Coachmark(_a) {
|
|
26
|
-
var index = _a.index, primaryProps = _a.primaryProps, size = _a.size, step = _a.step, tooltipProps = _a.tooltipProps, backProps = _a.backProps, closeProps = _a.closeProps;
|
|
27
|
-
var title = step.title, content = step.content, data = step.data;
|
|
28
|
-
return (react_1.default.createElement(Container, __assign({}, tooltipProps),
|
|
29
|
-
react_1.default.createElement(TextContainer, null,
|
|
30
|
-
react_1.default.createElement(Header, null,
|
|
31
|
-
react_1.default.createElement(Typography_1.Typography.Label, { size: "md" }, title),
|
|
32
|
-
react_1.default.createElement(SkipAction, __assign({}, closeProps),
|
|
33
|
-
react_1.default.createElement(MaterialSymbols_1.MaterialSymbols, { icon: "close", size: "m" }))),
|
|
34
|
-
react_1.default.createElement(Typography_1.Typography.Body, { size: "md" }, content)),
|
|
35
|
-
react_1.default.createElement(Footer, null,
|
|
36
|
-
react_1.default.createElement(Dots, null, Array.from({ length: size }, function (_, i) {
|
|
37
|
-
if (index === 0 && (data === null || data === void 0 ? void 0 : data.skipZeroIndex) === true) {
|
|
38
|
-
return react_1.default.createElement(react_1.default.Fragment, null);
|
|
39
|
-
}
|
|
40
|
-
return react_1.default.createElement(Dot, { key: i, isActive: i === index });
|
|
41
|
-
})),
|
|
42
|
-
react_1.default.createElement(ButtonContainer, null,
|
|
43
|
-
backProps && (react_1.default.createElement(BackButton, __assign({ typographyType: "label", size: "md" }, backProps, { isDisabled: index === 0, isUnderlined: false }), "Back")),
|
|
44
|
-
react_1.default.createElement(Link_1.default, __assign({ typographyType: "label", size: "md" }, primaryProps, { isUnderlined: false }), "Next")))));
|
|
45
|
-
}
|
|
46
|
-
var Container = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 8px;\n display: flex;\n flex-direction: column;\n gap: 24px;\n padding: 12px;\n min-width: 200px;\n max-width: 260px;\n"], ["\n background-color: ", ";\n border-radius: 8px;\n display: flex;\n flex-direction: column;\n gap: 24px;\n padding: 12px;\n min-width: 200px;\n max-width: 260px;\n"])), theme_1.straitsXTheme.color.surface.secondaryNeutral);
|
|
47
|
-
var TextContainer = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 12px;\n color: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n gap: 12px;\n color: ", ";\n"])), theme_1.straitsXTheme.color.base.onNeutral);
|
|
48
|
-
var Header = styled_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
49
|
-
var SkipAction = (0, styled_1.default)(Link_1.default)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n text-decoration: none !important;\n"], ["\n text-decoration: none !important;\n"])));
|
|
50
|
-
var Footer = styled_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
51
|
-
var Dots = styled_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n"])));
|
|
52
|
-
var Dot = styled_1.default.span(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background-color: ", ";\n"], ["\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background-color: ", ";\n"])), function (props) {
|
|
53
|
-
return props.isActive
|
|
54
|
-
? "".concat(theme_1.straitsXTheme.color.base.primary3)
|
|
55
|
-
: "".concat(theme_1.straitsXTheme.color.surface.disabledOnSurface);
|
|
56
|
-
});
|
|
57
|
-
var BackButton = (0, styled_1.default)(Link_1.default)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n h5 {\n color: ", ";\n }\n pointer-events: ", ";\n"], ["\n h5 {\n color: ", ";\n }\n pointer-events: ", ";\n"])), function (props) {
|
|
58
|
-
return props.isDisabled
|
|
59
|
-
? "".concat(theme_1.straitsXTheme.color.surface.disabledOnSurface)
|
|
60
|
-
: "".concat(theme_1.straitsXTheme.color.base.link);
|
|
61
|
-
}, function (props) { return (props.isDisabled ? 'none' : 'auto'); });
|
|
62
|
-
var ButtonContainer = styled_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n display: flex;\n gap: 8px;\n"], ["\n display: flex;\n gap: 8px;\n"])));
|
|
63
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
|
|
64
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Coachmark/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,91 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
-
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
-
return cooked;
|
|
5
|
-
};
|
|
6
|
-
var __assign = (this && this.__assign) || function () {
|
|
7
|
-
__assign = Object.assign || function(t) {
|
|
8
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
-
s = arguments[i];
|
|
10
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
11
|
-
t[p] = s[p];
|
|
12
|
-
}
|
|
13
|
-
return t;
|
|
14
|
-
};
|
|
15
|
-
return __assign.apply(this, arguments);
|
|
16
|
-
};
|
|
17
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
18
|
-
var t = {};
|
|
19
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
20
|
-
t[p] = s[p];
|
|
21
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
22
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
23
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
24
|
-
t[p[i]] = s[p[i]];
|
|
25
|
-
}
|
|
26
|
-
return t;
|
|
27
|
-
};
|
|
28
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
-
exports.default = default_1;
|
|
30
|
-
var react_1 = require("react");
|
|
31
|
-
var styled_1 = require("@emotion/styled");
|
|
32
|
-
var ColorStyles_1 = require("src/shared/ColorStyles");
|
|
33
|
-
var TypographyStyles_1 = require("src/shared/TypographyStyles");
|
|
34
|
-
var success_svg_1 = require("./success.svg");
|
|
35
|
-
var error_svg_1 = require("./error.svg");
|
|
36
|
-
var warning_svg_1 = require("./warning.svg");
|
|
37
|
-
var neutral_svg_1 = require("./neutral.svg");
|
|
38
|
-
var info_svg_1 = require("./info.svg");
|
|
39
|
-
var BASE_COLORS = {
|
|
40
|
-
success: ColorStyles_1.BACKGROUND_COLORS.SUCCESS,
|
|
41
|
-
error: ColorStyles_1.BACKGROUND_COLORS.ERROR,
|
|
42
|
-
warning: ColorStyles_1.BACKGROUND_COLORS.WARNING,
|
|
43
|
-
info: ColorStyles_1.BACKGROUND_COLORS.INFO,
|
|
44
|
-
neutral: ColorStyles_1.BACKGROUND_COLORS.NEUTRAL
|
|
45
|
-
};
|
|
46
|
-
var PAYLOAD_COLORS = {
|
|
47
|
-
success: ColorStyles_1.TEXT_COLORS.SUCCESS,
|
|
48
|
-
error: ColorStyles_1.TEXT_COLORS.ERROR,
|
|
49
|
-
warning: ColorStyles_1.TEXT_COLORS.WARNING,
|
|
50
|
-
info: ColorStyles_1.TEXT_COLORS.INFO,
|
|
51
|
-
neutral: ColorStyles_1.NEUTRAL_COLORS.G500
|
|
52
|
-
};
|
|
53
|
-
var BORDER_COLORS = {
|
|
54
|
-
success: ColorStyles_1.GREEN_COLORS.G400,
|
|
55
|
-
error: ColorStyles_1.RED_COLORS.R400,
|
|
56
|
-
warning: ColorStyles_1.YELLOW_COLORS.Y300,
|
|
57
|
-
info: ColorStyles_1.BLUE_COLORS.B300,
|
|
58
|
-
neutral: ColorStyles_1.NEUTRAL_COLORS.G300
|
|
59
|
-
};
|
|
60
|
-
function default_1(_a) {
|
|
61
|
-
var type = _a.type, children = _a.children, _b = _a.icon, icon = _b === void 0 ? false : _b, rest = __rest(_a, ["type", "children", "icon"]);
|
|
62
|
-
var iconElement;
|
|
63
|
-
switch (type) {
|
|
64
|
-
case 'success': {
|
|
65
|
-
iconElement = (react_1.default.createElement(success_svg_1.default, { style: { width: '13px', marginRight: '4px', marginTop: '2px' } }));
|
|
66
|
-
break;
|
|
67
|
-
}
|
|
68
|
-
case 'error': {
|
|
69
|
-
iconElement = (react_1.default.createElement(error_svg_1.default, { style: { width: '9px', marginRight: '4px', marginTop: '0px' } }));
|
|
70
|
-
break;
|
|
71
|
-
}
|
|
72
|
-
case 'warning': {
|
|
73
|
-
iconElement = (react_1.default.createElement(warning_svg_1.default, { style: { width: '14px', marginRight: '4px', marginTop: '0px' } }));
|
|
74
|
-
break;
|
|
75
|
-
}
|
|
76
|
-
case 'info': {
|
|
77
|
-
iconElement = (react_1.default.createElement(info_svg_1.default, { style: { width: '14px', marginRight: '4px', marginTop: '0px' } }));
|
|
78
|
-
break;
|
|
79
|
-
}
|
|
80
|
-
case 'neutral': {
|
|
81
|
-
iconElement = (react_1.default.createElement(neutral_svg_1.default, { style: { width: '14px', marginRight: '4px', marginTop: '0px' } }));
|
|
82
|
-
break;
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
return (react_1.default.createElement(Base, __assign({ type: type }, rest),
|
|
86
|
-
icon && iconElement,
|
|
87
|
-
children));
|
|
88
|
-
}
|
|
89
|
-
var Base = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n -webkit-font-smoothing: antialiased;\n border-radius: 14px;\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n height: 28px;\n display: inline-flex;\n align-items: center;\n padding-right: 15px;\n padding-left: 15px;\n text-transform: capitalize;\n\n ", ";\n"], ["\n -webkit-font-smoothing: antialiased;\n border-radius: 14px;\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n height: 28px;\n display: inline-flex;\n align-items: center;\n padding-right: 15px;\n padding-left: 15px;\n text-transform: capitalize;\n\n ", ";\n"])), TypographyStyles_1.MAIN_FONT, TypographyStyles_1.FONT_SIZE.P1, function (props) { return "\n background-color: ".concat(BASE_COLORS[props.type], ";\n color: ").concat(PAYLOAD_COLORS[props.type], " !important;\n border: 1px solid ").concat(BORDER_COLORS[props.type], ";\n "); });
|
|
90
|
-
var templateObject_1;
|
|
91
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Label/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Get the default Joyride configuration for Coachmark component.
|
|
3
|
-
* This includes the arrow styling that matches the Coachmark design.
|
|
4
|
-
*
|
|
5
|
-
* @param options - Optional configuration overrides
|
|
6
|
-
* @returns Joyride configuration object with floaterProps and styles
|
|
7
|
-
*
|
|
8
|
-
* @example
|
|
9
|
-
* ```tsx
|
|
10
|
-
* import { Coachmark, getCoachmarkJoyrideConfig } from '@xfers/design-system'
|
|
11
|
-
* import Joyride from 'react-joyride'
|
|
12
|
-
*
|
|
13
|
-
* <Joyride
|
|
14
|
-
* tooltipComponent={Coachmark}
|
|
15
|
-
* {...getCoachmarkJoyrideConfig()}
|
|
16
|
-
* />
|
|
17
|
-
* ```
|
|
18
|
-
*/
|
|
19
|
-
export declare function getCoachmarkJoyrideConfig(options?: {
|
|
20
|
-
arrowColor?: string;
|
|
21
|
-
arrowLength?: number;
|
|
22
|
-
arrowSpread?: number;
|
|
23
|
-
}): {
|
|
24
|
-
floaterProps: {
|
|
25
|
-
styles: {
|
|
26
|
-
arrow: {
|
|
27
|
-
length: number;
|
|
28
|
-
spread: number;
|
|
29
|
-
color: string;
|
|
30
|
-
};
|
|
31
|
-
};
|
|
32
|
-
};
|
|
33
|
-
};
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
import React, { ReactNode, RefCallback } from 'react';
|
|
2
|
-
type CoachmarkProps = {
|
|
3
|
-
continuous: boolean;
|
|
4
|
-
index: number;
|
|
5
|
-
isLastStep: boolean;
|
|
6
|
-
size: number;
|
|
7
|
-
step: {
|
|
8
|
-
title?: ReactNode;
|
|
9
|
-
content: ReactNode;
|
|
10
|
-
data?: {
|
|
11
|
-
skipZeroIndex?: boolean;
|
|
12
|
-
};
|
|
13
|
-
};
|
|
14
|
-
backProps: {
|
|
15
|
-
'aria-label': string;
|
|
16
|
-
'data-action': string;
|
|
17
|
-
onClick: () => void;
|
|
18
|
-
role: string;
|
|
19
|
-
title: string;
|
|
20
|
-
};
|
|
21
|
-
closeProps: {
|
|
22
|
-
'aria-label': string;
|
|
23
|
-
'data-action': string;
|
|
24
|
-
onClick: () => void;
|
|
25
|
-
role: string;
|
|
26
|
-
title: string;
|
|
27
|
-
};
|
|
28
|
-
primaryProps: {
|
|
29
|
-
'aria-label': string;
|
|
30
|
-
'data-action': string;
|
|
31
|
-
onClick: () => void;
|
|
32
|
-
role: string;
|
|
33
|
-
title: string;
|
|
34
|
-
};
|
|
35
|
-
skipProps: {
|
|
36
|
-
'aria-label': string;
|
|
37
|
-
'data-action': string;
|
|
38
|
-
onClick: () => void;
|
|
39
|
-
role: string;
|
|
40
|
-
title: string;
|
|
41
|
-
};
|
|
42
|
-
tooltipProps: {
|
|
43
|
-
'aria-modal': boolean;
|
|
44
|
-
ref: RefCallback<HTMLElement>;
|
|
45
|
-
role: string;
|
|
46
|
-
};
|
|
47
|
-
};
|
|
48
|
-
export default function Coachmark({ index, primaryProps, size, step, tooltipProps, backProps, closeProps, }: CoachmarkProps): React.JSX.Element;
|
|
49
|
-
export {};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
type Props = {
|
|
3
|
-
type: 'success' | 'error' | 'warning' | 'info' | 'neutral';
|
|
4
|
-
children: React.ReactNode;
|
|
5
|
-
icon?: boolean;
|
|
6
|
-
style?: Record<string, unknown>;
|
|
7
|
-
};
|
|
8
|
-
export default function ({ type, children, icon, ...rest }: Props): React.JSX.Element;
|
|
9
|
-
export {};
|