@typeolymp/ui-components 1.12.0 → 1.13.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/build/components/atoms/Button/index.d.ts +1 -1
- package/build/components/atoms/Illustration/index.d.ts +1 -1
- package/build/components/atoms/Input/Password.d.ts +2 -0
- package/build/components/atoms/Input/styles.d.ts +3 -0
- package/build/components/atoms/Input/translations.d.ts +11 -0
- package/build/components/atoms/Paragraph/index.d.ts +1 -0
- package/build/components/molecules/IconButton/index.d.ts +1 -0
- package/build/components/molecules/PasswordInputField/styles.d.ts +0 -2
- package/build/components/molecules/Tabs/index.d.ts +1 -2
- package/build/components/organisms/Table/index.d.ts +4 -2
- package/build/components/organisms/Table/styles.d.ts +1 -0
- package/build/index.es.js +214 -157
- package/build/index.es.js.map +1 -1
- package/build/index.js +214 -157
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.es.js
CHANGED
|
@@ -3419,6 +3419,8 @@ var StyledButton = styled.button(templateObject_1$Q || (templateObject_1$Q = __m
|
|
|
3419
3419
|
return theme.colors.blue.base;
|
|
3420
3420
|
case "green":
|
|
3421
3421
|
return theme.colors.green.base;
|
|
3422
|
+
case "red":
|
|
3423
|
+
return theme.colors.red.base;
|
|
3422
3424
|
case "white":
|
|
3423
3425
|
return theme.colors.lightGray.light;
|
|
3424
3426
|
}
|
|
@@ -3430,6 +3432,8 @@ var StyledButton = styled.button(templateObject_1$Q || (templateObject_1$Q = __m
|
|
|
3430
3432
|
return "inset 0 -3px 0 ".concat(theme.colors.blue.dark);
|
|
3431
3433
|
case "green":
|
|
3432
3434
|
return "inset 0 -3px 0 ".concat(theme.colors.green.dark);
|
|
3435
|
+
case "red":
|
|
3436
|
+
return "inset 0 -3px 0 ".concat(theme.colors.red.dark);
|
|
3433
3437
|
case "white":
|
|
3434
3438
|
return "0 3px 0 ".concat(theme.colors.darkGray.light);
|
|
3435
3439
|
}
|
|
@@ -3455,7 +3459,7 @@ var StyledButton = styled.button(templateObject_1$Q || (templateObject_1$Q = __m
|
|
|
3455
3459
|
? theme.button.medium.heightActive
|
|
3456
3460
|
: theme.button[size].heightActive;
|
|
3457
3461
|
});
|
|
3458
|
-
var DisabledButton = styled(StyledButton)(templateObject_2$w || (templateObject_2$w = __makeTemplateObject$1(["\n background-color: ", ";\n border:
|
|
3462
|
+
var DisabledButton = styled(StyledButton)(templateObject_2$w || (templateObject_2$w = __makeTemplateObject$1(["\n background-color: ", ";\n border: 1px solid ", ";\n box-shadow: none;\n padding: 16px 20px;\n cursor: not-allowed;\n\n span {\n color: ", ";\n }\n\n :active {\n margin-top: 0;\n height: ", ";\n }\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n box-shadow: none;\n padding: 16px 20px;\n cursor: not-allowed;\n\n span {\n color: ", ";\n }\n\n :active {\n margin-top: 0;\n height: ", ";\n }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.darker, theme.colors.lightGray.darker, function (_a) {
|
|
3459
3463
|
var size = _a.size;
|
|
3460
3464
|
return !size ? theme.button.medium.height : theme.button[size].height;
|
|
3461
3465
|
});
|
|
@@ -3980,17 +3984,56 @@ var illustrations = {
|
|
|
3980
3984
|
idCard: (jsxs("svg", __assign$2({ viewBox: "0 0 424 304" }, { children: [jsx$1("path", { d: "M0 82h424v182c0 22.091-17.909 40-40 40H40c-22.091 0-40-17.909-40-40V82z", fill: "#EDEDED" }), jsx$1("rect", { x: 242, y: 131, width: 149, height: 25, rx: 12.5, fill: "#23292F" }), jsx$1("rect", { x: 242, y: 179, width: 89, height: 25, rx: 12.5, fill: "#23292F" }), jsx$1("rect", { x: 242, y: 227, width: 119, height: 25, rx: 12.5, fill: "#23292F" }), jsx$1("path", { d: "M0 40C0 17.909 17.909 0 40 0h344c22.091 0 40 17.909 40 40v42H0V40z", fill: "#FF9D00" }), jsxs("g", __assign$2({ clipPath: "url(#clip0_894_47510)" }, { children: [jsx$1("path", { d: "M121 240c-18.778 0-34 15.457-34 34.523V304h68v-29.477C155 255.457 139.777 240 121 240z", fill: "#3DC478" }), jsx$1("path", { d: "M188.866 166.976a32.398 32.398 0 002.716-7.051c4.423-17.307-6.022-34.922-23.33-39.343a32.199 32.199 0 00-20.01 1.306c-3.93-8.569-11.549-15.357-21.394-17.873-14.776-3.777-29.77 3.288-36.594 16.204a32.826 32.826 0 00-2.518-.762c-17.307-4.423-34.923 6.021-39.346 23.328-2.335 9.138-.523 18.359 4.253 25.682a32.182 32.182 0 00-10.628 16.83c-4.423 17.306 6.022 34.922 23.33 39.343 14.077 3.598 28.358-2.642 35.577-14.409a32.237 32.237 0 0012.811 6.576c10.279 2.627 20.665.009 28.334-6.174 4.279 6.183 10.714 10.916 18.573 12.924 17.307 4.423 34.923-6.022 39.346-23.329 3.245-12.697-1.52-25.555-11.12-33.252z", fill: "#75301C" }), jsx$1("path", { d: "M129.851 228.557h-17.753v14.047a7.367 7.367 0 007.367 7.367h3.019a7.367 7.367 0 007.367-7.367v-14.047z", fill: "#FFB68D" }), jsx$1("path", { d: "M171.736 175.935c-.5 0-.987.052-1.464.134-5.422-22.108-25.36-38.514-49.141-38.514s-43.72 16.406-49.141 38.514a8.622 8.622 0 00-1.465-.134 8.606 8.606 0 100 17.213c.084 0 .164-.011.247-.013 2.501 25.61 24.09 45.625 50.359 45.625 26.268 0 47.858-20.015 50.359-45.625.082.002.163.013.246.013a8.606 8.606 0 008.607-8.607 8.606 8.606 0 00-8.607-8.606z", fill: "#FFB68D" }), jsx$1("path", { d: "M155.414 205.187c0-14.961-14.024-6.878-32.706-6.878-18.681 0-34.946-8.083-34.946 6.878 0 14.962 15.145 27.091 33.826 27.091s33.826-12.129 33.826-27.091z", fill: "#230F0B" }), jsx$1("path", { d: "M121.586 232.276c7.308 0 14.068-1.862 19.598-5.017-2.608-3.569-6.88-6.158-11.87-6.853a20.051 20.051 0 00-6.101.08 9.812 9.812 0 01-3.253 0 20.083 20.083 0 00-6.101-.08c-4.99.695-9.263 3.284-11.87 6.853 5.53 3.156 12.29 5.017 19.597 5.017z", fill: "#F21C40" }), jsx$1("path", { opacity: 0.37, d: "M126.804 188.238a5.217 5.217 0 10-10.434 0c0 2.881 2.336 3.523 5.217 3.523s5.217-.642 5.217-3.523z", fill: "#FFB68D" }), jsx$1("path", { d: "M94.656 157.686c-7.962 0-14.476 6.513-14.476 14.475v6.972c0 7.962 6.514 11.014 14.476 11.014 7.962 0 14.476-6.092 14.476-14.053v-3.933c.001-7.961-6.514-14.475-14.476-14.475z", fill: "#fff" }), jsx$1("path", { d: "M94.656 165.801a5.023 5.023 0 00-5.009 5.009v9.245c0 2.754 2.255 5.009 5.01 5.009 2.754 0 5.009-2.255 5.009-5.009v-9.245a5.023 5.023 0 00-5.01-5.009z", fill: "#23292F" }), jsx$1("path", { d: "M89.648 173.92a3.027 3.027 0 100-6.053 3.027 3.027 0 000 6.053zM147.279 157.686c7.963 0 14.476 6.513 14.476 14.475v6.972c0 7.962-6.513 11.014-14.476 11.014-7.962 0-14.475-6.092-14.475-14.053v-3.933c0-7.961 6.513-14.475 14.475-14.475z", fill: "#fff" }), jsx$1("path", { d: "M147.28 165.801c2.754 0 5.009 2.253 5.009 5.009v9.245c0 2.754-2.255 5.009-5.009 5.009-2.755 0-5.009-2.255-5.009-5.009v-9.245a5.023 5.023 0 015.009-5.009z", fill: "#23292F" }), jsx$1("path", { d: "M152.288 173.92a3.027 3.027 0 100-6.053 3.027 3.027 0 000 6.053z", fill: "#fff" }), jsx$1("path", { d: "M148.11 130.102c-8.331 0-15.781 2.196-20.751 5.648a51.514 51.514 0 00-6.346-.392c-3.856 0-7.521.421-10.842 1.176-4.971-3.288-12.43-5.381-20.772-5.381-14.965 0-27.097 6.728-27.097 15.027s12.132 15.027 27.097 15.027c4.564 0 8.861-.628 12.634-1.734 4.889 2.493 11.588 4.032 18.981 4.032 6.294 0 12.081-1.117 16.681-2.987 3.208.781 6.725 1.213 10.418 1.213 14.965 0 27.097-7.081 27.097-15.816-.001-8.733-12.133-15.813-27.1-15.813z", fill: "#75301C" }), jsx$1("path", { opacity: 0.57, d: "M68.7 184.682l.589-.59a1.146 1.146 0 10-1.62-1.62l-.59.59-.59-.59a1.147 1.147 0 00-1.62 1.62l.59.59-.59.589a1.147 1.147 0 001.62 1.621l.589-.59.59.59a1.146 1.146 0 101.618-1.621l-.587-.589zM176.426 184.682l.589-.59a1.144 1.144 0 10-1.62-1.62l-.589.59-.59-.59a1.146 1.146 0 00-1.62 1.62l.589.59-.589.589a1.146 1.146 0 001.619 1.621l.589-.59.59.59a1.144 1.144 0 001.619 0 1.147 1.147 0 000-1.621l-.587-.589z", fill: "#FFB68D" })] })), jsx$1("defs", { children: jsx$1("clipPath", __assign$2({ id: "clip0_894_47510" }, { children: jsx$1("path", { fill: "#fff", transform: "translate(41 103)", d: "M0 0H160V201H0z" }) })) })] }))),
|
|
3981
3985
|
cookie: (jsxs("svg", __assign$2({ viewBox: "0 0 867.3 871.1" }, { children: [jsx$1("path", { d: "M576.6 301.2c-.2-12.3 1-24.4 3.3-36 1.5-7.5-5.3-13.9-12.7-12.1-9.7 2.4-19.9 3.6-30.4 3.6-71.1 0-129.6-59.1-128.9-130.2.3-35.4 15-67.4 38.4-90.5 3.9-3.9 1.3-10.5-4.2-10.8-6.3-.3-12.6-.4-19-.4C189.5 24.8 0 214.2 0 447.9c0 233.7 189.5 423.2 423.2 423.2s423.2-189.5 423.2-423.2v-.1c0-3.8-4.3-6.1-7.5-4.1-25.9 16.3-56.4 25.9-89.2 26.3-94.1 1.1-171.9-74.8-173.1-168.8z", fill: "#f49500" }), jsx$1("path", { d: "M576.6 301.2c-.2-12.3 1-24.4 3.3-36 1.5-7.5-5.3-13.9-12.7-12.1-9.7 2.4-19.9 3.6-30.4 3.6-71.1 0-129.6-59.1-128.9-130.2.3-35.4 15-67.4 38.4-90.5 3.9-3.9 1.3-10.5-4.2-10.8-6.3-.3-12.6-.4-19-.4C189.5 24.8 0 214.2 0 447.9c0 233.7 189.5 423.2 423.2 423.2s423.2-189.5 423.2-423.2v-.1c0-3.8-4.3-6.1-7.5-4.1-25.9 16.3-56.4 25.9-89.2 26.3-94.1 1.1-171.9-74.8-173.1-168.8z", opacity: 0.2, fill: "#010202" }), jsx$1("path", { d: "M597.5 276.4c-.2-12.3 1-24.4 3.3-36 1.5-7.5-5.3-13.9-12.7-12.1-9.7 2.4-19.9 3.6-30.4 3.6-71.1 0-129.6-59.1-128.9-130.2.3-35.4 15-67.4 38.4-90.5C471.1 7.3 468.5.7 463 .4c-6.3-.3-12.6-.4-19-.4C210.4 0 20.9 189.5 20.9 423.2s189.5 423.2 423.2 423.2 423.2-189.5 423.2-423.2v-.1c0-3.8-4.3-6.1-7.5-4.1-25.9 16.3-56.4 25.9-89.2 26.3-94.1 1-171.9-74.9-173.1-168.9z", fill: "#f49500" }), jsxs("g", __assign$2({ fill: "#9e1827" }, { children: [jsx$1("circle", { cx: 277.7, cy: 259.3, r: 65 }), jsx$1("circle", { cx: 261.5, cy: 584.3, r: 81.2 }), jsx$1("circle", { cx: 624.3, cy: 543.8, r: 76.8 }), jsx$1("circle", { cx: 477, cy: 714.1, r: 32.9 }), jsx$1("circle", { cx: 415.3, cy: 443.9, r: 38.7 }), jsx$1("circle", { cx: 677.3, cy: 74.1, r: 33.1 }), jsx$1("circle", { cx: 838.9, cy: 192.3, r: 28.4 }), jsx$1("circle", { cx: 732.8, cy: 244.1, r: 51.9 })] }))] }))),
|
|
3982
3986
|
classroom: (jsxs("svg", __assign$2({ viewBox: "0 0 165.4 116.8" }, { children: [jsx$1("path", { d: "M14.4 109.3c-3.8 0-6.9-3.1-6.9-6.9v-88c0-3.8 3.1-6.9 6.9-6.9H151c3.8 0 6.9 3.1 6.9 6.9v88c0 3.8-3.1 6.9-6.9 6.9H14.4z", fill: "#2d9d60" }), jsx$1("path", { d: "M150.4 15v86.8H15V15h135.4m.6-15H14.4C6.5 0 0 6.5 0 14.4v88c0 8 6.5 14.4 14.4 14.4H151c8 0 14.4-6.5 14.4-14.4v-88C165.4 6.5 159 0 151 0z", fill: "#FF9D00" }), jsx$1("path", { fill: "#c4c4c4", d: "M103.1 90.7H135.39999999999998V101.8H103.1z" }), jsx$1("g", { children: jsx$1("path", { d: "M82 81.9H43.7c-2.8 0-5-2.2-5-5s2.2-5 5-5H82c2.8 0 5 2.2 5 5s-2.2 5-5 5zM69.4 63H43.7c-2.8 0-5-2.2-5-5s2.2-5 5-5h25.7c2.8 0 5 2.2 5 5s-2.2 5-5 5zM93.3 44.9H43.7c-2.8 0-5-2.2-5-5s2.2-5 5-5h49.6c2.8 0 5 2.2 5 5s-2.3 5-5 5z", fill: "#fff" }) })] }))),
|
|
3987
|
+
student: (jsxs("svg", __assign$2({ viewBox: "0 0 160 201" }, { children: [jsx$1("path", { d: "M80 137c-18.8 0-34 15.5-34 34.5V201h68v-29.5c0-19-15.2-34.5-34-34.5z", fill: "#53b476" }), jsx$1("path", { d: "M147.9 64c1.2-2.2 2.1-4.5 2.7-7.1 4.4-17.3-6-34.9-23.3-39.3-6.9-1.8-13.9-1.2-20 1.3-4-8.6-11.6-15.4-21.5-17.9-14.7-3.8-29.7 3.3-36.5 16.2-.8-.3-1.7-.5-2.5-.8-17.3-4.4-34.9 6-39.3 23.3-2.3 9.1-.5 18.4 4.3 25.7-5.2 4.3-9 10-10.8 16.9-4.4 17.3 6 34.9 23.3 39.3 14.1 3.6 28.4-2.6 35.6-14.4 3.6 3 7.9 5.3 12.8 6.6 10.3 2.6 20.7 0 28.3-6.2 4.3 6.2 10.7 10.9 18.6 12.9 17.3 4.4 34.9-6 39.3-23.3 3.3-12.7-1.4-25.5-11-33.2z", fill: "#75301c" }), jsx$1("path", { d: "M88.9 125.6H71.1v14c0 4.1 3.3 7.4 7.4 7.4h3c4.1 0 7.4-3.3 7.4-7.4v-14z", fill: "#f7b58e" }), jsx$1("path", { d: "M130.7 72.9c-.5 0-1 .1-1.5.1-5.4-22.1-25.4-38.5-49.1-38.5C56.3 34.6 36.4 51 31 73.1c-.5-.1-1-.1-1.5-.1-4.8 0-8.6 3.9-8.6 8.6 0 4.8 3.9 8.6 8.6 8.6h.2c2.5 25.6 24.1 45.6 50.4 45.6 26.3 0 47.9-20 50.4-45.6h.2c4.8 0 8.6-3.9 8.6-8.6 0-4.8-3.8-8.7-8.6-8.7z", fill: "#f7b58e" }), jsx$1("path", { d: "M114.4 102.2c0-15-14-6.9-32.7-6.9-18.7 0-34.9-8.1-34.9 6.9s15.1 27.1 33.8 27.1 33.8-12.2 33.8-27.1z", fill: "#220f0c" }), jsx$1("path", { d: "M80.6 129.3c7.3 0 14.1-1.9 19.6-5-2.6-3.6-6.9-6.2-11.9-6.9-2.1-.3-4.2-.2-6.1.1-1.1.2-2.2.2-3.3 0-1.9-.3-4-.4-6.1-.1-5 .7-9.3 3.3-11.9 6.9 5.6 3.1 12.4 5 19.7 5z", fill: "#e62743" }), jsx$1("path", { d: "M85.8 85.2c0-2.9-2.3-5.2-5.2-5.2-2.9 0-5.2 2.3-5.2 5.2s2.3 3.5 5.2 3.5c2.9.1 5.2-.6 5.2-3.5z", opacity: 0.37, fill: "#f7b58e" }), jsx$1("path", { d: "M53.7 54.7c-8 0-14.5 6.5-14.5 14.5v7c0 8 6.5 11 14.5 11s14.5-6.1 14.5-14.1v-3.9c-.1-8-6.6-14.5-14.5-14.5z", fill: "#fff" }), jsx$1("path", { d: "M53.7 62.8c-2.8 0-5 2.3-5 5V77c0 2.8 2.3 5 5 5s5-2.3 5-5v-9.2c0-2.7-2.3-5-5-5z", fill: "#23292f" }), jsx$1("path", { d: "M48.6 70.9c1.7 0 3-1.4 3-3 0-1.7-1.4-3-3-3-1.7 0-3 1.4-3 3 0 1.7 1.4 3 3 3zM106.3 54.7c8 0 14.5 6.5 14.5 14.5v7c0 8-6.5 11-14.5 11s-14.5-6.1-14.5-14.1v-3.9c0-8 6.5-14.5 14.5-14.5z", fill: "#fff" }), jsx$1("path", { d: "M106.3 62.8c2.8 0 5 2.3 5 5V77c0 2.8-2.3 5-5 5-2.8 0-5-2.3-5-5v-9.2c0-2.7 2.2-5 5-5z", fill: "#23292f" }), jsx$1("path", { d: "M111.3 70.9c1.7 0 3-1.4 3-3 0-1.7-1.4-3-3-3-1.7 0-3 1.4-3 3 0 1.7 1.3 3 3 3z", fill: "#fff" }), jsx$1("path", { d: "M107.1 27.1c-8.3 0-15.8 2.2-20.8 5.6-2-.3-4.2-.4-6.3-.4-3.9 0-7.5.4-10.8 1.2-5-3.3-12.4-5.4-20.8-5.4-15 0-27.1 6.7-27.1 15s12.1 15 27.1 15c4.6 0 8.9-.6 12.6-1.7 4.9 2.5 11.6 4 19 4 6.3 0 12.1-1.1 16.7-3 3.2.8 6.7 1.2 10.4 1.2 15 0 27.1-7.1 27.1-15.8 0-8.6-12.1-15.7-27.1-15.7z", fill: "#75301c" }), jsx$1("path", { d: "M27.7 81.7l.6-.6c.4-.4.4-1.2 0-1.6-.4-.4-1.2-.4-1.6 0l-.6.6-.6-.6c-.4-.4-1.2-.4-1.6 0-.4.4-.4 1.2 0 1.6l.6.6-.6.6c-.4.4-.4 1.2 0 1.6.2.2.5.3.8.3.3 0 .6-.1.8-.3l.6-.6.6.6c.2.2.5.3.8.3s.6-.1.8-.3c.4-.4.4-1.2 0-1.6l-.6-.6zM135.4 81.7l.6-.6c.4-.4.4-1.2 0-1.6-.4-.4-1.2-.4-1.6 0l-.6.6-.6-.6c-.4-.4-1.2-.4-1.6 0-.4.4-.4 1.2 0 1.6l.6.6-.6.6c-.4.4-.4 1.2 0 1.6.2.2.5.3.8.3.3 0 .6-.1.8-.3l.6-.6.6.6c.2.2.5.3.8.3.3 0 .6-.1.8-.3.4-.4.4-1.2 0-1.6l-.6-.6z", opacity: 0.57, fill: "#f7b58e" })] }))),
|
|
3983
3988
|
};
|
|
3984
3989
|
var Illustration = function (props) { return (jsx$1(Wrapper$7, __assign$2({}, props, { children: illustrations[props.type] }))); };
|
|
3985
3990
|
|
|
3986
|
-
var
|
|
3991
|
+
var StyledParagraph = styled.p(templateObject_1$K || (templateObject_1$K = __makeTemplateObject$1(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n text-transform: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n text-transform: ", ";\n"])), theme.fonts.paragraph, function (_a) {
|
|
3992
|
+
var size = _a.size;
|
|
3993
|
+
return size ? theme.paragraph[size].fontSize : theme.paragraph.medium.fontSize;
|
|
3994
|
+
}, function (_a) {
|
|
3995
|
+
var weight = _a.weight;
|
|
3996
|
+
switch (weight) {
|
|
3997
|
+
case "regular":
|
|
3998
|
+
return 400;
|
|
3999
|
+
default:
|
|
4000
|
+
case "medium":
|
|
4001
|
+
return 500;
|
|
4002
|
+
}
|
|
4003
|
+
}, function (_a) {
|
|
4004
|
+
var size = _a.size;
|
|
4005
|
+
return size
|
|
4006
|
+
? theme.paragraph[size].lineHeight
|
|
4007
|
+
: theme.paragraph.medium.lineHeight;
|
|
4008
|
+
}, function (_a) {
|
|
4009
|
+
var color = _a.color;
|
|
4010
|
+
switch (color) {
|
|
4011
|
+
case "white":
|
|
4012
|
+
return theme.colors.lightGray.light;
|
|
4013
|
+
default:
|
|
4014
|
+
case "lightGray":
|
|
4015
|
+
return theme.colors.darkGray.light;
|
|
4016
|
+
case "darkGray":
|
|
4017
|
+
return theme.colors.darkGray.dark;
|
|
4018
|
+
}
|
|
4019
|
+
}, function (_a) {
|
|
4020
|
+
var align = _a.align;
|
|
4021
|
+
return align;
|
|
4022
|
+
}, function (_a) {
|
|
4023
|
+
var transform = _a.transform;
|
|
4024
|
+
return transform;
|
|
4025
|
+
});
|
|
4026
|
+
var templateObject_1$K;
|
|
4027
|
+
|
|
4028
|
+
var Container$l = styled.div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject$1(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
4029
|
+
var InputIconWrapper = styled.div(templateObject_2$v || (templateObject_2$v = __makeTemplateObject$1(["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
|
|
3987
4030
|
var isChanged = _a.isChanged;
|
|
3988
4031
|
return !isChanged ? theme.colors.lightGray.darker : "";
|
|
3989
4032
|
}, function (_a) {
|
|
3990
4033
|
var disabled = _a.disabled;
|
|
3991
4034
|
return (disabled ? "not-allowed" : "pointer");
|
|
3992
4035
|
});
|
|
3993
|
-
var StyledInput = styled.input(
|
|
4036
|
+
var StyledInput = styled.input(templateObject_3$a || (templateObject_3$a = __makeTemplateObject$1(["\n width: 100%;\n min-width: 228px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n min-width: 228px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
3994
4037
|
var disabled = _a.disabled;
|
|
3995
4038
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
3996
4039
|
}, function (_a) {
|
|
@@ -4003,15 +4046,103 @@ var StyledInput = styled.input(templateObject_2$v || (templateObject_2$v = __mak
|
|
|
4003
4046
|
var disabled = _a.disabled;
|
|
4004
4047
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
4005
4048
|
}, theme.fonts.paragraph, theme.paragraph.medium.fontSize, theme.paragraph.medium.lineHeight, theme.colors.lightGray.darker, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4006
|
-
var
|
|
4049
|
+
var HelperContainer = styled.div(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject$1(["\n margin-top: 5px;\n padding-left: 5px;\n"], ["\n margin-top: 5px;\n padding-left: 5px;\n"])));
|
|
4050
|
+
var fadeIn = keyframes$1(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject$1(["\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n"], ["\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n"])));
|
|
4051
|
+
var Helper = styled(StyledParagraph)(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject$1(["\n font-weight: 400;\n font-size: 14px;\n color: ", ";\n animation: ", " 0.3s linear;\n"], ["\n font-weight: 400;\n font-size: 14px;\n color: ", ";\n animation: ", " 0.3s linear;\n"])), function (_a) {
|
|
4052
|
+
var isOk = _a.isOk;
|
|
4053
|
+
return isOk ? theme.colors.green.base : theme.colors.darkGray.light;
|
|
4054
|
+
}, fadeIn);
|
|
4055
|
+
var templateObject_1$J, templateObject_2$v, templateObject_3$a, templateObject_4$7, templateObject_5$3, templateObject_6$3;
|
|
4056
|
+
|
|
4057
|
+
var expressions = {};
|
|
4058
|
+
|
|
4059
|
+
(function (exports) {
|
|
4060
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4061
|
+
exports.isStrongPassword = exports.isValidUsername = exports.isValidEmail = exports.hasCapitalLetter = exports.hasSpecialCharacter = exports.hasNumber = void 0;
|
|
4062
|
+
var hasNumber = function (input) {
|
|
4063
|
+
var regex = new RegExp(/\d/g);
|
|
4064
|
+
return regex.test(input);
|
|
4065
|
+
};
|
|
4066
|
+
exports.hasNumber = hasNumber;
|
|
4067
|
+
var hasSpecialCharacter = function (input) {
|
|
4068
|
+
var regex = new RegExp(/`|~|!|"|-|_|@|#|\$|%|\^|&|\*|\(|\)|\+|=|\[|\{|\]|\}|\||\\|'|<|,|\.|>|\?|\/|""|;|:|\s/g);
|
|
4069
|
+
return regex.test(input);
|
|
4070
|
+
};
|
|
4071
|
+
exports.hasSpecialCharacter = hasSpecialCharacter;
|
|
4072
|
+
var hasCapitalLetter = function (input) {
|
|
4073
|
+
var regex = new RegExp(/[A-Z]/g);
|
|
4074
|
+
return regex.test(input);
|
|
4075
|
+
};
|
|
4076
|
+
exports.hasCapitalLetter = hasCapitalLetter;
|
|
4077
|
+
var isValidEmail = function (email) {
|
|
4078
|
+
var regex = new RegExp(/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/);
|
|
4079
|
+
return regex.test(email);
|
|
4080
|
+
};
|
|
4081
|
+
exports.isValidEmail = isValidEmail;
|
|
4082
|
+
var isValidUsername = function (username) {
|
|
4083
|
+
return username.length > 5 &&
|
|
4084
|
+
username.length <= 15 &&
|
|
4085
|
+
username.indexOf(" ") < 0 &&
|
|
4086
|
+
!(0, exports.isValidEmail)(username);
|
|
4087
|
+
};
|
|
4088
|
+
exports.isValidUsername = isValidUsername;
|
|
4089
|
+
var isStrongPassword = function (password) {
|
|
4090
|
+
return password.length >= 8 &&
|
|
4091
|
+
(0, exports.hasNumber)(password) &&
|
|
4092
|
+
(0, exports.hasSpecialCharacter)(password) &&
|
|
4093
|
+
(0, exports.hasCapitalLetter)(password);
|
|
4094
|
+
};
|
|
4095
|
+
exports.isStrongPassword = isStrongPassword;
|
|
4096
|
+
}(expressions));
|
|
4097
|
+
|
|
4098
|
+
var translations = {
|
|
4099
|
+
"nl-NL": {
|
|
4100
|
+
capitalLetter: "Minimaal 1 hoofdletter",
|
|
4101
|
+
number: "Minimaal 1 getal",
|
|
4102
|
+
specialCharacter: "Minimaal 1 leesteken",
|
|
4103
|
+
length: "Minimaal 8 karakters",
|
|
4104
|
+
},
|
|
4105
|
+
"nl-BE": {
|
|
4106
|
+
capitalLetter: "Minimaal 1 hoofdletter",
|
|
4107
|
+
number: "Minimaal 1 getal",
|
|
4108
|
+
specialCharacter: "Minimaal 1 leesteken",
|
|
4109
|
+
length: "Minimaal 8 karakters",
|
|
4110
|
+
},
|
|
4111
|
+
// "en-GB": {
|
|
4112
|
+
// capitalLetter: "At least 1 capital letter",
|
|
4113
|
+
// number: "At least 1 number",
|
|
4114
|
+
// specialCharacter: "At least 1 special character",
|
|
4115
|
+
// length: "At least 8 characters",
|
|
4116
|
+
// },
|
|
4117
|
+
// "fr-FR": {
|
|
4118
|
+
// capitalLetter: "Au moins une lettre majuscule",
|
|
4119
|
+
// number: "Au moins un chiffre",
|
|
4120
|
+
// specialCharacter: "Au moins un caractère spécial",
|
|
4121
|
+
// length: "Au moins 8 caractères",
|
|
4122
|
+
// },
|
|
4123
|
+
// "fr-BE": {
|
|
4124
|
+
// capitalLetter: "Au moins une lettre majuscule",
|
|
4125
|
+
// number: "Au moins un chiffre",
|
|
4126
|
+
// specialCharacter: "Au moins un caractère spécial",
|
|
4127
|
+
// length: "Au moins 8 caractères",
|
|
4128
|
+
// },
|
|
4129
|
+
// "de-DE": {
|
|
4130
|
+
// capitalLetter: "Mindestens 1 Großbuchstabe",
|
|
4131
|
+
// number: "Mindestens 1 Zahl",
|
|
4132
|
+
// specialCharacter: "Mindestens 1 Sonderzeichen",
|
|
4133
|
+
// length: "Mindestens 8 Zeichen",
|
|
4134
|
+
// },
|
|
4135
|
+
};
|
|
4007
4136
|
|
|
4008
4137
|
var PasswordInput = function (props) {
|
|
4009
|
-
var _a = useState(
|
|
4138
|
+
var _a = useState(props.defaultValue || ""), value = _a[0], setValue = _a[1];
|
|
4139
|
+
var _b = useState(false), isVisible = _b[0], setIsVisible = _b[1];
|
|
4010
4140
|
var toggle = function () {
|
|
4011
4141
|
if (!props.disabled)
|
|
4012
4142
|
setIsVisible(!isVisible);
|
|
4013
4143
|
};
|
|
4014
4144
|
var onChange = function (e) {
|
|
4145
|
+
setValue(e.target.value);
|
|
4015
4146
|
if (!props.disabled && !!props.onChange)
|
|
4016
4147
|
props.onChange(e.target.value);
|
|
4017
4148
|
};
|
|
@@ -4019,7 +4150,7 @@ var PasswordInput = function (props) {
|
|
|
4019
4150
|
if (props.onKeyPress)
|
|
4020
4151
|
props.onKeyPress(e);
|
|
4021
4152
|
};
|
|
4022
|
-
return (jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled }, { children: [jsx$1(Icon, { type: isVisible ? "eyeInvisible" : "eye", color: "gray", size: "small", onClick: toggle }), jsx$1(StyledInput, __assign$2({ type: isVisible ? "text" : "password" }, props, { onChange: onChange, onKeyPress: onKeyPress }))] })));
|
|
4153
|
+
return (jsxs(Container$l, { children: [jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled }, { children: [jsx$1(Icon, { type: isVisible ? "eyeInvisible" : "eye", color: "gray", size: "small", onClick: toggle }), jsx$1(StyledInput, __assign$2({ type: isVisible ? "text" : "password" }, props, { onChange: onChange, onKeyPress: onKeyPress }))] })), props.helperLocale && value.length ? (jsxs(HelperContainer, { children: [jsxs(Helper, __assign$2({ isOk: expressions.hasCapitalLetter(value) }, { children: ["\u2022 ", translations[props.helperLocale].capitalLetter] })), jsxs(Helper, __assign$2({ isOk: expressions.hasNumber(value) }, { children: ["\u2022 ", translations[props.helperLocale].number] })), jsxs(Helper, __assign$2({ isOk: expressions.hasSpecialCharacter(value) }, { children: ["\u2022 ", translations[props.helperLocale].specialCharacter] })), jsxs(Helper, __assign$2({ isOk: value.length >= 8 }, { children: ["\u2022 ", translations[props.helperLocale].length] }))] })) : null] }));
|
|
4023
4154
|
};
|
|
4024
4155
|
|
|
4025
4156
|
function requiredArgs(required, args) {
|
|
@@ -4183,7 +4314,7 @@ Input.Date = DateInput;
|
|
|
4183
4314
|
|
|
4184
4315
|
var Logo = function (props) { return (jsxs("svg", __assign$2({ width: 396, height: 66, viewBox: "0 0 662.8 118.1", fill: "none", xmlSpace: "preserve" }, props, { children: [jsxs("g", { children: [jsx$1("path", { d: "M61.6 23.5c-.4-.5-.9-1.1-1.3-1.5l-4.9-4.8L42 4c-1.3-1.3-2.8-2.3-4.5-3-1.7-.7-3.5-1-5.3-1-1.8 0-3.6.4-5.3 1-1.7.7-3.2 1.7-4.5 3L4.1 22C1.5 24.6 0 28 0 31.7c0 3.6 1.5 7.1 4.1 9.7l18.3 18c2.6 2.6 6.2 4 9.8 4 3.7 0 7.2-1.4 9.8-4l13.4-13.2-4.9-4.8c-.5-.5-.9-1-1.3-1.5L35.7 53.1c-.5.5-1 .8-1.6 1.1-.6.2-1.3.4-1.9.4-.7 0-1.3-.1-1.9-.4-.6-.2-1.2-.6-1.6-1.1l-18.3-18c-.9-.9-1.5-2.2-1.5-3.5 0-1.3.5-2.5 1.5-3.5l18.3-18c.5-.5 1-.8 1.6-1.1.6-.2 1.3-.4 1.9-.4.7 0 1.3.1 1.9.4.6.2 1.2.6 1.6 1.1l13.5 13.3 4.8 4.7c.5.4.8 1 1.1 1.6.2.6.4 1.2.4 1.9v.1c0 1.3.5 2.5 1.5 3.4l4.8 4.7c1.8-2.4 2.7-5.2 2.7-8.1-.1-3-1.1-5.8-2.9-8.2z", fill: "#e62743" }), jsx$1("path", { d: "M153.3 22L135 4c-1.3-1.3-2.8-2.3-4.5-3-1.7-.7-3.5-1-5.3-1-1.8 0-3.6.4-5.3 1-1.7.7-3.2 1.7-4.5 3L102 17.2 97.1 22c-.5.5-.9 1-1.3 1.5-1.8 2.4-2.8 5.2-2.8 8.2 0 2.9 1 5.8 2.7 8.1l4.8-4.7c.9-.9 1.4-2.1 1.5-3.4 0-.6.1-1.3.4-1.9.2-.6.6-1.1 1.1-1.6l4.8-4.7 13.5-13.3c.5-.5 1-.8 1.6-1.1.6-.2 1.2-.4 1.9-.4s1.3.1 1.9.4c.6.2 1.1.6 1.6 1.1l18.3 18c.5.5.8 1 1.1 1.6.3.6.4 1.2.4 1.9 0 .6-.1 1.3-.4 1.9-.3.6-.6 1.1-1.1 1.6l-18.3 18c-.5.5-1 .8-1.6 1.1-.6.2-1.2.4-1.9.4s-1.3-.1-1.9-.4c-.6-.2-1.1-.6-1.6-1.1l-13.5-13.3c-.4.5-.8 1.1-1.3 1.5l-4.9 4.8 13.4 13.2c1.3 1.3 2.8 2.3 4.5 3 1.7.7 3.5 1 5.3 1 1.8 0 3.6-.4 5.3-1 1.7-.7 3.2-1.7 4.5-3l18.3-18c1.3-1.3 2.3-2.8 3-4.5.7-1.7 1.1-3.5 1.1-5.3 0-1.8-.4-3.6-1.1-5.3-.8-1.5-1.8-3-3.1-4.3z", fill: "#53b476" }), jsx$1("path", { d: "M61.9 23.3l-.3.3c-.4-.5-.9-1.1-1.3-1.5l-4.9-4.8L68.8 4c1.3-1.3 2.8-2.3 4.5-3 1.7-.7 3.5-1 5.3-1s3.6.4 5.3 1c1.7.7 3.2 1.7 4.5 3l13.4 13.1-4.7 4.9c-.5.5-.9 1-1.3 1.5L82.2 10.2c-.5-.5-1-.8-1.6-1.1-.6-.2-1.3-.4-1.9-.4-.7 0-1.3.1-1.9.4-.6.2-1.2.6-1.6 1.1L61.9 23.3zm41.5 4.9l4.8-4.7c1.8 2.4 2.7 5.2 2.7 8.2 0 2.9-1 5.8-2.7 8.2-.4.5-.8 1.1-1.3 1.5l-4.9 4.8-13.5 13.2c-2.6 2.6-6.2 4-9.8 4s-7.2-1.4-9.8-4L55.4 46.1l-4.9-4.8c-.5-.5-.9-1-1.3-1.5-1.8-2.4-2.7-5.2-2.7-8.1 0-2.9 1-5.8 2.7-8.1l4.8 4.7c.5.4.8 1 1.1 1.6.2.6.4 1.2.4 1.9v.1c0 1.3.5 2.5 1.5 3.4l4.8 4.7 13.5 13.3c.5.5 1 .8 1.6 1.1s1.3.4 1.9.4 1.3-.1 1.9-.4 1.2-.6 1.6-1.1L95.8 40l4.8-4.7c.9-.9 1.4-2.1 1.5-3.4 0-.6.1-1.3.4-1.9 0-.8.4-1.3.9-1.8z", fillRule: "evenodd", clipRule: "evenodd", fill: "#ffd800" }), jsx$1("path", { d: "M130 76.6l-18.3-18c-2.6-2.6-6.2-4-9.8-4-3.7 0-7.2 1.4-9.8 4L78.7 71.9l-4.9 4.8c-.5.5-.9 1-1.3 1.5-1.8 2.4-2.7 5.2-2.7 8.1 0 2.9 1 5.8 2.7 8.1l4.8-4.7c.9-.9 1.4-2.1 1.5-3.4 0-1.3.5-2.5 1.5-3.4l4.8-4.7 13.5-13.3c.9-.9 2.2-1.4 3.5-1.4 1.3 0 2.6.5 3.5 1.4l18.3 18c.9.9 1.5 2.2 1.5 3.5 0 1.3-.5 2.5-1.5 3.5l-18.3 18c-.9.9-2.2 1.4-3.5 1.4-1.3 0-2.6-.5-3.5-1.4L84.9 94.5c-.4.6-.8 1.1-1.3 1.5l-4.9 4.8L92.1 114c2.6 2.6 6.2 4 9.8 4 3.7 0 7.2-1.4 9.8-4L130 96c1.3-1.3 2.3-2.8 3-4.5.7-1.7 1.1-3.5 1.1-5.3 0-1.8-.4-3.6-1.1-5.3-.6-1.5-1.7-3-3-4.3z", fill: "#8c5ca2" }), jsx$1("path", { d: "M84.9 78.2l-4.8 4.7c-.9.9-1.4 2.1-1.5 3.4 0 1.3-.5 2.5-1.5 3.4l-4.8 4.7-13.5 13.3c-.9.9-2.2 1.4-3.5 1.4s-2.6-.5-3.5-1.4l-18.3-18c-.9-.9-1.4-2.2-1.4-3.5s.5-2.5 1.4-3.5l18.3-18c.9-.9 2.2-1.4 3.5-1.4s2.6.5 3.5 1.4L72.3 78c.4-.5.8-1.1 1.3-1.5l4.9-4.8-13.3-13c-2.6-2.6-6.2-4-9.8-4-3.7 0-7.2 1.4-9.8 4l-18.3 18c-2.6 2.6-4.1 6.1-4.1 9.7s1.5 7.1 4.1 9.7l18.3 18c2.6 2.6 6.2 4 9.8 4 3.7 0 7.2-1.4 9.8-4l13.4-13.2 4.9-4.8c.5-.5.9-1 1.3-1.5 1.8-2.4 2.7-5.2 2.7-8.1.1-3.1-.9-5.9-2.6-8.3z", fill: "#3da9e1" })] }), jsxs("g", __assign$2({ fill: "#23292f" }, { children: [jsx$1("path", { d: "M236.6 21.5c-1.1-1-2.4-1.5-3.9-1.5h-40.2c-1.6 0-2.9.5-3.9 1.4-1.1.9-1.6 2.2-1.6 3.8 0 1.6.5 2.8 1.6 3.8s2.4 1.5 3.9 1.5h14.2V78c0 1.6.5 2.9 1.6 3.9 1.1 1.1 2.5 1.6 4.2 1.6 1.8 0 3.2-.5 4.3-1.6 1.1-1.1 1.7-2.4 1.7-3.9V30.4h14.2c1.6 0 2.9-.5 3.9-1.4 1.1-.9 1.6-2.2 1.6-3.8 0-1.5-.5-2.8-1.6-3.7z" }), jsx$1("path", { d: "M270.6 36.6c-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v23.2c0 2.3-.4 4.2-1.2 5.8-.8 1.6-1.9 2.8-3.4 3.6-1.5.8-3.2 1.2-5.3 1.2-3.1 0-5.5-.8-7.2-2.4-1.7-1.6-2.6-4.4-2.6-8.3V40.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9V67c0 3.4.7 6.4 2 9 1.3 2.6 3.2 4.7 5.6 6.2 2.4 1.5 5.2 2.2 8.4 2.2 2.7 0 5.1-.3 7.3-1 2.1-.7 3.9-1.6 5.5-2.9.7-.6 1.3-1.3 1.9-2v1c0 3.1-.5 5.5-1.4 7.3-.9 1.8-2.3 3.1-4.2 3.8-1.8.8-4.2 1.1-6.9 1.1-2.1 0-3.9-.3-5.4-1-1.6-.6-2.8-1.1-3.8-1.4-1.3-.5-2.6-.4-3.8.2-1.2.6-2.1 1.8-2.6 3.6-.4 1.3-.3 2.6.4 3.8.7 1.2 1.9 2.2 3.8 2.9 1.4.6 3.2 1.1 5.3 1.4 2.2.3 4.2.5 6.2.5 4.4 0 8.3-.7 11.8-2.2 3.5-1.4 6.3-3.8 8.4-7.1 2.1-3.3 3.1-7.7 3.1-13.3V40.5c-.3-1.6-.8-2.9-1.8-3.9zM327.5 46.1c-2-3.7-4.6-6.7-8-8.8-3.4-2.1-7.1-3.2-11.4-3.2-2.1 0-4.1.4-6 1.1-1.9.7-3.6 1.6-5 2.8-1.3 1-2.4 2-3.2 3.1v-.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v55.6c0 1.6.5 3 1.5 4s2.3 1.5 3.9 1.5 2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V78.3c.6.6 1.4 1.3 2.2 1.9 1.6 1.2 3.5 2.2 5.6 3 2.1.8 4.4 1.2 6.8 1.2 4.1 0 7.8-1.1 11.1-3.2s5.9-5.1 7.9-8.9c2-3.8 2.9-8.1 2.9-13.1s-1-9.3-2.9-13.1zm-9.2 20.8c-1.1 2.3-2.7 4.2-4.6 5.5-2 1.3-4.3 2-6.9 2s-5-.7-7-2-3.6-3.2-4.7-5.5-1.7-4.9-1.7-7.8c0-2.9.6-5.5 1.7-7.8s2.7-4.1 4.7-5.4c2-1.3 4.3-2 7-2s5 .7 6.9 2c2 1.3 3.5 3.1 4.6 5.4 1.1 2.3 1.7 4.8 1.7 7.8 0 2.9-.6 5.5-1.7 7.8zM380.4 61.6c1.1-.9 1.7-2.1 1.7-3.5 0-3.3-.6-6.3-1.9-9.2-1.2-2.9-2.9-5.5-5-7.7s-4.5-3.9-7.3-5.2c-2.8-1.3-5.7-1.9-8.7-1.9-4 0-7.8 1-11.3 3.1-3.6 2.1-6.5 5-8.7 8.8-2.2 3.8-3.3 8.5-3.3 13.9 0 4.7 1 8.8 3 12.5 2 3.7 4.9 6.6 8.7 8.7 3.8 2.1 8.2 3.2 13.4 3.2 3 0 6-.5 8.8-1.5 2.8-1 5-2.2 6.6-3.5 1.7-1.3 2.5-2.8 2.5-4.4 0-1.2-.4-2.3-1.3-3.2-.9-.9-2-1.4-3.3-1.4-1 0-2 .3-3.1.8-.7.4-1.4.8-2.2 1.3-.8.5-1.9 1-3.2 1.3-1.3.4-3.1.5-5.3.5-2.4 0-4.7-.6-6.8-1.8-2.1-1.2-3.9-2.9-5.3-5.2-.8-1.3-1.3-2.8-1.7-4.5h29.9c1.4.3 2.7-.2 3.8-1.1zM350 47.2c1.1-1.1 2.5-2 4.1-2.4 1.6-.5 3.3-.7 5.1-.7 1.9 0 3.6.4 5.3 1.2 1.7.8 3.1 1.9 4.2 3.3s1.7 3 1.9 4.7v.6h-23.7c.1-.7.3-1.5.5-2.1.5-1.9 1.5-3.4 2.6-4.6zM447.3 39.1c-1.5-3.9-3.6-7.4-6.4-10.4-2.8-3-6-5.3-9.8-7-3.8-1.7-7.9-2.5-12.4-2.5s-8.6.8-12.3 2.5c-3.7 1.7-7 4-9.7 7-2.8 3-4.9 6.5-6.4 10.4-1.5 3.9-2.3 8.2-2.3 12.7s.8 8.8 2.3 12.7c1.5 3.9 3.6 7.4 6.4 10.4 2.7 3 6 5.3 9.7 7 3.7 1.7 7.9 2.5 12.3 2.5 4.5 0 8.6-.8 12.4-2.5 3.8-1.7 7-4 9.8-7 2.8-3 4.9-6.5 6.4-10.4 1.5-3.9 2.3-8.2 2.3-12.7-.1-4.6-.8-8.8-2.3-12.7zm-12 23.7c-1.6 3.3-3.9 5.9-6.7 7.8-2.8 1.9-6.1 2.9-9.9 2.9-3.7 0-7-1-9.9-2.9-2.8-1.9-5.1-4.5-6.7-7.8-1.6-3.3-2.4-7-2.4-11 0-4.1.8-7.8 2.4-11.1 1.6-3.3 3.8-5.9 6.7-7.8 2.8-1.9 6.1-2.9 9.9-2.9 3.7 0 7 1 9.9 2.9 2.8 1.9 5.1 4.5 6.7 7.8 1.6 3.3 2.4 7 2.4 11 .1 4.1-.8 7.8-2.4 11.1zM468.4 18c-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6c-1.1 1.1-1.6 2.4-1.6 3.9v56c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.8 1.6 1.6 0 2.9-.5 3.9-1.6 1.1-1.1 1.6-2.4 1.6-3.9v-56c.1-1.5-.4-2.9-1.4-3.9zM520.2 36.6c-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v23.2c0 2.3-.4 4.2-1.2 5.8-.8 1.6-1.9 2.8-3.4 3.6-1.4.8-3.2 1.2-5.3 1.2-3.1 0-5.5-.8-7.2-2.4-1.7-1.6-2.6-4.4-2.6-8.3V40.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9V67c0 3.4.7 6.4 2 9 1.3 2.6 3.2 4.7 5.6 6.2 2.4 1.5 5.2 2.2 8.4 2.2 2.7 0 5.1-.3 7.3-1 2.1-.7 3.9-1.6 5.5-2.9.7-.6 1.3-1.3 1.9-2v1c0 3.1-.5 5.5-1.4 7.3-.9 1.8-2.3 3.1-4.2 3.8-1.8.8-4.2 1.1-6.9 1.1-2.1 0-3.9-.3-5.4-1-1.6-.6-2.8-1.1-3.8-1.4-1.3-.5-2.6-.4-3.8.2-1.2.6-2.1 1.8-2.6 3.6-.4 1.3-.3 2.6.4 3.8.7 1.2 1.9 2.2 3.8 2.9 1.4.6 3.2 1.1 5.3 1.4 2.2.3 4.2.5 6.2.5 4.4 0 8.3-.7 11.8-2.2 3.5-1.4 6.3-3.8 8.4-7.1 2.1-3.3 3.1-7.7 3.1-13.3V40.5c-.2-1.6-.7-2.9-1.8-3.9zM603.2 44.4c-.8-3.1-2.4-5.6-4.7-7.5s-5.6-2.8-9.9-2.8c-2.7 0-5.1.6-7.2 1.7-2.1 1.1-4 2.5-5.5 4.1-1.4 1.5-2.5 2.9-3.2 4.2-.8-2.6-2.1-4.7-3.9-6.5-2.3-2.3-5.9-3.5-10.7-3.5-2 0-3.8.3-5.5 1-1.7.6-3.2 1.5-4.6 2.5-1.4 1-2.6 2.1-3.5 3.3l-.9 1.2v-1.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9V78c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.9 1.6s2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V54.7c0-2 .4-3.8 1.2-5.4.8-1.6 2-2.9 3.7-3.9 1.6-1 3.6-1.4 5.9-1.4 2.4 0 4.2.5 5.4 1.4 1.3 1 2.1 2.3 2.6 3.9s.7 3.4.7 5.4v23.2c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.9 1.6s2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V54.7c0-2 .4-3.8 1.2-5.4.8-1.6 2-2.9 3.7-3.9 1.6-1 3.6-1.4 5.9-1.4 2.4 0 4.2.5 5.4 1.4 1.3 1 2.1 2.3 2.6 3.9s.7 3.4.7 5.4v23.2c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.9 1.6s2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V54.7c.3-3.8-.2-7.2-1-10.3zM659.8 46.1c-2-3.7-4.6-6.7-8-8.8-3.4-2.1-7.1-3.2-11.4-3.2-2.1 0-4.1.4-6 1.1-1.9.7-3.6 1.6-5 2.8-1.3 1-2.4 2-3.2 3.1v-.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v55.6c0 1.6.5 3 1.5 4s2.3 1.5 3.9 1.5 2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V78.3c.6.6 1.4 1.3 2.2 1.9 1.6 1.2 3.5 2.2 5.6 3s4.4 1.2 6.8 1.2c4.1 0 7.8-1.1 11.1-3.2s5.9-5.1 7.9-8.9c2-3.8 2.9-8.1 2.9-13.1.1-5-.9-9.3-2.9-13.1zm-9.1 20.8c-1.1 2.3-2.7 4.2-4.6 5.5-2 1.3-4.3 2-6.9 2s-5-.7-7-2-3.5-3.2-4.7-5.5c-1.1-2.3-1.7-4.9-1.7-7.8 0-2.9.6-5.5 1.7-7.8s2.7-4.1 4.7-5.4c2-1.3 4.3-2 7-2s5 .7 6.9 2c2 1.3 3.5 3.1 4.6 5.4 1.1 2.3 1.7 4.8 1.7 7.8-.1 2.9-.6 5.5-1.7 7.8z" })] }))] }))); };
|
|
4185
4316
|
|
|
4186
|
-
var Wrapper$6 = styled.div(templateObject_1$
|
|
4317
|
+
var Wrapper$6 = styled.div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
|
|
4187
4318
|
var size = _a.size;
|
|
4188
4319
|
switch (size) {
|
|
4189
4320
|
default:
|
|
@@ -4193,7 +4324,7 @@ var Wrapper$6 = styled.div(templateObject_1$J || (templateObject_1$J = __makeTem
|
|
|
4193
4324
|
return "116px";
|
|
4194
4325
|
}
|
|
4195
4326
|
});
|
|
4196
|
-
var templateObject_1$
|
|
4327
|
+
var templateObject_1$I;
|
|
4197
4328
|
|
|
4198
4329
|
var medals = {
|
|
4199
4330
|
small: {
|
|
@@ -4209,7 +4340,7 @@ var medals = {
|
|
|
4209
4340
|
};
|
|
4210
4341
|
var Medal = function (props) { return (jsx$1(Wrapper$6, __assign$2({}, props, { children: medals[props.size || "small"][props.type] }))); };
|
|
4211
4342
|
|
|
4212
|
-
var Wrapper$5 = styled.div(templateObject_1$
|
|
4343
|
+
var Wrapper$5 = styled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject$1(["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"])), function (_a) {
|
|
4213
4344
|
var disabled = _a.disabled;
|
|
4214
4345
|
return (disabled ? "49.5px" : "");
|
|
4215
4346
|
});
|
|
@@ -4226,7 +4357,7 @@ var StyledInputNumber = styled.input(templateObject_2$u || (templateObject_2$u =
|
|
|
4226
4357
|
var disabled = _a.disabled;
|
|
4227
4358
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
4228
4359
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4229
|
-
var templateObject_1$
|
|
4360
|
+
var templateObject_1$H, templateObject_2$u;
|
|
4230
4361
|
|
|
4231
4362
|
var Number$1 = function (props) {
|
|
4232
4363
|
var inputRef = useRef(null);
|
|
@@ -4263,40 +4394,6 @@ var Number$1 = function (props) {
|
|
|
4263
4394
|
return (jsxs(Wrapper$5, __assign$2({ disabled: props.disabled }, { children: [jsx$1(Button, { label: "-", disabled: props.disabled, onClick: decrease, tabIndex: -1, type: "button" }), jsx$1(StyledInputNumber, __assign$2({ type: "number" }, props, { defaultValue: props.defaultValue || props.min || 0, onChange: onChange, onBlur: props.onBlur, ref: inputRef })), jsx$1(Button, { label: "+", disabled: props.disabled, onClick: increase, tabIndex: -1, type: "button" })] })));
|
|
4264
4395
|
};
|
|
4265
4396
|
|
|
4266
|
-
var StyledParagraph = styled.p(templateObject_1$H || (templateObject_1$H = __makeTemplateObject$1(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n"])), theme.fonts.paragraph, function (_a) {
|
|
4267
|
-
var size = _a.size;
|
|
4268
|
-
return size ? theme.paragraph[size].fontSize : theme.paragraph.medium.fontSize;
|
|
4269
|
-
}, function (_a) {
|
|
4270
|
-
var weight = _a.weight;
|
|
4271
|
-
switch (weight) {
|
|
4272
|
-
case "regular":
|
|
4273
|
-
return 400;
|
|
4274
|
-
default:
|
|
4275
|
-
case "medium":
|
|
4276
|
-
return 500;
|
|
4277
|
-
}
|
|
4278
|
-
}, function (_a) {
|
|
4279
|
-
var size = _a.size;
|
|
4280
|
-
return size
|
|
4281
|
-
? theme.paragraph[size].lineHeight
|
|
4282
|
-
: theme.paragraph.medium.lineHeight;
|
|
4283
|
-
}, function (_a) {
|
|
4284
|
-
var color = _a.color;
|
|
4285
|
-
switch (color) {
|
|
4286
|
-
case "white":
|
|
4287
|
-
return theme.colors.lightGray.light;
|
|
4288
|
-
default:
|
|
4289
|
-
case "lightGray":
|
|
4290
|
-
return theme.colors.darkGray.light;
|
|
4291
|
-
case "darkGray":
|
|
4292
|
-
return theme.colors.darkGray.dark;
|
|
4293
|
-
}
|
|
4294
|
-
}, function (_a) {
|
|
4295
|
-
var align = _a.align;
|
|
4296
|
-
return align;
|
|
4297
|
-
});
|
|
4298
|
-
var templateObject_1$H;
|
|
4299
|
-
|
|
4300
4397
|
var Paragraph = function (props) { return (jsx$1(StyledParagraph, __assign$2({}, props, { children: props.children }))); };
|
|
4301
4398
|
|
|
4302
4399
|
var StyledRadio = styled.div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject$1(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
@@ -4620,19 +4717,19 @@ var Ellipse = styled.div(templateObject_2$s || (templateObject_2$s = __makeTempl
|
|
|
4620
4717
|
var color = _a.color;
|
|
4621
4718
|
return color ? theme.colors[color].light : "";
|
|
4622
4719
|
});
|
|
4623
|
-
var Content = styled.div(templateObject_3$
|
|
4624
|
-
var templateObject_1$x, templateObject_2$s, templateObject_3$
|
|
4720
|
+
var Content = styled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject$1(["\n height: 100%;\n padding: 15px;\n position: inherit;\n top: 0;\n left: 0;\n"], ["\n height: 100%;\n padding: 15px;\n position: inherit;\n top: 0;\n left: 0;\n"])));
|
|
4721
|
+
var templateObject_1$x, templateObject_2$s, templateObject_3$9;
|
|
4625
4722
|
|
|
4626
4723
|
var Card = function (props) { return (jsxs(StyledCard, __assign$2({}, props, { children: [props.ellipse && jsx$1(Ellipse, { color: props.ellipse }), jsx$1(Content, { children: props.children })] }))); };
|
|
4627
4724
|
|
|
4628
4725
|
var Fieldset$1 = styled.fieldset(templateObject_1$w || (templateObject_1$w = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
|
|
4629
4726
|
var CheckboxContainer = styled.div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
4630
|
-
var CheckboxWrapper = styled.div(templateObject_3$
|
|
4631
|
-
var Label$9 = styled(StyledParagraph)(templateObject_4$
|
|
4727
|
+
var CheckboxWrapper = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"], ["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"])));
|
|
4728
|
+
var Label$9 = styled(StyledParagraph)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject$1(["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"], ["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"])), function (_a) {
|
|
4632
4729
|
var weight = _a.weight;
|
|
4633
4730
|
return weight || 500;
|
|
4634
|
-
}, theme.colors.darkGray.base);
|
|
4635
|
-
var templateObject_1$w, templateObject_2$r, templateObject_3$
|
|
4731
|
+
}, theme.colors.darkGray.base, theme.colors.blue.base);
|
|
4732
|
+
var templateObject_1$w, templateObject_2$r, templateObject_3$8, templateObject_4$6;
|
|
4636
4733
|
|
|
4637
4734
|
var Checkboxes = function (props) {
|
|
4638
4735
|
var _a = useState(props.defaultValue || []), values = _a[0], setValues = _a[1];
|
|
@@ -4694,14 +4791,50 @@ var DateInputField = function (props) {
|
|
|
4694
4791
|
return (jsxs(Container$g, { children: [jsx$1(Label$8, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(Input.Date, { defaultValue: props.defaultValue, min: props.min, max: props.max, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, id: props.name, onChange: onChange, onBlur: onBlur })] }));
|
|
4695
4792
|
};
|
|
4696
4793
|
|
|
4697
|
-
var StyledIconButton = styled(StyledButton)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject$1(["\n min-width:
|
|
4698
|
-
var
|
|
4794
|
+
var StyledIconButton = styled(StyledButton)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"])), function (_a) {
|
|
4795
|
+
var size = _a.size;
|
|
4796
|
+
return (size === "small" ? "30px" : "40px");
|
|
4797
|
+
}, function (_a) {
|
|
4798
|
+
var size = _a.size;
|
|
4799
|
+
return (size === "small" ? "30px" : "40px");
|
|
4800
|
+
}, function (_a) {
|
|
4801
|
+
var size = _a.size;
|
|
4802
|
+
return (size === "small" ? "30px" : "40px");
|
|
4803
|
+
}, function (_a) {
|
|
4804
|
+
var size = _a.size;
|
|
4805
|
+
return (size === "small" ? "30px" : "40px");
|
|
4806
|
+
}, function (_a) {
|
|
4807
|
+
var size = _a.size;
|
|
4808
|
+
return (size === "small" ? "28px" : "38px");
|
|
4809
|
+
}, function (_a) {
|
|
4810
|
+
var size = _a.size;
|
|
4811
|
+
return (size === "small" ? "28px" : "38px");
|
|
4812
|
+
});
|
|
4813
|
+
var GhostIconButton = styled(GhostButton)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"])), function (_a) {
|
|
4814
|
+
var size = _a.size;
|
|
4815
|
+
return (size === "small" ? "30px" : "40px");
|
|
4816
|
+
}, function (_a) {
|
|
4817
|
+
var size = _a.size;
|
|
4818
|
+
return (size === "small" ? "30px" : "40px");
|
|
4819
|
+
}, function (_a) {
|
|
4820
|
+
var size = _a.size;
|
|
4821
|
+
return (size === "small" ? "30px" : "40px");
|
|
4822
|
+
}, function (_a) {
|
|
4823
|
+
var size = _a.size;
|
|
4824
|
+
return (size === "small" ? "30px" : "40px");
|
|
4825
|
+
}, function (_a) {
|
|
4826
|
+
var size = _a.size;
|
|
4827
|
+
return (size === "small" ? "32px" : "40px");
|
|
4828
|
+
}, function (_a) {
|
|
4829
|
+
var size = _a.size;
|
|
4830
|
+
return (size === "small" ? "32px" : "40px");
|
|
4831
|
+
});
|
|
4699
4832
|
var templateObject_1$t, templateObject_2$o;
|
|
4700
4833
|
|
|
4701
4834
|
var IconButton = function (props) {
|
|
4702
4835
|
if (props.color === "white")
|
|
4703
|
-
return (jsx$1(GhostIconButton, __assign$2({}, props, { children: jsx$1(Icon, { type: props.icon, size: "small", color: "gray" }) })));
|
|
4704
|
-
return (jsx$1(StyledIconButton, __assign$2({}, props, { children: jsx$1(Icon, { type: props.icon, size: "small", color: "white" }) })));
|
|
4836
|
+
return (jsx$1(GhostIconButton, __assign$2({}, props, { children: jsx$1(Icon, { type: props.icon, size: props.size === "small" ? "tiny" : "small", color: "gray" }) })));
|
|
4837
|
+
return (jsx$1(StyledIconButton, __assign$2({}, props, { children: jsx$1(Icon, { type: props.icon, size: props.size === "small" ? "tiny" : "small", color: "white" }) })));
|
|
4705
4838
|
};
|
|
4706
4839
|
|
|
4707
4840
|
var Container$f = styled.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
|
|
@@ -4772,7 +4905,7 @@ var Key$1 = function (props) { return (jsxs(Container$e, __assign$2({}, props, {
|
|
|
4772
4905
|
transform: "scale(2)",
|
|
4773
4906
|
} }, { children: jsx$1("path", { d: "M0 4.5V1C0 0.447715 0.447715 0 1 0H2C2.55228 0 3 0.447715 3 1V4H25V1C25 0.447715 25.4477 0 26 0H27C27.5523 0 28 0.447715 28 1V4.5C28 5.88071 26.8807 7 25.5 7H2.5C1.11929 7 0 5.88071 0 4.5Z" }) }))) : (jsx$1(Heading, __assign$2({ type: "h1" }, { children: props.char })))] }))); };
|
|
4774
4907
|
|
|
4775
|
-
var Wrapper$2 = styled.a(templateObject_1$q || (templateObject_1$q = __makeTemplateObject$1(["\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n > div {\n width: 19px;\n height: 19px;\n margin-
|
|
4908
|
+
var Wrapper$2 = styled.a(templateObject_1$q || (templateObject_1$q = __makeTemplateObject$1(["\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n > div {\n width: 19px;\n height: 19px;\n margin-right: ", ";\n margin-left: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n > div {\n width: 19px;\n height: 19px;\n margin-right: ", ";\n margin-left: ", ";\n }\n"])), function (_a) {
|
|
4776
4909
|
var chevron = _a.chevron;
|
|
4777
4910
|
return (chevron === "left" ? "4px" : "");
|
|
4778
4911
|
}, function (_a) {
|
|
@@ -4814,7 +4947,7 @@ var Container$c = styled.div(templateObject_1$o || (templateObject_1$o = __makeT
|
|
|
4814
4947
|
return "";
|
|
4815
4948
|
});
|
|
4816
4949
|
var SelectedLocaleWrapper = styled.div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n"])));
|
|
4817
|
-
var DropdownContainer = styled.div(templateObject_3$
|
|
4950
|
+
var DropdownContainer = styled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject$1(["\n min-width: 100%;\n background-color: ", ";\n overflow: hidden;\n border-radius: 6px 0 6px 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n position: absolute;\n top: 50px;\n right: 0;\n"], ["\n min-width: 100%;\n background-color: ", ";\n overflow: hidden;\n border-radius: 6px 0 6px 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n position: absolute;\n top: 50px;\n right: 0;\n"])), function (_a) {
|
|
4818
4951
|
var color = _a.color;
|
|
4819
4952
|
switch (color) {
|
|
4820
4953
|
default:
|
|
@@ -4824,8 +4957,8 @@ var DropdownContainer = styled.div(templateObject_3$8 || (templateObject_3$8 = _
|
|
|
4824
4957
|
return theme.colors.lightGray.dark;
|
|
4825
4958
|
}
|
|
4826
4959
|
});
|
|
4827
|
-
var LocaleWrapper = styled.div(templateObject_4$
|
|
4828
|
-
var templateObject_1$o, templateObject_2$k, templateObject_3$
|
|
4960
|
+
var LocaleWrapper = styled.div(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px 15px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n\n p {\n white-space: nowrap;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n svg {\n fill: ", ";\n }\n }\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px 15px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n\n p {\n white-space: nowrap;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n svg {\n fill: ", ";\n }\n }\n"])), theme.colors.lightGray.darker, theme.colors.lightGray.base, theme.colors.blue.base, theme.colors.blue.base);
|
|
4961
|
+
var templateObject_1$o, templateObject_2$k, templateObject_3$7, templateObject_4$5;
|
|
4829
4962
|
|
|
4830
4963
|
var LocaleSelect = function (props) {
|
|
4831
4964
|
var _a = useState(false), dropdownIsVisible = _a[0], setDropdownIsVisible = _a[1];
|
|
@@ -4873,100 +5006,12 @@ var NumberField = function (props) {
|
|
|
4873
5006
|
return (jsxs(Container$b, { children: [jsx$1(Label$6, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(Number$1, { min: props.min, max: props.max, defaultValue: props.defaultValue, autoComplete: props.autoComplete, disabled: props.disabled, autoFocus: props.autoFocus, id: props.name, onChange: onChange, onBlur: onBlur })] }));
|
|
4874
5007
|
};
|
|
4875
5008
|
|
|
4876
|
-
var expressions = {};
|
|
4877
|
-
|
|
4878
|
-
(function (exports) {
|
|
4879
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4880
|
-
exports.isStrongPassword = exports.isValidUsername = exports.isValidEmail = exports.hasCapitalLetter = exports.hasSpecialCharacter = exports.hasNumber = void 0;
|
|
4881
|
-
var hasNumber = function (input) {
|
|
4882
|
-
var regex = new RegExp(/\d/g);
|
|
4883
|
-
return regex.test(input);
|
|
4884
|
-
};
|
|
4885
|
-
exports.hasNumber = hasNumber;
|
|
4886
|
-
var hasSpecialCharacter = function (input) {
|
|
4887
|
-
var regex = new RegExp(/`|~|!|"|-|_|@|#|\$|%|\^|&|\*|\(|\)|\+|=|\[|\{|\]|\}|\||\\|'|<|,|\.|>|\?|\/|""|;|:|\s/g);
|
|
4888
|
-
return regex.test(input);
|
|
4889
|
-
};
|
|
4890
|
-
exports.hasSpecialCharacter = hasSpecialCharacter;
|
|
4891
|
-
var hasCapitalLetter = function (input) {
|
|
4892
|
-
var regex = new RegExp(/[A-Z]/g);
|
|
4893
|
-
return regex.test(input);
|
|
4894
|
-
};
|
|
4895
|
-
exports.hasCapitalLetter = hasCapitalLetter;
|
|
4896
|
-
var isValidEmail = function (email) {
|
|
4897
|
-
var regex = new RegExp(/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/);
|
|
4898
|
-
return regex.test(email);
|
|
4899
|
-
};
|
|
4900
|
-
exports.isValidEmail = isValidEmail;
|
|
4901
|
-
var isValidUsername = function (username) {
|
|
4902
|
-
return username.length > 5 &&
|
|
4903
|
-
username.length <= 15 &&
|
|
4904
|
-
username.indexOf(" ") < 0 &&
|
|
4905
|
-
!(0, exports.isValidEmail)(username);
|
|
4906
|
-
};
|
|
4907
|
-
exports.isValidUsername = isValidUsername;
|
|
4908
|
-
var isStrongPassword = function (password) {
|
|
4909
|
-
return password.length >= 8 &&
|
|
4910
|
-
(0, exports.hasNumber)(password) &&
|
|
4911
|
-
(0, exports.hasSpecialCharacter)(password) &&
|
|
4912
|
-
(0, exports.hasCapitalLetter)(password);
|
|
4913
|
-
};
|
|
4914
|
-
exports.isStrongPassword = isStrongPassword;
|
|
4915
|
-
}(expressions));
|
|
4916
|
-
|
|
4917
5009
|
var Container$a = styled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
|
|
4918
5010
|
var Label$5 = styled(StyledParagraph)(templateObject_2$h || (templateObject_2$h = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
4919
|
-
var
|
|
4920
|
-
var fadeIn = keyframes$1(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject$1(["\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n"], ["\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n"])));
|
|
4921
|
-
var Helper = styled(StyledParagraph)(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject$1(["\n font-weight: 400;\n font-size: 14px;\n color: ", ";\n animation: ", " 0.3s linear;\n"], ["\n font-weight: 400;\n font-size: 14px;\n color: ", ";\n animation: ", " 0.3s linear;\n"])), function (_a) {
|
|
4922
|
-
var isOk = _a.isOk;
|
|
4923
|
-
return isOk ? theme.colors.green.base : theme.colors.darkGray.light;
|
|
4924
|
-
}, fadeIn);
|
|
4925
|
-
var templateObject_1$k, templateObject_2$h, templateObject_3$7, templateObject_4$5, templateObject_5$3;
|
|
4926
|
-
|
|
4927
|
-
var translations = {
|
|
4928
|
-
"nl-NL": {
|
|
4929
|
-
capitalLetter: "Minimaal 1 hoofdletter",
|
|
4930
|
-
number: "Minimaal 1 getal",
|
|
4931
|
-
specialCharacter: "Minimaal 1 leesteken",
|
|
4932
|
-
length: "Minimaal 8 karakters",
|
|
4933
|
-
},
|
|
4934
|
-
"nl-BE": {
|
|
4935
|
-
capitalLetter: "Minimaal 1 hoofdletter",
|
|
4936
|
-
number: "Minimaal 1 getal",
|
|
4937
|
-
specialCharacter: "Minimaal 1 leesteken",
|
|
4938
|
-
length: "Minimaal 8 karakters",
|
|
4939
|
-
},
|
|
4940
|
-
// "en-GB": {
|
|
4941
|
-
// capitalLetter: "At least 1 capital letter",
|
|
4942
|
-
// number: "At least 1 number",
|
|
4943
|
-
// specialCharacter: "At least 1 special character",
|
|
4944
|
-
// length: "At least 8 characters",
|
|
4945
|
-
// },
|
|
4946
|
-
// "fr-FR": {
|
|
4947
|
-
// capitalLetter: "Au moins une lettre majuscule",
|
|
4948
|
-
// number: "Au moins un chiffre",
|
|
4949
|
-
// specialCharacter: "Au moins un caractère spécial",
|
|
4950
|
-
// length: "Au moins 8 caractères",
|
|
4951
|
-
// },
|
|
4952
|
-
// "fr-BE": {
|
|
4953
|
-
// capitalLetter: "Au moins une lettre majuscule",
|
|
4954
|
-
// number: "Au moins un chiffre",
|
|
4955
|
-
// specialCharacter: "Au moins un caractère spécial",
|
|
4956
|
-
// length: "Au moins 8 caractères",
|
|
4957
|
-
// },
|
|
4958
|
-
// "de-DE": {
|
|
4959
|
-
// capitalLetter: "Mindestens 1 Großbuchstabe",
|
|
4960
|
-
// number: "Mindestens 1 Zahl",
|
|
4961
|
-
// specialCharacter: "Mindestens 1 Sonderzeichen",
|
|
4962
|
-
// length: "Mindestens 8 Zeichen",
|
|
4963
|
-
// },
|
|
4964
|
-
};
|
|
5011
|
+
var templateObject_1$k, templateObject_2$h;
|
|
4965
5012
|
|
|
4966
5013
|
var PasswordInputField = function (props) {
|
|
4967
|
-
var _a = useState(props.defaultValue || ""), value = _a[0], setValue = _a[1];
|
|
4968
5014
|
var onChange = function (value) {
|
|
4969
|
-
setValue(value);
|
|
4970
5015
|
if (props.onChange)
|
|
4971
5016
|
props.onChange(props.name, value);
|
|
4972
5017
|
};
|
|
@@ -4979,7 +5024,7 @@ var PasswordInputField = function (props) {
|
|
|
4979
5024
|
if (props.onBlur)
|
|
4980
5025
|
props.onBlur(props.name);
|
|
4981
5026
|
};
|
|
4982
|
-
return (jsxs(Container$a, { children: [jsx$1(Label$5, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(Input.Password, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, id: props.name, onChange: onChange, onKeyPress: onKeyPress, onBlur: onBlur })
|
|
5027
|
+
return (jsxs(Container$a, { children: [jsx$1(Label$5, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(Input.Password, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, helperLocale: props.helperLocale, id: props.name, onChange: onChange, onKeyPress: onKeyPress, onBlur: onBlur })] }));
|
|
4983
5028
|
};
|
|
4984
5029
|
|
|
4985
5030
|
var generateRandomString = function (length) {
|
|
@@ -11559,21 +11604,33 @@ var TableBody = styled.tbody(templateObject_3 || (templateObject_3 = __makeTempl
|
|
|
11559
11604
|
styled.tfoot(templateObject_4 || (templateObject_4 = __makeTemplateObject$1([""], [""])));
|
|
11560
11605
|
var ColumnTitle = styled.th(templateObject_5 || (templateObject_5 = __makeTemplateObject$1(["\n text-align: left;\n padding-left: 15px;\n"], ["\n text-align: left;\n padding-left: 15px;\n"])));
|
|
11561
11606
|
var TableRow = styled.tr(templateObject_6 || (templateObject_6 = __makeTemplateObject$1(["\n height: 50px;\n border-bottom: 1px solid ", ";\n\n :nth-child(odd) {\n background: ", ";\n }\n :nth-child(even) {\n background: ", ";\n }\n"], ["\n height: 50px;\n border-bottom: 1px solid ", ";\n\n :nth-child(odd) {\n background: ", ";\n }\n :nth-child(even) {\n background: ", ";\n }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.light, theme.colors.lightGray.base);
|
|
11562
|
-
var TableCell = styled.td(templateObject_7 || (templateObject_7 = __makeTemplateObject$1(["\n padding: 0 15px;\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n font-style: normal;\n line-height: ", ";\n
|
|
11563
|
-
var
|
|
11607
|
+
var TableCell = styled.td(templateObject_7 || (templateObject_7 = __makeTemplateObject$1(["\n padding: 0 15px;\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n font-style: normal;\n line-height: 0;\n color: ", ";\n text-align: ", ";\n"], ["\n padding: 0 15px;\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n font-style: normal;\n line-height: 0;\n color: ", ";\n text-align: ", ";\n"])), theme.fonts.paragraph, theme.paragraph.medium.fontSize, theme.colors.darkGray.light, function (_a) {
|
|
11608
|
+
var align = _a.align;
|
|
11609
|
+
switch (align) {
|
|
11610
|
+
default:
|
|
11611
|
+
case "left":
|
|
11612
|
+
return "-webkit-left";
|
|
11613
|
+
case "right":
|
|
11614
|
+
return "-webkit-right";
|
|
11615
|
+
case "center":
|
|
11616
|
+
return "-webkit-center";
|
|
11617
|
+
}
|
|
11618
|
+
});
|
|
11619
|
+
var EmptyTableCell = styled.td(templateObject_8 || (templateObject_8 = __makeTemplateObject$1(["\n p {\n color: ", ";\n }\n"], ["\n p {\n color: ", ";\n }\n"])), theme.colors.lightGray.darker);
|
|
11620
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
|
|
11564
11621
|
|
|
11565
11622
|
var Table = function (_a) {
|
|
11566
|
-
var columns = _a.columns, data = _a.data;
|
|
11567
|
-
return (jsxs(Container, { children: [jsx$1(TableHead, { children: jsx$1(TableRow, { children: columns.map(function (_a) {
|
|
11623
|
+
var columns = _a.columns, data = _a.data, empytText = _a.empytText;
|
|
11624
|
+
return (jsxs(Container, { children: [jsx$1(TableHead, { children: jsx$1(TableRow, { children: columns.map(function (_a, index) {
|
|
11568
11625
|
var title = _a.title, dataIndex = _a.dataIndex;
|
|
11569
|
-
return (jsx$1(ColumnTitle, { children: jsx$1(Heading, __assign$2({ type: "h6", as: "span" }, { children: title })) }, dataIndex));
|
|
11570
|
-
}) }) }), jsx$1(TableBody, { children: data.map(function (row, index) {
|
|
11626
|
+
return (jsx$1(ColumnTitle, { children: title && (jsx$1(Heading, __assign$2({ type: "h6", as: "span" }, { children: title }))) }, "".concat(dataIndex, "-").concat(index)));
|
|
11627
|
+
}) }) }), jsx$1(TableBody, { children: data.length === 0 ? (jsx$1(TableRow, { children: jsx$1(EmptyTableCell, __assign$2({ colSpan: columns.length }, { children: jsx$1(Paragraph, __assign$2({ align: "center", size: "small", weight: "regular" }, { children: empytText || "No data" })) })) })) : (data.map(function (row, index) {
|
|
11571
11628
|
return (jsx$1(TableRow, { children: columns.map(function (_a, index) {
|
|
11572
|
-
var dataIndex = _a.dataIndex, render = _a.render;
|
|
11629
|
+
var dataIndex = _a.dataIndex, render = _a.render, align = _a.align;
|
|
11573
11630
|
var data = row[dataIndex];
|
|
11574
|
-
return (jsx$1(TableCell, { children: render ? render(data) : data }, "col-".concat(index)));
|
|
11631
|
+
return (jsx$1(TableCell, __assign$2({ align: align }, { children: render ? render(data, row) : data }), "col-".concat(index)));
|
|
11575
11632
|
}) }, "row-".concat(index)));
|
|
11576
|
-
}) })] }));
|
|
11633
|
+
})) })] }));
|
|
11577
11634
|
};
|
|
11578
11635
|
|
|
11579
11636
|
export { Alert, Button, Card, Checkbox, Checkboxes, Collapse, DateInputField, Flag, Form, Heading, Icon, IconButton, Illustration, Input, InputField, Key$1 as Key, Keyboard, Link, Loading, LocaleSelect, Logo, Medal, Medals, Modal, Notification, Number$1 as Number, NumberField, Paragraph, PasswordInputField, Popup, ProgressBar, Radio, RadioGroup, Range, Result, Select, SelectField, Spacer, Steps, Subheading, Table, Tabs, Tag, Toggle, ToggleField, Tooltip, Trophy, theme };
|