krl-alfred 1.61.2 → 1.63.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/dist/components/Icon/Buy.js +1 -1
- package/dist/components/Modal/Modal.js +0 -1
- package/dist/components/ProductCard/ProductCard.js +1 -1
- package/dist/components/ProductCard/stories/ProductCard.stories.js +1 -1
- package/dist/components/SuggestBox/SuggestBox.js +25 -0
- package/dist/components/SuggestBox/SuggestBox.styled.js +13 -0
- package/dist/components/SuggestBox/index.js +8 -0
- package/dist/components/SuggestBox/props.js +2 -0
- package/dist/components/SuggestBox/stories/SuggestBox.stories.js +31 -0
- package/dist/components/Toast/Toast.js +53 -0
- package/dist/components/Toast/Toast.styled.js +80 -0
- package/dist/components/Toast/index.js +8 -0
- package/dist/components/Toast/props.js +11 -0
- package/dist/components/Toast/stories/Toast.stories.js +35 -0
- package/dist/index.js +5 -1
- package/package.json +1 -1
|
@@ -36,5 +36,5 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
36
36
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
37
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
38
38
|
var React = __importStar(require("react"));
|
|
39
|
-
var SvgBuy = function (props) { return ((0, jsx_runtime_1.
|
|
39
|
+
var SvgBuy = function (props) { return ((0, jsx_runtime_1.jsx)("svg", __assign({ width: 22, height: 21, viewBox: "0 0 22 21", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: (0, jsx_runtime_1.jsxs)("g", { id: "Buy", children: [(0, jsx_runtime_1.jsx)("path", { id: "Stroke 1", fillRule: "evenodd", clipRule: "evenodd", d: "M6.4222 17.8203C6.8442 17.8203 7.1872 18.1633 7.1872 18.5853C7.1872 19.0073 6.8442 19.3493 6.4222 19.3493C6.0002 19.3493 5.6582 19.0073 5.6582 18.5853C5.6582 18.1633 6.0002 17.8203 6.4222 17.8203Z", fill: "#474C6D" }), (0, jsx_runtime_1.jsx)("path", { id: "Stroke 1 (Stroke)", fillRule: "evenodd", clipRule: "evenodd", d: "M6.4222 18.8203C6.55419 18.8203 6.6582 18.7139 6.6582 18.5853C6.6582 18.455 6.55249 18.3493 6.4222 18.3493C6.29362 18.3493 6.1872 18.4533 6.1872 18.5853C6.1872 18.7156 6.29192 18.8203 6.4222 18.8203ZM4.6582 18.5853C4.6582 17.6127 5.44622 16.8203 6.4222 16.8203C7.39649 16.8203 8.1872 17.611 8.1872 18.5853C8.1872 19.5613 7.39478 20.3493 6.4222 20.3493C5.44792 20.3493 4.6582 19.5596 4.6582 18.5853Z", fill: "#474C6D" }), (0, jsx_runtime_1.jsx)("path", { id: "Stroke 3", fillRule: "evenodd", clipRule: "evenodd", d: "M17.6752 17.8203C18.0972 17.8203 18.4402 18.1633 18.4402 18.5853C18.4402 19.0073 18.0972 19.3493 17.6752 19.3493C17.2532 19.3493 16.9102 19.0073 16.9102 18.5853C16.9102 18.1633 17.2532 17.8203 17.6752 17.8203Z", fill: "#474C6D" }), (0, jsx_runtime_1.jsx)("path", { id: "Stroke 3 (Stroke)", fillRule: "evenodd", clipRule: "evenodd", d: "M17.6752 18.8203C17.8054 18.8203 17.9102 18.7156 17.9102 18.5853C17.9102 18.4533 17.8037 18.3493 17.6752 18.3493C17.5466 18.3493 17.4402 18.4533 17.4402 18.5853C17.4402 18.7156 17.5449 18.8203 17.6752 18.8203ZM15.9102 18.5853C15.9102 17.611 16.7009 16.8203 17.6752 16.8203C18.6494 16.8203 19.4402 17.611 19.4402 18.5853C19.4402 19.5613 18.6477 20.3493 17.6752 20.3493C16.7026 20.3493 15.9102 19.5613 15.9102 18.5853Z", fill: "#474C6D" }), (0, jsx_runtime_1.jsx)("path", { id: "Stroke 5 (Stroke)", fillRule: "evenodd", clipRule: "evenodd", d: "M0.764813 1.07962C0.859 0.535428 1.37651 0.170626 1.9207 0.264813L4.00071 0.624813C4.44913 0.702425 4.78859 1.07303 4.82666 1.52652L5.0426 4.09916H18.9092C20.3354 4.09916 21.4301 5.36336 21.2259 6.7753L20.2769 13.3334C20.0766 14.7122 18.8957 15.7362 17.5022 15.7362H6.59016C5.13262 15.7362 3.91817 14.6202 3.79667 13.1668C3.79665 13.1666 3.79668 13.167 3.79667 13.1668L2.89829 2.46375L1.57962 2.23551C1.03543 2.14133 0.670626 1.62382 0.764813 1.07962ZM5.21047 6.09916L5.78966 12.9995C5.8244 13.4159 6.17188 13.7362 6.59016 13.7362H17.5022C17.9006 13.7362 18.2399 13.4436 18.2976 13.0464L19.2465 6.48903C19.2763 6.28297 19.1169 6.09916 18.9092 6.09916H5.21047Z", fill: "#474C6D" })] }) }))); };
|
|
40
40
|
exports.default = SvgBuy;
|
|
@@ -38,7 +38,7 @@ ProductCard.propTypes = {
|
|
|
38
38
|
disabled: prop_types_1.default.bool,
|
|
39
39
|
checkboxId: prop_types_1.default.string,
|
|
40
40
|
description: prop_types_1.default.string,
|
|
41
|
-
value: prop_types_1.default.string
|
|
41
|
+
value: prop_types_1.default.string,
|
|
42
42
|
};
|
|
43
43
|
ProductCard.defaultProps = {
|
|
44
44
|
title: "Apple İpad Air WİFİ 64GB (2020)",
|
|
@@ -20,7 +20,7 @@ var ProductCard_1 = __importDefault(require("../ProductCard"));
|
|
|
20
20
|
var props_1 = require("../props");
|
|
21
21
|
exports.default = {
|
|
22
22
|
title: "Components/ProductCard",
|
|
23
|
-
component: function (props) { return (0, jsx_runtime_1.jsx)("div", { style: { maxWidth: props.layout
|
|
23
|
+
component: function (props) { return (0, jsx_runtime_1.jsx)("div", { style: { maxWidth: ["standart"].includes(props.layout) ? '240px' : 'initial' }, children: (0, jsx_runtime_1.jsx)(ProductCard_1.default, __assign({}, props)) }); },
|
|
24
24
|
tags: ['autodocs'],
|
|
25
25
|
argTypes: {
|
|
26
26
|
contentAlignment: { control: 'select', options: props_1.contentAlignments },
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
7
|
+
var SuggestBox_styled_1 = require("./SuggestBox.styled");
|
|
8
|
+
var Icon_1 = __importDefault(require("../Icon/Icon"));
|
|
9
|
+
var Button_1 = __importDefault(require("../Button"));
|
|
10
|
+
var prop_types_1 = __importDefault(require("prop-types"));
|
|
11
|
+
var SuggestBox = function (props) {
|
|
12
|
+
var buttonOnClick = props.buttonOnClick, title = props.title, description = props.description, buttonText = props.buttonText;
|
|
13
|
+
return ((0, jsx_runtime_1.jsxs)(SuggestBox_styled_1.SuggestBoxStyled, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "icon", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: "Search", width: "16px", height: "16px" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "productCardContent", children: [(0, jsx_runtime_1.jsx)("strong", { className: "productCardTitle title-bold-16-19", children: title }), (0, jsx_runtime_1.jsx)("p", { className: "productCardDescription body-medium-14-17", children: description })] })] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Button_1.default, { onClick: buttonOnClick, size: "big", width: "100%", variant: "primary", children: buttonText }) })] }));
|
|
14
|
+
};
|
|
15
|
+
SuggestBox.propTypes = {
|
|
16
|
+
description: prop_types_1.default.string,
|
|
17
|
+
value: prop_types_1.default.string,
|
|
18
|
+
buttonText: prop_types_1.default.string
|
|
19
|
+
};
|
|
20
|
+
SuggestBox.defaultProps = {
|
|
21
|
+
title: "Aradığını bulamadın mı?",
|
|
22
|
+
description: "Aradığını bulamadıysan, dilediğin cihazı Kiralarsın.com’a önerebilirsin.",
|
|
23
|
+
buttonText: "Cihaz Öner",
|
|
24
|
+
};
|
|
25
|
+
exports.default = SuggestBox;
|
|
@@ -0,0 +1,13 @@
|
|
|
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 __importDefault = (this && this.__importDefault) || function (mod) {
|
|
7
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
8
|
+
};
|
|
9
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
|
+
exports.SuggestBoxStyled = void 0;
|
|
11
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
|
+
exports.SuggestBoxStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 0 6px 30px 0 #EAE9F0;\n border-radius: 0.5rem;\n min-width: 240px;\n padding: 1rem;\n transition: all .2s ease;\n position: relative;\n box-sizing: border-box;\n text-align: center;\n min-height: 346px;\n display: grid;\n grid-template-rows: 1fr auto;\n align-items: center;\n .icon{\n width: 56px;\n height: 56px;\n border-radius: 50%;\n background-color: var(--primary-opacity-5);\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 auto 1.5rem auto;\n svg{\n path , circle{\n stroke:var(--primary)\n }\n }\n }\n .productCardContent{\n .productCardTitle{\n display: block;\n color: var(--dark);\n }\n .productCardDescription{\n display: block;\n margin-top: 1rem;\n color: var(--grey-40);\n margin-bottom: 0;\n }\n }\n"], ["\n box-shadow: 0 6px 30px 0 #EAE9F0;\n border-radius: 0.5rem;\n min-width: 240px;\n padding: 1rem;\n transition: all .2s ease;\n position: relative;\n box-sizing: border-box;\n text-align: center;\n min-height: 346px;\n display: grid;\n grid-template-rows: 1fr auto;\n align-items: center;\n .icon{\n width: 56px;\n height: 56px;\n border-radius: 50%;\n background-color: var(--primary-opacity-5);\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 auto 1.5rem auto;\n svg{\n path , circle{\n stroke:var(--primary)\n }\n }\n }\n .productCardContent{\n .productCardTitle{\n display: block;\n color: var(--dark);\n }\n .productCardDescription{\n display: block;\n margin-top: 1rem;\n color: var(--grey-40);\n margin-bottom: 0;\n }\n }\n"])));
|
|
13
|
+
var templateObject_1;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var SuggestBox_1 = require("./SuggestBox");
|
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(SuggestBox_1).default; } });
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
exports.Default = void 0;
|
|
18
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
19
|
+
var SuggestBox_1 = __importDefault(require("../SuggestBox"));
|
|
20
|
+
exports.default = {
|
|
21
|
+
title: 'Components/SuggestBox',
|
|
22
|
+
component: function (props) { return (0, jsx_runtime_1.jsx)("div", { style: { maxWidth: '240px' }, children: (0, jsx_runtime_1.jsx)(SuggestBox_1.default, __assign({}, props)) }); },
|
|
23
|
+
tags: ['autodocs'],
|
|
24
|
+
argTypes: {}
|
|
25
|
+
};
|
|
26
|
+
exports.Default = {
|
|
27
|
+
args: {
|
|
28
|
+
title: "Aradığını bulamadın mı?",
|
|
29
|
+
description: "Aradığını bulamadıysan, dilediğin cihazı Kiralarsın.com’a önerebilirsin.",
|
|
30
|
+
},
|
|
31
|
+
};
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
29
|
+
var react_1 = require("react");
|
|
30
|
+
var Toast_styled_1 = require("./Toast.styled");
|
|
31
|
+
var react_dom_1 = __importDefault(require("react-dom"));
|
|
32
|
+
var Icon_1 = __importDefault(require("../Icon/Icon"));
|
|
33
|
+
var Button_1 = __importDefault(require("../Button"));
|
|
34
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
35
|
+
var Toast = function (props) {
|
|
36
|
+
var timer = props.timer, primaryButtonText = props.primaryButtonText, isPrimaryButtonDisabled = props.isPrimaryButtonDisabled, isPrimaryButtonLoading = props.isPrimaryButtonLoading, showPrimaryButton = props.showPrimaryButton, children = props.children, icon = props.icon, show = props.show, onPrimaryAction = props.onPrimaryAction, title = props.title, other = __rest(props, ["timer", "primaryButtonText", "isPrimaryButtonDisabled", "isPrimaryButtonLoading", "showPrimaryButton", "children", "icon", "show", "onPrimaryAction", "title"]);
|
|
37
|
+
var _a = (0, react_1.useState)(show), showToast = _a[0], setShowToast = _a[1];
|
|
38
|
+
(0, react_1.useEffect)(function () {
|
|
39
|
+
setShowToast(show);
|
|
40
|
+
setTimeout(function () {
|
|
41
|
+
setShowToast(false);
|
|
42
|
+
}, timer);
|
|
43
|
+
document.body.style.overflow = show ? "auto" : "hidden";
|
|
44
|
+
}, [show]);
|
|
45
|
+
return (showToast &&
|
|
46
|
+
react_dom_1.default.createPortal((0, jsx_runtime_1.jsx)(Toast_styled_1.OverlayStyled, { children: (0, jsx_runtime_1.jsx)(Toast_styled_1.ToastStyled, __assign({}, props, { children: (0, jsx_runtime_1.jsxs)("div", { children: [icon && ((0, jsx_runtime_1.jsx)("div", { className: "icon", children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: icon, width: "24px", height: "24px" }) })), title && ((0, jsx_runtime_1.jsx)("h5", { className: (0, classnames_1.default)("title", "headline-semi-bold-20-24"), children: title })), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)("content", "body-regular-14-17"), children: children }), showPrimaryButton && ((0, jsx_runtime_1.jsx)("div", { className: "bottom", children: (0, jsx_runtime_1.jsx)(Button_1.default, { onClick: onPrimaryAction, size: "big", variant: "primary", width: "100%", isLoading: isPrimaryButtonLoading, disabled: isPrimaryButtonDisabled, children: primaryButtonText }) }))] }) })) }), document.body));
|
|
47
|
+
};
|
|
48
|
+
Toast.defaultProps = {
|
|
49
|
+
icon: "CheckMark",
|
|
50
|
+
timer: 1000,
|
|
51
|
+
title: "Title",
|
|
52
|
+
};
|
|
53
|
+
exports.default = Toast;
|
|
@@ -0,0 +1,80 @@
|
|
|
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 __importDefault = (this && this.__importDefault) || function (mod) {
|
|
7
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
8
|
+
};
|
|
9
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
|
+
exports.OverlayStyled = exports.ToastStyled = void 0;
|
|
11
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
|
+
exports.ToastStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background: white;\n border-radius: 8px;\n box-sizing: border-box;\n max-width: calc(100vw - 2rem);\n padding: 2rem;\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n width: ", ";\n min-height: ", ";\n > div{\n width: 100%;\n }\n\n\n .icon{\n\n width: ", ";\n\n height: ", ";\n border-radius: 50%;\n background-color: var(--primary);\n text-align: center;\n align-items: center;\n justify-content: center;\n display: flex;\n margin: 0 auto;\n svg{\n\n width: ", ";\n\n height: ", ";\n path{\n fill: #fff;\n }\n }\n }\n\n .title {\n margin: 2rem 0 0 0;\n padding: 0;\n }\n \n .content {\n margin: 2rem 0 0 0;\n &:is(:empty){\n display: none;\n }\n }\n .bottom{\n margin: 2rem 0 0 0;\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n"], ["\n background: white;\n border-radius: 8px;\n box-sizing: border-box;\n max-width: calc(100vw - 2rem);\n padding: 2rem;\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n width: ", ";\n min-height: ", ";\n > div{\n width: 100%;\n }\n\n\n .icon{\n\n width: ", ";\n\n height: ", ";\n border-radius: 50%;\n background-color: var(--primary);\n text-align: center;\n align-items: center;\n justify-content: center;\n display: flex;\n margin: 0 auto;\n svg{\n\n width: ", ";\n\n height: ", ";\n path{\n fill: #fff;\n }\n }\n }\n\n .title {\n margin: 2rem 0 0 0;\n padding: 0;\n }\n \n .content {\n margin: 2rem 0 0 0;\n &:is(:empty){\n display: none;\n }\n }\n .bottom{\n margin: 2rem 0 0 0;\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n"])), function (props) {
|
|
13
|
+
switch (props.size) {
|
|
14
|
+
case 'small':
|
|
15
|
+
return "249px";
|
|
16
|
+
case 'medium':
|
|
17
|
+
return "343px";
|
|
18
|
+
case 'large':
|
|
19
|
+
return "462px";
|
|
20
|
+
default:
|
|
21
|
+
return "462px";
|
|
22
|
+
}
|
|
23
|
+
}, function (props) {
|
|
24
|
+
switch (props.size) {
|
|
25
|
+
case 'small':
|
|
26
|
+
return "227px";
|
|
27
|
+
case 'medium':
|
|
28
|
+
return "251px";
|
|
29
|
+
case 'large':
|
|
30
|
+
return "283px";
|
|
31
|
+
default:
|
|
32
|
+
return "227px";
|
|
33
|
+
}
|
|
34
|
+
}, function (props) {
|
|
35
|
+
switch (props.size) {
|
|
36
|
+
case 'small':
|
|
37
|
+
return "56px";
|
|
38
|
+
case 'medium':
|
|
39
|
+
return "80px";
|
|
40
|
+
case 'large':
|
|
41
|
+
return "112px";
|
|
42
|
+
default:
|
|
43
|
+
return "56px";
|
|
44
|
+
}
|
|
45
|
+
}, function (props) {
|
|
46
|
+
switch (props.size) {
|
|
47
|
+
case 'small':
|
|
48
|
+
return "56px";
|
|
49
|
+
case 'medium':
|
|
50
|
+
return "80px";
|
|
51
|
+
case 'large':
|
|
52
|
+
return "112px";
|
|
53
|
+
default:
|
|
54
|
+
return "56px";
|
|
55
|
+
}
|
|
56
|
+
}, function (props) {
|
|
57
|
+
switch (props.size) {
|
|
58
|
+
case 'small':
|
|
59
|
+
return "24px";
|
|
60
|
+
case 'medium':
|
|
61
|
+
return "35px";
|
|
62
|
+
case 'large':
|
|
63
|
+
return "50px";
|
|
64
|
+
default:
|
|
65
|
+
return "24px";
|
|
66
|
+
}
|
|
67
|
+
}, function (props) {
|
|
68
|
+
switch (props.size) {
|
|
69
|
+
case 'small':
|
|
70
|
+
return "24px";
|
|
71
|
+
case 'medium':
|
|
72
|
+
return "35px";
|
|
73
|
+
case 'large':
|
|
74
|
+
return "50px";
|
|
75
|
+
default:
|
|
76
|
+
return "24px";
|
|
77
|
+
}
|
|
78
|
+
});
|
|
79
|
+
exports.OverlayStyled = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: fixed;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #a3a5ad40;\n overflow: auto;\n left: 0;\n top: 0;\n z-index: 999999;\n"], ["\n position: fixed;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #a3a5ad40;\n overflow: auto;\n left: 0;\n top: 0;\n z-index: 999999;\n"])));
|
|
80
|
+
var templateObject_1, templateObject_2;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var Toast_1 = require("./Toast");
|
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Toast_1).default; } });
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.iconNames = exports.sizes = void 0;
|
|
4
|
+
var Icon_1 = require("../Icon");
|
|
5
|
+
exports.sizes = ['small', 'medium', 'large'];
|
|
6
|
+
exports.iconNames = Object.keys(Icon_1.iconList);
|
|
7
|
+
var ToastDefault = {
|
|
8
|
+
size: 'small',
|
|
9
|
+
show: true,
|
|
10
|
+
primaryButtonText: 'Primary'
|
|
11
|
+
};
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.Default = void 0;
|
|
7
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
+
var Toast_1 = __importDefault(require("../Toast"));
|
|
9
|
+
var props_1 = require("../../Toast/props");
|
|
10
|
+
var Icon_1 = require("../../Icon");
|
|
11
|
+
exports.default = {
|
|
12
|
+
title: 'Components/Toast',
|
|
13
|
+
component: Toast_1.default,
|
|
14
|
+
tags: ['autodocs'],
|
|
15
|
+
argTypes: {
|
|
16
|
+
size: { control: 'select', options: props_1.sizes },
|
|
17
|
+
icon: { control: 'select', options: Object.keys(Icon_1.iconList) },
|
|
18
|
+
title: {
|
|
19
|
+
name: 'Title',
|
|
20
|
+
type: { name: 'string', required: false },
|
|
21
|
+
defaultValue: 'Title',
|
|
22
|
+
},
|
|
23
|
+
onPrimaryAction: { action: 'primary clicked' },
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
exports.Default = {
|
|
27
|
+
args: {
|
|
28
|
+
show: true,
|
|
29
|
+
title: 'Title',
|
|
30
|
+
timer: 999999,
|
|
31
|
+
showPrimaryButton: true,
|
|
32
|
+
primaryButtonText: 'Primary Action',
|
|
33
|
+
children: (0, jsx_runtime_1.jsx)("div", { children: "Content" })
|
|
34
|
+
},
|
|
35
|
+
};
|
package/dist/index.js
CHANGED
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Banner = exports.Footer = exports.Accordion = exports.Divider = exports.SearchBox = exports.ValueProposition = exports.Textarea = exports.ActionButton = exports.RadioButton = exports.Icon = exports.Agreement = exports.Alert = exports.Stepper = exports.ProductCard = exports.OtpInput = exports.Modal = exports.Input = exports.CircleProgress = exports.Checkbox = exports.CategoryMenu = exports.Breadcrumbs = exports.Spinner = exports.Button = void 0;
|
|
6
|
+
exports.SuggestBox = exports.Toast = exports.Banner = exports.Footer = exports.Accordion = exports.Divider = exports.SearchBox = exports.ValueProposition = exports.Textarea = exports.ActionButton = exports.RadioButton = exports.Icon = exports.Agreement = exports.Alert = exports.Stepper = exports.ProductCard = exports.OtpInput = exports.Modal = exports.Input = exports.CircleProgress = exports.Checkbox = exports.CategoryMenu = exports.Breadcrumbs = exports.Spinner = exports.Button = void 0;
|
|
7
7
|
var Button_1 = __importDefault(require("./components/Button"));
|
|
8
8
|
exports.Button = Button_1.default;
|
|
9
9
|
var Spinner_1 = __importDefault(require("./components/Spinner"));
|
|
@@ -50,3 +50,7 @@ var Footer_1 = __importDefault(require("./components/Footer"));
|
|
|
50
50
|
exports.Footer = Footer_1.default;
|
|
51
51
|
var Banner_1 = __importDefault(require("./components/Banner"));
|
|
52
52
|
exports.Banner = Banner_1.default;
|
|
53
|
+
var Toast_1 = __importDefault(require("./components/Toast"));
|
|
54
|
+
exports.Toast = Toast_1.default;
|
|
55
|
+
var SuggestBox_1 = __importDefault(require("./components/SuggestBox"));
|
|
56
|
+
exports.SuggestBox = SuggestBox_1.default;
|