@xfers/design-system 5.0.0-dev.7624cd9986 → 5.0.0-dev.8da41ea20c
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/index.js +4 -4
- package/cjs/index.js.map +1 -1
- package/dist/components/Modal/DialogItems.js +41 -0
- package/dist/components/Modal/DialogItems.js.map +1 -0
- package/dist/components/Modal/index.js +29 -32
- package/dist/components/Modal/index.js.map +1 -1
- package/dist/components/Modal/styles.js +42 -0
- package/dist/components/Modal/styles.js.map +1 -0
- package/dist/index.js +4 -2
- package/dist/index.js.map +1 -1
- package/dist/shared/modalContext.js +2 -2
- package/dist/shared/modalContext.js.map +1 -1
- package/dist/types/components/Modal/DialogItems.d.ts +13 -0
- package/dist/types/components/Modal/index.d.ts +9 -2
- package/dist/types/components/Modal/styles.d.ts +17 -0
- package/dist/types/index.d.ts +1 -0
- package/es/index.js +1 -1
- package/es/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,41 @@
|
|
|
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
|
+
var react_1 = require("react");
|
|
19
|
+
var styled_1 = require("@emotion/styled");
|
|
20
|
+
var fontStyles_1 = require("src/constants/fontStyles");
|
|
21
|
+
var DialogItem = function (_a) {
|
|
22
|
+
var label = _a.label, value = _a.value, _b = _a.variant, variant = _b === void 0 ? 'small' : _b;
|
|
23
|
+
return (react_1.default.createElement(Row, null,
|
|
24
|
+
react_1.default.createElement(Label, { variant: variant }, label),
|
|
25
|
+
react_1.default.createElement(Value, { variant: variant }, value)));
|
|
26
|
+
};
|
|
27
|
+
var DialogItems = function (_a) {
|
|
28
|
+
var items = _a.items, className = _a.className;
|
|
29
|
+
return (react_1.default.createElement(Container, { className: className }, items.map(function (item, index) { return (react_1.default.createElement(DialogItem, __assign({ key: index }, item))); })));
|
|
30
|
+
};
|
|
31
|
+
exports.default = DialogItems;
|
|
32
|
+
var Container = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 12px;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 12px;\n"])));
|
|
33
|
+
var Row = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
34
|
+
var Label = styled_1.default.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n line-height: 1;\n color: ", ";\n"], ["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n line-height: 1;\n color: ", ";\n"])), function (props) {
|
|
35
|
+
return props.variant === 'large' ? fontStyles_1.SECONDARY_FONT : fontStyles_1.MAIN_FONT;
|
|
36
|
+
}, function (props) { return (props.variant === 'large' ? 700 : 400); }, function (props) { return (props.variant === 'large' ? '20px' : '14px'); }, function (props) { return (props.variant === 'large' ? '#002b2a' : '#505454'); });
|
|
37
|
+
var Value = styled_1.default.span(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n line-height: 1;\n color: #002b2a;\n"], ["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n line-height: 1;\n color: #002b2a;\n"])), function (props) {
|
|
38
|
+
return props.variant === 'large' ? fontStyles_1.SECONDARY_FONT : fontStyles_1.MAIN_FONT;
|
|
39
|
+
}, function (props) { return (props.variant === 'large' ? 700 : 400); }, function (props) { return (props.variant === 'large' ? '20px' : '14px'); });
|
|
40
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
41
|
+
//# sourceMappingURL=DialogItems.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DialogItems.js","sourceRoot":"","sources":["../../../src/components/Modal/DialogItems.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,+BAAyB;AACzB,0CAAoC;AACpC,uDAAoE;AAUpE,IAAM,UAAU,GAAG,UAAC,EAAoD;QAAlD,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,eAAiB,EAAjB,OAAO,mBAAG,OAAO,KAAA;IACnD,OAAO,CACL,8BAAC,GAAG;QACF,8BAAC,KAAK,IAAC,OAAO,EAAE,OAAO,IAAG,KAAK,CAAS;QACxC,8BAAC,KAAK,IAAC,OAAO,EAAE,OAAO,IAAG,KAAK,CAAS,CACpC,CACP,CAAA;AACH,CAAC,CAAA;AAOD,IAAM,WAAW,GAAG,UAAC,EAAsC;QAApC,KAAK,WAAA,EAAE,SAAS,eAAA;IACrC,OAAO,CACL,8BAAC,SAAS,IAAC,SAAS,EAAE,SAAS,IAC5B,KAAK,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,KAAK,IAAK,OAAA,CAC1B,8BAAC,UAAU,aAAC,GAAG,EAAE,KAAK,IAAM,IAAI,EAAI,CACrC,EAF2B,CAE3B,CAAC,CACQ,CACb,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,WAAW,CAAA;AAE1B,IAAM,SAAS,GAAG,gBAAM,CAAC,GAAG,kIAAA,+DAI3B,IAAA,CAAA;AAED,IAAM,GAAG,GAAG,gBAAM,CAAC,GAAG,oJAAA,iFAIrB,IAAA,CAAA;AAED,IAAM,KAAK,GAAG,gBAAM,CAAC,IAAI,0KAAgC,mBACxC,EACyC,oBACzC,EAAkD,kBACpD,EAAwD,iCAE5D,EAA8D,KACxE,KANgB,UAAC,KAAK;IACnB,OAAA,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,2BAAc,CAAC,CAAC,CAAC,sBAAS;AAAtD,CAAsD,EACzC,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAvC,CAAuC,EACpD,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,EAA7C,CAA6C,EAE5D,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,EAAnD,CAAmD,CACxE,CAAA;AAED,IAAM,KAAK,GAAG,gBAAM,CAAC,IAAI,6KAAgC,mBACxC,EACyC,oBACzC,EAAkD,kBACpD,EAAwD,2CAGtE,KANgB,UAAC,KAAK;IACnB,OAAA,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,2BAAc,CAAC,CAAC,CAAC,sBAAS;AAAtD,CAAsD,EACzC,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAvC,CAAuC,EACpD,UAAC,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,EAA7C,CAA6C,CAGtE,CAAA"}
|
|
@@ -1,42 +1,39 @@
|
|
|
1
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
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
3
|
var react_1 = require("react");
|
|
8
|
-
var styled_1 = require("@emotion/styled");
|
|
9
|
-
var Typography_1 = require("src/components/Typography");
|
|
10
|
-
var Divider_1 = require("src/components/Divider");
|
|
11
4
|
var Cross_1 = require("src/icons/Cross");
|
|
12
5
|
var ThemeContext_1 = require("src/theme/ThemeContext");
|
|
13
|
-
var
|
|
6
|
+
var styles_1 = require("./styles");
|
|
14
7
|
var ModalContent = function (_a) {
|
|
15
|
-
var onClose = _a.onClose,
|
|
8
|
+
var onClose = _a.onClose, _b = _a.variant, variant = _b === void 0 ? 'default' : _b, _c = _a.size, size = _c === void 0 ? 'small' : _c, title = _a.title, children = _a.children, footer = _a.footer, disabledCloseIcon = _a.disabledCloseIcon, className = _a.className, illustration = _a.illustration, headerImage = _a.headerImage;
|
|
16
9
|
var neutral = (0, ThemeContext_1.useTheme)().neutral;
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
react_1.default.createElement(
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
10
|
+
var resolvedSize = variant === 'newFeature' ? 'medium' : size;
|
|
11
|
+
var closeIcon = !disabledCloseIcon && (react_1.default.createElement(styles_1.Close, { onClick: function () { return onClose(); } },
|
|
12
|
+
react_1.default.createElement(Cross_1.default, { color: neutral.text, width: 18 })));
|
|
13
|
+
var renderHeader = function () {
|
|
14
|
+
switch (variant) {
|
|
15
|
+
case 'illustration':
|
|
16
|
+
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
17
|
+
react_1.default.createElement(styles_1.IllustrationCloseBar, null, closeIcon),
|
|
18
|
+
react_1.default.createElement(styles_1.IllustrationContainer, null,
|
|
19
|
+
illustration && (react_1.default.createElement(styles_1.IllustrationWrapper, null, illustration)),
|
|
20
|
+
title && react_1.default.createElement(styles_1.CenteredTitle, null, title))));
|
|
21
|
+
case 'newFeature':
|
|
22
|
+
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
23
|
+
headerImage && (react_1.default.createElement(styles_1.NewFeatureImageContainer, null, headerImage)),
|
|
24
|
+
title && (react_1.default.createElement(styles_1.CenteredTitleFrame, null,
|
|
25
|
+
react_1.default.createElement(styles_1.NewFeatureTitle, null, title)))));
|
|
26
|
+
default:
|
|
27
|
+
return ((title || !disabledCloseIcon) && (react_1.default.createElement(styles_1.ModalHeader, null,
|
|
28
|
+
react_1.default.createElement(styles_1.TitleContainer, null,
|
|
29
|
+
react_1.default.createElement(styles_1.Title, null, title || ''),
|
|
30
|
+
closeIcon))));
|
|
31
|
+
}
|
|
32
|
+
};
|
|
33
|
+
return (react_1.default.createElement(styles_1.ModalContentWrapper, { modalSize: resolvedSize, className: className },
|
|
34
|
+
renderHeader(),
|
|
35
|
+
react_1.default.createElement(styles_1.ModalBody, null, children),
|
|
36
|
+
footer && react_1.default.createElement(styles_1.ModalFooter, null, footer)));
|
|
28
37
|
};
|
|
29
38
|
exports.default = ModalContent;
|
|
30
|
-
var ModalHeader = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n ", "\n padding-left: ", ";\n padding-right: ", ";\n"])), function (props) {
|
|
31
|
-
return props.hasIcon
|
|
32
|
-
? "\n height: 86px;\n "
|
|
33
|
-
: "\n height: 73px;\n ";
|
|
34
|
-
}, spacing_1.EXTRA_LARGE_SPACING, spacing_1.EXTRA_LARGE_SPACING);
|
|
35
|
-
var ModalBody = (0, styled_1.default)(Typography_1.P1)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-bottom: 1px solid #e8e8e8;\n padding-top: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-bottom: ", ";\n"], ["\n border-bottom: 1px solid #e8e8e8;\n padding-top: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-bottom: ", ";\n"])), spacing_1.LARGE_SPACING, spacing_1.EXTRA_LARGE_SPACING, spacing_1.EXTRA_LARGE_SPACING, spacing_1.EXTRA_LARGE_SPACING);
|
|
36
|
-
var ModalFooter = styled_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background: #f6f7f9;\n display: flex;\n justify-content: flex-end;\n padding-right: ", ";\n padding-top: ", ";\n padding-bottom: ", ";\n"], ["\n background: #f6f7f9;\n display: flex;\n justify-content: flex-end;\n padding-right: ", ";\n padding-top: ", ";\n padding-bottom: ", ";\n"])), spacing_1.EXTRA_LARGE_SPACING, spacing_1.SMALL_SPACING, spacing_1.SMALL_SPACING);
|
|
37
|
-
var TitleContainer = styled_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"], ["\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
38
|
-
var Title = styled_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n user-select: none;\n & :not(:last-child) {\n margin-right: 10px;\n }\n"], ["\n display: flex;\n align-items: center;\n user-select: none;\n & :not(:last-child) {\n margin-right: 10px;\n }\n"])));
|
|
39
|
-
var Close = styled_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n cursor: pointer;\n padding-left: 5px;\n padding-right: 5px;\n margin-right: -5px;\n"], ["\n cursor: pointer;\n padding-left: 5px;\n padding-right: 5px;\n margin-right: -5px;\n"])));
|
|
40
|
-
var ModalContentWrapper = styled_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n width: calc(100vw - 32px);\n max-width: 400px;\n background: white;\n box-shadow: 0px 4px 10px rgba(170, 170, 170, 0.25);\n border-radius: 5px;\n overflow: hidden;\n -webkit-font-smoothing: antialiased;\n margin-bottom: 1.7vh;\n position: absolute;\n top: 6.8vh;\n left: 50%;\n transform: translateX(-50%);\n"], ["\n width: calc(100vw - 32px);\n max-width: 400px;\n background: white;\n box-shadow: 0px 4px 10px rgba(170, 170, 170, 0.25);\n border-radius: 5px;\n overflow: hidden;\n -webkit-font-smoothing: antialiased;\n margin-bottom: 1.7vh;\n position: absolute;\n top: 6.8vh;\n left: 50%;\n transform: translateX(-50%);\n"])));
|
|
41
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
|
42
39
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":";;AAAA,+BAAyB;AACzB,yCAAuC;AACvC,uDAAiD;AACjD,mCAgBiB;AAmBjB,IAAM,YAAY,GAAG,UAAC,EAWF;QAVlB,OAAO,aAAA,EACP,eAAmB,EAAnB,OAAO,mBAAG,SAAS,KAAA,EACnB,YAAc,EAAd,IAAI,mBAAG,OAAO,KAAA,EACd,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,MAAM,YAAA,EACN,iBAAiB,uBAAA,EACjB,SAAS,eAAA,EACT,YAAY,kBAAA,EACZ,WAAW,iBAAA;IAEH,IAAA,OAAO,GAAK,IAAA,uBAAQ,GAAE,QAAf,CAAe;IAC9B,IAAM,YAAY,GAAc,OAAO,KAAK,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA;IAE1E,IAAM,SAAS,GAAG,CAAC,iBAAiB,IAAI,CACtC,8BAAC,cAAK,IAAC,OAAO,EAAE,cAAM,OAAA,OAAO,EAAE,EAAT,CAAS;QAC7B,8BAAC,eAAS,IAAC,KAAK,EAAE,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,GAAI,CACvC,CACT,CAAA;IAED,IAAM,YAAY,GAAG;QACnB,QAAQ,OAAO,EAAE,CAAC;YAChB,KAAK,cAAc;gBACjB,OAAO,CACL;oBACE,8BAAC,6BAAoB,QAAE,SAAS,CAAwB;oBACxD,8BAAC,8BAAqB;wBACnB,YAAY,IAAI,CACf,8BAAC,4BAAmB,QAAE,YAAY,CAAuB,CAC1D;wBACA,KAAK,IAAI,8BAAC,sBAAa,QAAE,KAAK,CAAiB,CAC1B,CACvB,CACJ,CAAA;YAEH,KAAK,YAAY;gBACf,OAAO,CACL;oBACG,WAAW,IAAI,CACd,8BAAC,iCAAwB,QAAE,WAAW,CAA4B,CACnE;oBACA,KAAK,IAAI,CACR,8BAAC,2BAAkB;wBACjB,8BAAC,wBAAe,QAAE,KAAK,CAAmB,CACvB,CACtB,CACA,CACJ,CAAA;YAEH;gBACE,OAAO,CACL,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAC/B,8BAAC,oBAAW;oBACV,8BAAC,uBAAc;wBACb,8BAAC,cAAK,QAAE,KAAK,IAAI,EAAE,CAAS;wBAC3B,SAAS,CACK,CACL,CACf,CACF,CAAA;QACL,CAAC;IACH,CAAC,CAAA;IAED,OAAO,CACL,8BAAC,4BAAmB,IAAC,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS;QAC/D,YAAY,EAAE;QACf,8BAAC,kBAAS,QAAE,QAAQ,CAAa;QAChC,MAAM,IAAI,8BAAC,oBAAW,QAAE,MAAM,CAAe,CAC1B,CACvB,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,YAAY,CAAA"}
|
|
@@ -0,0 +1,42 @@
|
|
|
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
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
|
+
exports.Close = exports.ModalFooter = exports.ModalBody = exports.NewFeatureTitle = exports.CenteredTitleFrame = exports.NewFeatureImageContainer = exports.CenteredTitle = exports.IllustrationWrapper = exports.IllustrationContainer = exports.IllustrationCloseBar = exports.Title = exports.TitleContainer = exports.ModalHeader = exports.ModalContentWrapper = void 0;
|
|
8
|
+
var styled_1 = require("@emotion/styled");
|
|
9
|
+
var fontStyles_1 = require("src/constants/fontStyles");
|
|
10
|
+
var spacing_1 = require("src/constants/spacing");
|
|
11
|
+
var WIDTH_MAP = {
|
|
12
|
+
small: '400px',
|
|
13
|
+
medium: '600px',
|
|
14
|
+
};
|
|
15
|
+
exports.ModalContentWrapper = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: calc(100vw - 32px);\n max-width: ", ";\n background: white;\n box-shadow:\n 0px 20px 24px -4px rgba(10, 13, 18, 0.08),\n 0px 8px 8px -4px rgba(10, 13, 18, 0.03);\n border-radius: 12px;\n overflow: hidden;\n -webkit-font-smoothing: antialiased;\n margin-bottom: 1.7vh;\n position: absolute;\n top: 6.8vh;\n left: 50%;\n transform: translateX(-50%);\n"], ["\n width: calc(100vw - 32px);\n max-width: ", ";\n background: white;\n box-shadow:\n 0px 20px 24px -4px rgba(10, 13, 18, 0.08),\n 0px 8px 8px -4px rgba(10, 13, 18, 0.03);\n border-radius: 12px;\n overflow: hidden;\n -webkit-font-smoothing: antialiased;\n margin-bottom: 1.7vh;\n position: absolute;\n top: 6.8vh;\n left: 50%;\n transform: translateX(-50%);\n"
|
|
16
|
+
// ─── Default variant ───
|
|
17
|
+
])), function (props) { return WIDTH_MAP[props.modalSize]; });
|
|
18
|
+
// ─── Default variant ───
|
|
19
|
+
exports.ModalHeader = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n padding: 16px ", ";\n"], ["\n padding: 16px ", ";\n"])), spacing_1.LARGE_SPACING);
|
|
20
|
+
exports.TitleContainer = styled_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: 12px;\n padding-top: 4px;\n padding-bottom: 16px;\n border-bottom: 1px solid #d8d8d8;\n"], ["\n display: flex;\n align-items: center;\n gap: 12px;\n padding-top: 4px;\n padding-bottom: 16px;\n border-bottom: 1px solid #d8d8d8;\n"])));
|
|
21
|
+
exports.Title = styled_1.default.h2(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n flex: 1 0 0;\n min-width: 0;\n margin: 0;\n font-family: ", ";\n font-weight: 700;\n font-size: 20px;\n line-height: 1;\n color: #002b2a;\n"], ["\n flex: 1 0 0;\n min-width: 0;\n margin: 0;\n font-family: ", ";\n font-weight: 700;\n font-size: 20px;\n line-height: 1;\n color: #002b2a;\n"
|
|
22
|
+
// ─── Illustration variant ───
|
|
23
|
+
])), fontStyles_1.SECONDARY_FONT);
|
|
24
|
+
// ─── Illustration variant ───
|
|
25
|
+
exports.IllustrationCloseBar = styled_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n justify-content: flex-end;\n align-items: center;\n padding: 16px ", ";\n height: 56px;\n box-sizing: border-box;\n"], ["\n display: flex;\n justify-content: flex-end;\n align-items: center;\n padding: 16px ", ";\n height: 56px;\n box-sizing: border-box;\n"])), spacing_1.LARGE_SPACING);
|
|
26
|
+
exports.IllustrationContainer = styled_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 0 ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 0 ", ";\n"])), spacing_1.LARGE_SPACING);
|
|
27
|
+
exports.IllustrationWrapper = styled_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n width: 160px;\n height: 160px;\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n width: 160px;\n height: 160px;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
28
|
+
exports.CenteredTitle = styled_1.default.h2(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n margin: 16px 0 0;\n font-family: ", ";\n font-weight: 700;\n font-size: 20px;\n line-height: 1.3;\n color: #002b2a;\n text-align: center;\n width: 100%;\n"], ["\n margin: 16px 0 0;\n font-family: ", ";\n font-weight: 700;\n font-size: 20px;\n line-height: 1.3;\n color: #002b2a;\n text-align: center;\n width: 100%;\n"
|
|
29
|
+
// ─── New Feature variant ───
|
|
30
|
+
])), fontStyles_1.SECONDARY_FONT);
|
|
31
|
+
// ─── New Feature variant ───
|
|
32
|
+
exports.NewFeatureImageContainer = styled_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n padding: 40px ", " 0;\n overflow: hidden;\n\n img {\n width: 100%;\n display: block;\n border-radius: 8px;\n }\n"], ["\n padding: 40px ", " 0;\n overflow: hidden;\n\n img {\n width: 100%;\n display: block;\n border-radius: 8px;\n }\n"])), spacing_1.LARGE_SPACING);
|
|
33
|
+
exports.CenteredTitleFrame = styled_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n padding: 16px ", ";\n text-align: center;\n"], ["\n padding: 16px ", ";\n text-align: center;\n"])), spacing_1.LARGE_SPACING);
|
|
34
|
+
exports.NewFeatureTitle = styled_1.default.h2(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n margin: 0;\n font-family: ", ";\n font-weight: 700;\n font-size: 20px;\n line-height: 1.3;\n color: #002b2a;\n"], ["\n margin: 0;\n font-family: ", ";\n font-weight: 700;\n font-size: 20px;\n line-height: 1.3;\n color: #002b2a;\n"
|
|
35
|
+
// ─── Shared ───
|
|
36
|
+
])), fontStyles_1.SECONDARY_FONT);
|
|
37
|
+
// ─── Shared ───
|
|
38
|
+
exports.ModalBody = styled_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n padding: 0 ", " 16px;\n font-family: ", ";\n font-size: 14px;\n line-height: 1.4;\n color: #002b2a;\n"], ["\n padding: 0 ", " 16px;\n font-family: ", ";\n font-size: 14px;\n line-height: 1.4;\n color: #002b2a;\n"])), spacing_1.LARGE_SPACING, fontStyles_1.MAIN_FONT);
|
|
39
|
+
exports.ModalFooter = styled_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n background: #f6f7f9;\n display: flex;\n gap: 16px;\n padding: ", ";\n\n > * {\n flex: 1 0 0;\n }\n"], ["\n background: #f6f7f9;\n display: flex;\n gap: 16px;\n padding: ", ";\n\n > * {\n flex: 1 0 0;\n }\n"])), spacing_1.LARGE_SPACING);
|
|
40
|
+
exports.Close = styled_1.default.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n cursor: pointer;\n flex-shrink: 0;\n"], ["\n cursor: pointer;\n flex-shrink: 0;\n"])));
|
|
41
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14;
|
|
42
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Modal/styles.ts"],"names":[],"mappings":";;;;;;;AAAA,0CAAoC;AACpC,uDAAoE;AACpE,iDAAqD;AAIrD,IAAM,SAAS,GAA8B;IAC3C,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,OAAO;CAChB,CAAA;AAEY,QAAA,mBAAmB,GAAG,gBAAM,CAAC,GAAG,8bAA0B,+CAExD,EAAqC,0UAanD;IAED,0BAA0B;KAfX,UAAC,KAAK,IAAK,OAAA,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC,EAA1B,CAA0B,EAanD;AAED,0BAA0B;AAEb,QAAA,WAAW,GAAG,gBAAM,CAAC,GAAG,8FAAA,oBACnB,EAAa,KAC9B,KADiB,uBAAa,EAC9B;AAEY,QAAA,cAAc,GAAG,gBAAM,CAAC,GAAG,kNAAA,+IAOvC,KAAA;AAEY,QAAA,KAAK,GAAG,gBAAM,CAAC,EAAE,2NAAA,kEAIb,EAAc,oFAK9B;IAED,+BAA+B;KAPd,2BAAc,EAK9B;AAED,+BAA+B;AAElB,QAAA,oBAAoB,GAAG,gBAAM,CAAC,GAAG,kNAAA,4FAI5B,EAAa,iDAG9B,KAHiB,uBAAa,EAG9B;AAEY,QAAA,qBAAqB,GAAG,gBAAM,CAAC,GAAG,gKAAA,sFAIhC,EAAa,KAC3B,KADc,uBAAa,EAC3B;AAEY,QAAA,mBAAmB,GAAG,gBAAM,CAAC,GAAG,gLAAA,6GAM5C,KAAA;AAEY,QAAA,aAAa,GAAG,gBAAM,CAAC,EAAE,0OAAA,wCAErB,EAAc,6HAO9B;IAED,8BAA8B;KATb,2BAAc,EAO9B;AAED,8BAA8B;AAEjB,QAAA,wBAAwB,GAAG,gBAAM,CAAC,GAAG,qMAAA,oBAChC,EAAa,4GAQ9B,KARiB,uBAAa,EAQ9B;AAEY,QAAA,kBAAkB,GAAG,gBAAM,CAAC,GAAG,uHAAA,oBAC1B,EAAa,4BAE9B,KAFiB,uBAAa,EAE9B;AAEY,QAAA,eAAe,GAAG,gBAAM,CAAC,EAAE,8LAAA,iCAEvB,EAAc,sFAK9B;IAED,iBAAiB;KAPA,2BAAc,EAK9B;AAED,iBAAiB;AAEJ,QAAA,SAAS,GAAG,gBAAM,CAAC,GAAG,oLAAA,iBACpB,EAAa,yBACX,EAAS,iEAIzB,KALc,uBAAa,EACX,sBAAS,EAIzB;AAEY,QAAA,WAAW,GAAG,gBAAM,CAAC,GAAG,qLAAA,uEAIxB,EAAa,uCAKzB,KALY,uBAAa,EAKzB;AAEY,QAAA,KAAK,GAAG,gBAAM,CAAC,GAAG,gHAAA,2CAG9B,KAAA"}
|
package/dist/index.js
CHANGED
|
@@ -16,8 +16,8 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
16
16
|
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
17
17
|
};
|
|
18
18
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
19
|
-
exports.
|
|
20
|
-
exports.LINE_HEIGHT = exports.FONT_SIZE = exports.FONT_WEIGHT = exports.FALLBACK_FONT = exports.MAIN_FONT = exports.BACKGROUND_COLORS = exports.TEXT_COLORS = exports.ICON_COLORS = exports.MAIN_COLORS = exports.NEUTRAL_COLORS = exports.YELLOW_COLORS = exports.RED_COLORS = exports.GREEN_COLORS = exports.BLUE_COLORS = exports.TABLET_BREAKPOINT = exports.LAPTOP_BREAKPOINT = exports.DESKTOP_BREAKPOINT = exports.EXTRA_LARGE_DESKTOP_BREAKPOINT = exports.useModal = exports.ModalProvider = exports.straitsXTheme = exports.xfersTheme = exports.useTheme = exports.ThemeProvider = exports.Typography = exports.MaterialSymbols = exports.getCoachmarkJoyrideConfig = void 0;
|
|
19
|
+
exports.Timeline = exports.SummaryCard = exports.Spin = exports.ErrorPage = exports.Tooltip = exports.CopyBox = exports.Section = exports.Banner = exports.Note = exports.ContentBreakdown = exports.Hidden = exports.Link = exports.Divider = exports.EmptyData = exports.SmallP = exports.P1Bold = exports.P1 = exports.H4 = exports.H3 = exports.H2 = exports.H1 = exports.Checkbox = exports.DatePicker = exports.Timer = exports.Tabs = exports.Table = exports.Steps = exports.Select = exports.RangePicker = exports.Radio = exports.Pagination = exports.DeprecatedModal = exports.DialogItems = exports.Modal = exports.Tag = exports.InputWithButton = exports.Input = exports.Form = exports.DynamicSelect = exports.Dropdown = exports.Carousel = exports.Chart = exports.Card = exports.BadgeIcon = exports.Accordion = exports.ActionCard = exports.ActionButton = exports.Button = exports.Alert = exports.AntdConfigProvider = void 0;
|
|
20
|
+
exports.LINE_HEIGHT = exports.FONT_SIZE = exports.FONT_WEIGHT = exports.FALLBACK_FONT = exports.MAIN_FONT = exports.BACKGROUND_COLORS = exports.TEXT_COLORS = exports.ICON_COLORS = exports.MAIN_COLORS = exports.NEUTRAL_COLORS = exports.YELLOW_COLORS = exports.RED_COLORS = exports.GREEN_COLORS = exports.BLUE_COLORS = exports.TABLET_BREAKPOINT = exports.LAPTOP_BREAKPOINT = exports.DESKTOP_BREAKPOINT = exports.EXTRA_LARGE_DESKTOP_BREAKPOINT = exports.useModal = exports.ModalProvider = exports.straitsXTheme = exports.xfersTheme = exports.useTheme = exports.ThemeProvider = exports.Typography = exports.MaterialSymbols = exports.getCoachmarkJoyrideConfig = exports.Coachmark = void 0;
|
|
21
21
|
// Components
|
|
22
22
|
var AntdConfigProvider_1 = require("./components/AntdConfigProvider");
|
|
23
23
|
Object.defineProperty(exports, "AntdConfigProvider", { enumerable: true, get: function () { return AntdConfigProvider_1.default; } });
|
|
@@ -53,6 +53,8 @@ var Tag_1 = require("./components/Tag");
|
|
|
53
53
|
Object.defineProperty(exports, "Tag", { enumerable: true, get: function () { return Tag_1.default; } });
|
|
54
54
|
var Modal_1 = require("./components/Modal");
|
|
55
55
|
Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return Modal_1.default; } });
|
|
56
|
+
var DialogItems_1 = require("./components/Modal/DialogItems");
|
|
57
|
+
Object.defineProperty(exports, "DialogItems", { enumerable: true, get: function () { return DialogItems_1.default; } });
|
|
56
58
|
var DeprecatedModal_1 = require("./components/DeprecatedModal");
|
|
57
59
|
Object.defineProperty(exports, "DeprecatedModal", { enumerable: true, get: function () { return DeprecatedModal_1.default; } });
|
|
58
60
|
var Pagination_1 = require("./components/Pagination");
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -11,7 +11,7 @@ var styled_1 = require("@emotion/styled");
|
|
|
11
11
|
var core_1 = require("@emotion/core");
|
|
12
12
|
var ModalContext = react_1.default.createContext({
|
|
13
13
|
setModal: function () { return null; },
|
|
14
|
-
resetModal: function () { return null; }
|
|
14
|
+
resetModal: function () { return null; },
|
|
15
15
|
});
|
|
16
16
|
var bodyElement = document.body;
|
|
17
17
|
var ModalContainer = function (_a) {
|
|
@@ -51,7 +51,7 @@ var useModal = function () {
|
|
|
51
51
|
};
|
|
52
52
|
exports.useModal = useModal;
|
|
53
53
|
var showAnimation = (0, core_1.keyframes)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n"], ["\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n"])));
|
|
54
|
-
var ModalMask = styled_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: fixed;\n width: 100vw;\n height: 100%;\n background: rgba(
|
|
54
|
+
var ModalMask = styled_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: fixed;\n width: 100vw;\n height: 100%;\n background: rgba(5, 21, 19, 0.7);\n top: 0;\n left: 0;\n display: none;\n overflow: auto;\n z-index: 9; // bigger than nav bar z-index: 8\n ", ";\n"], ["\n position: fixed;\n width: 100vw;\n height: 100%;\n background: rgba(5, 21, 19, 0.7);\n top: 0;\n left: 0;\n display: none;\n overflow: auto;\n z-index: 9; // bigger than nav bar z-index: 8\n ", ";\n"])), function (props) {
|
|
55
55
|
return props.open && (0, core_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: block;\n animation: ", " 0.3s ease;\n "], ["\n display: block;\n animation: ", " 0.3s ease;\n "])), showAnimation);
|
|
56
56
|
});
|
|
57
57
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modalContext.js","sourceRoot":"","sources":["../../src/shared/modalContext.tsx"],"names":[],"mappings":";;;;;;;AAAA,+BAA+D;AAC/D,uCAAgC;AAChC,0CAAoC;AACpC,sCAAsD;AAEtD,IAAM,YAAY,GAAG,eAAK,CAAC,aAAa,CAIrC;IACD,QAAQ,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;IACpB,UAAU,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;CACvB,CAAC,CAAA;AAEF,IAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAA;AAKjC,IAAM,cAAc,GAAG,UAAC,EAA8B;QAA5B,KAAK,WAAA;IAC7B,sDAAsD;IAC/C,IAAA,WAAW,GAAI,IAAA,gBAAQ,EAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,GAA3C,CAA2C;IAC7D,WAAW,CAAC,YAAY,CAAC,IAAI,EAAE,YAAY,CAAC,CAAA;IAE5C,IAAA,iBAAS,
|
|
1
|
+
{"version":3,"file":"modalContext.js","sourceRoot":"","sources":["../../src/shared/modalContext.tsx"],"names":[],"mappings":";;;;;;;AAAA,+BAA+D;AAC/D,uCAAgC;AAChC,0CAAoC;AACpC,sCAAsD;AAEtD,IAAM,YAAY,GAAG,eAAK,CAAC,aAAa,CAIrC;IACD,QAAQ,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;IACpB,UAAU,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI;CACvB,CAAC,CAAA;AAEF,IAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAA;AAKjC,IAAM,cAAc,GAAG,UAAC,EAA8B;QAA5B,KAAK,WAAA;IAC7B,sDAAsD;IAC/C,IAAA,WAAW,GAAI,IAAA,gBAAQ,EAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,GAA3C,CAA2C;IAC7D,WAAW,CAAC,YAAY,CAAC,IAAI,EAAE,YAAY,CAAC,CAAA;IAE5C,IAAA,iBAAS,EAAC;QACR,WAAW,CAAC,WAAW,CAAC,WAAW,CAAC,CAAA;QACpC,OAAO;YACL,WAAW,CAAC,WAAW,CAAC,WAAW,CAAC,CAAA;QACtC,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAA;IAEjB,IAAM,0BAA0B,GAAG,CACjC,8BAAC,aAAM,IACL,MAAM,MAAE,UAAG,sIAAA,kEAIV,OACD,CACH,CAAA;IACD,OAAO,mBAAQ,CAAC,YAAY,CAC1B,8BAAC,SAAS,IAAC,IAAI,EAAE,CAAC,CAAC,KAAK;QACrB,CAAC,CAAC,KAAK,IAAI,0BAA0B;QACrC,KAAK,CACI,EACZ,WAAW,CACZ,CAAA;AACH,CAAC,CAAA;AAGD,IAAM,aAAa,GAAG,UAAC,EAAgC;QAA9B,QAAQ,cAAA;IAC/B,sDAAsD;IAChD,IAAA,KAAoB,IAAA,gBAAQ,GAAkC,EAA7D,KAAK,QAAA,EAAE,QAAQ,QAA8C,CAAA;IACpE,IAAM,UAAU,GAAG,IAAA,mBAAW,EAAC;QAC7B,QAAQ,CAAC,SAAS,CAAC,CAAA;IACrB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEd,OAAO,CACL,8BAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,UAAU,YAAA,EAAE,QAAQ,UAAA,EAAE;QACnD,QAAQ;QACT,8BAAC,cAAc,IAAC,KAAK,EAAE,KAAK,GAAI,CACV,CACzB,CAAA;AACH,CAAC,CAAA;AAWQ,sCAAa;AATtB,IAAM,QAAQ,GAAG;IACf,IAAM,OAAO,GAAG,eAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAA;IAE9C,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC1B,MAAM,IAAI,KAAK,CAAC,6CAA6C,CAAC,CAAA;IAChE,CAAC;IACD,OAAO,OAAO,CAAA;AAChB,CAAC,CAAA;AAEuB,4BAAQ;AAEhC,IAAM,aAAa,OAAG,gBAAS,sIAAA,kEAO9B,IAAA,CAAA;AACD,IAAM,SAAS,GAAG,gBAAM,CAAC,GAAG,wRAAmB,8MAU3C,EAKC,KACJ,KANG,UAAC,KAAK;IACN,OAAA,KAAK,CAAC,IAAI,QACV,UAAG,qIAAA,4CAEY,EAAa,mBAC3B,KADc,aAAa,CAC3B;AAJD,CAIC,CACJ,CAAA"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
type DialogItemVariant = 'small' | 'large';
|
|
3
|
+
type DialogItemProps = {
|
|
4
|
+
label: string;
|
|
5
|
+
value: React.ReactNode;
|
|
6
|
+
variant?: DialogItemVariant;
|
|
7
|
+
};
|
|
8
|
+
type DialogItemsProps = {
|
|
9
|
+
items: DialogItemProps[];
|
|
10
|
+
className?: string;
|
|
11
|
+
};
|
|
12
|
+
declare const DialogItems: ({ items, className }: DialogItemsProps) => React.JSX.Element;
|
|
13
|
+
export default DialogItems;
|
|
@@ -1,12 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { ModalSize } from './styles';
|
|
3
|
+
export type ModalVariant = 'default' | 'illustration' | 'newFeature';
|
|
2
4
|
type ModalContentProps = {
|
|
3
5
|
onClose: () => void;
|
|
4
|
-
|
|
6
|
+
variant?: ModalVariant;
|
|
7
|
+
size?: ModalSize;
|
|
5
8
|
title?: React.ReactNode;
|
|
6
9
|
children: React.ReactNode;
|
|
7
10
|
footer: React.ReactNode;
|
|
8
11
|
disabledCloseIcon?: boolean;
|
|
9
12
|
className?: string;
|
|
13
|
+
illustration?: React.ReactNode;
|
|
14
|
+
headerImage?: React.ReactNode;
|
|
15
|
+
/** @deprecated No longer rendered. Will be removed in a future version. */
|
|
16
|
+
icon?: React.ReactNode | false;
|
|
10
17
|
};
|
|
11
|
-
declare const ModalContent: ({ onClose,
|
|
18
|
+
declare const ModalContent: ({ onClose, variant, size, title, children, footer, disabledCloseIcon, className, illustration, headerImage, }: ModalContentProps) => React.JSX.Element;
|
|
12
19
|
export default ModalContent;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
export type ModalSize = 'small' | 'medium';
|
|
2
|
+
export declare const ModalContentWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
3
|
+
modalSize: ModalSize;
|
|
4
|
+
}, object>;
|
|
5
|
+
export declare const ModalHeader: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
|
6
|
+
export declare const TitleContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
|
7
|
+
export declare const Title: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, Pick<import("react").ClassAttributes<HTMLHeadingElement> & import("react").HTMLAttributes<HTMLHeadingElement>, keyof import("react").HTMLAttributes<HTMLHeadingElement>>, object>;
|
|
8
|
+
export declare const IllustrationCloseBar: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
|
9
|
+
export declare const IllustrationContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
|
10
|
+
export declare const IllustrationWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
|
11
|
+
export declare const CenteredTitle: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, Pick<import("react").ClassAttributes<HTMLHeadingElement> & import("react").HTMLAttributes<HTMLHeadingElement>, keyof import("react").HTMLAttributes<HTMLHeadingElement>>, object>;
|
|
12
|
+
export declare const NewFeatureImageContainer: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
|
13
|
+
export declare const CenteredTitleFrame: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
|
14
|
+
export declare const NewFeatureTitle: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, Pick<import("react").ClassAttributes<HTMLHeadingElement> & import("react").HTMLAttributes<HTMLHeadingElement>, keyof import("react").HTMLAttributes<HTMLHeadingElement>>, object>;
|
|
15
|
+
export declare const ModalBody: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
|
16
|
+
export declare const ModalFooter: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
|
17
|
+
export declare const Close: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
|
package/dist/types/index.d.ts
CHANGED
|
@@ -15,6 +15,7 @@ export { default as Input } from './components/Input';
|
|
|
15
15
|
export { default as InputWithButton } from './components/InputWithButton';
|
|
16
16
|
export { default as Tag } from './components/Tag';
|
|
17
17
|
export { default as Modal } from './components/Modal';
|
|
18
|
+
export { default as DialogItems } from './components/Modal/DialogItems';
|
|
18
19
|
export { default as DeprecatedModal } from './components/DeprecatedModal';
|
|
19
20
|
export { default as Pagination } from './components/Pagination';
|
|
20
21
|
export { default as Radio } from './components/Radio';
|