@commonsku/styles 1.17.9 → 1.17.11
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/index.cjs +308 -190
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +32 -1
- package/dist/index.mjs +304 -190
- package/dist/index.mjs.map +1 -1
- package/dist/styles/ErrorBoundary.d.ts.map +1 -1
- package/dist/styles/icons/CommonskuMainLogo.d.ts +12 -0
- package/dist/styles/icons/CommonskuMainLogo.d.ts.map +1 -0
- package/dist/styles/icons/ResizableIcon.d.ts +6 -0
- package/dist/styles/icons/ResizableIcon.d.ts.map +1 -0
- package/dist/styles/icons/SkubotLogo.d.ts +12 -0
- package/dist/styles/icons/SkubotLogo.d.ts.map +1 -0
- package/dist/styles/icons/SkubotSpinner.d.ts +13 -0
- package/dist/styles/icons/SkubotSpinner.d.ts.map +1 -0
- package/dist/styles/icons/index.d.ts +4 -0
- package/dist/styles/icons/index.d.ts.map +1 -1
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/ssr.d.ts +2 -0
- package/dist/utils/ssr.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -209,6 +209,7 @@ var win = typeof window !== 'undefined' ? window : {
|
|
|
209
209
|
pushState: function () { },
|
|
210
210
|
go: function () { },
|
|
211
211
|
back: function () { },
|
|
212
|
+
length: 1,
|
|
212
213
|
},
|
|
213
214
|
CustomEvent: function CustomEvent() {
|
|
214
215
|
return this;
|
|
@@ -244,11 +245,11 @@ var ssr = {
|
|
|
244
245
|
};
|
|
245
246
|
|
|
246
247
|
var media = {
|
|
247
|
-
xs: function (styles) { return "\n @media only screen and (min-width: 0px) {\n ".concat(typeof styles === 'string' ? styled.css(templateObject_1$
|
|
248
|
-
sm: function (styles) { return "\n @media only screen and (min-width: 640px) {\n ".concat(typeof styles === 'string' ? styled.css(templateObject_2$
|
|
248
|
+
xs: function (styles) { return "\n @media only screen and (min-width: 0px) {\n ".concat(typeof styles === 'string' ? styled.css(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["", ""], ["", ""])), styles) : styled.css(styles), "\n }\n "); },
|
|
249
|
+
sm: function (styles) { return "\n @media only screen and (min-width: 640px) {\n ".concat(typeof styles === 'string' ? styled.css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["", ""], ["", ""])), styles) : styled.css(styles), "\n }\n "); },
|
|
249
250
|
md: function (styles) { return "\n @media only screen and (min-width: 768px) {\n ".concat(typeof styles === 'string' ? styled.css(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["", ""], ["", ""])), styles) : styled.css(styles), "\n }\n "); },
|
|
250
251
|
lg: function (styles) { return "\n @media only screen and (min-width: 1024px) {\n ".concat(typeof styles === 'string' ? styled.css(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["", ""], ["", ""])), styles) : styled.css(styles), "\n }\n "); },
|
|
251
|
-
xl: function (styles) { return "\n @media only screen and (min-width: 1280px) {\n ".concat(typeof styles === 'string' ? styled.css(templateObject_5$
|
|
252
|
+
xl: function (styles) { return "\n @media only screen and (min-width: 1280px) {\n ".concat(typeof styles === 'string' ? styled.css(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["", ""], ["", ""])), styles) : styled.css(styles), "\n }\n "); },
|
|
252
253
|
};
|
|
253
254
|
var sizeMediaWidth = {
|
|
254
255
|
xs: '0px',
|
|
@@ -265,7 +266,7 @@ var sizeMedia = {
|
|
|
265
266
|
xl: "@media only screen and (min-width: ".concat(sizeMediaWidth.xl, ")"),
|
|
266
267
|
};
|
|
267
268
|
var sizes$1 = ['xs', 'sm', 'md', 'lg', 'xl'];
|
|
268
|
-
var templateObject_1$
|
|
269
|
+
var templateObject_1$Y, templateObject_2$z, templateObject_3$m, templateObject_4$g, templateObject_5$b;
|
|
269
270
|
|
|
270
271
|
var valIsValid = function (val) { return val !== null && val !== undefined && val !== ''; }; // not checking for 0
|
|
271
272
|
function isClientSide() {
|
|
@@ -417,7 +418,7 @@ var wait = function (time) {
|
|
|
417
418
|
};
|
|
418
419
|
};
|
|
419
420
|
|
|
420
|
-
var SharedStyles = styled.css(templateObject_1$
|
|
421
|
+
var SharedStyles = styled.css(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n box-sizing: border-box;\n ", "\n"], ["\n box-sizing: border-box;\n ", "\n"])), function (p) { return _.map(_.pick(p, _.keys(SHARED_STYLE_MAPS)), function (v, k) {
|
|
421
422
|
return _.isUndefined(v) ? '' : SHARED_STYLE_MAPS[k](v);
|
|
422
423
|
}).join(''); });
|
|
423
424
|
var SHARED_STYLE_MAPS = {
|
|
@@ -459,8 +460,8 @@ var SHARED_STYLE_MAPS = {
|
|
|
459
460
|
// Custom Styles
|
|
460
461
|
custom: function (val) { return "".concat(val); },
|
|
461
462
|
};
|
|
462
|
-
var Wrapper$4 = styled__default.default.div(templateObject_2$
|
|
463
|
-
var templateObject_1$
|
|
463
|
+
var Wrapper$4 = styled__default.default.div(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["", ""], ["", ""])), SharedStyles);
|
|
464
|
+
var templateObject_1$X, templateObject_2$y;
|
|
464
465
|
|
|
465
466
|
var primary1 = {
|
|
466
467
|
'10': '#F6FEFF',
|
|
@@ -635,7 +636,7 @@ errors['lightest'] = errors['10'];
|
|
|
635
636
|
errors['light'] = errors['30'];
|
|
636
637
|
errors['dark'] = errors['70'];
|
|
637
638
|
errors['darkest'] = errors['90'];
|
|
638
|
-
var colors = {
|
|
639
|
+
var colors$1 = {
|
|
639
640
|
primary1: primary1,
|
|
640
641
|
secondary1: secondary1,
|
|
641
642
|
secondary2: secondary2,
|
|
@@ -867,7 +868,7 @@ var SVG$1 = styled__default.default.svg.attrs(function (p) {
|
|
|
867
868
|
viewBox: p.viewBox || defaultSize.viewBox,
|
|
868
869
|
};
|
|
869
870
|
})(function (p) {
|
|
870
|
-
return styled.css(templateObject_1$
|
|
871
|
+
return styled.css(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), SharedStyles);
|
|
871
872
|
}, function (p) {
|
|
872
873
|
var styles = {};
|
|
873
874
|
var iconSizes = p.iconSizes || iconSize;
|
|
@@ -881,7 +882,7 @@ var SVG$1 = styled__default.default.svg.attrs(function (p) {
|
|
|
881
882
|
styles['cursor'] = p.pointer ? 'pointer' : undefined;
|
|
882
883
|
return styles;
|
|
883
884
|
});
|
|
884
|
-
var templateObject_1$
|
|
885
|
+
var templateObject_1$W;
|
|
885
886
|
|
|
886
887
|
function TableIcon(_a) {
|
|
887
888
|
var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "Calculate" : _d, props = __rest(_a, ["color", "size", "altText"]);
|
|
@@ -1255,7 +1256,7 @@ function createFontStyles(p) {
|
|
|
1255
1256
|
return "\n --skufont-".concat(k, ": ").concat(fontFamilies[k], ";\n --font-family-").concat(k, ": ").concat([fontFamilies[k]].concat(fontFamilies['fallbacks']).join(','), ";\n ");
|
|
1256
1257
|
}).join('');
|
|
1257
1258
|
}
|
|
1258
|
-
var GlobalStyle = styled.createGlobalStyle(templateObject_1$
|
|
1259
|
+
var GlobalStyle = styled.createGlobalStyle(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n:root {\n ", "\n ", "\n ", "\n}\n&&& {\n .commonsku-styles-select__input {\n input {\n height: auto;\n }\n }\n ", "\n}\n"], ["\n:root {\n ", "\n ", "\n ", "\n}\n&&& {\n .commonsku-styles-select__input {\n input {\n height: auto;\n }\n }\n ", "\n}\n"])), function (p) { return createFontStyles(p); }, function (p) { return parseColorVars(___default.default.get(p, ['theme', 'colors'], {}), ''); }, function (p) {
|
|
1259
1260
|
if (!p.additionalStyles) {
|
|
1260
1261
|
return null;
|
|
1261
1262
|
}
|
|
@@ -1269,7 +1270,7 @@ var GlobalStyle = styled.createGlobalStyle(templateObject_1$U || (templateObject
|
|
|
1269
1270
|
return null;
|
|
1270
1271
|
}
|
|
1271
1272
|
}, datepickerStyles);
|
|
1272
|
-
var templateObject_1$
|
|
1273
|
+
var templateObject_1$V;
|
|
1273
1274
|
|
|
1274
1275
|
var fontFamilies = {
|
|
1275
1276
|
skuFontRegular: "'skufont-regular'",
|
|
@@ -1366,7 +1367,7 @@ var fontStyles = {
|
|
|
1366
1367
|
}
|
|
1367
1368
|
};
|
|
1368
1369
|
var themeOptions = {
|
|
1369
|
-
colors: colors,
|
|
1370
|
+
colors: colors$1,
|
|
1370
1371
|
fonts: fonts,
|
|
1371
1372
|
fontFamily: "".concat(fonts.join(",")),
|
|
1372
1373
|
fontFamilies: fontFamilies,
|
|
@@ -1394,7 +1395,7 @@ function getColor$1(color, def) {
|
|
|
1394
1395
|
if (!color) {
|
|
1395
1396
|
return '';
|
|
1396
1397
|
}
|
|
1397
|
-
return (_a = ___default.default.get(colors, color, ___default.default.get(colors, def || '', def))) !== null && _a !== void 0 ? _a : '';
|
|
1398
|
+
return (_a = ___default.default.get(colors$1, color, ___default.default.get(colors$1, def || '', def))) !== null && _a !== void 0 ? _a : '';
|
|
1398
1399
|
}
|
|
1399
1400
|
function getFontStyle(value, def) {
|
|
1400
1401
|
var _a;
|
|
@@ -1492,7 +1493,7 @@ function CircleProgressIcon(_a) {
|
|
|
1492
1493
|
var dashOffset = dashArray - dashArray * percentage / 100;
|
|
1493
1494
|
return React__default.default.createElement(SVG$1, __assign({ size: size, iconSizes: iconSizes, "aria-labelledby": "CircleProgressIcon" }, props),
|
|
1494
1495
|
React__default.default.createElement("title", { id: "CircleProgressIcon" }, text !== '' ? "".concat(text, " stage") : percentage ? "".concat(percentage, "% completed") : altText),
|
|
1495
|
-
React__default.default.createElement("circle", { className: "circle-background", cx: sqSize / 2, cy: sqSize / 2, r: radius, strokeWidth: "".concat(strokeWidth, "px"), style: { fill: 'none', stroke: colors.disabledButtonBorder, } }),
|
|
1496
|
+
React__default.default.createElement("circle", { className: "circle-background", cx: sqSize / 2, cy: sqSize / 2, r: radius, strokeWidth: "".concat(strokeWidth, "px"), style: { fill: 'none', stroke: colors$1.disabledButtonBorder, } }),
|
|
1496
1497
|
React__default.default.createElement("circle", { className: "circle-progress", cx: sqSize / 2, cy: sqSize / 2, r: radius, strokeWidth: "".concat(strokeWidth, "px"), transform: "rotate(-90 ".concat(sqSize / 2, " ").concat(sqSize / 2, ")"), style: {
|
|
1497
1498
|
strokeDasharray: dashArray,
|
|
1498
1499
|
strokeDashoffset: dashOffset,
|
|
@@ -1504,14 +1505,14 @@ function CircleProgressIcon(_a) {
|
|
|
1504
1505
|
React__default.default.createElement("text", { className: "circle-text", x: "50%", y: "50%", dy: ".3em", textAnchor: "middle", style: __assign({ fontSize: size === "small" || size === "tiny" ? ".6em" : size === "medium" ? ".8em" : "1em", fontWeight: 'bold', fill: textColor }, textStyle) }, text || "".concat(percentage, "%")));
|
|
1505
1506
|
}
|
|
1506
1507
|
|
|
1507
|
-
var SVG = styled__default.default.svg(templateObject_1$
|
|
1508
|
-
var templateObject_1$
|
|
1508
|
+
var SVG = styled__default.default.svg(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), SharedStyles);
|
|
1509
|
+
var templateObject_1$U;
|
|
1509
1510
|
|
|
1510
1511
|
function Loading(_a) {
|
|
1511
1512
|
var _b = _a.height, height = _b === void 0 ? 50 : _b, width = _a.width, _c = _a.animationDuration, animationDuration = _c === void 0 ? 1000 : _c, _d = _a.barWidth, barWidth = _d === void 0 ? 14 : _d, _e = _a.barRadius, barRadius = _e === void 0 ? 2 : _e, _f = _a.colorful, colorful = _f === void 0 ? false : _f, _g = _a.bars, bars = _g === void 0 ? 4 : _g, _h = _a.viewBox, viewBox = _h === void 0 ? "10 0 51 50" : _h; _a.rotate; var startColor = _a.startColor, endColor = _a.endColor, props = __rest(_a, ["height", "width", "animationDuration", "barWidth", "barRadius", "colorful", "bars", "viewBox", "rotate", "startColor", "endColor"]);
|
|
1512
1513
|
var colorGradient = colorful
|
|
1513
|
-
? generateColor(startColor || colors.special1, endColor || colors.primary, bars)
|
|
1514
|
-
: generateColor(startColor || colors.primary, endColor || colors.primary0, bars);
|
|
1514
|
+
? generateColor(startColor || colors$1.special1, endColor || colors$1.primary, bars)
|
|
1515
|
+
: generateColor(startColor || colors$1.primary, endColor || colors$1.primary0, bars);
|
|
1515
1516
|
var generateBar = function (v) {
|
|
1516
1517
|
return (React__default.default.createElement("rect", { key: "bar_".concat(v), x: 19 * v, y: "0", width: barWidth || 14, height: height, fill: "#".concat(colorGradient[v]), rx: barRadius },
|
|
1517
1518
|
React__default.default.createElement("animate", { attributeName: "height", values: "50;10;50", begin: "".concat(v * 0.2, "s"), dur: "".concat(animationDuration / 1000, "s"), repeatCount: "indefinite" })));
|
|
@@ -1526,6 +1527,99 @@ function Loading(_a) {
|
|
|
1526
1527
|
return (React__default.default.createElement(SVG, __assign({ width: width ? "".concat(width, "px") : "100%", height: height ? "".concat(height, "px") : "100%", viewBox: viewBox, transform: "scale(1, -1) translate(0, -1)" }, props), generateBars()));
|
|
1527
1528
|
}
|
|
1528
1529
|
|
|
1530
|
+
var logoSizes = {
|
|
1531
|
+
small: {
|
|
1532
|
+
width: 24
|
|
1533
|
+
},
|
|
1534
|
+
medium: {
|
|
1535
|
+
width: 64
|
|
1536
|
+
},
|
|
1537
|
+
large: {
|
|
1538
|
+
width: 120
|
|
1539
|
+
},
|
|
1540
|
+
default: {
|
|
1541
|
+
width: 120
|
|
1542
|
+
}
|
|
1543
|
+
};
|
|
1544
|
+
var containerSizes = {
|
|
1545
|
+
small: {
|
|
1546
|
+
width: 48
|
|
1547
|
+
},
|
|
1548
|
+
medium: {
|
|
1549
|
+
width: 100
|
|
1550
|
+
},
|
|
1551
|
+
large: {
|
|
1552
|
+
width: 200
|
|
1553
|
+
},
|
|
1554
|
+
default: {
|
|
1555
|
+
width: 200
|
|
1556
|
+
}
|
|
1557
|
+
};
|
|
1558
|
+
var rotator = styled.keyframes(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(270deg);\n }\n"], ["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(270deg);\n }\n"])));
|
|
1559
|
+
var colors = styled.keyframes(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n 0% {\n stroke: #02c0da;\n }\n 25% {\n stroke: #02c0da;\n }\n 50% {\n stroke: #02c0da;\n }\n 75% {\n stroke: #02c0da;\n }\n 100% {\n stroke: #02c0da;\n }\n"], ["\n 0% {\n stroke: #02c0da;\n }\n 25% {\n stroke: #02c0da;\n }\n 50% {\n stroke: #02c0da;\n }\n 75% {\n stroke: #02c0da;\n }\n 100% {\n stroke: #02c0da;\n }\n"])));
|
|
1560
|
+
var dash = styled.keyframes(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n 0% {\n stroke-dashoffset: 187;\n }\n 50% {\n stroke-dashoffset: 46.75;\n transform: rotate(135deg);\n }\n 100% {\n stroke-dashoffset: 187;\n transform: rotate(450deg);\n }\n"], ["\n 0% {\n stroke-dashoffset: 187;\n }\n 50% {\n stroke-dashoffset: 46.75;\n transform: rotate(135deg);\n }\n 100% {\n stroke-dashoffset: 187;\n transform: rotate(450deg);\n }\n"])));
|
|
1561
|
+
var Container$1 = styled__default.default.div(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n position: relative;\n width: ", ";\n height: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n position: relative;\n width: ", ";\n height: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (props) { return props.size + 'px' || '200px'; }, function (props) { return props.size + 'px' || '200px'; });
|
|
1562
|
+
var Spinner$1 = styled__default.default.svg(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n animation: ", " 1.4s linear infinite;\n"], ["\n animation: ", " 1.4s linear infinite;\n"])), rotator);
|
|
1563
|
+
var Path = styled__default.default.circle(templateObject_6$a || (templateObject_6$a = __makeTemplateObject(["\n fill: none;\n stroke-width: 2.5;\n stroke-linecap: round;\n stroke-dasharray: 187;\n stroke-dashoffset: 0;\n transform-origin: center;\n animation: ", " 1.4s ease-in-out infinite, ", " 5.6s ease-in-out infinite;\n"], ["\n fill: none;\n stroke-width: 2.5;\n stroke-linecap: round;\n stroke-dasharray: 187;\n stroke-dashoffset: 0;\n transform-origin: center;\n animation: ", " 1.4s ease-in-out infinite, ", " 5.6s ease-in-out infinite;\n"])), dash, colors);
|
|
1564
|
+
var Logo = styled__default.default.svg(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n position: absolute;\n top: 50%;\n left: 50%;\n translate: -50% -50%;\n"], ["\n position: absolute;\n top: 50%;\n left: 50%;\n translate: -50% -50%;\n"])));
|
|
1565
|
+
function SkubotSpinner(_a) {
|
|
1566
|
+
var _b = _a.color, color = _b === void 0 ? '#00C1DE' : _b, _c = _a.size, size = _c === void 0 ? "default" : _c; _a.altText; var _e = _a.skubot, skubot = _e === void 0 ? true : _e; __rest(_a, ["color", "size", "altText", "skubot"]);
|
|
1567
|
+
return (React__default.default.createElement(Container$1, { size: containerSizes[size] ? containerSizes[size].width : 200 },
|
|
1568
|
+
React__default.default.createElement(Spinner$1, { width: '200px', height: '200px', viewBox: "0 0 66 66", xmlns: "http://www.w3.org/2000/svg" },
|
|
1569
|
+
React__default.default.createElement(Path, { cx: "33", cy: "33", r: "30" })),
|
|
1570
|
+
skubot ?
|
|
1571
|
+
React__default.default.createElement(Logo, { width: logoSizes[size] ? logoSizes[size].width : 120, viewBox: "0 0 100 54.9" },
|
|
1572
|
+
React__default.default.createElement("circle", { fill: color, cx: "2.7", cy: "30.2", r: "2.7" }),
|
|
1573
|
+
React__default.default.createElement("circle", { fill: color, cx: "97.3", cy: "30.2", r: "2.7" }),
|
|
1574
|
+
React__default.default.createElement("path", { fill: color, d: "M91,28.5c-0.1-2.3-0.4-4.6-0.8-6.8c-0.2-0.9-1-1.5-1.9-1.5h-6.8V9.7c0-1.4-0.8-2.5-1.7-2.5\n c-4.8-0.9-9.6-1.5-14.5-2V3.4c0-0.9-0.6-1.8-1.6-2C59.2,0.5,54.6,0,50,0c-4.6,0-9.2,0.5-13.6,1.4c-0.9,0.2-1.6,1-1.6,2v1.9\n c-4.8,0.4-9.7,1.1-14.5,2c-0.5,0-0.9,0.3-1.2,0.7c-0.3,0.4-0.5,1.1-0.5,1.7v10.4h-6.8c-0.9,0-1.8,0.6-1.9,1.5\n C9.4,24,9.1,26.2,9,28.5V31c0.1,2.3,0.4,4.6,0.8,6.8c0.2,0.9,1,1.5,1.9,1.5h6.8V50c0,1.4,0.8,2.5,1.7,2.5\n c9.8,1.6,19.8,2.5,29.7,2.5c9.9,0,19.8-0.8,29.7-2.5c0.5,0,0.9-0.3,1.2-0.7c0.3-0.4,0.5-1.1,0.5-1.7V39.4h6.8\n c0.9,0,1.8-0.6,1.9-1.5c0.5-2.3,0.8-4.5,0.8-6.8V28.5z M76.6,45.7c0,1.1-0.9,2-2,2c-16.3,2.5-32.9,2.5-49.3,0c-0.5,0-1-0.2-1.4-0.6\n c-0.4-0.4-0.6-0.8-0.6-1.4V13.8c0-1.1,0.9-2,2-2C33.5,10.6,41.8,10,50,10c8.2,0,16.5,0.6,24.6,1.8c0.5,0,1,0.2,1.4,0.6\n c0.4,0.4,0.6,0.8,0.6,1.4V45.7z" }),
|
|
1575
|
+
React__default.default.createElement("path", { fill: color, d: "M37.2,39L37.2,39c-2.7,0-4.9-2.2-4.9-4.9v-7.8c0-2.7,2.2-4.9,4.9-4.9h0c2.7,0,4.9,2.2,4.9,4.9v7.8\n C42.1,36.8,39.9,39,37.2,39z" }),
|
|
1576
|
+
React__default.default.createElement("path", { fill: color, d: "M62.8,39L62.8,39c-2.7,0-4.9-2.2-4.9-4.9v-7.8c0-2.7,2.2-4.9,4.9-4.9h0c2.7,0,4.9,2.2,4.9,4.9v7.8\n C67.8,36.8,65.5,39,62.8,39z" })) : null));
|
|
1577
|
+
}
|
|
1578
|
+
var templateObject_1$T, templateObject_2$x, templateObject_3$l, templateObject_4$f, templateObject_5$a, templateObject_6$a, templateObject_7$4;
|
|
1579
|
+
|
|
1580
|
+
function CommonskuMainLogo(_a) {
|
|
1581
|
+
var _b = _a.color, color = _b === void 0 ? '#00C1DE' : _b; _a.size; _a.altText; _a.width; __rest(_a, ["color", "size", "altText", "width"]);
|
|
1582
|
+
return (React__default.default.createElement("svg", { viewBox: "0 0 125 43.9" },
|
|
1583
|
+
React__default.default.createElement("g", null,
|
|
1584
|
+
React__default.default.createElement("path", { fill: color, d: "M1.8,33.7C3,32.5,4.4,31.9,6,31.9c0.9,0,1.7,0.2,2.5,0.6c0.8,0.4,1.3,0.8,1.7,1.2l0.5,0.6l-1.6,1.6\n\t\t\tc-0.1-0.1-0.2-0.3-0.4-0.5c-0.2-0.2-0.5-0.4-1-0.7c-0.5-0.3-1.1-0.5-1.7-0.5c-1,0-1.8,0.4-2.5,1.1c-0.7,0.7-1.1,1.6-1.1,2.7\n\t\t\tc0,1.1,0.4,2,1.1,2.7C4.2,41.4,5,41.7,6,41.7c0.6,0,1.2-0.2,1.7-0.5c0.5-0.3,0.9-0.6,1.2-0.9l0.4-0.4l1.6,1.6\n\t\t\tc0,0.1-0.1,0.2-0.2,0.3c-0.1,0.1-0.3,0.3-0.6,0.6c-0.3,0.3-0.6,0.5-1,0.7c-0.3,0.2-0.8,0.4-1.3,0.6c-0.5,0.2-1.1,0.3-1.7,0.3\n\t\t\tc-1.6,0-3-0.6-4.2-1.8C0.6,40.9,0,39.5,0,37.9C0,36.3,0.6,34.9,1.8,33.7z" }),
|
|
1585
|
+
React__default.default.createElement("path", { fill: color, d: "M13.6,33.7c1.2-1.2,2.6-1.8,4.2-1.8c1.6,0,3,0.6,4.2,1.8c1.2,1.2,1.8,2.6,1.8,4.2c0,1.6-0.6,3-1.8,4.2\n\t\t\ts-2.6,1.8-4.2,1.8c-1.6,0-3-0.6-4.2-1.8s-1.8-2.6-1.8-4.2C11.9,36.3,12.5,34.9,13.6,33.7z M20.4,35.2c-0.7-0.7-1.6-1.1-2.5-1.1\n\t\t\tc-1,0-1.8,0.4-2.5,1.1c-0.7,0.7-1.1,1.6-1.1,2.7c0,1.1,0.4,2,1.1,2.7c0.7,0.7,1.6,1.1,2.5,1.1c1,0,1.8-0.4,2.5-1.1\n\t\t\tc0.7-0.7,1.1-1.6,1.1-2.7C21.5,36.8,21.1,35.9,20.4,35.2z" }),
|
|
1586
|
+
React__default.default.createElement("path", { fill: color, d: "M40.7,36.9c0-0.9-0.2-1.7-0.6-2.1c-0.4-0.5-1-0.7-1.8-0.7c-0.7,0-1.4,0.3-1.9,0.9c-0.5,0.6-0.8,1.4-0.8,2.5\n\t\t\tv6.2h-2.4v-6.7c0-0.9-0.2-1.7-0.6-2.1c-0.4-0.5-1-0.7-1.8-0.7c-0.7,0-1.4,0.3-1.9,0.9c-0.5,0.6-0.8,1.4-0.8,2.5v6.2h-2.4V32.1h2.4\n\t\t\tv1.2c0.1-0.1,0.2-0.2,0.4-0.4c0.2-0.2,0.5-0.4,1.1-0.6c0.5-0.3,1.1-0.4,1.7-0.4c0.5,0,0.9,0.1,1.3,0.2c0.4,0.1,0.8,0.3,1,0.5\n\t\t\tc0.2,0.2,0.5,0.4,0.7,0.6c0.2,0.2,0.3,0.4,0.4,0.5l0.1,0.2c0,0,0.1-0.1,0.2-0.2c0.1-0.1,0.2-0.2,0.5-0.5c0.2-0.2,0.5-0.4,0.8-0.6\n\t\t\tc0.3-0.2,0.6-0.3,1.1-0.5c0.5-0.1,0.9-0.2,1.4-0.2c1.3,0,2.4,0.4,3.2,1.3c0.8,0.9,1.2,2.1,1.2,3.8v6.7h-2.4V36.9z" }),
|
|
1587
|
+
React__default.default.createElement("path", { fill: color, d: "M60.8,36.9c0-0.9-0.2-1.7-0.6-2.1s-1-0.7-1.8-0.7c-0.7,0-1.4,0.3-1.9,0.9c-0.5,0.6-0.8,1.4-0.8,2.5v6.2h-2.4\n\t\t\tv-6.7c0-0.9-0.2-1.7-0.6-2.1c-0.4-0.5-1-0.7-1.8-0.7c-0.7,0-1.4,0.3-1.9,0.9c-0.5,0.6-0.8,1.4-0.8,2.5v6.2h-2.4V32.1h2.4v1.2\n\t\t\tc0.1-0.1,0.2-0.2,0.4-0.4c0.2-0.2,0.5-0.4,1.1-0.6c0.5-0.3,1.1-0.4,1.7-0.4c0.5,0,0.9,0.1,1.3,0.2c0.4,0.1,0.8,0.3,1,0.5\n\t\t\tc0.2,0.2,0.5,0.4,0.7,0.6c0.2,0.2,0.3,0.4,0.4,0.5l0.1,0.2c0,0,0.1-0.1,0.2-0.2c0.1-0.1,0.2-0.2,0.5-0.5c0.2-0.2,0.5-0.4,0.8-0.6\n\t\t\tc0.3-0.2,0.6-0.3,1.1-0.5c0.5-0.1,0.9-0.2,1.4-0.2c1.3,0,2.4,0.4,3.2,1.3c0.8,0.9,1.2,2.1,1.2,3.8v6.7h-2.4V36.9z" }),
|
|
1588
|
+
React__default.default.createElement("path", { fill: color, d: "M67,33.7c1.2-1.2,2.6-1.8,4.2-1.8c1.6,0,3,0.6,4.2,1.8c1.2,1.2,1.8,2.6,1.8,4.2c0,1.6-0.6,3-1.8,4.2\n\t\t\ts-2.6,1.8-4.2,1.8c-1.6,0-3-0.6-4.2-1.8c-1.2-1.2-1.8-2.6-1.8-4.2C65.2,36.3,65.8,34.9,67,33.7z M73.7,35.2\n\t\t\tc-0.7-0.7-1.6-1.1-2.5-1.1c-1,0-1.8,0.4-2.5,1.1c-0.7,0.7-1.1,1.6-1.1,2.7c0,1.1,0.4,2,1.1,2.7c0.7,0.7,1.6,1.1,2.5,1.1\n\t\t\tc1,0,1.8-0.4,2.5-1.1c0.7-0.7,1.1-1.6,1.1-2.7C74.8,36.8,74.4,35.9,73.7,35.2z" }),
|
|
1589
|
+
React__default.default.createElement("path", { fill: color, d: "M81.6,33.3l0.2-0.2c0.1-0.1,0.2-0.2,0.4-0.3c0.2-0.2,0.5-0.3,0.7-0.4c0.3-0.1,0.6-0.2,1-0.4\n\t\t\tc0.4-0.1,0.8-0.2,1.2-0.2c1.4,0,2.5,0.5,3.4,1.4c0.9,0.9,1.3,2.1,1.3,3.7v6.7h-2.4v-6.7c0-0.8-0.3-1.5-0.8-2.1\n\t\t\tc-0.5-0.5-1.2-0.8-2-0.8c-0.9,0-1.6,0.3-2.2,0.9c-0.5,0.6-0.8,1.4-0.8,2.5v6.2h-2.4V32.1h2.4V33.3z" }),
|
|
1590
|
+
React__default.default.createElement("path", { fill: color, d: "M98.3,35c-0.1-0.1-0.2-0.2-0.3-0.3c-0.1-0.1-0.4-0.3-0.7-0.4c-0.4-0.2-0.8-0.3-1.1-0.3\n\t\t\tc-0.5,0-0.9,0.1-1.2,0.4c-0.3,0.2-0.5,0.5-0.5,0.8c0,0.3,0.1,0.6,0.4,0.8c0.3,0.2,0.7,0.4,1.1,0.5c0.4,0.1,0.9,0.3,1.4,0.4\n\t\t\tc0.5,0.2,1,0.4,1.4,0.6c0.4,0.2,0.8,0.6,1.1,1c0.3,0.5,0.4,1,0.4,1.6c0,1-0.4,1.8-1.2,2.5c-0.8,0.7-1.8,1.1-3.1,1.1\n\t\t\tc-0.6,0-1.1-0.1-1.6-0.2c-0.5-0.1-0.9-0.3-1.3-0.5s-0.6-0.4-0.9-0.6c-0.2-0.2-0.4-0.4-0.5-0.5l-0.2-0.2l1.6-1.6\n\t\t\tc0.1,0.1,0.2,0.2,0.3,0.4c0.2,0.2,0.5,0.4,1,0.6c0.5,0.3,1,0.4,1.6,0.4c0.6,0,1.1-0.1,1.4-0.4c0.3-0.3,0.5-0.6,0.5-1\n\t\t\tc0-0.3-0.1-0.6-0.4-0.8c-0.3-0.2-0.7-0.4-1.1-0.5c-0.4-0.1-0.9-0.3-1.4-0.4c-0.5-0.2-1-0.4-1.4-0.6c-0.4-0.2-0.8-0.6-1.1-1\n\t\t\tc-0.3-0.5-0.4-1-0.4-1.6c0-0.9,0.4-1.7,1.2-2.3c0.8-0.7,1.7-1,2.9-1c0.5,0,0.9,0.1,1.3,0.2c0.4,0.1,0.8,0.2,1.1,0.4\n\t\t\tc0.3,0.2,0.5,0.3,0.7,0.5c0.2,0.2,0.4,0.3,0.5,0.4l0.2,0.2L98.3,35z" }),
|
|
1591
|
+
React__default.default.createElement("path", { fill: color, d: "M108.3,36.9l4.8,6.7h-2.6l-3.7-5.2l-1.8,1.9v3.2h-2.4V0h2.4v37.3l4.9-5.2h2.9L108.3,36.9z" }),
|
|
1592
|
+
React__default.default.createElement("path", { fill: color, d: "M122.6,42.5l-0.2,0.2c-0.1,0.1-0.2,0.2-0.4,0.3c-0.2,0.2-0.5,0.3-0.7,0.4c-0.3,0.1-0.6,0.2-1,0.3\n\t\t\tc-0.4,0.1-0.8,0.2-1.2,0.2c-1.4,0-2.5-0.5-3.4-1.4c-0.9-0.9-1.3-2.1-1.3-3.7v-6.7h2.4v6.7c0,0.8,0.3,1.5,0.8,2.1\n\t\t\tc0.5,0.5,1.2,0.8,2,0.8c0.9,0,1.6-0.3,2.2-0.9c0.5-0.6,0.8-1.4,0.8-2.5v-6.2h2.4v11.5h-2.4V42.5z" })),
|
|
1593
|
+
React__default.default.createElement("g", null,
|
|
1594
|
+
React__default.default.createElement("rect", { x: "6.8", y: "0", fill: color, width: "5.1", height: "27.1" }),
|
|
1595
|
+
React__default.default.createElement("rect", { x: "16.5", y: "0", fill: color, width: "2.7", height: "27.1" }),
|
|
1596
|
+
React__default.default.createElement("rect", { x: "33.3", y: "0", fill: color, width: "5", height: "27.1" }),
|
|
1597
|
+
React__default.default.createElement("rect", { x: "47.8", y: "0", fill: color, width: "4", height: "27.1" }),
|
|
1598
|
+
React__default.default.createElement("rect", { x: "71.3", y: "0", fill: color, width: "5.9", height: "27.1" }),
|
|
1599
|
+
React__default.default.createElement("rect", { x: "94.2", y: "0", fill: color, width: "4", height: "27.1" }),
|
|
1600
|
+
React__default.default.createElement("rect", { x: "114.4", y: "0", fill: color, width: "4", height: "27.1" }),
|
|
1601
|
+
React__default.default.createElement("rect", { x: "22.4", y: "0", fill: color, width: "5.9", height: "27.1" }),
|
|
1602
|
+
React__default.default.createElement("rect", { x: "41.6", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1603
|
+
React__default.default.createElement("rect", { x: "56.3", y: "0", fill: color, width: "5.3", height: "27.1" }),
|
|
1604
|
+
React__default.default.createElement("rect", { x: "81.6", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1605
|
+
React__default.default.createElement("rect", { x: "1.2", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1606
|
+
React__default.default.createElement("rect", { x: "65.2", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1607
|
+
React__default.default.createElement("rect", { x: "87.4", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1608
|
+
React__default.default.createElement("rect", { x: "107.9", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1609
|
+
React__default.default.createElement("rect", { x: "122.1", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1610
|
+
React__default.default.createElement("path", { fill: color, d: "M105,27.1h-2.4V0h2.4V27.1z" }))));
|
|
1611
|
+
}
|
|
1612
|
+
|
|
1613
|
+
function SkubotLogo(_a) {
|
|
1614
|
+
var _b = _a.color, color = _b === void 0 ? '#00C1DE' : _b, _c = _a.width, width = _c === void 0 ? 64 : _c, _d = _a.height, height = _d === void 0 ? 64 : _d; _a.altText; __rest(_a, ["color", "width", "height", "altText"]);
|
|
1615
|
+
return (React__default.default.createElement(SVG$1, { width: width, height: height, viewBox: "0 0 100 54.9" },
|
|
1616
|
+
React__default.default.createElement("circle", { fill: color, cx: "2.7", cy: "30.2", r: "2.7" }),
|
|
1617
|
+
React__default.default.createElement("circle", { fill: color, cx: "97.3", cy: "30.2", r: "2.7" }),
|
|
1618
|
+
React__default.default.createElement("path", { fill: color, d: "M91,28.5c-0.1-2.3-0.4-4.6-0.8-6.8c-0.2-0.9-1-1.5-1.9-1.5h-6.8V9.7c0-1.4-0.8-2.5-1.7-2.5\n c-4.8-0.9-9.6-1.5-14.5-2V3.4c0-0.9-0.6-1.8-1.6-2C59.2,0.5,54.6,0,50,0c-4.6,0-9.2,0.5-13.6,1.4c-0.9,0.2-1.6,1-1.6,2v1.9\n c-4.8,0.4-9.7,1.1-14.5,2c-0.5,0-0.9,0.3-1.2,0.7c-0.3,0.4-0.5,1.1-0.5,1.7v10.4h-6.8c-0.9,0-1.8,0.6-1.9,1.5\n C9.4,24,9.1,26.2,9,28.5V31c0.1,2.3,0.4,4.6,0.8,6.8c0.2,0.9,1,1.5,1.9,1.5h6.8V50c0,1.4,0.8,2.5,1.7,2.5\n c9.8,1.6,19.8,2.5,29.7,2.5c9.9,0,19.8-0.8,29.7-2.5c0.5,0,0.9-0.3,1.2-0.7c0.3-0.4,0.5-1.1,0.5-1.7V39.4h6.8\n c0.9,0,1.8-0.6,1.9-1.5c0.5-2.3,0.8-4.5,0.8-6.8V28.5z M76.6,45.7c0,1.1-0.9,2-2,2c-16.3,2.5-32.9,2.5-49.3,0c-0.5,0-1-0.2-1.4-0.6\n c-0.4-0.4-0.6-0.8-0.6-1.4V13.8c0-1.1,0.9-2,2-2C33.5,10.6,41.8,10,50,10c8.2,0,16.5,0.6,24.6,1.8c0.5,0,1,0.2,1.4,0.6\n c0.4,0.4,0.6,0.8,0.6,1.4V45.7z" }),
|
|
1619
|
+
React__default.default.createElement("path", { fill: color, d: "M37.2,39L37.2,39c-2.7,0-4.9-2.2-4.9-4.9v-7.8c0-2.7,2.2-4.9,4.9-4.9h0c2.7,0,4.9,2.2,4.9,4.9v7.8\n C42.1,36.8,39.9,39,37.2,39z" }),
|
|
1620
|
+
React__default.default.createElement("path", { fill: color, d: "M62.8,39L62.8,39c-2.7,0-4.9-2.2-4.9-4.9v-7.8c0-2.7,2.2-4.9,4.9-4.9h0c2.7,0,4.9,2.2,4.9,4.9v7.8\n C67.8,36.8,65.5,39,62.8,39z" })));
|
|
1621
|
+
}
|
|
1622
|
+
|
|
1529
1623
|
function SalesArrowIcon(_a) {
|
|
1530
1624
|
var _b = _a.color, color = _b === void 0 ? green.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.direction, direction = _d === void 0 ? "up" : _d, _e = _a.altText, altText = _e === void 0 ? "Up" : _e, props = __rest(_a, ["color", "size", "direction", "altText"]);
|
|
1531
1625
|
if (direction === "down") {
|
|
@@ -2292,7 +2386,7 @@ function MenuIcon(_a) {
|
|
|
2292
2386
|
React__default.default.createElement("path", { d: "M4 18h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1Zm0-5h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1ZM3 7c0 .55.45 1 1 1h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1Z", fill: color }));
|
|
2293
2387
|
}
|
|
2294
2388
|
|
|
2295
|
-
var iconSizes$
|
|
2389
|
+
var iconSizes$8 = {
|
|
2296
2390
|
tiny: {
|
|
2297
2391
|
'font-size': fontStyles.button.small.fontSize,
|
|
2298
2392
|
},
|
|
@@ -2316,7 +2410,7 @@ var getSizeStyle$2 = function (style, defaults) {
|
|
|
2316
2410
|
return function (_a) {
|
|
2317
2411
|
var size = _a.size;
|
|
2318
2412
|
if (size) {
|
|
2319
|
-
return _.get(iconSizes$
|
|
2413
|
+
return _.get(iconSizes$8, [size, style]) || defaults;
|
|
2320
2414
|
}
|
|
2321
2415
|
return defaults;
|
|
2322
2416
|
};
|
|
@@ -2381,7 +2475,7 @@ function HandleIcon(_a) {
|
|
|
2381
2475
|
React__default.default.createElement("path", { d: "M11 18C11 19.1 10.1 20 9 20C7.9 20 7 19.1 7 18C7 16.9 7.9 16 9 16C10.1 16 11 16.9 11 18ZM9 10C7.9 10 7 10.9 7 12C7 13.1 7.9 14 9 14C10.1 14 11 13.1 11 12C11 10.9 10.1 10 9 10ZM9 4C7.9 4 7 4.9 7 6C7 7.1 7.9 8 9 8C10.1 8 11 7.1 11 6C11 4.9 10.1 4 9 4ZM15 8C16.1 8 17 7.1 17 6C17 4.9 16.1 4 15 4C13.9 4 13 4.9 13 6C13 7.1 13.9 8 15 8ZM15 10C13.9 10 13 10.9 13 12C13 13.1 13.9 14 15 14C16.1 14 17 13.1 17 12C17 10.9 16.1 10 15 10ZM15 16C13.9 16 13 16.9 13 18C13 19.1 13.9 20 15 20C16.1 20 17 19.1 17 18C17 16.9 16.1 16 15 16Z", fill: color }));
|
|
2382
2476
|
}
|
|
2383
2477
|
|
|
2384
|
-
var iconSizes$
|
|
2478
|
+
var iconSizes$7 = {
|
|
2385
2479
|
tiny: {
|
|
2386
2480
|
width: 16,
|
|
2387
2481
|
height: 18,
|
|
@@ -2415,11 +2509,11 @@ var iconSizes$6 = {
|
|
|
2415
2509
|
};
|
|
2416
2510
|
function ShoppingCartIcon(_a) {
|
|
2417
2511
|
var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "Shopping Cart" : _d, props = __rest(_a, ["color", "size", "altText"]);
|
|
2418
|
-
return (React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "ShoppingCartIcon", iconSizes: iconSizes$
|
|
2512
|
+
return (React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "ShoppingCartIcon", iconSizes: iconSizes$7, altText: altText }, props),
|
|
2419
2513
|
React__default.default.createElement("path", { d: "M15.5463 11C16.2963 11 16.9563 10.59 17.2963 9.97L20.8763 3.48C21.2463 2.82 20.7663 2 20.0063 2H5.20634L4.26634 0H0.996338V2H2.99634L6.59634 9.59L5.24634 12.03C4.51634 13.37 5.47634 15 6.99634 15H18.9963V13H6.99634L8.09634 11H15.5463ZM6.15634 4H18.3063L15.5463 9H8.52634L6.15634 4ZM6.99634 16C5.89634 16 5.00634 16.9 5.00634 18C5.00634 19.1 5.89634 20 6.99634 20C8.09634 20 8.99634 19.1 8.99634 18C8.99634 16.9 8.09634 16 6.99634 16ZM16.9963 16C15.8963 16 15.0063 16.9 15.0063 18C15.0063 19.1 15.8963 20 16.9963 20C18.0963 20 18.9963 19.1 18.9963 18C18.9963 16.9 18.0963 16 16.9963 16Z", fill: color })));
|
|
2420
2514
|
}
|
|
2421
2515
|
|
|
2422
|
-
var iconSizes$
|
|
2516
|
+
var iconSizes$6 = {
|
|
2423
2517
|
tiny: {
|
|
2424
2518
|
width: 14,
|
|
2425
2519
|
height: 15,
|
|
@@ -2453,7 +2547,7 @@ var iconSizes$5 = {
|
|
|
2453
2547
|
};
|
|
2454
2548
|
function AddShoppingCartIcon(_a) {
|
|
2455
2549
|
var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c; _a.altText; var props = __rest(_a, ["color", "size", "altText"]);
|
|
2456
|
-
return (React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "AddShoppingCartIcon", iconSizes: iconSizes$
|
|
2550
|
+
return (React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "AddShoppingCartIcon", iconSizes: iconSizes$6 }, props),
|
|
2457
2551
|
React__default.default.createElement("path", { d: "M10.4199 8.5H12.4199V5.5H15.4199V3.5H12.4199V0.5H10.4199V3.5H7.41992V5.5H10.4199V8.5ZM6.41992 17.5C5.31992 17.5 4.42992 18.4 4.42992 19.5C4.42992 20.6 5.31992 21.5 6.41992 21.5C7.51992 21.5 8.41992 20.6 8.41992 19.5C8.41992 18.4 7.51992 17.5 6.41992 17.5ZM16.4199 17.5C15.3199 17.5 14.4299 18.4 14.4299 19.5C14.4299 20.6 15.3199 21.5 16.4199 21.5C17.5199 21.5 18.4199 20.6 18.4199 19.5C18.4199 18.4 17.5199 17.5 16.4199 17.5ZM7.51992 12.5H14.9699C15.7199 12.5 16.3799 12.09 16.7199 11.47L20.5799 4.46L18.8399 3.5L14.9699 10.5H7.94992L3.68992 1.5H0.419922V3.5H2.41992L6.01992 11.09L4.66992 13.53C3.93992 14.87 4.89992 16.5 6.41992 16.5H18.4199V14.5H6.41992L7.51992 12.5Z", fill: color })));
|
|
2458
2552
|
}
|
|
2459
2553
|
|
|
@@ -2528,7 +2622,7 @@ function HelpIcon(_a) {
|
|
|
2528
2622
|
React__default.default.createElement("path", { d: "M9 16H11V14H9V16ZM10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 18C5.59 18 2 14.41 2 10C2 5.59 5.59 2 10 2C14.41 2 18 5.59 18 10C18 14.41 14.41 18 10 18ZM10 4C7.79 4 6 5.79 6 8H8C8 6.9 8.9 6 10 6C11.1 6 12 6.9 12 8C12 10 9 9.75 9 13H11C11 10.75 14 10.5 14 8C14 5.79 12.21 4 10 4Z", fill: color }));
|
|
2529
2623
|
}
|
|
2530
2624
|
|
|
2531
|
-
var iconSizes$
|
|
2625
|
+
var iconSizes$5 = {
|
|
2532
2626
|
tiny: {
|
|
2533
2627
|
width: 188,
|
|
2534
2628
|
height: 44,
|
|
@@ -2563,7 +2657,7 @@ var iconSizes$4 = {
|
|
|
2563
2657
|
function FileUploadIcon(_a) {
|
|
2564
2658
|
var _b = _a.color; _b === void 0 ? teal.main : _b; var _c = _a.size, size = _c === void 0 ? "medium" : _c; _a.altText; var props = __rest(_a, ["color", "size", "altText"]);
|
|
2565
2659
|
var clipId = "clip0_2603_83254_".concat(_.uniqueId('clip'));
|
|
2566
|
-
return React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "FileUploadIcon", iconSizes: iconSizes$
|
|
2660
|
+
return React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "FileUploadIcon", iconSizes: iconSizes$5 }, props),
|
|
2567
2661
|
React__default.default.createElement("g", { clipPath: "url(#".concat(clipId, ")") },
|
|
2568
2662
|
React__default.default.createElement("path", { d: "M74.6667 13.3333V50.6667H37.3333V13.3333H74.6667ZM74.6667 8H37.3333C34.4 8 32 10.4 32 13.3333V50.6667C32 53.6 34.4 56 37.3333 56H74.6667C77.6 56 80 53.6 80 50.6667V13.3333C80 10.4 77.6 8 74.6667 8ZM61.7067 31.6267L53.7067 41.9467L48 35.04L40 45.3333H72L61.7067 31.6267Z", fill: "#B8C4CB" })),
|
|
2569
2663
|
React__default.default.createElement("path", { d: "M97.26 19H99.9C102.36 19 104.28 17.08 104.28 14.8C104.28 12.52 102.36 10.6 99.9 10.6H97.26V19ZM98.16 18.16V11.44H99.9C101.88 11.44 103.38 12.94 103.38 14.8C103.38 16.66 101.88 18.16 99.9 18.16H98.16ZM105.96 19H106.8V15.82C106.8 14.68 107.64 13.96 108.6 13.96H108.96V13.12H108.72C107.4 13.12 106.8 14.02 106.8 14.02V13.24H105.96V19ZM113.577 19H114.417V15.34C114.417 14.08 113.457 13.12 112.137 13.12C110.757 13.12 109.977 14.2 109.977 14.2L110.517 14.74C110.517 14.74 111.117 13.9 112.137 13.9C112.977 13.9 113.577 14.5 113.577 15.34L111.357 15.7C110.277 15.88 109.677 16.48 109.677 17.44C109.677 18.28 110.517 19.12 111.717 19.12C112.977 19.12 113.577 18.22 113.577 18.22V19ZM113.577 16.42C113.577 17.56 112.797 18.34 111.717 18.34C110.937 18.34 110.517 17.92 110.517 17.44C110.517 16.9 110.877 16.552 111.597 16.42L113.577 16.06V16.42ZM116.151 20.32C116.151 20.32 116.931 21.52 118.551 21.52C120.111 21.52 121.371 20.26 121.371 18.64V13.24H120.531V14.02C120.531 14.02 119.991 13.12 118.611 13.12C117.111 13.12 115.911 14.38 115.911 16C115.911 17.62 117.111 18.88 118.611 18.88C119.991 18.88 120.531 17.98 120.531 17.98V18.64C120.531 19.84 119.631 20.74 118.551 20.74C117.351 20.74 116.691 19.78 116.691 19.78L116.151 20.32ZM118.611 18.1C117.591 18.1 116.751 17.2 116.751 16C116.751 14.8 117.591 13.9 118.611 13.9C119.691 13.9 120.531 14.8 120.531 16C120.531 17.2 119.691 18.1 118.611 18.1ZM129.292 19H130.132V15.34C130.132 14.08 129.172 13.12 127.852 13.12C126.472 13.12 125.692 14.2 125.692 14.2L126.232 14.74C126.232 14.74 126.832 13.9 127.852 13.9C128.692 13.9 129.292 14.5 129.292 15.34L127.072 15.7C125.992 15.88 125.392 16.48 125.392 17.44C125.392 18.28 126.232 19.12 127.432 19.12C128.692 19.12 129.292 18.22 129.292 18.22V19ZM129.292 16.42C129.292 17.56 128.512 18.34 127.432 18.34C126.652 18.34 126.232 17.92 126.232 17.44C126.232 16.9 126.592 16.552 127.312 16.42L129.292 16.06V16.42ZM132.046 19H132.886V15.82C132.886 14.68 133.666 13.9 134.686 13.9C135.586 13.9 136.246 14.56 136.246 15.58V19H137.086V15.58C137.086 14.08 136.126 13.12 134.746 13.12C133.486 13.12 132.886 14.08 132.886 14.08V13.24H132.046V19ZM143.387 19H144.227V10.6H143.387V14.08C143.387 14.08 142.727 13.12 141.407 13.12C139.847 13.12 138.587 14.38 138.587 16.12C138.587 17.86 139.847 19.12 141.407 19.12C142.727 19.12 143.387 18.16 143.387 18.16V19ZM141.407 18.34C140.327 18.34 139.427 17.44 139.427 16.12C139.427 14.8 140.327 13.9 141.407 13.9C142.427 13.9 143.387 14.86 143.387 16.12C143.387 17.38 142.427 18.34 141.407 18.34ZM153.102 19H153.942V10.6H153.102V14.08C153.102 14.08 152.442 13.12 151.122 13.12C149.562 13.12 148.302 14.38 148.302 16.12C148.302 17.86 149.562 19.12 151.122 19.12C152.442 19.12 153.102 18.16 153.102 18.16V19ZM151.122 18.34C150.042 18.34 149.142 17.44 149.142 16.12C149.142 14.8 150.042 13.9 151.122 13.9C152.142 13.9 153.102 14.86 153.102 16.12C153.102 17.38 152.142 18.34 151.122 18.34ZM155.917 19H156.757V15.82C156.757 14.68 157.597 13.96 158.557 13.96H158.917V13.12H158.677C157.357 13.12 156.757 14.02 156.757 14.02V13.24H155.917V19ZM162.457 19.12C164.077 19.12 165.397 17.8 165.397 16.12C165.397 14.44 164.077 13.12 162.457 13.12C160.837 13.12 159.517 14.44 159.517 16.12C159.517 17.8 160.837 19.12 162.457 19.12ZM162.457 18.34C161.317 18.34 160.357 17.368 160.357 16.12C160.357 14.86 161.317 13.9 162.457 13.9C163.597 13.9 164.557 14.86 164.557 16.12C164.557 17.38 163.597 18.34 162.457 18.34ZM166.898 21.52H167.738V18.16C167.738 18.16 168.398 19.12 169.718 19.12C171.278 19.12 172.538 17.86 172.538 16.12C172.538 14.38 171.278 13.12 169.718 13.12C168.398 13.12 167.738 14.08 167.738 14.08V13.24H166.898V21.52ZM169.718 18.34C168.698 18.34 167.738 17.38 167.738 16.12C167.738 14.86 168.698 13.9 169.718 13.9C170.798 13.9 171.698 14.8 171.698 16.12C171.698 17.44 170.798 18.34 169.718 18.34ZM97.02 33H97.86V29.82C97.86 28.68 98.64 27.9 99.66 27.9C100.56 27.9 101.22 28.56 101.22 29.58V33H102.06V29.58C102.06 28.08 101.1 27.12 99.72 27.12C98.46 27.12 97.86 28.08 97.86 28.08V24.6H97.02V33ZM108.3 31.38C108.3 31.38 107.652 32.34 106.44 32.34C105.36 32.34 104.46 31.44 104.4 30.42L109.08 30.432C109.08 30.432 109.14 30.24 109.14 30C109.14 28.32 107.94 27.12 106.38 27.12C104.88 27.12 103.56 28.44 103.56 30.12C103.56 31.8 104.88 33.12 106.44 33.12C108 33.12 108.84 31.92 108.84 31.92L108.3 31.38ZM104.4 29.7C104.52 28.74 105.36 27.9 106.38 27.9C107.4 27.9 108.18 28.68 108.3 29.7H104.4ZM110.636 33H111.476V29.82C111.476 28.68 112.316 27.96 113.276 27.96H113.636V27.12H113.396C112.076 27.12 111.476 28.02 111.476 28.02V27.24H110.636V33ZM118.975 31.38C118.975 31.38 118.327 32.34 117.115 32.34C116.035 32.34 115.135 31.44 115.075 30.42L119.755 30.432C119.755 30.432 119.815 30.24 119.815 30C119.815 28.32 118.615 27.12 117.055 27.12C115.555 27.12 114.235 28.44 114.235 30.12C114.235 31.8 115.555 33.12 117.115 33.12C118.675 33.12 119.515 31.92 119.515 31.92L118.975 31.38ZM115.075 29.7C115.195 28.74 116.035 27.9 117.055 27.9C118.075 27.9 118.855 28.68 118.975 29.7H115.075ZM126.351 33.12C127.971 33.12 129.291 31.8 129.291 30.12C129.291 28.44 127.971 27.12 126.351 27.12C124.731 27.12 123.411 28.44 123.411 30.12C123.411 31.8 124.731 33.12 126.351 33.12ZM126.351 32.34C125.211 32.34 124.251 31.368 124.251 30.12C124.251 28.86 125.211 27.9 126.351 27.9C127.491 27.9 128.451 28.86 128.451 30.12C128.451 31.38 127.491 32.34 126.351 32.34ZM130.792 33H131.632V29.82C131.632 28.68 132.472 27.96 133.432 27.96H133.792V27.12H133.552C132.232 27.12 131.632 28.02 131.632 28.02V27.24H130.792V33Z", fill: "#899CA9" }),
|
|
@@ -2573,7 +2667,7 @@ function FileUploadIcon(_a) {
|
|
|
2573
2667
|
React__default.default.createElement("rect", { width: "64", height: "64", fill: "white", transform: "translate(24)" }))));
|
|
2574
2668
|
}
|
|
2575
2669
|
|
|
2576
|
-
var iconSizes$
|
|
2670
|
+
var iconSizes$4 = {
|
|
2577
2671
|
tiny: {
|
|
2578
2672
|
width: 12,
|
|
2579
2673
|
height: 12,
|
|
@@ -2641,13 +2735,13 @@ function DoubleArrowIcon(_a) {
|
|
|
2641
2735
|
'M16.4065 8.94078C15.8865 9.46078 15.8865 10.3008 16.4065 10.8208L21.5665 16.0074L16.3932 21.1808C15.8732 21.7008 15.8732 22.5408 16.3932 23.0608C16.9132 23.5808 17.7532 23.5808 18.2732 23.0608L24.3932 16.9408C24.9132 16.4208 24.9132 15.5808 24.3932 15.0608L18.2865 8.94078C17.7665 8.42078 16.9265 8.42078 16.4065 8.94078Z',
|
|
2642
2736
|
];
|
|
2643
2737
|
}, [direction]);
|
|
2644
|
-
return (React__default.default.createElement(SVG$1, __assign({ fill: "none", xmlns: "http://www.w3.org/2000/svg", iconSizes: iconSizes$
|
|
2738
|
+
return (React__default.default.createElement(SVG$1, __assign({ fill: "none", xmlns: "http://www.w3.org/2000/svg", iconSizes: iconSizes$4, size: size }, props),
|
|
2645
2739
|
React__default.default.createElement("title", { id: "DoubleArrowIcon" }, iconAltText),
|
|
2646
2740
|
React__default.default.createElement("path", { d: directionPaths[0], fill: color }),
|
|
2647
2741
|
React__default.default.createElement("path", { d: directionPaths[1], fill: color })));
|
|
2648
2742
|
}
|
|
2649
2743
|
|
|
2650
|
-
var iconSizes$
|
|
2744
|
+
var iconSizes$3 = {
|
|
2651
2745
|
tiny: {
|
|
2652
2746
|
width: 16,
|
|
2653
2747
|
height: 16,
|
|
@@ -2682,7 +2776,7 @@ var iconSizes$2 = {
|
|
|
2682
2776
|
function ImageIcon(props) {
|
|
2683
2777
|
var _a = props.color, color = _a === void 0 ? teal.main : _a, _b = props.size, size = _b === void 0 ? "medium" : _b, _c = props.altText, altText = _c === void 0 ? "ImageIcon" : _c, rest = __rest(props, ["color", "size", "altText"]);
|
|
2684
2778
|
var id = _.uniqueId('clip0_1244_70960');
|
|
2685
|
-
return (React__default.default.createElement(SVG$1, __assign({ size: size, iconSizes: iconSizes$
|
|
2779
|
+
return (React__default.default.createElement(SVG$1, __assign({ size: size, iconSizes: iconSizes$3, "aria-labelledby": altText, fill: "none" }, rest),
|
|
2686
2780
|
React__default.default.createElement("g", { clipPath: "url(#".concat(id, ")") },
|
|
2687
2781
|
React__default.default.createElement("path", { d: "M25.3333 6.66667V25.3333H6.66667V6.66667H25.3333ZM25.3333 4H6.66667C5.2 4 4 5.2 4 6.66667V25.3333C4 26.8 5.2 28 6.66667 28H25.3333C26.8 28 28 26.8 28 25.3333V6.66667C28 5.2 26.8 4 25.3333 4ZM18.8533 15.8133L14.8533 20.9733L12 17.52L8 22.6667H24L18.8533 15.8133Z", fill: color })),
|
|
2688
2782
|
React__default.default.createElement("defs", null,
|
|
@@ -2690,7 +2784,7 @@ function ImageIcon(props) {
|
|
|
2690
2784
|
React__default.default.createElement("rect", { width: "32", height: "32", fill: "white" })))));
|
|
2691
2785
|
}
|
|
2692
2786
|
|
|
2693
|
-
var iconSizes$
|
|
2787
|
+
var iconSizes$2 = {
|
|
2694
2788
|
tiny: {
|
|
2695
2789
|
width: 81,
|
|
2696
2790
|
height: 80,
|
|
@@ -2724,14 +2818,14 @@ var iconSizes$1 = {
|
|
|
2724
2818
|
};
|
|
2725
2819
|
function StarLightIcon(_a) {
|
|
2726
2820
|
var _b = _a.color; _b === void 0 ? teal.main : _b; var _c = _a.size, size = _c === void 0 ? "medium" : _c; _a.altText; var props = __rest(_a, ["color", "size", "altText"]);
|
|
2727
|
-
return (React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "StarLightIcon", iconSizes: iconSizes$
|
|
2821
|
+
return (React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "StarLightIcon", iconSizes: iconSizes$2 }, props),
|
|
2728
2822
|
React__default.default.createElement("g", { id: "light", transform: "matrix(0.357231,0,0,0.357231,-1.53898,1.04263)" },
|
|
2729
2823
|
React__default.default.createElement("rect", { x: "4.308", y: "-0.3", width: "279.931", height: "279.931", style: { fill: 'none' } }),
|
|
2730
2824
|
React__default.default.createElement("g", { transform: "matrix(1.69264,0,0,1.69264,-1244.22,-2149.68)" },
|
|
2731
2825
|
React__default.default.createElement("path", { d: "M816.161,1280.05C816.87,1278.39 818.503,1277.31 820.31,1277.31C822.117,1277.31 823.75,1278.39 824.459,1280.05L844.406,1326.83L895.064,1331.35C896.864,1331.51 898.395,1332.73 898.954,1334.44C899.512,1336.16 898.991,1338.05 897.628,1339.24L859.299,1372.67L870.66,1422.24C871.064,1424 870.377,1425.83 868.914,1426.9C867.452,1427.96 865.497,1428.05 863.946,1427.12L820.31,1400.99L776.674,1427.12C775.123,1428.05 773.168,1427.96 771.706,1426.9C770.243,1425.83 769.556,1424 769.96,1422.24L781.321,1372.67L742.992,1339.24C741.629,1338.05 741.108,1336.16 741.666,1334.44C742.225,1332.73 743.756,1331.51 745.556,1331.35L796.214,1326.83L816.161,1280.05Z", style: { fill: 'rgb(236,248,255)', } })))));
|
|
2732
2826
|
}
|
|
2733
2827
|
|
|
2734
|
-
var iconSizes = {
|
|
2828
|
+
var iconSizes$1 = {
|
|
2735
2829
|
tiny: {
|
|
2736
2830
|
width: 81,
|
|
2737
2831
|
height: 80,
|
|
@@ -2765,7 +2859,7 @@ var iconSizes = {
|
|
|
2765
2859
|
};
|
|
2766
2860
|
function StarDarkIcon(_a) {
|
|
2767
2861
|
var _b = _a.color; _b === void 0 ? teal.main : _b; var _c = _a.size, size = _c === void 0 ? "medium" : _c; _a.altText; var props = __rest(_a, ["color", "size", "altText"]);
|
|
2768
|
-
return (React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "StarDarkIcon", iconSizes: iconSizes }, props),
|
|
2862
|
+
return (React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "StarDarkIcon", iconSizes: iconSizes$1 }, props),
|
|
2769
2863
|
React__default.default.createElement("g", { transform: "matrix(1,0,0,1,-126,0)" },
|
|
2770
2864
|
React__default.default.createElement("g", { id: "dark", transform: "matrix(0.357231,0,0,0.357231,124.961,0.10718)" },
|
|
2771
2865
|
React__default.default.createElement("rect", { x: "4.308", y: "-0.3", width: "279.931", height: "279.931", style: { fill: 'none' } }),
|
|
@@ -2867,6 +2961,21 @@ function DesignIcon(_a) {
|
|
|
2867
2961
|
React__default.default.createElement("path", { fill: color, d: "m16.239 11.51 1.57-1.57-3.75-3.75-1.57 1.57-4.14-4.13c-.78-.78-2.05-.78-2.83 0l-1.9 1.9c-.78.78-.78 2.05 0 2.83l4.13 4.13-4.6 4.61c-.1.1-.15.22-.15.36v3.04c0 .28.22.5.5.5h3.04c.13 0 .26-.05.35-.15l4.62-4.62 4.13 4.13c1.32 1.32 2.76.07 2.83 0l1.9-1.9c.78-.78.78-2.05 0-2.83l-4.13-4.12Zm-7.06-.44-4.14-4.13 1.89-1.9 1.27 1.27-.47.49a.996.996 0 1 0 1.41 1.41l.48-.48 1.45 1.45-1.89 1.89Zm7.88 7.89-4.13-4.13 1.9-1.9 1.45 1.45-.48.48a.996.996 0 1 0 1.41 1.41l.48-.48 1.27 1.27-1.9 1.9ZM20.709 7.04a.996.996 0 0 0 0-1.41l-2.34-2.34c-.47-.47-1.12-.29-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83Z" }));
|
|
2868
2962
|
}
|
|
2869
2963
|
|
|
2964
|
+
var iconSizes = iconSize;
|
|
2965
|
+
function ResizableIcon(_a) {
|
|
2966
|
+
var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.altText, altText = _c === void 0 ? "Resizable Icon" : _c, props = __rest(_a, ["color", "altText"]);
|
|
2967
|
+
var size = iconSizes[props.size || "medium"];
|
|
2968
|
+
var clipId = _.uniqueId('ResizableIcon');
|
|
2969
|
+
return (React__default.default.createElement(SVG$1, __assign({ "aria-labelledby": "ResizableIcon" }, props, { size: props.size || "medium" }),
|
|
2970
|
+
React__default.default.createElement("title", { id: "ResizableIcon" }, altText),
|
|
2971
|
+
React__default.default.createElement("g", { "clip-path": "url(#".concat(clipId, ")") },
|
|
2972
|
+
React__default.default.createElement("path", { d: "M16.24 11.5094L17.81 9.93944L14.06 6.18944L12.49 7.75944L8.35 3.62944C7.57 2.84944 6.3 2.84944 5.52 3.62944L3.62 5.52944C2.84 6.30944 2.84 7.57944 3.62 8.35944L7.75 12.4894L3.15 17.0994C3.05 17.1994 3 17.3194 3 17.4594V20.4994C3 20.7794 3.22 20.9994 3.5 20.9994H6.54C6.67 20.9994 6.8 20.9494 6.89 20.8494L11.51 16.2294L15.64 20.3594C16.96 21.6794 18.4 20.4294 18.47 20.3594L20.37 18.4594C21.15 17.6794 21.15 16.4094 20.37 15.6294L16.24 11.5094ZM9.18 11.0694L5.04 6.93944L6.93 5.03944L8.2 6.30944L7.73 6.79944C7.34 7.18944 7.34 7.81944 7.73 8.20944C8.12 8.59944 8.75 8.59944 9.14 8.20944L9.62 7.72944L11.07 9.17944L9.18 11.0694ZM17.06 18.9594L12.93 14.8294L14.83 12.9294L16.28 14.3794L15.8 14.8594C15.41 15.2494 15.41 15.8794 15.8 16.2694C16.19 16.6594 16.82 16.6594 17.21 16.2694L17.69 15.7894L18.96 17.0594L17.06 18.9594Z", fill: color }),
|
|
2973
|
+
React__default.default.createElement("path", { d: "M20.71 7.03944C21.1 6.64944 21.1 6.01944 20.71 5.62944L18.37 3.28944C17.9 2.81944 17.25 2.99944 16.96 3.28944L15.13 5.11944L18.88 8.86944L20.71 7.03944Z", fill: color })),
|
|
2974
|
+
React__default.default.createElement("defs", null,
|
|
2975
|
+
React__default.default.createElement("clipPath", { id: clipId },
|
|
2976
|
+
React__default.default.createElement("rect", { width: size.width, height: size.height, fill: "white" })))));
|
|
2977
|
+
}
|
|
2978
|
+
|
|
2870
2979
|
var avatarSizes = {
|
|
2871
2980
|
tiny: {
|
|
2872
2981
|
size: '24px',
|
|
@@ -2917,7 +3026,7 @@ var avatarColors = {
|
|
|
2917
3026
|
};
|
|
2918
3027
|
var AvatarWrapper = styled__default.default.div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n &&& {\n display: inline-block;\n vertical-align: top;\n overflow: hidden;\n margin: 0;\n ", "\n\n width: ", ";\n height: ", ";\n border-radius: ", ";\n text-align: center;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: inline-block;\n vertical-align: top;\n overflow: hidden;\n margin: 0;\n ", "\n\n width: ", ";\n height: ", ";\n border-radius: ", ";\n text-align: center;\n ", "\n ", "\n }\n"])), SharedStyles, function (props) { return props.size; }, function (props) { return props.size; }, function (props) { return props.shape; }, function (props) { var _a; return props.hasPic ? '' : "background: ".concat(_.get(avatarColors, [(_a = props.color) !== null && _a !== void 0 ? _a : 'teal', 'backgroundColor'], props.color), ";"); }, function (props) { var _a; return props.hasPic ? '' : "color: ".concat(_.get(avatarColors, [(_a = props.color) !== null && _a !== void 0 ? _a : 'teal', 'textColor'], props.color), ";"); });
|
|
2919
3028
|
var AvatarPic = styled__default.default.img(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n &&& {\n width: 100%;\n height: 100%;\n }\n"], ["\n &&& {\n width: 100%;\n height: 100%;\n }\n"])));
|
|
2920
|
-
var AvatarInitials = styled__default.default.p(templateObject_3$
|
|
3029
|
+
var AvatarInitials = styled__default.default.p(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n &&& {\n margin: 0;\n position: relative;\n top: 50%;\n transform: translate(0, -50%);\n font-family: 'skufont-bold', sans-serif;\n font-size: ", "\n"], ["\n &&& {\n margin: 0;\n position: relative;\n top: 50%;\n transform: translate(0, -50%);\n font-family: 'skufont-bold', sans-serif;\n font-size: ", "\n"])), function (props) { var _a; return _.get(avatarSizes, [(_a = props.size) !== null && _a !== void 0 ? _a : 'small', 'fontSize'], props.size); });
|
|
2921
3030
|
var Avatar = function (_a) {
|
|
2922
3031
|
var pic = _a.pic, _b = _a.size, size = _b === void 0 ? 'small' : _b, _c = _a.shape, shape = _c === void 0 ? 'square' : _c, color = _a.color, initials = _a.initials, icon = _a.icon, children = _a.children, props = __rest(_a, ["pic", "size", "shape", "color", "initials", "icon", "children"]);
|
|
2923
3032
|
if (pic) {
|
|
@@ -2933,7 +3042,7 @@ var Avatar = function (_a) {
|
|
|
2933
3042
|
React__default.default.createElement(AvatarInitials, { size: size }, initials !== null && initials !== void 0 ? initials : children));
|
|
2934
3043
|
}
|
|
2935
3044
|
};
|
|
2936
|
-
var templateObject_1$R, templateObject_2$v, templateObject_3$
|
|
3045
|
+
var templateObject_1$R, templateObject_2$v, templateObject_3$k;
|
|
2937
3046
|
|
|
2938
3047
|
var getTotalCols = function (p) { return p.totalCols || 12; };
|
|
2939
3048
|
var SizerCss = styled.css(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n ", "\n ", "\n ", "\n\n ", "\n ", ";\n ", "\n"], ["\n ", "\n ", "\n ", "\n\n ", "\n ", ";\n ", "\n"])), function (props) { return props.start ? "\n justify-content: flex-start;\n text-align: left;\n " : ''; }, function (props) { return props.center ? "\n justify-content: center;\n text-align: center;\n " : ''; }, function (props) { return props.end ? "\n justify-content: flex-end;\n text-align: right;\n " : ''; }, function (props) { return props.offset && "margin-left: ".concat(props.offset / getTotalCols(props) * 100, "%;"); }, function (props) { return props.collapse && typeof (props.collapse) === 'string' && media[props.collapse]("\n display: none;\n "); }, function (props) {
|
|
@@ -2985,14 +3094,14 @@ var Row = styled__default.default.div(templateObject_1$P || (templateObject_1$P
|
|
|
2985
3094
|
var Col = styled__default.default.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n &&& {\n padding: ", ";\n flex: 12;\n flex-grow: 1;\n box-sizing: border-box;\n ", "\n ", "\n }\n"], ["\n &&& {\n padding: ", ";\n flex: 12;\n flex-grow: 1;\n box-sizing: border-box;\n ", "\n ", "\n }\n"])), function (props) { return props.padded ? '0.5rem' : 'initial'; }, SizerCss, SharedStyles);
|
|
2986
3095
|
var templateObject_1$P, templateObject_2$t;
|
|
2987
3096
|
|
|
2988
|
-
var headingStyle = styled.css(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n font-family: \"skufont-demibold\", sans-serif;\n color: ", ";\n font-weight: bold;\n"], ["\n font-family: \"skufont-demibold\", sans-serif;\n color: ", ";\n font-weight: bold;\n"])), function (props) { return getThemeColor(props, 'texttitle', colors.texttitle); });
|
|
3097
|
+
var headingStyle = styled.css(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n font-family: \"skufont-demibold\", sans-serif;\n color: ", ";\n font-weight: bold;\n"], ["\n font-family: \"skufont-demibold\", sans-serif;\n color: ", ";\n font-weight: bold;\n"])), function (props) { return getThemeColor(props, 'texttitle', colors$1.texttitle); });
|
|
2989
3098
|
var H1 = styled__default.default.h1(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n &&& {\n font-size: 30px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 30px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
|
|
2990
|
-
var H2 = styled__default.default.h2(templateObject_3$
|
|
2991
|
-
var H3 = styled__default.default.h3(templateObject_4$
|
|
3099
|
+
var H2 = styled__default.default.h2(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
|
|
3100
|
+
var H3 = styled__default.default.h3(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
|
|
2992
3101
|
var H4 = styled__default.default.h4(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n &&& {\n font-size: 23px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 23px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
|
|
2993
3102
|
var H5 = styled__default.default.h5(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n &&& {\n font-size: 20px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 20px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
|
|
2994
3103
|
var H6 = styled__default.default.h6(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n &&& {\n font-size: 18px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 18px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
|
|
2995
|
-
var templateObject_1$O, templateObject_2$s, templateObject_3$
|
|
3104
|
+
var templateObject_1$O, templateObject_2$s, templateObject_3$j, templateObject_4$e, templateObject_5$9, templateObject_6$9, templateObject_7$3;
|
|
2996
3105
|
|
|
2997
3106
|
var StyledBox = styled__default.default.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n background: white;\n margin-top: 20px;\n box-shadow: ", ";\n border-radius: 5px;\n padding: 20px ", "px;\n ", "\n"], ["\n background: white;\n margin-top: 20px;\n box-shadow: ", ";\n border-radius: 5px;\n padding: 20px ", "px;\n ", "\n"])), function (props) { return props.borderless ? 0 : "0 2px 4px rgba(0, 0, 0, 0.07)"; }, function (props) { return props.padded ? 20 : 0; }, SharedStyles);
|
|
2998
3107
|
var Box = function (_a) {
|
|
@@ -3007,13 +3116,13 @@ var Box = function (_a) {
|
|
|
3007
3116
|
};
|
|
3008
3117
|
var templateObject_1$N;
|
|
3009
3118
|
|
|
3010
|
-
var Background = styled__default.default.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n &&& {\n background: ", ";\n padding: 20px ", "px;\n min-height: ", ";\n ", "\n }\n"], ["\n &&& {\n background: ", ";\n padding: 20px ", "px;\n min-height: ", ";\n ", "\n }\n"])), function (props) { return getThemeColor(props, 'bggray', colors.bggray); }, function (props) { return props.padded ? 20 : 0; }, function (props) { return props.fillWindow ? "100vh" : 0; }, SharedStyles);
|
|
3119
|
+
var Background = styled__default.default.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n &&& {\n background: ", ";\n padding: 20px ", "px;\n min-height: ", ";\n ", "\n }\n"], ["\n &&& {\n background: ", ";\n padding: 20px ", "px;\n min-height: ", ";\n ", "\n }\n"])), function (props) { return getThemeColor(props, 'bggray', colors$1.bggray); }, function (props) { return props.padded ? 20 : 0; }, function (props) { return props.fillWindow ? "100vh" : 0; }, SharedStyles);
|
|
3011
3120
|
var templateObject_1$M;
|
|
3012
3121
|
|
|
3013
|
-
var StyledDropArea = styled__default.default.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n &&& {\n padding: 20px;\n border: 2px dashed ", "; \n cursor: pointer;\n border-radius: 5px;\n &:hover {\n background-color: ", ";\n }\n border-color: ", ";\n outline: none;\n transition: border .24s ease-in-out;\n width: 100%;\n ", "\n }\n"], ["\n &&& {\n padding: 20px;\n border: 2px dashed ", "; \n cursor: pointer;\n border-radius: 5px;\n &:hover {\n background-color: ", ";\n }\n border-color: ", ";\n outline: none;\n transition: border .24s ease-in-out;\n width: 100%;\n ", "\n }\n"])), function (props) { return getThemeColor(props, 'primary', colors.primary); }, function (props) { return getThemeColor(props, 'bgblue', colors.bgblue); }, function (props) { return getColor(props); }, SharedStyles);
|
|
3014
|
-
var PlaceHolder = styled__default.default.label(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n &&& {\n color: ", ";\n text-align: center;\n width: 100%;\n display: block;\n }\n"], ["\n &&& {\n color: ", ";\n text-align: center;\n width: 100%;\n display: block;\n }\n"])), function (props) { return getThemeColor(props, 'primary', colors.primary); });
|
|
3015
|
-
var ThumbsContainer = styled__default.default.aside(templateObject_3$
|
|
3016
|
-
var Thumb = styled__default.default.div(templateObject_4$
|
|
3122
|
+
var StyledDropArea = styled__default.default.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n &&& {\n padding: 20px;\n border: 2px dashed ", "; \n cursor: pointer;\n border-radius: 5px;\n &:hover {\n background-color: ", ";\n }\n border-color: ", ";\n outline: none;\n transition: border .24s ease-in-out;\n width: 100%;\n ", "\n }\n"], ["\n &&& {\n padding: 20px;\n border: 2px dashed ", "; \n cursor: pointer;\n border-radius: 5px;\n &:hover {\n background-color: ", ";\n }\n border-color: ", ";\n outline: none;\n transition: border .24s ease-in-out;\n width: 100%;\n ", "\n }\n"])), function (props) { return getThemeColor(props, 'primary', colors$1.primary); }, function (props) { return getThemeColor(props, 'bgblue', colors$1.bgblue); }, function (props) { return getColor(props); }, SharedStyles);
|
|
3123
|
+
var PlaceHolder = styled__default.default.label(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n &&& {\n color: ", ";\n text-align: center;\n width: 100%;\n display: block;\n }\n"], ["\n &&& {\n color: ", ";\n text-align: center;\n width: 100%;\n display: block;\n }\n"])), function (props) { return getThemeColor(props, 'primary', colors$1.primary); });
|
|
3124
|
+
var ThumbsContainer = styled__default.default.aside(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n &&& {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n margin-top: 16px;\n }\n"], ["\n &&& {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n margin-top: 16px;\n }\n"])));
|
|
3125
|
+
var Thumb = styled__default.default.div(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n &&& {\n display: inline-flex;\n border-radius: 2px;\n border: 1px solid #eaeaea ", ";\n margin-bottom: 8px;\n margin-right: 8px;\n width: 100px;\n height: 100px;\n padding: 4px;\n box-sizing: border-box;\n }\n"], ["\n &&& {\n display: inline-flex;\n border-radius: 2px;\n border: 1px solid #eaeaea ", ";\n margin-bottom: 8px;\n margin-right: 8px;\n width: 100px;\n height: 100px;\n padding: 4px;\n box-sizing: border-box;\n }\n"])), function (props) { return getThemeColor(props, 'bggray', colors$1.bggray); });
|
|
3017
3126
|
var ThumbInner = styled__default.default.div(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n &&& {\n display: flex;\n min-width: 0px;\n overflow: hidden;\n }\n"], ["\n &&& {\n display: flex;\n min-width: 0px;\n overflow: hidden;\n }\n"])));
|
|
3018
3127
|
var ImgPreview = styled__default.default.img(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n &&& {\n display: block;\n width: auto;\n height: 100%;\n }\n"], ["\n &&& {\n display: block;\n width: auto;\n height: 100%;\n }\n"])));
|
|
3019
3128
|
var DropArea = function (_a) {
|
|
@@ -3072,7 +3181,7 @@ function DropzonedPreviews(_a) {
|
|
|
3072
3181
|
? React__default.default.createElement(ThumbsContainer, null, thumbs)
|
|
3073
3182
|
: React__default.default.createElement(PlaceHolder, null, placeholder))));
|
|
3074
3183
|
}
|
|
3075
|
-
var templateObject_1$L, templateObject_2$r, templateObject_3$
|
|
3184
|
+
var templateObject_1$L, templateObject_2$r, templateObject_3$i, templateObject_4$d, templateObject_5$8, templateObject_6$8;
|
|
3076
3185
|
|
|
3077
3186
|
/*
|
|
3078
3187
|
|
|
@@ -3150,18 +3259,18 @@ var getSizeStyle$1 = function (style, defaults) {
|
|
|
3150
3259
|
};
|
|
3151
3260
|
};
|
|
3152
3261
|
var getVariantStyles = function (props, variant) {
|
|
3153
|
-
var white = getThemeColor(props, 'neutrals.white', colors.neutrals.white);
|
|
3154
|
-
var disabled = getThemeColor(props, 'neutrals.50', colors.errors['50']);
|
|
3155
|
-
var disabledText = getThemeColor(props, 'neutrals.70', colors.errors['70']);
|
|
3156
|
-
var primary = getThemeColor(props, 'primary1.main', colors.primary1.main);
|
|
3157
|
-
var primaryDark = getThemeColor(props, 'primary1.75', colors.primary1['75']);
|
|
3158
|
-
var primaryLight = getThemeColor(props, 'primary1.20', colors.primary1['20']);
|
|
3159
|
-
var cta = getThemeColor(props, 'secondary1.main', colors.secondary1.main);
|
|
3160
|
-
var ctaDark = getThemeColor(props, 'secondary1.80', colors.secondary1['80']);
|
|
3262
|
+
var white = getThemeColor(props, 'neutrals.white', colors$1.neutrals.white);
|
|
3263
|
+
var disabled = getThemeColor(props, 'neutrals.50', colors$1.errors['50']);
|
|
3264
|
+
var disabledText = getThemeColor(props, 'neutrals.70', colors$1.errors['70']);
|
|
3265
|
+
var primary = getThemeColor(props, 'primary1.main', colors$1.primary1.main);
|
|
3266
|
+
var primaryDark = getThemeColor(props, 'primary1.75', colors$1.primary1['75']);
|
|
3267
|
+
var primaryLight = getThemeColor(props, 'primary1.20', colors$1.primary1['20']);
|
|
3268
|
+
var cta = getThemeColor(props, 'secondary1.main', colors$1.secondary1.main);
|
|
3269
|
+
var ctaDark = getThemeColor(props, 'secondary1.80', colors$1.secondary1['80']);
|
|
3161
3270
|
// const ctaLight = getThemeColor(props, 'secondary1.20', colors.secondary1['20']);
|
|
3162
|
-
var error = getThemeColor(props, 'errors.main', colors.errors.main);
|
|
3163
|
-
var errorLight = getThemeColor(props, 'errors.10', colors.errors['10']);
|
|
3164
|
-
var errorDark = getThemeColor(props, 'errors.70', colors.errors['70']);
|
|
3271
|
+
var error = getThemeColor(props, 'errors.main', colors$1.errors.main);
|
|
3272
|
+
var errorLight = getThemeColor(props, 'errors.10', colors$1.errors['10']);
|
|
3273
|
+
var errorDark = getThemeColor(props, 'errors.70', colors$1.errors['70']);
|
|
3165
3274
|
var customColor = props.variantColor || white;
|
|
3166
3275
|
var customBorderColor = props.variantBorderColor;
|
|
3167
3276
|
var customBg = props.variantBg;
|
|
@@ -3371,12 +3480,12 @@ var getVariantStyles = function (props, variant) {
|
|
|
3371
3480
|
var Button = styled__default.default.button(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n &&& {\n border: 3px solid white;\n border-radius: ", ";\n background: ", ";\n color: ", ";\n border-color: ", ";\n font-size: ", ";\n line-height: ", ";\n padding: ", ";\n font-family: ", ";\n cursor: pointer;\n vertical-align: top;\n /*\n &:focus {\n outline: none;\n opacity: .9;\n box-shadow: 0 0 8px ", ";\n }\n */\n &:disabled {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n cursor: default;\n opacity: 0.5;\n ", "\n }\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 3px solid white;\n border-radius: ", ";\n background: ", ";\n color: ", ";\n border-color: ", ";\n font-size: ", ";\n line-height: ", ";\n padding: ", ";\n font-family: ", ";\n cursor: pointer;\n vertical-align: top;\n /*\n &:focus {\n outline: none;\n opacity: .9;\n box-shadow: 0 0 8px ", ";\n }\n */\n &:disabled {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n cursor: default;\n opacity: 0.5;\n ", "\n }\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.size && sizes[props.size] ? sizes[props.size].borderRadius : '4px'; }, function (_a) {
|
|
3372
3481
|
var secondary = _a.secondary, cta = _a.cta, props = __rest(_a, ["secondary", "cta"]);
|
|
3373
3482
|
return secondary ? "transparent" :
|
|
3374
|
-
cta ? getThemeColor(props, 'cta', colors.cta) : getThemeColor(props, 'primary', colors.teal.main);
|
|
3375
|
-
}, function (props) { return props.secondary ? getThemeColor(props, 'primary', colors.primary) : "white"; }, function (props) { return props.cta ? getThemeColor(props, 'cta', colors.cta) : getThemeColor(props, 'primary', colors.teal.main); }, getSizeStyle$1('font-size', '1rem'), getSizeStyle$1('line-height', '1.5rem'), function (p) { return getSizeStyle$1('padding', '12px 25px'); }, getSizeStyle$1('font-family', "'skufont-demibold', sans-serif"), function (_a) {
|
|
3483
|
+
cta ? getThemeColor(props, 'cta', colors$1.cta) : getThemeColor(props, 'primary', colors$1.teal.main);
|
|
3484
|
+
}, function (props) { return props.secondary ? getThemeColor(props, 'primary', colors$1.primary) : "white"; }, function (props) { return props.cta ? getThemeColor(props, 'cta', colors$1.cta) : getThemeColor(props, 'primary', colors$1.teal.main); }, getSizeStyle$1('font-size', '1rem'), getSizeStyle$1('line-height', '1.5rem'), function (p) { return getSizeStyle$1('padding', '12px 25px'); }, getSizeStyle$1('font-family', "'skufont-demibold', sans-serif"), function (_a) {
|
|
3376
3485
|
var secondary = _a.secondary, cta = _a.cta, props = __rest(_a, ["secondary", "cta"]);
|
|
3377
|
-
return secondary ? getThemeColor(props, 'primary', colors.primary) :
|
|
3378
|
-
cta ? getThemeColor(props, 'cta', colors.cta) : getThemeColor(props, 'primary', colors.primary);
|
|
3379
|
-
}, function (props) { return getThemeColor(props, 'disabledButton', colors.disabledButton); }, function (props) { return getThemeColor(props, 'disabledButtonBorder', colors.disabledButtonBorder); }, function (props) { return getThemeColor(props, 'primary', colors.primary); }, function (p) { return getVariantStyles(p, 'disabled'); }, function (p) { var _a; return getVariantStyles(p, p.disabled ? 'disabled' : ((_a = p.variant) !== null && _a !== void 0 ? _a : (p.secondary ? 'secondary' : (p.cta ? 'cta' : 'primary')))); }, SharedStyles, SizerCss);
|
|
3486
|
+
return secondary ? getThemeColor(props, 'primary', colors$1.primary) :
|
|
3487
|
+
cta ? getThemeColor(props, 'cta', colors$1.cta) : getThemeColor(props, 'primary', colors$1.primary);
|
|
3488
|
+
}, function (props) { return getThemeColor(props, 'disabledButton', colors$1.disabledButton); }, function (props) { return getThemeColor(props, 'disabledButtonBorder', colors$1.disabledButtonBorder); }, function (props) { return getThemeColor(props, 'primary', colors$1.primary); }, function (p) { return getVariantStyles(p, 'disabled'); }, function (p) { var _a; return getVariantStyles(p, p.disabled ? 'disabled' : ((_a = p.variant) !== null && _a !== void 0 ? _a : (p.secondary ? 'secondary' : (p.cta ? 'cta' : 'primary')))); }, SharedStyles, SizerCss);
|
|
3380
3489
|
var ButtonsGroup = styled__default.default.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n &&& {\n display: inline-block;\n max-width: 100%;\n margin-bottom: 10px;\n margin-right: 100px;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: inline-block;\n max-width: 100%;\n margin-bottom: 10px;\n margin-right: 100px;\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
|
|
3381
3490
|
var presets = {
|
|
3382
3491
|
edit: {
|
|
@@ -3527,8 +3636,8 @@ var templateObject_1$J;
|
|
|
3527
3636
|
|
|
3528
3637
|
var InputIconLabel = styled__default.default.div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n&&& {\n box-sizing: border-box;\n width: 40px;\n height: ", "px;\n background-color: ", ";\n border-radius: ", ";\n margin-bottom: 1rem;\n color: white;\n font-size: 18px;\n text-align: center;\n line-height: 1.5rem;\n padding: 6px;\n\n :hover {\n background: ", ";\n }\n\n ", "\n\n ", "\n\n ", "\n}\n"], ["\n&&& {\n box-sizing: border-box;\n width: 40px;\n height: ", "px;\n background-color: ", ";\n border-radius: ", ";\n margin-bottom: 1rem;\n color: white;\n font-size: 18px;\n text-align: center;\n line-height: 1.5rem;\n padding: 6px;\n\n :hover {\n background: ", ";\n }\n\n ", "\n\n ", "\n\n ", "\n}\n"])), function (p) { return p.error ? 38 : 36; }, function (p) {
|
|
3529
3638
|
return p.error
|
|
3530
|
-
? getThemeColor(p, 'errors.main', colors.errors.main)
|
|
3531
|
-
: getThemeColor(p, 'input.iconWrapper.background', colors.input.iconWrapper.background);
|
|
3639
|
+
? getThemeColor(p, 'errors.main', colors$1.errors.main)
|
|
3640
|
+
: getThemeColor(p, 'input.iconWrapper.background', colors$1.input.iconWrapper.background);
|
|
3532
3641
|
}, function (p) { return p.iconPosition === 'right' ? '0 3px 3px 0' : '3px 0 0 3px'; }, function (p) { return getThemeColor(p, 'input.iconWrapper.hover.background'); }, function (p) { return p.isHover
|
|
3533
3642
|
? "background: ".concat(getThemeColor(p, 'input.iconWrapper.hover.background'), ";")
|
|
3534
3643
|
: ''; }, function (p) { return p.isActive
|
|
@@ -3553,7 +3662,7 @@ var InputIconLabelContainer = styled__default.default.div(templateObject_2$p ||
|
|
|
3553
3662
|
},
|
|
3554
3663
|
};
|
|
3555
3664
|
});
|
|
3556
|
-
var Input = styled__default.default.input(templateObject_3$
|
|
3665
|
+
var Input = styled__default.default.input(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n &&& {\n ", "\n }\n ", "\n"], ["\n &&& {\n ", "\n }\n ", "\n"])), function (p) {
|
|
3557
3666
|
var styles = {
|
|
3558
3667
|
marginBottom: p.noMargin ? 0 : "1rem",
|
|
3559
3668
|
fontSize: '1rem',
|
|
@@ -3623,11 +3732,11 @@ var LabeledIconInput = React__default.default.forwardRef(function (_a, ref) {
|
|
|
3623
3732
|
var containerRef = React.useRef(null);
|
|
3624
3733
|
var _g = React.useState(false), isActive = _g[0], setIsActive = _g[1];
|
|
3625
3734
|
var _h = React.useState(false), isHovering = _h[0], setIsHovering = _h[1];
|
|
3626
|
-
var activeBorderColor = getThemeColor(props, 'input.active.border', colors.input.active.border);
|
|
3627
|
-
var activeTextColor = colors.input.active.text;
|
|
3628
|
-
var errorBorderColor = getThemeColor(props, 'input.error.border', colors.input.error.border);
|
|
3629
|
-
var disabledBackground = colors.input.disabled.background;
|
|
3630
|
-
var disabledTextColor = colors.input.disabled.text;
|
|
3735
|
+
var activeBorderColor = getThemeColor(props, 'input.active.border', colors$1.input.active.border);
|
|
3736
|
+
var activeTextColor = colors$1.input.active.text;
|
|
3737
|
+
var errorBorderColor = getThemeColor(props, 'input.error.border', colors$1.input.error.border);
|
|
3738
|
+
var disabledBackground = colors$1.input.disabled.background;
|
|
3739
|
+
var disabledTextColor = colors$1.input.disabled.text;
|
|
3631
3740
|
var activeStyles = !isActive ? {} : {
|
|
3632
3741
|
borderColor: error ? errorBorderColor : activeBorderColor,
|
|
3633
3742
|
color: getThemeColor(props, 'input.active.text', activeTextColor),
|
|
@@ -3655,16 +3764,16 @@ var LabeledIconInput = React__default.default.forwardRef(function (_a, ref) {
|
|
|
3655
3764
|
iconProps['color'] = errorBorderColor;
|
|
3656
3765
|
}
|
|
3657
3766
|
else if (disabled) {
|
|
3658
|
-
iconProps['fill'] = colors.input.icon.disabled.fill;
|
|
3659
|
-
iconProps['color'] = colors.input.icon.disabled.fill;
|
|
3767
|
+
iconProps['fill'] = colors$1.input.icon.disabled.fill;
|
|
3768
|
+
iconProps['color'] = colors$1.input.icon.disabled.fill;
|
|
3660
3769
|
}
|
|
3661
3770
|
else if (isHovering) {
|
|
3662
|
-
iconProps['fill'] = colors.input.icon.hover.fill;
|
|
3663
|
-
iconProps['color'] = colors.input.icon.hover.fill;
|
|
3771
|
+
iconProps['fill'] = colors$1.input.icon.hover.fill;
|
|
3772
|
+
iconProps['color'] = colors$1.input.icon.hover.fill;
|
|
3664
3773
|
}
|
|
3665
3774
|
else if (isActive) {
|
|
3666
|
-
iconProps['fill'] = colors.input.icon.active.fill;
|
|
3667
|
-
iconProps['color'] = colors.input.icon.active.fill;
|
|
3775
|
+
iconProps['fill'] = colors$1.input.icon.active.fill;
|
|
3776
|
+
iconProps['color'] = colors$1.input.icon.active.fill;
|
|
3668
3777
|
}
|
|
3669
3778
|
return React__default.default.cloneElement(Icon, iconProps);
|
|
3670
3779
|
}, [Icon, error, disabled, errorBorderColor, isActive, isHovering, iconColor]);
|
|
@@ -3694,7 +3803,7 @@ var LabeledIconInput = React__default.default.forwardRef(function (_a, ref) {
|
|
|
3694
3803
|
React__default.default.createElement(Input, { hasIcon: true, ref: ref, name: name, value: value, defaultValue: defaultValue, placeholder: placeholder, readOnly: readOnly, required: required, style: { marginBottom: 0, }, noMargin: noMargin, error: error, disabled: disabled, onFocus: onFocus, onChange: onChange, onBlur: onBlur }),
|
|
3695
3804
|
iconPosition === 'right' ? React__default.default.createElement(InputIconLabel, { style: __assign({ marginBottom: 0, padding: 6 }, iconLabelStyles), isActive: isActive, isDisabled: disabled, isHover: isHovering, iconPosition: iconPosition }, NewIcon) : null)));
|
|
3696
3805
|
});
|
|
3697
|
-
var CheckboxLabel = styled__default.default.label(templateObject_4$
|
|
3806
|
+
var CheckboxLabel = styled__default.default.label(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n &&& {\n display: inline-flex;\n position: relative;\n margin-bottom: 12px;\n margin-right: 24px;\n cursor: ", ";\n font-size: ", ";\n color: ", ";\n font-family: ", ";\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n font-weight: normal;\n line-height: ", ";\n box-sizing: border-box;\n opacity: ", ";\n &:focus {\n outline: 0;\n }\n }\n"], ["\n &&& {\n display: inline-flex;\n position: relative;\n margin-bottom: 12px;\n margin-right: 24px;\n cursor: ", ";\n font-size: ", ";\n color: ", ";\n font-family: ", ";\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n font-weight: normal;\n line-height: ", ";\n box-sizing: border-box;\n opacity: ", ";\n &:focus {\n outline: 0;\n }\n }\n"])), function (props) { return props.disabled ? 'default' : 'pointer'; }, fontStyles.label.fontSize, neutrals.darkest, fontStyles.label.fontFamily, fontStyles.label.lineHeight, function (props) { return props.disabled ? 0.7 : 1; });
|
|
3698
3807
|
var RadioLabel = styled__default.default(CheckboxLabel)(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n &&& {\n padding-left: 32px;\n }\n"], ["\n &&& {\n padding-left: 32px;\n }\n"])));
|
|
3699
3808
|
var Radio = styled__default.default.input(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n &&& {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:checked {\n background-color: white;\n display: block;\n }\n &:hover {\n background-color: #02c0da;\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:checked {\n background-color: white;\n display: block;\n }\n &:hover {\n background-color: #02c0da;\n }\n ", "\n ", "\n }\n"])), function (props) { return props.isHovering && "background-color: #02c0da;"; }, SharedStyles);
|
|
3700
3809
|
var CheckMark = styled__default.default.span(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n height: 23px;\n width: 23px;\n background-color: ", ";\n opacity: ", ";\n filter: ", ";\n border: 2px solid #02c0da;\n border-radius: 4px;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:hover {\n background-color: ", ";\n }\n &::after {\n content: \"\";\n position: absolute;\n left: 9px;\n top: 5px;\n width: 5px;\n height: 10px;\n border: solid white;\n border-width: 0 3px 3px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n box-sizing: border-box;\n display: ", ";\n }\n ", "\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n height: 23px;\n width: 23px;\n background-color: ", ";\n opacity: ", ";\n filter: ", ";\n border: 2px solid #02c0da;\n border-radius: 4px;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:hover {\n background-color: ", ";\n }\n &::after {\n content: \"\";\n position: absolute;\n left: 9px;\n top: 5px;\n width: 5px;\n height: 10px;\n border: solid white;\n border-width: 0 3px 3px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n box-sizing: border-box;\n display: ", ";\n }\n ", "\n"])), function (props) { return ((props.isHovering || props.checked) && !props.disabled) ? '#02c0da' : 'white'; }, function (props) { return props.disabled ? 0.7 : 1; }, function (props) { return props.disabled ? "grayscale(100%)" : "none"; }, function (props) { return props.disabled ? "white" : "#02c0da"; }, function (props) { return props.checked ? 'block' : 'none'; }, SharedStyles);
|
|
@@ -3721,7 +3830,7 @@ var LabeledRadioInButton = function (_a) {
|
|
|
3721
3830
|
var label = _a.label; _a.name; var checked = _a.checked, disabled = _a.disabled, readOnly = _a.readOnly, defaultValue = _a.defaultValue; _a.labelStyle; _a.radioIconStyle; var flexGrow = _a.flexGrow, onChange = _a.onChange; __rest(_a, ["label", "name", "checked", "disabled", "readOnly", "defaultValue", "labelStyle", "radioIconStyle", "flexGrow", "onChange"]);
|
|
3722
3831
|
return (React__default.default.createElement(LabeledRadio, { label: label, checked: checked, disabled: disabled, onChange: onChange, readOnly: readOnly, defaultValue: defaultValue, labelStyle: {
|
|
3723
3832
|
padding: "13px 40px",
|
|
3724
|
-
backgroundColor: disabled ? neutrals['40'] : checked ? colors.white : teal['20'],
|
|
3833
|
+
backgroundColor: disabled ? neutrals['40'] : checked ? colors$1.white : teal['20'],
|
|
3725
3834
|
border: disabled ? "solid 3px ".concat(neutrals['40']) : checked ? "solid 3px ".concat(teal.main) : "solid 3px ".concat(teal['20']),
|
|
3726
3835
|
borderRadius: "200px",
|
|
3727
3836
|
color: disabled ? neutrals['70'] : teal.main,
|
|
@@ -3751,7 +3860,7 @@ var LabeledCheckbox = React__default.default.forwardRef(function (_a, ref) {
|
|
|
3751
3860
|
label,
|
|
3752
3861
|
React__default.default.createElement(Radio, __assign({ ref: ref, name: name, type: "checkbox", checked: checked, isHovering: isHovering, onChange: disabled ? undefined : onChange }, props))));
|
|
3753
3862
|
});
|
|
3754
|
-
var templateObject_1$I, templateObject_2$p, templateObject_3$
|
|
3863
|
+
var templateObject_1$I, templateObject_2$p, templateObject_3$h, templateObject_4$c, templateObject_5$7, templateObject_6$7, templateObject_7$2, templateObject_8$2;
|
|
3755
3864
|
|
|
3756
3865
|
var Padding = styled__default.default.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n padding: 20px;\n ", "\n"], ["\n padding: 20px;\n ", "\n"])), SharedStyles);
|
|
3757
3866
|
var templateObject_1$H;
|
|
@@ -3820,23 +3929,23 @@ function skuSelectStyles(props) {
|
|
|
3820
3929
|
return __assign(__assign({}, provided), props.containerStyles);
|
|
3821
3930
|
},
|
|
3822
3931
|
clearIndicator: function (provided, state) {
|
|
3823
|
-
return __assign(__assign(__assign({}, provided), { color: getThemeColor(props, 'select.clearIcon.color', colors.select.clearIcon.color), ':hover': {
|
|
3824
|
-
color: getThemeColor(props, 'select.clearIcon.color', colors.select.clearIcon.color),
|
|
3932
|
+
return __assign(__assign(__assign({}, provided), { color: getThemeColor(props, 'select.clearIcon.color', colors$1.select.clearIcon.color), ':hover': {
|
|
3933
|
+
color: getThemeColor(props, 'select.clearIcon.color', colors$1.select.clearIcon.color),
|
|
3825
3934
|
} }), props.clearIndicatorStyles);
|
|
3826
3935
|
},
|
|
3827
3936
|
dropdownIndicator: function (provided, state) {
|
|
3828
3937
|
var styles = {
|
|
3829
3938
|
color: props.error
|
|
3830
|
-
? getThemeColor(props, 'select.dropdownIcon.error.color', colors.select.dropdownIcon.error.color)
|
|
3831
|
-
: getThemeColor(props, 'select.dropdownIcon.color', colors.select.dropdownIcon.color),
|
|
3939
|
+
? getThemeColor(props, 'select.dropdownIcon.error.color', colors$1.select.dropdownIcon.error.color)
|
|
3940
|
+
: getThemeColor(props, 'select.dropdownIcon.color', colors$1.select.dropdownIcon.color),
|
|
3832
3941
|
':hover': {
|
|
3833
3942
|
color: props.error
|
|
3834
|
-
? getThemeColor(props, 'select.dropdownIcon.error.color', colors.select.dropdownIcon.error.color)
|
|
3835
|
-
: getThemeColor(props, 'select.dropdownIcon.color', colors.select.dropdownIcon.color),
|
|
3943
|
+
? getThemeColor(props, 'select.dropdownIcon.error.color', colors$1.select.dropdownIcon.error.color)
|
|
3944
|
+
: getThemeColor(props, 'select.dropdownIcon.color', colors$1.select.dropdownIcon.color),
|
|
3836
3945
|
},
|
|
3837
3946
|
};
|
|
3838
3947
|
if (state.isDisabled) {
|
|
3839
|
-
styles['color'] = getThemeColor(props, 'select.dropdownIcon.disabled', colors.select.dropdownIcon.disabled);
|
|
3948
|
+
styles['color'] = getThemeColor(props, 'select.dropdownIcon.disabled', colors$1.select.dropdownIcon.disabled);
|
|
3840
3949
|
}
|
|
3841
3950
|
return __assign(__assign(__assign({}, provided), styles), props.dropdownIndicatorStyles);
|
|
3842
3951
|
},
|
|
@@ -3846,8 +3955,8 @@ function skuSelectStyles(props) {
|
|
|
3846
3955
|
},
|
|
3847
3956
|
input: function (provided, state) {
|
|
3848
3957
|
return __assign(__assign(__assign({}, provided), { height: 'auto', borderColor: props.error
|
|
3849
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3850
|
-
: getThemeColor(props, 'select.border', colors.select.border) }), props.inputStyles);
|
|
3958
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3959
|
+
: getThemeColor(props, 'select.border', colors$1.select.border) }), props.inputStyles);
|
|
3851
3960
|
},
|
|
3852
3961
|
control: function (provided, state) {
|
|
3853
3962
|
var styles = {
|
|
@@ -3857,8 +3966,8 @@ function skuSelectStyles(props) {
|
|
|
3857
3966
|
styles['borderWidth'] = '1px';
|
|
3858
3967
|
styles['borderStyle'] = 'solid';
|
|
3859
3968
|
styles['borderColor'] = props.error
|
|
3860
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3861
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
3969
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3970
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3862
3971
|
styles['boxShadow'] = "\n 1px 1px 0px ".concat(styles['borderColor'], ",\n -1px -1px 0px ").concat(styles['borderColor'], ",\n 1px -1px 0px ").concat(styles['borderColor'], ",\n -1px 1px 0px ").concat(styles['borderColor'], "\n ");
|
|
3863
3972
|
if (state.selectProps.menuPlacement === 'bottom') {
|
|
3864
3973
|
styles['borderBottomRightRadius'] = 0;
|
|
@@ -3872,31 +3981,31 @@ function skuSelectStyles(props) {
|
|
|
3872
3981
|
else if (!state.menuIsOpen && state.isFocused) {
|
|
3873
3982
|
styles['borderWidth'] = '1px';
|
|
3874
3983
|
styles['borderColor'] = props.error
|
|
3875
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3876
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
3984
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3985
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3877
3986
|
styles['boxShadow'] = "0 0 0 1px ".concat(props.error
|
|
3878
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3879
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border));
|
|
3987
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3988
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border));
|
|
3880
3989
|
}
|
|
3881
3990
|
else if (state.isDisabled) {
|
|
3882
|
-
styles['backgroundColor'] = getThemeColor(props, 'select.disabled.background', colors.select.disabled.background);
|
|
3883
|
-
styles['borderColor'] = getThemeColor(props, 'select.disabled.border', colors.select.disabled.border);
|
|
3991
|
+
styles['backgroundColor'] = getThemeColor(props, 'select.disabled.background', colors$1.select.disabled.background);
|
|
3992
|
+
styles['borderColor'] = getThemeColor(props, 'select.disabled.border', colors$1.select.disabled.border);
|
|
3884
3993
|
}
|
|
3885
3994
|
else {
|
|
3886
3995
|
styles['borderColor'] = props.error
|
|
3887
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3996
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3888
3997
|
: provided.borderColor;
|
|
3889
3998
|
}
|
|
3890
3999
|
return (__assign(__assign(__assign(__assign({}, provided), styles), { ':hover': {
|
|
3891
4000
|
borderColor: props.error
|
|
3892
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3893
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border),
|
|
4001
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
4002
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border),
|
|
3894
4003
|
} }), props.controlStyles));
|
|
3895
4004
|
},
|
|
3896
4005
|
menu: function (provided, state) {
|
|
3897
4006
|
var borderColor = props.error
|
|
3898
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3899
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
4007
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
4008
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3900
4009
|
var styles = {
|
|
3901
4010
|
zIndex: 10,
|
|
3902
4011
|
position: props.menuRelative ? 'relative' : provided.position,
|
|
@@ -3938,7 +4047,7 @@ function skuSelectStyles(props) {
|
|
|
3938
4047
|
},
|
|
3939
4048
|
};
|
|
3940
4049
|
}
|
|
3941
|
-
var skuSelectThemeByProps = function (props) { return function (theme) { return (__assign(__assign({}, theme), { borderRadius: 5, colors: __assign(__assign({}, theme.colors), { primary25: getThemeColor(props, 'primary0', colors.primary0), primary75: getThemeColor(props, 'primary0', colors.primary0), primary50: getThemeColor(props, 'primary10', colors.primary10), primary: getThemeColor(props, 'primary', colors.primary), neutral20: getThemeColor(props, 'select.border', colors.select.border), neutral30: getThemeColor(props, 'select.border', colors.select.border), neutral80: getThemeColor(props, 'textbody', colors.textbody), neutral90: getThemeColor(props, 'textbody', colors.textbody) }) })); }; };
|
|
4050
|
+
var skuSelectThemeByProps = function (props) { return function (theme) { return (__assign(__assign({}, theme), { borderRadius: 5, colors: __assign(__assign({}, theme.colors), { primary25: getThemeColor(props, 'primary0', colors$1.primary0), primary75: getThemeColor(props, 'primary0', colors$1.primary0), primary50: getThemeColor(props, 'primary10', colors$1.primary10), primary: getThemeColor(props, 'primary', colors$1.primary), neutral20: getThemeColor(props, 'select.border', colors$1.select.border), neutral30: getThemeColor(props, 'select.border', colors$1.select.border), neutral80: getThemeColor(props, 'textbody', colors$1.textbody), neutral90: getThemeColor(props, 'textbody', colors$1.textbody) }) })); }; };
|
|
3942
4051
|
// duplicate styles to overide .resku global styles
|
|
3943
4052
|
// : React.ForwardRefExoticComponent<SKUSelectProps & React.RefAttributes<BaseSelect>>
|
|
3944
4053
|
// React.ForwardRefExoticComponent<AdditionalSKUSelectProps & Omit<Pick<Props<unknown, boolean, GroupBase<unknown>>, "aria-errormessage" | "aria-invalid" | "aria-label" | ... 27 more ... | "form"> & InexactPartial<...> & InexactPartial<...>, StateManagedPropKeys> & Partial<...> & StateManagerAdditionalProps<...> & React.RefAttributes<...>>
|
|
@@ -4045,8 +4154,8 @@ var SidePanel = function (_a) {
|
|
|
4045
4154
|
backdrop && visible ? React__default.default.createElement(Backdrop, null) : null);
|
|
4046
4155
|
};
|
|
4047
4156
|
var NameAndPosition = styled__default.default.div(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n display: inline-block;\n width: 90%;\n"], ["\n display: inline-block;\n width: 90%;\n"])));
|
|
4048
|
-
var Name = styled__default.default.div(templateObject_3$
|
|
4049
|
-
var Position = styled__default.default.div(templateObject_4$
|
|
4157
|
+
var Name = styled__default.default.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
4158
|
+
var Position = styled__default.default.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n font-size: .8em;\n"], ["\n font-size: .8em;\n"])));
|
|
4050
4159
|
var Email = styled__default.default.a(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n font-size: .8em;\n overflow-wrap: break-word;\n word-wrap: break-word;\n -ms-word-break: break-all;\n word-break: break-word;\n"], ["\n font-size: .8em;\n overflow-wrap: break-word;\n word-wrap: break-word;\n -ms-word-break: break-all;\n word-break: break-word;\n"])));
|
|
4051
4160
|
var Contact = styled__default.default.div(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n &&& {\n display: flex;\n flex-basis: 50%;\n margin-bottom: 15px;\n ", "\n }\n"], ["\n &&& {\n display: flex;\n flex-basis: 50%;\n margin-bottom: 15px;\n ", "\n }\n"])), SizerCss);
|
|
4052
4161
|
var PanelContact = function (_a) {
|
|
@@ -4083,12 +4192,12 @@ var PanelTileContact = function (_a) {
|
|
|
4083
4192
|
p.phone_extension && 'x' + p.phone_extension) : '';
|
|
4084
4193
|
}) : null)));
|
|
4085
4194
|
};
|
|
4086
|
-
var templateObject_1$C, templateObject_2$m, templateObject_3$
|
|
4195
|
+
var templateObject_1$C, templateObject_2$m, templateObject_3$g, templateObject_4$b, templateObject_5$6, templateObject_6$6;
|
|
4087
4196
|
|
|
4088
4197
|
var sharedStyle = styled.css(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n line-height: 1.125rem;\n box-sizing: border-box;\n"], ["\n line-height: 1.125rem;\n box-sizing: border-box;\n"])));
|
|
4089
4198
|
var optionalPadding = styled.css(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n &:first-child {\n padding-left: ", ";\n }\n\n &:last-child {\n padding-right: ", ";\n }\n"], ["\n &:first-child {\n padding-left: ", ";\n }\n\n &:last-child {\n padding-right: ", ";\n }\n"])), function (props) { return props.padded ? "20px" : "inherit"; }, function (props) { return props.padded ? "20px" : "inherit"; });
|
|
4090
|
-
var Table = styled__default.default.table.attrs(function () { return ({ cellPadding: 0, cellSpacing: 0 }); })(templateObject_3$
|
|
4091
|
-
var TH = styled__default.default.th(templateObject_4$
|
|
4199
|
+
var Table = styled__default.default.table.attrs(function () { return ({ cellPadding: 0, cellSpacing: 0 }); })(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n &&& {\n background-color: white;\n border: none;\n border-spacing: 0;\n width: 100%;\n table-layout: auto;\n display: table;\n font-family: 'skufont-regular', sans-serif;\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n background-color: white;\n border: none;\n border-spacing: 0;\n width: 100%;\n table-layout: auto;\n display: table;\n font-family: 'skufont-regular', sans-serif;\n ", "\n ", "\n ", "\n }\n"])), sharedStyle, SizerCss, SharedStyles);
|
|
4200
|
+
var TH = styled__default.default.th(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n &&& {\n background-color: #dae9ee;\n border: none;\n border-spacing: 0;\n color: ", ";\n font-size: 1rem;\n padding: 0.5rem 0.625rem 0.625rem;\n display: table-cell;\n text-align: left;\n font-family: \"skufont-demibold\", sans-serif;\n ", "\n &:hover {\n background-color: ", ";\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n background-color: #dae9ee;\n border: none;\n border-spacing: 0;\n color: ", ";\n font-size: 1rem;\n padding: 0.5rem 0.625rem 0.625rem;\n display: table-cell;\n text-align: left;\n font-family: \"skufont-demibold\", sans-serif;\n ", "\n &:hover {\n background-color: ", ";\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.clickable ? "#00889B" : "#123952"; }, function (props) { return props.sticky ? "position: sticky; top: ".concat(props.stickyTop ? props.stickyTop : 0, ";") : null; }, function (props) { return props.clickable ? "#d2e6ec" : "#dae9ee"; }, function (props) { return props.clickable ? "pointer" : "normal"; }, optionalPadding, sharedStyle, SizerCss, SharedStyles);
|
|
4092
4201
|
var TD$1 = styled__default.default.td(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n &&& {\n border: 0;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 0;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.clickable ? "pointer" : "normal"; }, optionalPadding, sharedStyle, SizerCss, SharedStyles);
|
|
4093
4202
|
var TR = styled__default.default.tr(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n &&& {\n ", "\n &:hover {\n background: #EDF2F4;\n }\n ", "\n }\n"], ["\n &&& {\n ", "\n &:hover {\n background: #EDF2F4;\n }\n ", "\n }\n"])), SizerCss, function (p) { return p.selected && 'background: #EDF2F4;'; });
|
|
4094
4203
|
var THead = styled__default.default.thead(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n &&& {\n ", "\n }\n"], ["\n &&& {\n ", "\n }\n"])), SizerCss);
|
|
@@ -4110,7 +4219,7 @@ var THSorted = function (_a) {
|
|
|
4110
4219
|
" ",
|
|
4111
4220
|
children));
|
|
4112
4221
|
};
|
|
4113
|
-
var templateObject_1$B, templateObject_2$l, templateObject_3$
|
|
4222
|
+
var templateObject_1$B, templateObject_2$l, templateObject_3$f, templateObject_4$a, templateObject_5$5, templateObject_6$5, templateObject_7$1, templateObject_8$1, templateObject_9$1;
|
|
4114
4223
|
|
|
4115
4224
|
var useClickOutside = function (props) {
|
|
4116
4225
|
var ref = props.ref, _a = props.eventType, eventType = _a === void 0 ? 'mousedown' : _a, onClick = props.onClick, onCleanup = props.onCleanup;
|
|
@@ -4365,8 +4474,8 @@ var useFallbackRef = function (forwardedRef) {
|
|
|
4365
4474
|
|
|
4366
4475
|
var Overlay = styled__default.default.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n &&& {\n position: fixed;\n top: 0px;\n bottom: 0px;\n left: 0px;\n right: 0px;\n background: rgba(42, 56, 63, 0.45);\n display: flex;\n z-index: ", ";\n margin-left: auto;\n margin-right: auto;\n }\n"], ["\n &&& {\n position: fixed;\n top: 0px;\n bottom: 0px;\n left: 0px;\n right: 0px;\n background: rgba(42, 56, 63, 0.45);\n display: flex;\n z-index: ", ";\n margin-left: auto;\n margin-right: auto;\n }\n"])), function (p) { return p.zIndex || 999; });
|
|
4367
4476
|
var PopupWindow = styled__default.default.div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n &&& {\n width: ", ";\n height: ", "; \n margin: 0 !important;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: fixed;\n ", "\n overflow-y: hidden;\n display: block;\n z-index: ", ";\n\n padding: ", ";\n border: 1px solid #CCD5DA;\n background-color: #fefefe;\n border-radius: 3px;\n\n &:last-child {\n margin-bottom: 0;\n }\n .popup-content {\n overflow-y: auto;\n height: 90%;\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n width: ", ";\n height: ", "; \n margin: 0 !important;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: fixed;\n ", "\n overflow-y: hidden;\n display: block;\n z-index: ", ";\n\n padding: ", ";\n border: 1px solid #CCD5DA;\n background-color: #fefefe;\n border-radius: 3px;\n\n &:last-child {\n margin-bottom: 0;\n }\n .popup-content {\n overflow-y: auto;\n height: 90%;\n }\n ", "\n ", "\n }\n"])), function (props) { var _a; return (_a = props.width) !== null && _a !== void 0 ? _a : '90%'; }, function (props) { var _a; return (_a = props.height) !== null && _a !== void 0 ? _a : '75%'; }, function (props) { return props.height ? '' : 'max-height: 700px;'; }, function (p) { return p.zIndex || 1006; }, function (props) { var _a; return (_a = props.padding) !== null && _a !== void 0 ? _a : '1rem'; }, SharedStyles, SizerCss);
|
|
4368
|
-
var PopupHeader = styled__default.default.div(templateObject_3$
|
|
4369
|
-
var ChevronButton = styled__default.default(ChevronIcon)(templateObject_4$
|
|
4477
|
+
var PopupHeader = styled__default.default.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n &&& {\n position: sticky;\n top: 0;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n background: white;\n padding: 3px;\n z-index: 99;\n .title {\n font-size: 1.8rem;\n font-weight: 500;\n text-align: left;\n align-self: center;\n padding-top: 3px;\n padding-left: 3px;\n border-bottom: none;\n font-family: \"skufont-demibold\",sans-serif;\n color: #123952;\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n position: sticky;\n top: 0;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n background: white;\n padding: 3px;\n z-index: 99;\n .title {\n font-size: 1.8rem;\n font-weight: 500;\n text-align: left;\n align-self: center;\n padding-top: 3px;\n padding-left: 3px;\n border-bottom: none;\n font-family: \"skufont-demibold\",sans-serif;\n color: #123952;\n }\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
|
|
4478
|
+
var ChevronButton = styled__default.default(ChevronIcon)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n && {\n position: absolute;\n width: 120px;\n height: 120px;\n ", "\n top: calc(50% - 120px/2 + 22.5px);\n }\n"], ["\n && {\n position: absolute;\n width: 120px;\n height: 120px;\n ", "\n top: calc(50% - 120px/2 + 22.5px);\n }\n"])), function (props) { return props.left ? 'left: 0px;' : 'right: 0px;'; });
|
|
4370
4479
|
var PopupContainer = function (_a) {
|
|
4371
4480
|
var children = _a.children;
|
|
4372
4481
|
var ref = React__default.default.useRef(document$1.createElement('div'));
|
|
@@ -4439,12 +4548,12 @@ var ChevronPopupWindow = React__default.default.forwardRef(function (props, ref)
|
|
|
4439
4548
|
var ChevronPopup = function (props) {
|
|
4440
4549
|
return React__default.default.createElement(Popup, __assign({ PopupWindowComponent: ChevronPopupWindow }, props));
|
|
4441
4550
|
};
|
|
4442
|
-
var templateObject_1$A, templateObject_2$k, templateObject_3$
|
|
4551
|
+
var templateObject_1$A, templateObject_2$k, templateObject_3$e, templateObject_4$9;
|
|
4443
4552
|
|
|
4444
4553
|
var GridTableContainer = styled__default.default.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n display:grid;\n grid-template-rows: ", ";\n grid-gap: ", ";\n width:", ";\n margin-top: 24px;\n margin-bottom: 24px;\n background: white;\n overflow: scroll;\n .droppable {\n display:grid;\n grid-template-rows: ", ";\n grid-gap: ", ";\n }\n ", "\n"], ["\n display:grid;\n grid-template-rows: ", ";\n grid-gap: ", ";\n width:", ";\n margin-top: 24px;\n margin-bottom: 24px;\n background: white;\n overflow: scroll;\n .droppable {\n display:grid;\n grid-template-rows: ", ";\n grid-gap: ", ";\n }\n ", "\n"])), function (props) { return props.gridTemplateRows ? props.gridTemplateRows : 'auto'; }, function (props) { return props.gridRowGap ? props.gridRowGap : "16px"; }, function (props) { return props.width ? props.width : '100%'; }, function (props) { return props.gridTemplateRows ? props.gridTemplateRows : 'auto'; }, function (props) { return props.gridRowGap ? props.gridRowGap : "16px"; }, SharedStyles);
|
|
4445
4554
|
var GridRow = styled__default.default.div(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n display:grid;\n grid-template-columns: ", ";\n grid-gap: ", ";\n width:100%;\n background: white;\n ", "\n"], ["\n display:grid;\n grid-template-columns: ", ";\n grid-gap: ", ";\n width:100%;\n background: white;\n ", "\n"])), function (props) { return props.gridTemplateColumns; }, function (props) { return props.gridColumnGap ? props.gridColumnGap : "16px"; }, SharedStyles);
|
|
4446
|
-
var GridCell = styled__default.default.div(templateObject_3$
|
|
4447
|
-
var FieldError = styled__default.default.p(templateObject_4$
|
|
4555
|
+
var GridCell = styled__default.default.div(templateObject_3$d || (templateObject_3$d = __makeTemplateObject([" \n background: white;\n width: ", ";\n font-family: ", ";\n color: ", ";\n text-align: ", ";\n"], [" \n background: white;\n width: ", ";\n font-family: ", ";\n color: ", ";\n text-align: ", ";\n"])), function (props) { return props.width ? props.width : 'auto'; }, function (props) { return props.header ? themeOptions.fontFamilies.bold : fontStyles.p.medium; }, function (props) { return props.header ? errors.main : neutrals.bodyText; }, function (props) { return props.centerContent ? 'center' : 'left'; });
|
|
4556
|
+
var FieldError = styled__default.default.p(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n margin:0;\n"], ["\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n margin:0;\n"])), fontStyles.p.small.fontFamily, fontStyles.p.small.fontSize, errors['40']);
|
|
4448
4557
|
var defaultTransform = function (v) { return v.target ? v.target.value : v.currentTarget ? v.currentTarget.value : v.value; };
|
|
4449
4558
|
var Column = function (_a) {
|
|
4450
4559
|
_a.name; var title = _a.title; _a.children; var centerContent = _a.centerContent; _a.transform;
|
|
@@ -4627,14 +4736,14 @@ function GridTable(_a) {
|
|
|
4627
4736
|
Adding && NewRow,
|
|
4628
4737
|
onAdd && !Adding && AddNew)));
|
|
4629
4738
|
}
|
|
4630
|
-
var templateObject_1$z, templateObject_2$j, templateObject_3$
|
|
4739
|
+
var templateObject_1$z, templateObject_2$j, templateObject_3$d, templateObject_4$8;
|
|
4631
4740
|
|
|
4632
4741
|
var tabSizes = {
|
|
4633
4742
|
small: styled.css(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n font-size: 0.9rem;\n padding: 0.5rem 5px;\n margin: 0;\n "], ["\n font-size: 0.9rem;\n padding: 0.5rem 5px;\n margin: 0;\n "]))),
|
|
4634
4743
|
medium: styled.css(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n font-size: inherit;\n padding: 1rem 12px;\n margin: 0 15px 0 0;\n "], ["\n font-size: inherit;\n padding: 1rem 12px;\n margin: 0 15px 0 0;\n "]))),
|
|
4635
4744
|
};
|
|
4636
|
-
var TabBar = styled__default.default.ul(templateObject_3$
|
|
4637
|
-
var Tab = styled__default.default.li(templateObject_4$
|
|
4745
|
+
var TabBar = styled__default.default.ul(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n &&& {\n display: block;\n font-size: 16px;\n font-family: 'skufont-demibold', sans-serif;\n margin: 0;\n margin-bottom: ", ";\n padding: 0;\n ", "\n }\n"], ["\n &&& {\n display: block;\n font-size: 16px;\n font-family: 'skufont-demibold', sans-serif;\n margin: 0;\n margin-bottom: ", ";\n padding: 0;\n ", "\n }\n"])), function (props) { return props.padded ? "20px" : 0; }, SharedStyles);
|
|
4746
|
+
var Tab = styled__default.default.li(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n &&& {\n cursor: pointer;\n display: inline-block;\n border-bottom: ", ";\n color: #222222;\n opacity: ", ";\n list-style: none;\n margin-bottom: 0 !important;\n position: relative;\n padding: 1rem 12px;\n margin-right: 15px;\n ", "\n\n ", "\n }\n"], ["\n &&& {\n cursor: pointer;\n display: inline-block;\n border-bottom: ", ";\n color: #222222;\n opacity: ", ";\n list-style: none;\n margin-bottom: 0 !important;\n position: relative;\n padding: 1rem 12px;\n margin-right: 15px;\n ", "\n\n ", "\n }\n"
|
|
4638
4747
|
/*
|
|
4639
4748
|
|
|
4640
4749
|
Here's how you use this:
|
|
@@ -4664,7 +4773,7 @@ var Tab = styled__default.default.li(templateObject_4$8 || (templateObject_4$8 =
|
|
|
4664
4773
|
// </div>
|
|
4665
4774
|
// }
|
|
4666
4775
|
])), function (props) { return props.selected
|
|
4667
|
-
? "5px solid ".concat(props.variant === 'secondary' ? colors.secondary1.main : colors.primary1.main)
|
|
4776
|
+
? "5px solid ".concat(props.variant === 'secondary' ? colors$1.secondary1.main : colors$1.primary1.main)
|
|
4668
4777
|
: "none"; }, function (props) { return props.selected ? "1" : ".5"; }, SharedStyles, function (props) { var _a; return tabSizes[(_a = props.size) !== null && _a !== void 0 ? _a : 'medium']; });
|
|
4669
4778
|
var Tabs = /** @class */ (function (_super) {
|
|
4670
4779
|
__extends(Tabs, _super);
|
|
@@ -4722,7 +4831,7 @@ var Tabs = /** @class */ (function (_super) {
|
|
|
4722
4831
|
};
|
|
4723
4832
|
return Tabs;
|
|
4724
4833
|
}(React.Component));
|
|
4725
|
-
var templateObject_1$y, templateObject_2$i, templateObject_3$
|
|
4834
|
+
var templateObject_1$y, templateObject_2$i, templateObject_3$c, templateObject_4$7;
|
|
4726
4835
|
|
|
4727
4836
|
var toggleSizes$1 = {
|
|
4728
4837
|
small: {
|
|
@@ -4760,8 +4869,8 @@ var getSizeStyle = function (style, defaults) {
|
|
|
4760
4869
|
};
|
|
4761
4870
|
};
|
|
4762
4871
|
var Wrapper$3 = styled__default.default.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n &&& {\n display: inline-flex;\n max-width: 600px;\n justify-content: flex-start;\n width: 100%; \n }"], ["\n &&& {\n display: inline-flex;\n max-width: 600px;\n justify-content: flex-start;\n width: 100%; \n }"])));
|
|
4763
|
-
var Container = styled__default.default.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n &&& {\n background: ", ";\n border-radius: 50px;\n display: flex;\n justify-content: space-between;\n width: ", ";\n ", "\n }"], ["\n &&& {\n background: ", ";\n border-radius: 50px;\n display: flex;\n justify-content: space-between;\n width: ", ";\n ", "\n }"])), function (props) { return getThemeColor(props, 'teal.20', colors.teal['20']); }, function (props) { return props.stretch ? "100%" : "auto"; }, SharedStyles);
|
|
4764
|
-
var ToggleLink = styled__default.default.a(templateObject_3$
|
|
4872
|
+
var Container = styled__default.default.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n &&& {\n background: ", ";\n border-radius: 50px;\n display: flex;\n justify-content: space-between;\n width: ", ";\n ", "\n }"], ["\n &&& {\n background: ", ";\n border-radius: 50px;\n display: flex;\n justify-content: space-between;\n width: ", ";\n ", "\n }"])), function (props) { return getThemeColor(props, 'teal.20', colors$1.teal['20']); }, function (props) { return props.stretch ? "100%" : "auto"; }, SharedStyles);
|
|
4873
|
+
var ToggleLink = styled__default.default.a(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n font-size: ", ";\n border-radius: 30px;\n display: flex;\n align-content: center;\n padding: ", ";\n height: auto;\n line-height: ", ";\n width: ", ";\n justify-content: center;\n cursor: pointer;\n background-color: ", ";\n color: ", ";\n ", "\n }"], ["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n font-size: ", ";\n border-radius: 30px;\n display: flex;\n align-content: center;\n padding: ", ";\n height: auto;\n line-height: ", ";\n width: ", ";\n justify-content: center;\n cursor: pointer;\n background-color: ", ";\n color: ", ";\n ", "\n }"])), function (props) { return getSizeStyle('font-size', '1rem')({ size: props.size }); }, function (props) { return getSizeStyle('padding', '8px 16px')({ size: props.size }); }, function (props) { return getSizeStyle('line-height', '24px')({ size: props.size }); }, function (props) { return props.stretch ? "50%" : "auto"; }, function (props) { return props.selected ? getThemeColor(props, 'teal.main', colors$1.teal.main) : getThemeColor(props, 'teal.20', colors$1.teal['20']); }, function (props) { return props.selected ? "white" : getThemeColor(props, 'teal.main', colors$1.teal.main); }, SharedStyles);
|
|
4765
4874
|
var Toggle = function (_a) {
|
|
4766
4875
|
var _b = _a.size, size = _b === void 0 ? 'medium' : _b, props = __rest(_a, ["size"]);
|
|
4767
4876
|
return React__default.default.createElement(Wrapper$3, __assign({ size: size }, props),
|
|
@@ -4769,7 +4878,7 @@ var Toggle = function (_a) {
|
|
|
4769
4878
|
return React__default.default.cloneElement(child, { size: size });
|
|
4770
4879
|
})));
|
|
4771
4880
|
};
|
|
4772
|
-
var templateObject_1$x, templateObject_2$h, templateObject_3$
|
|
4881
|
+
var templateObject_1$x, templateObject_2$h, templateObject_3$b;
|
|
4773
4882
|
|
|
4774
4883
|
var Textarea = styled__default.default.textarea(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), function (p) {
|
|
4775
4884
|
var styles = {
|
|
@@ -4861,8 +4970,8 @@ var templateObject_1$u;
|
|
|
4861
4970
|
|
|
4862
4971
|
var ProductInfo = styled__default.default.div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n width: 100%;\n background: rgba(0, 0, 0, 0.55) !important;\n position: absolute;\n left: 0;\n bottom: 0;\n opacity: 1;\n color: #fff;\n padding: 10px;\n font-size: 14px;\n box-sizing: border-box;\n -moz-box-sizing: border-box;\n height: 110px;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n -moz-text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#b0000000',GradientType=0 );\n"], ["\n width: 100%;\n background: rgba(0, 0, 0, 0.55) !important;\n position: absolute;\n left: 0;\n bottom: 0;\n opacity: 1;\n color: #fff;\n padding: 10px;\n font-size: 14px;\n box-sizing: border-box;\n -moz-box-sizing: border-box;\n height: 110px;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n -moz-text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#b0000000',GradientType=0 );\n"])));
|
|
4863
4972
|
var ProductName = styled__default.default.div(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n font-size: 1.2rem;\n font-weight: bold;\n display: none;\n"], ["\n font-size: 1.2rem;\n font-weight: bold;\n display: none;\n"])));
|
|
4864
|
-
var SupplierName = styled__default.default.div(templateObject_3$
|
|
4865
|
-
var ProductWrapper = styled__default.default.div(templateObject_4$
|
|
4973
|
+
var SupplierName = styled__default.default.div(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n font-size: .9rem;\n font-weight: bold;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"], ["\n font-size: .9rem;\n font-weight: bold;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"])));
|
|
4974
|
+
var ProductWrapper = styled__default.default.div(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n width: 100%;\n height: 17rem;\n overflow: hidden;\n background-image: url(\"", "\");\n background-repeat: no-repeat;\n background-position: center top;\n background-size: cover;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n &:hover ", " {\n height: 100%;\n }\n &:hover ", " {\n display: block;\n }\n &:hover ", " {\n overflow: visible;\n white-space: normal;\n }\n ", "\n"], ["\n width: 100%;\n height: 17rem;\n overflow: hidden;\n background-image: url(\"", "\");\n background-repeat: no-repeat;\n background-position: center top;\n background-size: cover;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n &:hover ", " {\n height: 100%;\n }\n &:hover ", " {\n display: block;\n }\n &:hover ", " {\n overflow: visible;\n white-space: normal;\n }\n ", "\n"])), function (props) { return props.picture; }, ProductInfo, ProductName, SupplierName, SharedStyles);
|
|
4866
4975
|
var Product = function (props) {
|
|
4867
4976
|
return React__default.default.createElement(ProductWrapper, __assign({}, props),
|
|
4868
4977
|
React__default.default.createElement(ProductInfo, null,
|
|
@@ -4873,12 +4982,12 @@ var Product = function (props) {
|
|
|
4873
4982
|
props.price && props.currency ? props.currency + "$" + props.price : null,
|
|
4874
4983
|
props.rating ? React__default.default.createElement(StarRating, { rating: props.rating }) : null));
|
|
4875
4984
|
};
|
|
4876
|
-
var templateObject_1$t, templateObject_2$g, templateObject_3$
|
|
4985
|
+
var templateObject_1$t, templateObject_2$g, templateObject_3$a, templateObject_4$6;
|
|
4877
4986
|
|
|
4878
4987
|
var ArtworkName = styled__default.default.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n font-size: .9rem;\n font-weight: bold;\n"], ["\n font-size: .9rem;\n font-weight: bold;\n"])));
|
|
4879
|
-
var UpdateDate = styled__default.default.div(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n font-size: ", ";\n color: ", ";\n"], ["\n font-size: ", ";\n color: ", ";\n"])), function (props) { return getThemeFontSize(props, 'tiny'); }, function (props) { return getThemeColor(props, 'textbody', colors.textbody); });
|
|
4880
|
-
var ArtworkControls = styled__default.default.div(templateObject_3$
|
|
4881
|
-
var ArtworkInfo = styled__default.default.div(templateObject_4$
|
|
4988
|
+
var UpdateDate = styled__default.default.div(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n font-size: ", ";\n color: ", ";\n"], ["\n font-size: ", ";\n color: ", ";\n"])), function (props) { return getThemeFontSize(props, 'tiny'); }, function (props) { return getThemeColor(props, 'textbody', colors$1.textbody); });
|
|
4989
|
+
var ArtworkControls = styled__default.default.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n text-align: right;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 2;\n padding: 10px;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: .3s all;\n"], ["\n text-align: right;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 2;\n padding: 10px;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: .3s all;\n"])));
|
|
4990
|
+
var ArtworkInfo = styled__default.default.div(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n padding-left: ", ";\n width: 100%;\n position: absolute;\n height: 3rem;\n left: 0;\n ", " : 0;\n opacity: 1;\n color: black;\n font-size: 14px;\n box-sizing: border-box;\n word-wrap: break-word;\n -moz-box-sizing: border-box;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n"], ["\n padding-left: ", ";\n width: 100%;\n position: absolute;\n height: 3rem;\n left: 0;\n ", " : 0;\n opacity: 1;\n color: black;\n font-size: 14px;\n box-sizing: border-box;\n word-wrap: break-word;\n -moz-box-sizing: border-box;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n"])), function (props) { return props.withPicture ? 0 : "4vw !important"; }, function (props) { return props.withPicture ? "bottom" : "top"; });
|
|
4882
4991
|
var ArtworkWrapper = styled__default.default.div(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n width: 100%;\n height: ", ";\n min-height: 4rem;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n\n &:hover ", " {\n opacity: 1;\n }\n ", "\n"], ["\n width: 100%;\n height: ", ";\n min-height: 4rem;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n\n &:hover ", " {\n opacity: 1;\n }\n ", "\n"])), function (props) { return props.cssHeight > 0 ? props.cssHeight + "vw" : "auto"; }, ArtworkControls, SharedStyles);
|
|
4883
4992
|
var ArtworkPicture = styled__default.default.div(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n width: 100%;\n height: calc(", "vw - 3.5rem);\n overflow: hidden;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2);\n\n &:hover ", " {\n opacity: 1;\n }\n"], ["\n width: 100%;\n height: calc(", "vw - 3.5rem);\n overflow: hidden;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2);\n\n &:hover ", " {\n opacity: 1;\n }\n"])), function (props) { return props.cssHeight; }, ArtworkControls);
|
|
4884
4993
|
function truncate(filename, max) {
|
|
@@ -4917,12 +5026,12 @@ var Artwork = function (_a) {
|
|
|
4917
5026
|
"Updated ",
|
|
4918
5027
|
props.date) : null));
|
|
4919
5028
|
};
|
|
4920
|
-
var templateObject_1$s, templateObject_2$f, templateObject_3$
|
|
5029
|
+
var templateObject_1$s, templateObject_2$f, templateObject_3$9, templateObject_4$5, templateObject_5$4, templateObject_6$4;
|
|
4921
5030
|
|
|
4922
5031
|
var TaskLabel = styled__default.default.div(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["display: flex; min-height: 25px; ", ""], ["display: flex; min-height: 25px; ", ""])), function (p) { return p.hasCheckbox ? "width: calc(100% - 24px);" : ''; });
|
|
4923
5032
|
var TaskName = styled__default.default.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["flex-grow: 1; font-size:13px;"], ["flex-grow: 1; font-size:13px;"])));
|
|
4924
|
-
var StyledTask = styled__default.default.div(templateObject_3$
|
|
4925
|
-
var TaskBody = styled__default.default.div(templateObject_4$
|
|
5033
|
+
var StyledTask = styled__default.default.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["margin-bottom: 1.5em; ", ""], ["margin-bottom: 1.5em; ", ""])), SharedStyles);
|
|
5034
|
+
var TaskBody = styled__default.default.div(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["margin-left:34px;"], ["margin-left:34px;"])));
|
|
4926
5035
|
var Task = function (_a) {
|
|
4927
5036
|
var taskName = _a.taskName, date = _a.date; _a.done; var assignee = _a.assignee, taskBody = _a.taskBody, _b = _a.initialChecked, initialChecked = _b === void 0 ? false : _b, onClickCheckbox = _a.onClickCheckbox, props = __rest(_a, ["taskName", "date", "done", "assignee", "taskBody", "initialChecked", "onClickCheckbox"]);
|
|
4928
5037
|
var _c = React.useState(initialChecked), checked = _c[0], setChecked = _c[1];
|
|
@@ -4995,19 +5104,19 @@ var CalendarTask = React__default.default.forwardRef(function (_a, ref) {
|
|
|
4995
5104
|
assignee ? "for " + assignee : null,
|
|
4996
5105
|
assignee ? "on " : null)));
|
|
4997
5106
|
});
|
|
4998
|
-
var templateObject_1$r, templateObject_2$e, templateObject_3$
|
|
5107
|
+
var templateObject_1$r, templateObject_2$e, templateObject_3$8, templateObject_4$4, templateObject_5$3, templateObject_6$3;
|
|
4999
5108
|
|
|
5000
|
-
var PublisherWrapper = styled__default.default.div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["background: ", "; border-radius:5px; padding: 1em; margin-bottom: 1em;"], ["background: ", "; border-radius:5px; padding: 1em; margin-bottom: 1em;"])), function (props) { return getThemeColor(props, "bgblue", colors.bgblue); });
|
|
5109
|
+
var PublisherWrapper = styled__default.default.div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["background: ", "; border-radius:5px; padding: 1em; margin-bottom: 1em;"], ["background: ", "; border-radius:5px; padding: 1em; margin-bottom: 1em;"])), function (props) { return getThemeColor(props, "bgblue", colors$1.bgblue); });
|
|
5001
5110
|
var Publisher = function (props) {
|
|
5002
5111
|
return React__default.default.createElement(PublisherWrapper, null,
|
|
5003
5112
|
React__default.default.createElement(Textarea, { placeholder: "Post a note about this project" }));
|
|
5004
5113
|
};
|
|
5005
5114
|
var PostWrapper = styled__default.default.div(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["display:flex; margin-bottom: 1em; line-height: 1.5em; ", ""], ["display:flex; margin-bottom: 1em; line-height: 1.5em; ", ""])), SharedStyles);
|
|
5006
|
-
var WidePart = styled__default.default.div(templateObject_3$
|
|
5007
|
-
var Date$1 = styled__default.default.span(templateObject_4$
|
|
5115
|
+
var WidePart = styled__default.default.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["flex-grow:1;"], ["flex-grow:1;"])));
|
|
5116
|
+
var Date$1 = styled__default.default.span(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["color: ", "; display: inline-block;"], ["color: ", "; display: inline-block;"])), function (props) { return getThemeColor(props, "textbody", colors$1.textbody); });
|
|
5008
5117
|
var Action = styled__default.default.a(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["display: inline-block; margin-left: 10px;"], ["display: inline-block; margin-left: 10px;"])));
|
|
5009
|
-
var Author = styled__default.default.div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["flex-grow: 1; color: ", "; font-size: 18px; font-family: \"skufont-medium\", sans-serif; "], ["flex-grow: 1; color: ", "; font-size: 18px; font-family: \"skufont-medium\", sans-serif; "])), function (props) { return getThemeColor(props, "texttitle", colors.texttitle); });
|
|
5010
|
-
var Subject = styled__default.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["color:", "; font-size: 14px; font-family: \"skufont-medium\", sans-serif; "], ["color:", "; font-size: 14px; font-family: \"skufont-medium\", sans-serif; "])), function (props) { return getThemeColor(props, "textbody", colors.textbody); });
|
|
5118
|
+
var Author = styled__default.default.div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["flex-grow: 1; color: ", "; font-size: 18px; font-family: \"skufont-medium\", sans-serif; "], ["flex-grow: 1; color: ", "; font-size: 18px; font-family: \"skufont-medium\", sans-serif; "])), function (props) { return getThemeColor(props, "texttitle", colors$1.texttitle); });
|
|
5119
|
+
var Subject = styled__default.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["color:", "; font-size: 14px; font-family: \"skufont-medium\", sans-serif; "], ["color:", "; font-size: 14px; font-family: \"skufont-medium\", sans-serif; "])), function (props) { return getThemeColor(props, "textbody", colors$1.textbody); });
|
|
5011
5120
|
var TopLine = styled__default.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["display:flex;"], ["display:flex;"])));
|
|
5012
5121
|
var PostFooter = styled__default.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["font-size:.9em;"], ["font-size:.9em;"])));
|
|
5013
5122
|
var Comments = styled__default.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["margin-top: 1em;"], ["margin-top: 1em;"])));
|
|
@@ -5025,12 +5134,10 @@ var FeedPost = function (props) {
|
|
|
5025
5134
|
props.comments && props.comments.length > 0 ?
|
|
5026
5135
|
React__default.default.createElement(Comments, null, props.comments) : null));
|
|
5027
5136
|
};
|
|
5028
|
-
var templateObject_1$q, templateObject_2$d, templateObject_3$
|
|
5137
|
+
var templateObject_1$q, templateObject_2$d, templateObject_3$7, templateObject_4$3, templateObject_5$2, templateObject_6$2, templateObject_7, templateObject_8, templateObject_9, templateObject_10;
|
|
5029
5138
|
|
|
5030
|
-
var Wrapper$1 = styled__default.default.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n
|
|
5031
|
-
var ErrorTextContainer = styled__default.default.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n
|
|
5032
|
-
var BotContainer = styled__default.default.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n padding: 40px;\n\n margin-right: auto;\n @media only screen and (max-width: 700px) {\n margin-left: auto;\n margin-top: 20px;\n }\n\n @media only screen and (min-width: 701px) {\n margin-left: 5px;\n }\n"], ["\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n padding: 40px;\n\n margin-right: auto;\n @media only screen and (max-width: 700px) {\n margin-left: auto;\n margin-top: 20px;\n }\n\n @media only screen and (min-width: 701px) {\n margin-left: 5px;\n }\n"])));
|
|
5033
|
-
var BotImg = styled__default.default.img(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n margin-top: 20px;\n padding: 0;\n margin: 0;\n max-width: 450px;\n"], ["\n margin-top: 20px;\n padding: 0;\n margin: 0;\n max-width: 450px;\n"])));
|
|
5139
|
+
var Wrapper$1 = styled__default.default.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n &&& {\n text-align: center;\n font-family: \"TT Norms Pro\", sans-serif;\n background: white;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n ", " \n }\n"], ["\n &&& {\n text-align: center;\n font-family: \"TT Norms Pro\", sans-serif;\n background: white;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n ", " \n }\n"])), SharedStyles);
|
|
5140
|
+
var ErrorTextContainer = styled__default.default.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n padding: 100px 50px;\n margin-top: 100px;\n\n @media only screen and (max-width: 700px) {\n margin-right: auto;\n }\n\n @media only screen and (min-width: 701px) {\n margin-right: 10px;\n }\n"], ["\n padding: 100px 50px;\n margin-top: 100px;\n\n @media only screen and (max-width: 700px) {\n margin-right: auto;\n }\n\n @media only screen and (min-width: 701px) {\n margin-right: 10px;\n }\n"])));
|
|
5034
5141
|
var ErrorBoundary = /** @class */ (function (_super) {
|
|
5035
5142
|
__extends(ErrorBoundary, _super);
|
|
5036
5143
|
function ErrorBoundary(props) {
|
|
@@ -5043,22 +5150,29 @@ var ErrorBoundary = /** @class */ (function (_super) {
|
|
|
5043
5150
|
console.log({ error: error, info: info });
|
|
5044
5151
|
};
|
|
5045
5152
|
ErrorBoundary.prototype.render = function () {
|
|
5153
|
+
var goBack = function () {
|
|
5154
|
+
window$1.history.back();
|
|
5155
|
+
};
|
|
5156
|
+
var isNewTab = window$1.history.length === 1;
|
|
5046
5157
|
if (this.state.hasError) {
|
|
5047
5158
|
return (React__default.default.createElement(Wrapper$1, __assign({}, this.props),
|
|
5048
|
-
React__default.default.createElement(
|
|
5049
|
-
React__default.default.createElement(
|
|
5050
|
-
|
|
5051
|
-
|
|
5052
|
-
|
|
5053
|
-
|
|
5054
|
-
|
|
5055
|
-
React__default.default.createElement(
|
|
5159
|
+
React__default.default.createElement(ErrorTextContainer, null,
|
|
5160
|
+
React__default.default.createElement("b", { style: { color: '#2A4D63', fontSize: '64px' } }, "Sorry, something went wrong."),
|
|
5161
|
+
React__default.default.createElement("br", null),
|
|
5162
|
+
React__default.default.createElement("p", { style: { color: '#597486', fontSize: '24px', fontStyle: 'normal', lineHeight: '40px', fontWeight: 400, position: 'relative', zIndex: 100 } }, " We\u2019ve been notified about the error and will get it resolved shortly."),
|
|
5163
|
+
React__default.default.createElement("br", null),
|
|
5164
|
+
React__default.default.createElement("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
|
5165
|
+
React__default.default.createElement(Button, { variant: "primary", size: "medium", id: "goBackButton", onClick: goBack, style: { marginRight: '25px', zIndex: 100, display: isNewTab ? 'none' : 'table-cell' } }, "Back to previous page"),
|
|
5166
|
+
React__default.default.createElement(Button, { variant: "text", size: "medium", style: { zIndex: 100 }, onClick: function (e) { return window$1.location.href = "/"; } }, "Go to homepage"))),
|
|
5167
|
+
React__default.default.createElement("div", { style: { position: 'absolute', bottom: '0', width: '100%' } },
|
|
5168
|
+
React__default.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "310", viewBox: "0 0 1510 310", fill: "none", preserveAspectRatio: "none" },
|
|
5169
|
+
React__default.default.createElement("path", { d: "M858 52.2161C498 -49.6986 200.667 20.7424 0 68.7022V310H1510V52.2166L1508.43 52.7138C1352.99 101.997 1202.45 149.728 858 52.2161Z", fill: "#EDF4F7" })))));
|
|
5056
5170
|
}
|
|
5057
5171
|
return this.props.children;
|
|
5058
5172
|
};
|
|
5059
5173
|
return ErrorBoundary;
|
|
5060
5174
|
}(React.Component));
|
|
5061
|
-
var templateObject_1$p, templateObject_2$c
|
|
5175
|
+
var templateObject_1$p, templateObject_2$c;
|
|
5062
5176
|
|
|
5063
5177
|
var CustomDateInput = React.forwardRef(function (_a, ref) {
|
|
5064
5178
|
var error = _a.error, noMargin = _a.noMargin, onClick = _a.onClick, isClearable = _a.isClearable, props = __rest(_a, ["error", "noMargin", "onClick", "isClearable"]);
|
|
@@ -5154,7 +5268,7 @@ var Dropdown = function (_a) {
|
|
|
5154
5268
|
};
|
|
5155
5269
|
var templateObject_1$o, templateObject_2$b, templateObject_3$6;
|
|
5156
5270
|
|
|
5157
|
-
var Badge = styled__default.default.span(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n display: inline-block;\n min-width: 10px;\n padding: 3px 7px;\n font-size: 12px;\n font-weight: 700;\n line-height: 1;\n color: #fff;\n text-align: center;\n white-space: nowrap;\n vertical-align: middle;\n background-color: ", ";\n color: ", ";\n border-radius: 10px;\n ", "\n"], ["\n display: inline-block;\n min-width: 10px;\n padding: 3px 7px;\n font-size: 12px;\n font-weight: 700;\n line-height: 1;\n color: #fff;\n text-align: center;\n white-space: nowrap;\n vertical-align: middle;\n background-color: ", ";\n color: ", ";\n border-radius: 10px;\n ", "\n"])), function (p) { return p.color === 'cta' ? colors.cta : p.color === 'grey' ? colors.primary0 : colors.primary; }, function (p) { return p.color === 'grey' ? colors.primary100 : colors.white; }, SharedStyles);
|
|
5271
|
+
var Badge = styled__default.default.span(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n display: inline-block;\n min-width: 10px;\n padding: 3px 7px;\n font-size: 12px;\n font-weight: 700;\n line-height: 1;\n color: #fff;\n text-align: center;\n white-space: nowrap;\n vertical-align: middle;\n background-color: ", ";\n color: ", ";\n border-radius: 10px;\n ", "\n"], ["\n display: inline-block;\n min-width: 10px;\n padding: 3px 7px;\n font-size: 12px;\n font-weight: 700;\n line-height: 1;\n color: #fff;\n text-align: center;\n white-space: nowrap;\n vertical-align: middle;\n background-color: ", ";\n color: ", ";\n border-radius: 10px;\n ", "\n"])), function (p) { return p.color === 'cta' ? colors$1.cta : p.color === 'grey' ? colors$1.primary0 : colors$1.primary; }, function (p) { return p.color === 'grey' ? colors$1.primary100 : colors$1.white; }, SharedStyles);
|
|
5158
5272
|
var templateObject_1$n;
|
|
5159
5273
|
|
|
5160
5274
|
var verticalScrollbarWidth = function () {
|
|
@@ -6157,8 +6271,8 @@ Transition.EXITING = EXITING;
|
|
|
6157
6271
|
var Transition$1 = Transition;
|
|
6158
6272
|
|
|
6159
6273
|
var CollapseStyled = styled__default.default.div(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n&&& {\n .collapsed:not(.show) {\n display: none;\n }\n\n .collapsing {\n position: relative;\n height: 0;\n overflow: hidden;\n transition: height ", "s ease;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .collapsing {\n transition: none;\n }\n }\n}\n"], ["\n&&& {\n .collapsed:not(.show) {\n display: none;\n }\n\n .collapsing {\n position: relative;\n height: 0;\n overflow: hidden;\n transition: height ", "s ease;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .collapsing {\n transition: none;\n }\n }\n}\n"])), function (p) { return p.duration ? p.duration / 1000 : '0.35'; });
|
|
6160
|
-
var CollapseWrapper = styled__default.default.div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n&&& {\n border: 1px solid ", ";\n border-radius: 5px;\n}\n"], ["\n&&& {\n border: 1px solid ", ";\n border-radius: 5px;\n}\n"])), colors.primary0);
|
|
6161
|
-
var CollapsiblePanelTitle = styled__default.default.div(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n&&& {\n background: #f3f6f7;\n border-bottom: 1px solid ", ";\n color: ", ";\n padding: 20px;\n cursor: pointer;\n}\n"], ["\n&&& {\n background: #f3f6f7;\n border-bottom: 1px solid ", ";\n color: ", ";\n padding: 20px;\n cursor: pointer;\n}\n"])), colors.primary0, colors.primary);
|
|
6274
|
+
var CollapseWrapper = styled__default.default.div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n&&& {\n border: 1px solid ", ";\n border-radius: 5px;\n}\n"], ["\n&&& {\n border: 1px solid ", ";\n border-radius: 5px;\n}\n"])), colors$1.primary0);
|
|
6275
|
+
var CollapsiblePanelTitle = styled__default.default.div(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n&&& {\n background: #f3f6f7;\n border-bottom: 1px solid ", ";\n color: ", ";\n padding: 20px;\n cursor: pointer;\n}\n"], ["\n&&& {\n background: #f3f6f7;\n border-bottom: 1px solid ", ";\n color: ", ";\n padding: 20px;\n cursor: pointer;\n}\n"])), colors$1.primary0, colors$1.primary);
|
|
6162
6276
|
var transitionStatusToClass = {
|
|
6163
6277
|
entering: 'collapsing',
|
|
6164
6278
|
entered: 'collapsed show',
|
|
@@ -6342,7 +6456,7 @@ function Thermometer(_a) {
|
|
|
6342
6456
|
setValue1Width((node === null || node === void 0 ? void 0 : node.clientWidth) || 0);
|
|
6343
6457
|
}, []);
|
|
6344
6458
|
return (React__default.default.createElement("div", __assign({}, props),
|
|
6345
|
-
title ? React__default.default.createElement(Text, { style: { fontWeight: 'bold', fontSize: 18, color: colors.neutrals.bodyText } }, title) : null,
|
|
6459
|
+
title ? React__default.default.createElement(Text, { style: { fontWeight: 'bold', fontSize: 18, color: colors$1.neutrals.bodyText } }, title) : null,
|
|
6346
6460
|
React__default.default.createElement("div", { style: { paddingBottom: 20, paddingTop: 5 } },
|
|
6347
6461
|
React__default.default.createElement("span", { ref: measureTargetRef, style: {
|
|
6348
6462
|
position: 'absolute',
|
|
@@ -6354,13 +6468,13 @@ function Thermometer(_a) {
|
|
|
6354
6468
|
React__default.default.createElement("span", { ref: measureValue1Ref, style: {
|
|
6355
6469
|
position: 'absolute',
|
|
6356
6470
|
paddingRight: 5,
|
|
6357
|
-
color: labelTextColor || colors.secondary3.main,
|
|
6471
|
+
color: labelTextColor || colors$1.secondary3.main,
|
|
6358
6472
|
} },
|
|
6359
6473
|
value1Label + " $",
|
|
6360
6474
|
React__default.default.createElement(Number$1, { commas: true, decimalPoints: 0, num: value1 }))),
|
|
6361
6475
|
React__default.default.createElement("div", { ref: measureContainerRef },
|
|
6362
6476
|
React__default.default.createElement(ProgressWrapper, { style: { marginTop: 10, background: isSecondary ? '#FFF9C5' : '#C9FDE5' } },
|
|
6363
|
-
React__default.default.createElement(ProgressBar, { target: target, value: value1, color: barColor || colors.secondary3.main, offset: calcVal1Width(), elementWidth: value1Width })))));
|
|
6477
|
+
React__default.default.createElement(ProgressBar, { target: target, value: value1, color: barColor || colors$1.secondary3.main, offset: calcVal1Width(), elementWidth: value1Width })))));
|
|
6364
6478
|
}
|
|
6365
6479
|
var templateObject_1$g, templateObject_2$4;
|
|
6366
6480
|
|
|
@@ -6382,7 +6496,7 @@ function LightIndicatorLight(_a) {
|
|
|
6382
6496
|
React__default.default.createElement("defs", null,
|
|
6383
6497
|
React__default.default.createElement("radialGradient", { id: lightID, cx: 0, cy: 0, r: 1, gradientUnits: "userSpaceOnUse", gradientTransform: gradientTransform }, litOrNot)));
|
|
6384
6498
|
}
|
|
6385
|
-
var LightIndicatorText = styled__default.default.p(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n margin-top:0;\n margin-bottom:0;\n };\n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n margin-top:0;\n margin-bottom:0;\n };\n"])), function (props) { return props.large ? themeOptions.fontStyles.p.medium.fontSize : themeOptions.fontStyles.p.small.fontSize; }, themeOptions.fontStyles.p.small.fontFamily, themeOptions.fontStyles.p.small.lineHeight, function (props) { return props.LightIndicatorTextColor ? colors.neutrals.bodyText : colors.neutrals[70]; });
|
|
6499
|
+
var LightIndicatorText = styled__default.default.p(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n margin-top:0;\n margin-bottom:0;\n };\n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n margin-top:0;\n margin-bottom:0;\n };\n"])), function (props) { return props.large ? themeOptions.fontStyles.p.medium.fontSize : themeOptions.fontStyles.p.small.fontSize; }, themeOptions.fontStyles.p.small.fontFamily, themeOptions.fontStyles.p.small.lineHeight, function (props) { return props.LightIndicatorTextColor ? colors$1.neutrals.bodyText : colors$1.neutrals[70]; });
|
|
6386
6500
|
var LightIndicatorContainer = styled__default.default.div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n max-width: 100%;\n margin-bottom: 8px;\n margin-right: 16px;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n max-width: 100%;\n margin-bottom: 8px;\n margin-right: 16px;\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
|
|
6387
6501
|
function LightIndicator(_a) {
|
|
6388
6502
|
var _b = _a.name, name = _b === void 0 ? "Name this Indicator" : _b, _c = _a.on, on = _c === void 0 ? false : _c, _d = _a.large, large = _d === void 0 ? false : _d, _e = _a.textProps, textProps = _e === void 0 ? {} : _e, props = __rest(_a, ["name", "on", "large", "textProps"]);
|
|
@@ -6392,7 +6506,7 @@ function LightIndicator(_a) {
|
|
|
6392
6506
|
}
|
|
6393
6507
|
var templateObject_1$f, templateObject_2$3;
|
|
6394
6508
|
|
|
6395
|
-
var DefaultStarText = styled__default.default.p(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n &&& {\n opacity: ", ";\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"], ["\n &&& {\n opacity: ", ";\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"])), function (props) { return props.clicked ? 1 : props.hover ? 0.8 : 0; }, themeOptions.fontStyles.p.medium.fontSize, themeOptions.fontStyles.p.medium.fontFamily, themeOptions.fontStyles.p.medium.lineHeight, function (props) { return props.clicked ? props.color : colors.neutrals[60]; });
|
|
6509
|
+
var DefaultStarText = styled__default.default.p(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n &&& {\n opacity: ", ";\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"], ["\n &&& {\n opacity: ", ";\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"])), function (props) { return props.clicked ? 1 : props.hover ? 0.8 : 0; }, themeOptions.fontStyles.p.medium.fontSize, themeOptions.fontStyles.p.medium.fontFamily, themeOptions.fontStyles.p.medium.lineHeight, function (props) { return props.clicked ? props.color : colors$1.neutrals[60]; });
|
|
6396
6510
|
var DefaultStarContainer = styled__default.default.div(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n width: ", ";\n margin-bottom: 16px;\n margin-right: 16px;\n cursor: pointer;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n width: ", ";\n margin-bottom: 16px;\n margin-right: 16px;\n cursor: pointer;\n ", "\n ", "\n }\n"])), function (props) { return props.width ? props.width : props.noText ? '24px' : '128px'; }, SharedStyles, SizerCss);
|
|
6397
6511
|
function DefaultStar(_a) {
|
|
6398
6512
|
var _b = _a.initialSelected, initialSelected = _b === void 0 ? false : _b, _c = _a.forceSelected, forceSelected = _c === void 0 ? false : _c, hoverText = _a.hoverText, _d = _a.noText, noText = _d === void 0 ? false : _d, _e = _a.children, children = _e === void 0 ? "Default" : _e, width = _a.width, _f = _a.color, color = _f === void 0 ? teal.main : _f; __rest(_a, ["initialSelected", "forceSelected", "hoverText", "noText", "children", "width", "color"]);
|
|
@@ -6418,9 +6532,9 @@ function DoneButton(_a) {
|
|
|
6418
6532
|
return (React__default.default.createElement(Button, __assign({ variant: variant, size: size }, Props), "Done"));
|
|
6419
6533
|
}
|
|
6420
6534
|
|
|
6421
|
-
var StyledLink = styled__default.default.a(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n display: flex;\n ", ";\n ", "\n ", "\n &:hover {\n color: ", ";\n }\n } \n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n display: flex;\n ", ";\n ", "\n ", "\n &:hover {\n color: ", ";\n }\n } \n"])), fontStyles.p.medium.fontSize, fontStyles.p.medium.fontFamily, fontStyles.p.medium.lineHeight, function (props) { return props.color || colors.teal.main; }, function (props) { return props.flexShrink ? "flex-shrink: 0;" : null; }, SharedStyles, SizerCss, function (props) { return props.hoverColor ? props.hoverColor : colors.teal.dark; });
|
|
6535
|
+
var StyledLink = styled__default.default.a(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n display: flex;\n ", ";\n ", "\n ", "\n &:hover {\n color: ", ";\n }\n } \n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n display: flex;\n ", ";\n ", "\n ", "\n &:hover {\n color: ", ";\n }\n } \n"])), fontStyles.p.medium.fontSize, fontStyles.p.medium.fontFamily, fontStyles.p.medium.lineHeight, function (props) { return props.color || colors$1.teal.main; }, function (props) { return props.flexShrink ? "flex-shrink: 0;" : null; }, SharedStyles, SizerCss, function (props) { return props.hoverColor ? props.hoverColor : colors$1.teal.dark; });
|
|
6422
6536
|
function LinkWithIcon(_a) {
|
|
6423
|
-
var Icon = _a.Icon, href = _a.href, children = _a.children, _b = _a.color, color = _b === void 0 ? colors.teal.main : _b, _c = _a.hoverColor, hoverColor = _c === void 0 ? colors.teal.dark : _c, _d = _a.flexShrink, flexShrink = _d === void 0 ? false : _d, iconProps = _a.iconProps, _e = _a.style, style = _e === void 0 ? {} : _e, props = __rest(_a, ["Icon", "href", "children", "color", "hoverColor", "flexShrink", "iconProps", "style"]);
|
|
6537
|
+
var Icon = _a.Icon, href = _a.href, children = _a.children, _b = _a.color, color = _b === void 0 ? colors$1.teal.main : _b, _c = _a.hoverColor, hoverColor = _c === void 0 ? colors$1.teal.dark : _c, _d = _a.flexShrink, flexShrink = _d === void 0 ? false : _d, iconProps = _a.iconProps, _e = _a.style, style = _e === void 0 ? {} : _e, props = __rest(_a, ["Icon", "href", "children", "color", "hoverColor", "flexShrink", "iconProps", "style"]);
|
|
6424
6538
|
var _f = React.useState(false), isHover = _f[0], setHover = _f[1];
|
|
6425
6539
|
var RenderIcon = React__default.default.useMemo(function () {
|
|
6426
6540
|
if (!Icon) {
|
|
@@ -6450,29 +6564,29 @@ var NotificationExtraContent = React.memo(function (props) {
|
|
|
6450
6564
|
var NotificationIcon = React.memo(function (props) {
|
|
6451
6565
|
var alertType = props.alertType;
|
|
6452
6566
|
if (alertType === "success") {
|
|
6453
|
-
return React__default.default.createElement(CompletedCheckmarkIcon, { color: colors.green.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6567
|
+
return React__default.default.createElement(CompletedCheckmarkIcon, { color: colors$1.green.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6454
6568
|
}
|
|
6455
6569
|
else if (alertType === "error") {
|
|
6456
|
-
return React__default.default.createElement(AlertIcon, { color: colors.errors.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6570
|
+
return React__default.default.createElement(AlertIcon, { color: colors$1.errors.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6457
6571
|
}
|
|
6458
|
-
return React__default.default.createElement(InfoIcon, { color: colors.navy.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6572
|
+
return React__default.default.createElement(InfoIcon, { color: colors$1.navy.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6459
6573
|
});
|
|
6460
6574
|
var notificationVariantStyles = function (alertType) {
|
|
6461
6575
|
switch (alertType) {
|
|
6462
6576
|
case "neutral":
|
|
6463
6577
|
return {
|
|
6464
|
-
backgroundColor: colors.navy.lightest,
|
|
6465
|
-
color: colors.navy.dark,
|
|
6578
|
+
backgroundColor: colors$1.navy.lightest,
|
|
6579
|
+
color: colors$1.navy.dark,
|
|
6466
6580
|
};
|
|
6467
6581
|
case "success":
|
|
6468
6582
|
return {
|
|
6469
|
-
backgroundColor: colors.green.lightest,
|
|
6470
|
-
color: colors.green.darkest,
|
|
6583
|
+
backgroundColor: colors$1.green.lightest,
|
|
6584
|
+
color: colors$1.green.darkest,
|
|
6471
6585
|
};
|
|
6472
6586
|
case "error":
|
|
6473
6587
|
return {
|
|
6474
|
-
backgroundColor: colors.errors.lightest,
|
|
6475
|
-
color: colors.errors.dark,
|
|
6588
|
+
backgroundColor: colors$1.errors.lightest,
|
|
6589
|
+
color: colors$1.errors.dark,
|
|
6476
6590
|
};
|
|
6477
6591
|
default:
|
|
6478
6592
|
return {};
|
|
@@ -7057,8 +7171,8 @@ var BaseCollapsible = function (props) {
|
|
|
7057
7171
|
setHeight(0);
|
|
7058
7172
|
}, [isOpen]);
|
|
7059
7173
|
return (React__default.default.createElement("div", { style: style },
|
|
7060
|
-
React__default.default.createElement(Row, { style: __assign({ alignItems: 'center', padding: 10, paddingTop: 12, paddingBottom: 8, background: isOpen ? colors.white : colors.teal[20], borderRadius: isOpen ? 25 : 2000, flex: 'none', order: 1, flexGrow: 0 }, (isOpen
|
|
7061
|
-
? { border: "3px solid ".concat(colors.teal.main) }
|
|
7174
|
+
React__default.default.createElement(Row, { style: __assign({ alignItems: 'center', padding: 10, paddingTop: 12, paddingBottom: 8, background: isOpen ? colors$1.white : colors$1.teal[20], borderRadius: isOpen ? 25 : 2000, flex: 'none', order: 1, flexGrow: 0 }, (isOpen
|
|
7175
|
+
? { border: "3px solid ".concat(colors$1.teal.main) }
|
|
7062
7176
|
: {})) },
|
|
7063
7177
|
React__default.default.createElement(CollapsibleHeader, { isOpen: isOpen, handleToggle: handleToggle, controls: controls }, header || label),
|
|
7064
7178
|
React__default.default.createElement(Col, { xs: true, style: {
|
|
@@ -7101,7 +7215,7 @@ var CollapsibleLabel = function (props) {
|
|
|
7101
7215
|
}
|
|
7102
7216
|
if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
|
|
7103
7217
|
return React__default.default.createElement("span", { style: {
|
|
7104
|
-
color: colors.teal.main,
|
|
7218
|
+
color: colors$1.teal.main,
|
|
7105
7219
|
fontFamily: fontFamilies.bold,
|
|
7106
7220
|
fontStyle: 'normal',
|
|
7107
7221
|
fontWeight: 500,
|
|
@@ -7129,7 +7243,7 @@ var CollapsibleControls = function (props) {
|
|
|
7129
7243
|
}
|
|
7130
7244
|
if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
|
|
7131
7245
|
return React__default.default.createElement("span", { style: {
|
|
7132
|
-
color: colors.teal.main,
|
|
7246
|
+
color: colors$1.teal.main,
|
|
7133
7247
|
fontFamily: fontFamilies.bold,
|
|
7134
7248
|
fontStyle: 'normal',
|
|
7135
7249
|
fontWeight: 500,
|
|
@@ -7154,7 +7268,7 @@ var ConfirmPopup = function (props) {
|
|
|
7154
7268
|
fontFamily: fontStyles.p.medium.fontFamily,
|
|
7155
7269
|
fontSize: fontStyles.p.medium.fontSize,
|
|
7156
7270
|
lineHeight: fontStyles.p.medium.lineHeight,
|
|
7157
|
-
color: colors.neutrals.bodyText
|
|
7271
|
+
color: colors$1.neutrals.bodyText
|
|
7158
7272
|
} }, confirmText),
|
|
7159
7273
|
React__default.default.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
|
|
7160
7274
|
React__default.default.createElement(Button, { size: "medium", variant: 'secondary', mr: 24, onClick: function () {
|
|
@@ -7194,8 +7308,8 @@ var PopupTitle = function (_a) {
|
|
|
7194
7308
|
var PopupContent = function (_a) {
|
|
7195
7309
|
var children = _a.children;
|
|
7196
7310
|
return (React__default.default.createElement("div", { style: {
|
|
7197
|
-
background: colors.errors[10],
|
|
7198
|
-
color: colors.errors.main,
|
|
7311
|
+
background: colors$1.errors[10],
|
|
7312
|
+
color: colors$1.errors.main,
|
|
7199
7313
|
padding: 16,
|
|
7200
7314
|
} },
|
|
7201
7315
|
React__default.default.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
|
|
@@ -7204,12 +7318,12 @@ var PopupContent = function (_a) {
|
|
|
7204
7318
|
verticalAlign: 'middle',
|
|
7205
7319
|
alignSelf: 'center',
|
|
7206
7320
|
} },
|
|
7207
|
-
React__default.default.createElement(AlertIcon, { size: 'medium', color: colors.errors[70] })),
|
|
7321
|
+
React__default.default.createElement(AlertIcon, { size: 'medium', color: colors$1.errors[70] })),
|
|
7208
7322
|
React__default.default.createElement("div", { style: {
|
|
7209
7323
|
fontFamily: 'var(--font-family-regular)',
|
|
7210
7324
|
fontSize: fontStyles.p.large.fontSize,
|
|
7211
7325
|
lineHeight: fontStyles.p.medium.lineHeight,
|
|
7212
|
-
color: colors.errors.main,
|
|
7326
|
+
color: colors$1.errors.main,
|
|
7213
7327
|
} }, children))));
|
|
7214
7328
|
};
|
|
7215
7329
|
|
|
@@ -7245,7 +7359,7 @@ var CalendarDaysBody = function (_a) {
|
|
|
7245
7359
|
var DaysHeaderWrapper = styled__default.default(Row)(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n text-transform: uppercase;\n font-weight: 400;\n color: #ccc;\n font-size: 70%;\n padding: 0.75em 0 !important;\n border-bottom: 1px solid #eee;\n"], ["\n text-transform: uppercase;\n font-weight: 400;\n color: #ccc;\n font-size: 70%;\n padding: 0.75em 0 !important;\n border-bottom: 1px solid #eee;\n"])));
|
|
7246
7360
|
var templateObject_1$6;
|
|
7247
7361
|
|
|
7248
|
-
var StyledDayText = styled__default.default(Text)(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) { return props.selected ? "\n border-radius: 15px;\n background: ".concat(colors.cta, ";\n color: white;\n font-weight: bold;\n padding: 0 5px;\n ") : ''; });
|
|
7362
|
+
var StyledDayText = styled__default.default(Text)(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) { return props.selected ? "\n border-radius: 15px;\n background: ".concat(colors$1.cta, ";\n color: white;\n font-weight: bold;\n padding: 0 5px;\n ") : ''; });
|
|
7249
7363
|
var templateObject_1$5;
|
|
7250
7364
|
|
|
7251
7365
|
var CalendarDaysHeader = function (_a) {
|
|
@@ -7283,11 +7397,11 @@ var DefaultCalendarHeader = function (_a) {
|
|
|
7283
7397
|
React__default.default.createElement(Row, null,
|
|
7284
7398
|
React__default.default.createElement(LabeledCheckbox, { label: "Weekends", checked: true })))),
|
|
7285
7399
|
React__default.default.createElement(Col, { padded: true },
|
|
7286
|
-
React__default.default.createElement("div", { style: { cursor: 'pointer', color: colors.primary, }, onClick: onPrevWeek }, "< Prev Week")),
|
|
7400
|
+
React__default.default.createElement("div", { style: { cursor: 'pointer', color: colors$1.primary, }, onClick: onPrevWeek }, "< Prev Week")),
|
|
7287
7401
|
React__default.default.createElement(Col, { center: true, padded: true },
|
|
7288
|
-
React__default.default.createElement("span", { style: { color: colors.disabledButton } }, dateFns.format(currentMonth, "MMM yyyy"))),
|
|
7402
|
+
React__default.default.createElement("span", { style: { color: colors$1.disabledButton } }, dateFns.format(currentMonth, "MMM yyyy"))),
|
|
7289
7403
|
React__default.default.createElement(Col, { end: true, padded: true },
|
|
7290
|
-
React__default.default.createElement("div", { style: { cursor: 'pointer', color: colors.primary, }, onClick: onNextWeek }, "Next Week >"))));
|
|
7404
|
+
React__default.default.createElement("div", { style: { cursor: 'pointer', color: colors$1.primary, }, onClick: onNextWeek }, "Next Week >"))));
|
|
7291
7405
|
};
|
|
7292
7406
|
|
|
7293
7407
|
var TasksCalendarDayBody = function (_a) {
|
|
@@ -7359,7 +7473,7 @@ var CalendarIconDatePicker = React__default.default.forwardRef(function (_a, ref
|
|
|
7359
7473
|
textAlign: 'center',
|
|
7360
7474
|
borderRadius: 5,
|
|
7361
7475
|
cursor: 'pointer',
|
|
7362
|
-
color: colors.disabledButton,
|
|
7476
|
+
color: colors$1.disabledButton,
|
|
7363
7477
|
} })));
|
|
7364
7478
|
});
|
|
7365
7479
|
var TasksCalendarHeader = function (_a) {
|
|
@@ -7401,7 +7515,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7401
7515
|
}
|
|
7402
7516
|
} })),
|
|
7403
7517
|
React__default.default.createElement("span", null,
|
|
7404
|
-
React__default.default.createElement(WeekNav, { style: { cursor: 'pointer', color: colors.primary, verticalAlign: 'middle' }, onClick: onPrevWeek },
|
|
7518
|
+
React__default.default.createElement(WeekNav, { style: { cursor: 'pointer', color: colors$1.primary, verticalAlign: 'middle' }, onClick: onPrevWeek },
|
|
7405
7519
|
React__default.default.createElement(ChevronIcon, { direction: "left", size: 'large' })),
|
|
7406
7520
|
React__default.default.createElement(WeekNav, { as: Button, variant: "text", size: "primary-light", style: { verticalAlign: "middle", padding: "10px 0px", }, py: 5, onClick: function () {
|
|
7407
7521
|
if (isCurrentWeek) {
|
|
@@ -7409,7 +7523,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7409
7523
|
}
|
|
7410
7524
|
onResetDate();
|
|
7411
7525
|
} }, "Today"),
|
|
7412
|
-
React__default.default.createElement(WeekNav, { style: { cursor: 'pointer', color: colors.primary1.main, verticalAlign: 'middle' }, onClick: onNextWeek },
|
|
7526
|
+
React__default.default.createElement(WeekNav, { style: { cursor: 'pointer', color: colors$1.primary1.main, verticalAlign: 'middle' }, onClick: onNextWeek },
|
|
7413
7527
|
React__default.default.createElement(ChevronIcon, { size: "large" })))),
|
|
7414
7528
|
React__default.default.createElement(Col, { start: 1, xs: true, md: 8, padded: true },
|
|
7415
7529
|
React__default.default.createElement(Tabs, { size: "medium", tabs: tabs })),
|
|
@@ -7417,7 +7531,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7417
7531
|
React__default.default.createElement(Link, { as: "span", onClick: onClickAddTask, style: {
|
|
7418
7532
|
marginRight: 10,
|
|
7419
7533
|
verticalAlign: 'bottom',
|
|
7420
|
-
color: colors.primary1.main,
|
|
7534
|
+
color: colors$1.primary1.main,
|
|
7421
7535
|
fontFamily: [themeOptions.fontFamilies.regular].concat(themeOptions.fontFamilies.fallbacks).join(','),
|
|
7422
7536
|
fontWeight: 600,
|
|
7423
7537
|
} }, "+ Add Task")
|
|
@@ -7723,7 +7837,7 @@ var SimpleWindowedTableStyles = styled__default.default.div(templateObject_1$1 |
|
|
|
7723
7837
|
"border: ".concat(typeof p.bordered === 'string'
|
|
7724
7838
|
? p.bordered
|
|
7725
7839
|
: "1px solid ".concat(getThemeColor(p, 'tableBorder', '#edf2f5')), ";")
|
|
7726
|
-
: ''; }, colors.disabledButtonBorder, colors.disabledButtonBorder, function (p) { return p.hoverRowBg ?
|
|
7840
|
+
: ''; }, colors$1.disabledButtonBorder, colors$1.disabledButtonBorder, function (p) { return p.hoverRowBg ?
|
|
7727
7841
|
".tr:not(.header.tr, .table-footer.tr):hover {\n background: ".concat(typeof p.hoverRowBg === 'string'
|
|
7728
7842
|
? p.hoverRowBg
|
|
7729
7843
|
: getThemeColor(p, 'tableHeaderBg', '#F6FEFF'), ";\n }") : ''; }, function (p) { return p.selectedRowIndex && p.selectedRowStyle ?
|
|
@@ -7845,7 +7959,7 @@ var createAnimationLeftStyle = function (p) {
|
|
|
7845
7959
|
};
|
|
7846
7960
|
var ContainerStyled = styled__default.default(Csku)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n &&& {\n position: relative;\n background: ", ";\n width: ", ";\n padding: 0.35rem;\n border-radius: 1.8rem;\n cursor: pointer;\n transition: background .3s;\n\n @keyframes switch-slide-to-right {\n from { left: 0; }\n to {\n left: ", ";\n }\n }\n \n @keyframes switch-slide-to-left {\n from {\n left: ", ";\n }\n to { left: 0; }\n }\n }"], ["\n &&& {\n position: relative;\n background: ", ";\n width: ", ";\n padding: 0.35rem;\n border-radius: 1.8rem;\n cursor: pointer;\n transition: background .3s;\n\n @keyframes switch-slide-to-right {\n from { left: 0; }\n to {\n left: ", ";\n }\n }\n \n @keyframes switch-slide-to-left {\n from {\n left: ", ";\n }\n to { left: 0; }\n }\n }"])), function (p) { return p.selected
|
|
7847
7961
|
? getThemeColor(p, 'teal.main', 'var(--color-primary1-main)')
|
|
7848
|
-
: getThemeColor(p, 'teal.20', colors.teal['20']); }, function (p) { return p.stretch
|
|
7962
|
+
: getThemeColor(p, 'teal.20', colors$1.teal['20']); }, function (p) { return p.stretch
|
|
7849
7963
|
? '100%'
|
|
7850
7964
|
: "".concat(stripUnit(toggleSizes[p.size || 'medium'].height) * 2.5, "px"); }, createAnimationLeftStyle, createAnimationLeftStyle);
|
|
7851
7965
|
var ToggleSwitchDotStyled = styled__default.default(Csku)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n &&& {\n position: relative;\n background: #FFFFFF;\n width: ", ";\n height: ", ";\n border-radius: 50%;\n\n animation: ", ";\n }\n"], ["\n &&& {\n position: relative;\n background: #FFFFFF;\n width: ", ";\n height: ", ";\n border-radius: 50%;\n\n animation: ", ";\n }\n"])), function (p) { return toggleSizes[p.size || 'medium'].height; }, function (p) { return toggleSizes[p.size || 'medium'].height; }, function (p) { return p.selected
|
|
@@ -7978,6 +8092,7 @@ exports.Collapsibles = Collapsibles;
|
|
|
7978
8092
|
exports.Column = Column;
|
|
7979
8093
|
exports.ColumnSelectIcon = ColumnSelectIcon;
|
|
7980
8094
|
exports.CommentIcon = CommentIcon;
|
|
8095
|
+
exports.CommonskuMainLogo = CommonskuMainLogo;
|
|
7981
8096
|
exports.CommunityIcon = CommunityIcon;
|
|
7982
8097
|
exports.CompletedCheckmarkIcon = CompletedCheckmarkIcon;
|
|
7983
8098
|
exports.ConfirmAlertPopup = ConfirmAlertPopup;
|
|
@@ -8114,6 +8229,7 @@ exports.RadioIcon = RadioIcon;
|
|
|
8114
8229
|
exports.RadioLabel = RadioLabel;
|
|
8115
8230
|
exports.ReceiptLongIcon = ReceiptLongIcon;
|
|
8116
8231
|
exports.RenderChild = RenderChild;
|
|
8232
|
+
exports.ResizableIcon = ResizableIcon;
|
|
8117
8233
|
exports.ResponsiveTable = ResponsiveTable;
|
|
8118
8234
|
exports.Row = Row;
|
|
8119
8235
|
exports.SHARED_STYLE_MAPS = SHARED_STYLE_MAPS;
|
|
@@ -8131,6 +8247,8 @@ exports.SimpleWindowedTable = SimpleWindowedTable;
|
|
|
8131
8247
|
exports.SimpleWindowedTableStyles = SimpleWindowedTableStyles;
|
|
8132
8248
|
exports.SizerCss = SizerCss;
|
|
8133
8249
|
exports.SizerWrapper = SizerWrapper;
|
|
8250
|
+
exports.SkubotLogo = SkubotLogo;
|
|
8251
|
+
exports.SkubotSpinner = SkubotSpinner;
|
|
8134
8252
|
exports.SlideInIcon = SlideInIcon;
|
|
8135
8253
|
exports.Sparkles = Sparkles;
|
|
8136
8254
|
exports.Spinner = Spinner;
|
|
@@ -8187,7 +8305,7 @@ exports.VirtualTable = VirtualTable;
|
|
|
8187
8305
|
exports.VirtualTableStyles = VirtualTableStyles;
|
|
8188
8306
|
exports.Wrapper = Wrapper$4;
|
|
8189
8307
|
exports.XIcon = XIcon;
|
|
8190
|
-
exports.colors = colors;
|
|
8308
|
+
exports.colors = colors$1;
|
|
8191
8309
|
exports.createMeasurementStyle = createMeasurementStyle;
|
|
8192
8310
|
exports.datepickerStyles = datepickerStyles;
|
|
8193
8311
|
exports.fontFamilies = fontFamilies;
|