@commonsku/styles 1.17.8 → 1.17.10
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 +317 -175
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +32 -1
- package/dist/index.mjs +313 -175
- 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/EmptyStateArrow.d.ts +6 -0
- package/dist/styles/icons/EmptyStateArrow.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") {
|
|
@@ -2810,6 +2904,45 @@ function SlideInIcon(_a) {
|
|
|
2810
2904
|
React__default.default.createElement("path", { d: "M3 20.99L21 20.99C22.1 20.99 23 20.09 23 18.99L23 15L21 15L21 19.01L3 19.01L3 4.97999L21 4.97999L21 8.99999L23 8.99999L23 4.98999C23 3.88999 22.1 3.00999 21 3.00999L3 3.00999C1.9 3.00999 1 3.88999 1 4.98999L1 18.99C1 20.1 1.9 20.99 3 20.99ZM13 7.99999L9 12L13 16L13 13L23 13L23 11L13 11L13 7.99999ZM3 20.99L21 20.99C22.1 20.99 23 20.09 23 18.99L23 15L21 15L21 19.01L3 19.01L3 4.97999L21 4.97999L21 8.99999L23 8.99999L23 4.98999C23 3.88999 22.1 3.00999 21 3.00999L3 3.00999C1.9 3.00999 1 3.88999 1 4.98999L1 18.99C1 20.1 1.9 20.99 3 20.99ZM13 7.99999L9 12L13 16L13 13L23 13L23 11L13 11L13 7.99999Z", fill: color }));
|
|
2811
2905
|
}
|
|
2812
2906
|
|
|
2907
|
+
function EmptyStateArrowIcon(_a) {
|
|
2908
|
+
var _b = _a.direction, direction = _b === void 0 ? "Up" : _b; _a.altText; var props = __rest(_a, ["direction", "altText"]);
|
|
2909
|
+
var d1, d2, x1, x2, y1, y2;
|
|
2910
|
+
var arrowColor = teal['30'];
|
|
2911
|
+
switch (direction) {
|
|
2912
|
+
case "down":
|
|
2913
|
+
d1 = "m9.239 20.009 2.704.784c.037.011.077.011.114 0l2.704-.784c.164-.048.304.114.207.24l-2.818 3.68a.196.196 0 0 1-.3 0l-2.818-3.68c-.097-.125.043-.288.207-.24Z";
|
|
2914
|
+
d2 = "M5.15 0c5.411 2.2 6.084 16.033 6.084 21h1.57c0-5.275 0-18.5 6.246-21H5.15Z";
|
|
2915
|
+
x1 = 12.636;
|
|
2916
|
+
x2 = 12.636;
|
|
2917
|
+
y1 = 19.98;
|
|
2918
|
+
y2 = 0;
|
|
2919
|
+
break;
|
|
2920
|
+
case "up":
|
|
2921
|
+
d1 = "m14.761 3.991-2.704-.784a.205.205 0 0 0-.114 0L9.24 3.99c-.164.048-.304-.115-.207-.24L11.85.07a.196.196 0 0 1 .3 0l2.818 3.68c.097.126-.043.288-.207.24Z";
|
|
2922
|
+
d2 = "M18.85 24c-5.411-2.2-6.084-16.033-6.084-21h-1.57c0 5.276 0 18.5-6.246 21h13.9Z";
|
|
2923
|
+
x1 = 11.364;
|
|
2924
|
+
x2 = 11.364;
|
|
2925
|
+
y1 = 4.02;
|
|
2926
|
+
y2 = 24;
|
|
2927
|
+
break;
|
|
2928
|
+
case "up-right":
|
|
2929
|
+
d1 = "m22.406 2.203-1.173-.394a.145.145 0 0 0-.092 0l-1.173.394c-.134.044-.247-.108-.169-.227l1.266-1.91a.146.146 0 0 1 .244 0l1.265 1.91c.079.119-.035.271-.168.227Z";
|
|
2930
|
+
d2 = "M6.389 23.515C16.608 15.176 21.225 7.772 21.657 1.721l-.877-.064c.357 2.992-8.819 10.581-19.247 15.372l4.856 6.486Z";
|
|
2931
|
+
x1 = 21.05;
|
|
2932
|
+
x2 = 14.656;
|
|
2933
|
+
y1 = 2.11;
|
|
2934
|
+
y2 = 12.611;
|
|
2935
|
+
break;
|
|
2936
|
+
}
|
|
2937
|
+
return React__default.default.createElement(SVG$1, __assign({ height: 500, width: 500, viewBox: "0 0 633 633", "aria-labelledby": "Arrow" }, props),
|
|
2938
|
+
React__default.default.createElement("path", { fill: arrowColor, d: d1 }),
|
|
2939
|
+
React__default.default.createElement("path", { fill: "url(#a)", d: d2 }),
|
|
2940
|
+
React__default.default.createElement("defs", null,
|
|
2941
|
+
React__default.default.createElement("linearGradient", { id: "a", x1: x1, x2: x2, y1: y1, y2: y2, gradientUnits: "userSpaceOnUse" },
|
|
2942
|
+
React__default.default.createElement("stop", { stopColor: arrowColor }),
|
|
2943
|
+
React__default.default.createElement("stop", { offset: 1, stopColor: arrowColor, stopOpacity: 0 }))));
|
|
2944
|
+
}
|
|
2945
|
+
|
|
2813
2946
|
function TagIcon(_a) {
|
|
2814
2947
|
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"]);
|
|
2815
2948
|
return React__default.default.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "TagIcon" }, props),
|
|
@@ -2878,7 +3011,7 @@ var avatarColors = {
|
|
|
2878
3011
|
};
|
|
2879
3012
|
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), ";"); });
|
|
2880
3013
|
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"])));
|
|
2881
|
-
var AvatarInitials = styled__default.default.p(templateObject_3$
|
|
3014
|
+
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); });
|
|
2882
3015
|
var Avatar = function (_a) {
|
|
2883
3016
|
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"]);
|
|
2884
3017
|
if (pic) {
|
|
@@ -2894,7 +3027,7 @@ var Avatar = function (_a) {
|
|
|
2894
3027
|
React__default.default.createElement(AvatarInitials, { size: size }, initials !== null && initials !== void 0 ? initials : children));
|
|
2895
3028
|
}
|
|
2896
3029
|
};
|
|
2897
|
-
var templateObject_1$R, templateObject_2$v, templateObject_3$
|
|
3030
|
+
var templateObject_1$R, templateObject_2$v, templateObject_3$k;
|
|
2898
3031
|
|
|
2899
3032
|
var getTotalCols = function (p) { return p.totalCols || 12; };
|
|
2900
3033
|
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) {
|
|
@@ -2946,14 +3079,14 @@ var Row = styled__default.default.div(templateObject_1$P || (templateObject_1$P
|
|
|
2946
3079
|
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);
|
|
2947
3080
|
var templateObject_1$P, templateObject_2$t;
|
|
2948
3081
|
|
|
2949
|
-
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); });
|
|
3082
|
+
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); });
|
|
2950
3083
|
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);
|
|
2951
|
-
var H2 = styled__default.default.h2(templateObject_3$
|
|
2952
|
-
var H3 = styled__default.default.h3(templateObject_4$
|
|
3084
|
+
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);
|
|
3085
|
+
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);
|
|
2953
3086
|
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);
|
|
2954
3087
|
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);
|
|
2955
3088
|
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);
|
|
2956
|
-
var templateObject_1$O, templateObject_2$s, templateObject_3$
|
|
3089
|
+
var templateObject_1$O, templateObject_2$s, templateObject_3$j, templateObject_4$e, templateObject_5$9, templateObject_6$9, templateObject_7$3;
|
|
2957
3090
|
|
|
2958
3091
|
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);
|
|
2959
3092
|
var Box = function (_a) {
|
|
@@ -2968,13 +3101,13 @@ var Box = function (_a) {
|
|
|
2968
3101
|
};
|
|
2969
3102
|
var templateObject_1$N;
|
|
2970
3103
|
|
|
2971
|
-
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);
|
|
3104
|
+
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);
|
|
2972
3105
|
var templateObject_1$M;
|
|
2973
3106
|
|
|
2974
|
-
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);
|
|
2975
|
-
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); });
|
|
2976
|
-
var ThumbsContainer = styled__default.default.aside(templateObject_3$
|
|
2977
|
-
var Thumb = styled__default.default.div(templateObject_4$
|
|
3107
|
+
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);
|
|
3108
|
+
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); });
|
|
3109
|
+
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"])));
|
|
3110
|
+
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); });
|
|
2978
3111
|
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"])));
|
|
2979
3112
|
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"])));
|
|
2980
3113
|
var DropArea = function (_a) {
|
|
@@ -3033,7 +3166,7 @@ function DropzonedPreviews(_a) {
|
|
|
3033
3166
|
? React__default.default.createElement(ThumbsContainer, null, thumbs)
|
|
3034
3167
|
: React__default.default.createElement(PlaceHolder, null, placeholder))));
|
|
3035
3168
|
}
|
|
3036
|
-
var templateObject_1$L, templateObject_2$r, templateObject_3$
|
|
3169
|
+
var templateObject_1$L, templateObject_2$r, templateObject_3$i, templateObject_4$d, templateObject_5$8, templateObject_6$8;
|
|
3037
3170
|
|
|
3038
3171
|
/*
|
|
3039
3172
|
|
|
@@ -3111,18 +3244,18 @@ var getSizeStyle$1 = function (style, defaults) {
|
|
|
3111
3244
|
};
|
|
3112
3245
|
};
|
|
3113
3246
|
var getVariantStyles = function (props, variant) {
|
|
3114
|
-
var white = getThemeColor(props, 'neutrals.white', colors.neutrals.white);
|
|
3115
|
-
var disabled = getThemeColor(props, 'neutrals.50', colors.errors['50']);
|
|
3116
|
-
var disabledText = getThemeColor(props, 'neutrals.70', colors.errors['70']);
|
|
3117
|
-
var primary = getThemeColor(props, 'primary1.main', colors.primary1.main);
|
|
3118
|
-
var primaryDark = getThemeColor(props, 'primary1.75', colors.primary1['75']);
|
|
3119
|
-
var primaryLight = getThemeColor(props, 'primary1.20', colors.primary1['20']);
|
|
3120
|
-
var cta = getThemeColor(props, 'secondary1.main', colors.secondary1.main);
|
|
3121
|
-
var ctaDark = getThemeColor(props, 'secondary1.80', colors.secondary1['80']);
|
|
3247
|
+
var white = getThemeColor(props, 'neutrals.white', colors$1.neutrals.white);
|
|
3248
|
+
var disabled = getThemeColor(props, 'neutrals.50', colors$1.errors['50']);
|
|
3249
|
+
var disabledText = getThemeColor(props, 'neutrals.70', colors$1.errors['70']);
|
|
3250
|
+
var primary = getThemeColor(props, 'primary1.main', colors$1.primary1.main);
|
|
3251
|
+
var primaryDark = getThemeColor(props, 'primary1.75', colors$1.primary1['75']);
|
|
3252
|
+
var primaryLight = getThemeColor(props, 'primary1.20', colors$1.primary1['20']);
|
|
3253
|
+
var cta = getThemeColor(props, 'secondary1.main', colors$1.secondary1.main);
|
|
3254
|
+
var ctaDark = getThemeColor(props, 'secondary1.80', colors$1.secondary1['80']);
|
|
3122
3255
|
// const ctaLight = getThemeColor(props, 'secondary1.20', colors.secondary1['20']);
|
|
3123
|
-
var error = getThemeColor(props, 'errors.main', colors.errors.main);
|
|
3124
|
-
var errorLight = getThemeColor(props, 'errors.10', colors.errors['10']);
|
|
3125
|
-
var errorDark = getThemeColor(props, 'errors.70', colors.errors['70']);
|
|
3256
|
+
var error = getThemeColor(props, 'errors.main', colors$1.errors.main);
|
|
3257
|
+
var errorLight = getThemeColor(props, 'errors.10', colors$1.errors['10']);
|
|
3258
|
+
var errorDark = getThemeColor(props, 'errors.70', colors$1.errors['70']);
|
|
3126
3259
|
var customColor = props.variantColor || white;
|
|
3127
3260
|
var customBorderColor = props.variantBorderColor;
|
|
3128
3261
|
var customBg = props.variantBg;
|
|
@@ -3332,12 +3465,12 @@ var getVariantStyles = function (props, variant) {
|
|
|
3332
3465
|
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) {
|
|
3333
3466
|
var secondary = _a.secondary, cta = _a.cta, props = __rest(_a, ["secondary", "cta"]);
|
|
3334
3467
|
return secondary ? "transparent" :
|
|
3335
|
-
cta ? getThemeColor(props, 'cta', colors.cta) : getThemeColor(props, 'primary', colors.teal.main);
|
|
3336
|
-
}, 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) {
|
|
3468
|
+
cta ? getThemeColor(props, 'cta', colors$1.cta) : getThemeColor(props, 'primary', colors$1.teal.main);
|
|
3469
|
+
}, 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) {
|
|
3337
3470
|
var secondary = _a.secondary, cta = _a.cta, props = __rest(_a, ["secondary", "cta"]);
|
|
3338
|
-
return secondary ? getThemeColor(props, 'primary', colors.primary) :
|
|
3339
|
-
cta ? getThemeColor(props, 'cta', colors.cta) : getThemeColor(props, 'primary', colors.primary);
|
|
3340
|
-
}, 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);
|
|
3471
|
+
return secondary ? getThemeColor(props, 'primary', colors$1.primary) :
|
|
3472
|
+
cta ? getThemeColor(props, 'cta', colors$1.cta) : getThemeColor(props, 'primary', colors$1.primary);
|
|
3473
|
+
}, 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);
|
|
3341
3474
|
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);
|
|
3342
3475
|
var presets = {
|
|
3343
3476
|
edit: {
|
|
@@ -3488,8 +3621,8 @@ var templateObject_1$J;
|
|
|
3488
3621
|
|
|
3489
3622
|
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) {
|
|
3490
3623
|
return p.error
|
|
3491
|
-
? getThemeColor(p, 'errors.main', colors.errors.main)
|
|
3492
|
-
: getThemeColor(p, 'input.iconWrapper.background', colors.input.iconWrapper.background);
|
|
3624
|
+
? getThemeColor(p, 'errors.main', colors$1.errors.main)
|
|
3625
|
+
: getThemeColor(p, 'input.iconWrapper.background', colors$1.input.iconWrapper.background);
|
|
3493
3626
|
}, 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
|
|
3494
3627
|
? "background: ".concat(getThemeColor(p, 'input.iconWrapper.hover.background'), ";")
|
|
3495
3628
|
: ''; }, function (p) { return p.isActive
|
|
@@ -3514,7 +3647,7 @@ var InputIconLabelContainer = styled__default.default.div(templateObject_2$p ||
|
|
|
3514
3647
|
},
|
|
3515
3648
|
};
|
|
3516
3649
|
});
|
|
3517
|
-
var Input = styled__default.default.input(templateObject_3$
|
|
3650
|
+
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) {
|
|
3518
3651
|
var styles = {
|
|
3519
3652
|
marginBottom: p.noMargin ? 0 : "1rem",
|
|
3520
3653
|
fontSize: '1rem',
|
|
@@ -3584,11 +3717,11 @@ var LabeledIconInput = React__default.default.forwardRef(function (_a, ref) {
|
|
|
3584
3717
|
var containerRef = React.useRef(null);
|
|
3585
3718
|
var _g = React.useState(false), isActive = _g[0], setIsActive = _g[1];
|
|
3586
3719
|
var _h = React.useState(false), isHovering = _h[0], setIsHovering = _h[1];
|
|
3587
|
-
var activeBorderColor = getThemeColor(props, 'input.active.border', colors.input.active.border);
|
|
3588
|
-
var activeTextColor = colors.input.active.text;
|
|
3589
|
-
var errorBorderColor = getThemeColor(props, 'input.error.border', colors.input.error.border);
|
|
3590
|
-
var disabledBackground = colors.input.disabled.background;
|
|
3591
|
-
var disabledTextColor = colors.input.disabled.text;
|
|
3720
|
+
var activeBorderColor = getThemeColor(props, 'input.active.border', colors$1.input.active.border);
|
|
3721
|
+
var activeTextColor = colors$1.input.active.text;
|
|
3722
|
+
var errorBorderColor = getThemeColor(props, 'input.error.border', colors$1.input.error.border);
|
|
3723
|
+
var disabledBackground = colors$1.input.disabled.background;
|
|
3724
|
+
var disabledTextColor = colors$1.input.disabled.text;
|
|
3592
3725
|
var activeStyles = !isActive ? {} : {
|
|
3593
3726
|
borderColor: error ? errorBorderColor : activeBorderColor,
|
|
3594
3727
|
color: getThemeColor(props, 'input.active.text', activeTextColor),
|
|
@@ -3616,16 +3749,16 @@ var LabeledIconInput = React__default.default.forwardRef(function (_a, ref) {
|
|
|
3616
3749
|
iconProps['color'] = errorBorderColor;
|
|
3617
3750
|
}
|
|
3618
3751
|
else if (disabled) {
|
|
3619
|
-
iconProps['fill'] = colors.input.icon.disabled.fill;
|
|
3620
|
-
iconProps['color'] = colors.input.icon.disabled.fill;
|
|
3752
|
+
iconProps['fill'] = colors$1.input.icon.disabled.fill;
|
|
3753
|
+
iconProps['color'] = colors$1.input.icon.disabled.fill;
|
|
3621
3754
|
}
|
|
3622
3755
|
else if (isHovering) {
|
|
3623
|
-
iconProps['fill'] = colors.input.icon.hover.fill;
|
|
3624
|
-
iconProps['color'] = colors.input.icon.hover.fill;
|
|
3756
|
+
iconProps['fill'] = colors$1.input.icon.hover.fill;
|
|
3757
|
+
iconProps['color'] = colors$1.input.icon.hover.fill;
|
|
3625
3758
|
}
|
|
3626
3759
|
else if (isActive) {
|
|
3627
|
-
iconProps['fill'] = colors.input.icon.active.fill;
|
|
3628
|
-
iconProps['color'] = colors.input.icon.active.fill;
|
|
3760
|
+
iconProps['fill'] = colors$1.input.icon.active.fill;
|
|
3761
|
+
iconProps['color'] = colors$1.input.icon.active.fill;
|
|
3629
3762
|
}
|
|
3630
3763
|
return React__default.default.cloneElement(Icon, iconProps);
|
|
3631
3764
|
}, [Icon, error, disabled, errorBorderColor, isActive, isHovering, iconColor]);
|
|
@@ -3653,9 +3786,9 @@ var LabeledIconInput = React__default.default.forwardRef(function (_a, ref) {
|
|
|
3653
3786
|
}, style: __assign(__assign(__assign(__assign({}, activeStyles), errorStyles), disabledStyles), (props.style || {})), onMouseOver: function () { return setIsHovering(true); }, onMouseLeave: function () { return setIsHovering(false); } }),
|
|
3654
3787
|
iconPosition !== 'right' ? React__default.default.createElement(InputIconLabel, { style: __assign({ marginBottom: 0 }, iconLabelStyles), isActive: isActive, isDisabled: disabled, isHover: isHovering }, NewIcon) : null,
|
|
3655
3788
|
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 }),
|
|
3656
|
-
iconPosition === 'right' ? React__default.default.createElement(InputIconLabel, { style: { marginBottom: 0, padding: 6
|
|
3789
|
+
iconPosition === 'right' ? React__default.default.createElement(InputIconLabel, { style: __assign({ marginBottom: 0, padding: 6 }, iconLabelStyles), isActive: isActive, isDisabled: disabled, isHover: isHovering, iconPosition: iconPosition }, NewIcon) : null)));
|
|
3657
3790
|
});
|
|
3658
|
-
var CheckboxLabel = styled__default.default.label(templateObject_4$
|
|
3791
|
+
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; });
|
|
3659
3792
|
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"])));
|
|
3660
3793
|
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);
|
|
3661
3794
|
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);
|
|
@@ -3682,7 +3815,7 @@ var LabeledRadioInButton = function (_a) {
|
|
|
3682
3815
|
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"]);
|
|
3683
3816
|
return (React__default.default.createElement(LabeledRadio, { label: label, checked: checked, disabled: disabled, onChange: onChange, readOnly: readOnly, defaultValue: defaultValue, labelStyle: {
|
|
3684
3817
|
padding: "13px 40px",
|
|
3685
|
-
backgroundColor: disabled ? neutrals['40'] : checked ? colors.white : teal['20'],
|
|
3818
|
+
backgroundColor: disabled ? neutrals['40'] : checked ? colors$1.white : teal['20'],
|
|
3686
3819
|
border: disabled ? "solid 3px ".concat(neutrals['40']) : checked ? "solid 3px ".concat(teal.main) : "solid 3px ".concat(teal['20']),
|
|
3687
3820
|
borderRadius: "200px",
|
|
3688
3821
|
color: disabled ? neutrals['70'] : teal.main,
|
|
@@ -3712,7 +3845,7 @@ var LabeledCheckbox = React__default.default.forwardRef(function (_a, ref) {
|
|
|
3712
3845
|
label,
|
|
3713
3846
|
React__default.default.createElement(Radio, __assign({ ref: ref, name: name, type: "checkbox", checked: checked, isHovering: isHovering, onChange: disabled ? undefined : onChange }, props))));
|
|
3714
3847
|
});
|
|
3715
|
-
var templateObject_1$I, templateObject_2$p, templateObject_3$
|
|
3848
|
+
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;
|
|
3716
3849
|
|
|
3717
3850
|
var Padding = styled__default.default.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n padding: 20px;\n ", "\n"], ["\n padding: 20px;\n ", "\n"])), SharedStyles);
|
|
3718
3851
|
var templateObject_1$H;
|
|
@@ -3781,23 +3914,23 @@ function skuSelectStyles(props) {
|
|
|
3781
3914
|
return __assign(__assign({}, provided), props.containerStyles);
|
|
3782
3915
|
},
|
|
3783
3916
|
clearIndicator: function (provided, state) {
|
|
3784
|
-
return __assign(__assign(__assign({}, provided), { color: getThemeColor(props, 'select.clearIcon.color', colors.select.clearIcon.color), ':hover': {
|
|
3785
|
-
color: getThemeColor(props, 'select.clearIcon.color', colors.select.clearIcon.color),
|
|
3917
|
+
return __assign(__assign(__assign({}, provided), { color: getThemeColor(props, 'select.clearIcon.color', colors$1.select.clearIcon.color), ':hover': {
|
|
3918
|
+
color: getThemeColor(props, 'select.clearIcon.color', colors$1.select.clearIcon.color),
|
|
3786
3919
|
} }), props.clearIndicatorStyles);
|
|
3787
3920
|
},
|
|
3788
3921
|
dropdownIndicator: function (provided, state) {
|
|
3789
3922
|
var styles = {
|
|
3790
3923
|
color: props.error
|
|
3791
|
-
? getThemeColor(props, 'select.dropdownIcon.error.color', colors.select.dropdownIcon.error.color)
|
|
3792
|
-
: getThemeColor(props, 'select.dropdownIcon.color', colors.select.dropdownIcon.color),
|
|
3924
|
+
? getThemeColor(props, 'select.dropdownIcon.error.color', colors$1.select.dropdownIcon.error.color)
|
|
3925
|
+
: getThemeColor(props, 'select.dropdownIcon.color', colors$1.select.dropdownIcon.color),
|
|
3793
3926
|
':hover': {
|
|
3794
3927
|
color: props.error
|
|
3795
|
-
? getThemeColor(props, 'select.dropdownIcon.error.color', colors.select.dropdownIcon.error.color)
|
|
3796
|
-
: getThemeColor(props, 'select.dropdownIcon.color', colors.select.dropdownIcon.color),
|
|
3928
|
+
? getThemeColor(props, 'select.dropdownIcon.error.color', colors$1.select.dropdownIcon.error.color)
|
|
3929
|
+
: getThemeColor(props, 'select.dropdownIcon.color', colors$1.select.dropdownIcon.color),
|
|
3797
3930
|
},
|
|
3798
3931
|
};
|
|
3799
3932
|
if (state.isDisabled) {
|
|
3800
|
-
styles['color'] = getThemeColor(props, 'select.dropdownIcon.disabled', colors.select.dropdownIcon.disabled);
|
|
3933
|
+
styles['color'] = getThemeColor(props, 'select.dropdownIcon.disabled', colors$1.select.dropdownIcon.disabled);
|
|
3801
3934
|
}
|
|
3802
3935
|
return __assign(__assign(__assign({}, provided), styles), props.dropdownIndicatorStyles);
|
|
3803
3936
|
},
|
|
@@ -3807,8 +3940,8 @@ function skuSelectStyles(props) {
|
|
|
3807
3940
|
},
|
|
3808
3941
|
input: function (provided, state) {
|
|
3809
3942
|
return __assign(__assign(__assign({}, provided), { height: 'auto', borderColor: props.error
|
|
3810
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3811
|
-
: getThemeColor(props, 'select.border', colors.select.border) }), props.inputStyles);
|
|
3943
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3944
|
+
: getThemeColor(props, 'select.border', colors$1.select.border) }), props.inputStyles);
|
|
3812
3945
|
},
|
|
3813
3946
|
control: function (provided, state) {
|
|
3814
3947
|
var styles = {
|
|
@@ -3818,8 +3951,8 @@ function skuSelectStyles(props) {
|
|
|
3818
3951
|
styles['borderWidth'] = '1px';
|
|
3819
3952
|
styles['borderStyle'] = 'solid';
|
|
3820
3953
|
styles['borderColor'] = props.error
|
|
3821
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3822
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
3954
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3955
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3823
3956
|
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 ");
|
|
3824
3957
|
if (state.selectProps.menuPlacement === 'bottom') {
|
|
3825
3958
|
styles['borderBottomRightRadius'] = 0;
|
|
@@ -3833,31 +3966,31 @@ function skuSelectStyles(props) {
|
|
|
3833
3966
|
else if (!state.menuIsOpen && state.isFocused) {
|
|
3834
3967
|
styles['borderWidth'] = '1px';
|
|
3835
3968
|
styles['borderColor'] = props.error
|
|
3836
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3837
|
-
: 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);
|
|
3838
3971
|
styles['boxShadow'] = "0 0 0 1px ".concat(props.error
|
|
3839
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3840
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border));
|
|
3972
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3973
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border));
|
|
3841
3974
|
}
|
|
3842
3975
|
else if (state.isDisabled) {
|
|
3843
|
-
styles['backgroundColor'] = getThemeColor(props, 'select.disabled.background', colors.select.disabled.background);
|
|
3844
|
-
styles['borderColor'] = getThemeColor(props, 'select.disabled.border', colors.select.disabled.border);
|
|
3976
|
+
styles['backgroundColor'] = getThemeColor(props, 'select.disabled.background', colors$1.select.disabled.background);
|
|
3977
|
+
styles['borderColor'] = getThemeColor(props, 'select.disabled.border', colors$1.select.disabled.border);
|
|
3845
3978
|
}
|
|
3846
3979
|
else {
|
|
3847
3980
|
styles['borderColor'] = props.error
|
|
3848
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3981
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3849
3982
|
: provided.borderColor;
|
|
3850
3983
|
}
|
|
3851
3984
|
return (__assign(__assign(__assign(__assign({}, provided), styles), { ':hover': {
|
|
3852
3985
|
borderColor: props.error
|
|
3853
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3854
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border),
|
|
3986
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3987
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border),
|
|
3855
3988
|
} }), props.controlStyles));
|
|
3856
3989
|
},
|
|
3857
3990
|
menu: function (provided, state) {
|
|
3858
3991
|
var borderColor = props.error
|
|
3859
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3860
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
3992
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3993
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3861
3994
|
var styles = {
|
|
3862
3995
|
zIndex: 10,
|
|
3863
3996
|
position: props.menuRelative ? 'relative' : provided.position,
|
|
@@ -3899,7 +4032,7 @@ function skuSelectStyles(props) {
|
|
|
3899
4032
|
},
|
|
3900
4033
|
};
|
|
3901
4034
|
}
|
|
3902
|
-
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) }) })); }; };
|
|
4035
|
+
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) }) })); }; };
|
|
3903
4036
|
// duplicate styles to overide .resku global styles
|
|
3904
4037
|
// : React.ForwardRefExoticComponent<SKUSelectProps & React.RefAttributes<BaseSelect>>
|
|
3905
4038
|
// 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<...>>
|
|
@@ -4006,8 +4139,8 @@ var SidePanel = function (_a) {
|
|
|
4006
4139
|
backdrop && visible ? React__default.default.createElement(Backdrop, null) : null);
|
|
4007
4140
|
};
|
|
4008
4141
|
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"])));
|
|
4009
|
-
var Name = styled__default.default.div(templateObject_3$
|
|
4010
|
-
var Position = styled__default.default.div(templateObject_4$
|
|
4142
|
+
var Name = styled__default.default.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
4143
|
+
var Position = styled__default.default.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n font-size: .8em;\n"], ["\n font-size: .8em;\n"])));
|
|
4011
4144
|
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"])));
|
|
4012
4145
|
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);
|
|
4013
4146
|
var PanelContact = function (_a) {
|
|
@@ -4044,12 +4177,12 @@ var PanelTileContact = function (_a) {
|
|
|
4044
4177
|
p.phone_extension && 'x' + p.phone_extension) : '';
|
|
4045
4178
|
}) : null)));
|
|
4046
4179
|
};
|
|
4047
|
-
var templateObject_1$C, templateObject_2$m, templateObject_3$
|
|
4180
|
+
var templateObject_1$C, templateObject_2$m, templateObject_3$g, templateObject_4$b, templateObject_5$6, templateObject_6$6;
|
|
4048
4181
|
|
|
4049
4182
|
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"])));
|
|
4050
4183
|
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"; });
|
|
4051
|
-
var Table = styled__default.default.table.attrs(function () { return ({ cellPadding: 0, cellSpacing: 0 }); })(templateObject_3$
|
|
4052
|
-
var TH = styled__default.default.th(templateObject_4$
|
|
4184
|
+
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);
|
|
4185
|
+
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);
|
|
4053
4186
|
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);
|
|
4054
4187
|
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;'; });
|
|
4055
4188
|
var THead = styled__default.default.thead(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n &&& {\n ", "\n }\n"], ["\n &&& {\n ", "\n }\n"])), SizerCss);
|
|
@@ -4071,7 +4204,7 @@ var THSorted = function (_a) {
|
|
|
4071
4204
|
" ",
|
|
4072
4205
|
children));
|
|
4073
4206
|
};
|
|
4074
|
-
var templateObject_1$B, templateObject_2$l, templateObject_3$
|
|
4207
|
+
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;
|
|
4075
4208
|
|
|
4076
4209
|
var useClickOutside = function (props) {
|
|
4077
4210
|
var ref = props.ref, _a = props.eventType, eventType = _a === void 0 ? 'mousedown' : _a, onClick = props.onClick, onCleanup = props.onCleanup;
|
|
@@ -4326,8 +4459,8 @@ var useFallbackRef = function (forwardedRef) {
|
|
|
4326
4459
|
|
|
4327
4460
|
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; });
|
|
4328
4461
|
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);
|
|
4329
|
-
var PopupHeader = styled__default.default.div(templateObject_3$
|
|
4330
|
-
var ChevronButton = styled__default.default(ChevronIcon)(templateObject_4$
|
|
4462
|
+
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);
|
|
4463
|
+
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;'; });
|
|
4331
4464
|
var PopupContainer = function (_a) {
|
|
4332
4465
|
var children = _a.children;
|
|
4333
4466
|
var ref = React__default.default.useRef(document$1.createElement('div'));
|
|
@@ -4400,12 +4533,12 @@ var ChevronPopupWindow = React__default.default.forwardRef(function (props, ref)
|
|
|
4400
4533
|
var ChevronPopup = function (props) {
|
|
4401
4534
|
return React__default.default.createElement(Popup, __assign({ PopupWindowComponent: ChevronPopupWindow }, props));
|
|
4402
4535
|
};
|
|
4403
|
-
var templateObject_1$A, templateObject_2$k, templateObject_3$
|
|
4536
|
+
var templateObject_1$A, templateObject_2$k, templateObject_3$e, templateObject_4$9;
|
|
4404
4537
|
|
|
4405
4538
|
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);
|
|
4406
4539
|
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);
|
|
4407
|
-
var GridCell = styled__default.default.div(templateObject_3$
|
|
4408
|
-
var FieldError = styled__default.default.p(templateObject_4$
|
|
4540
|
+
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'; });
|
|
4541
|
+
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']);
|
|
4409
4542
|
var defaultTransform = function (v) { return v.target ? v.target.value : v.currentTarget ? v.currentTarget.value : v.value; };
|
|
4410
4543
|
var Column = function (_a) {
|
|
4411
4544
|
_a.name; var title = _a.title; _a.children; var centerContent = _a.centerContent; _a.transform;
|
|
@@ -4588,14 +4721,14 @@ function GridTable(_a) {
|
|
|
4588
4721
|
Adding && NewRow,
|
|
4589
4722
|
onAdd && !Adding && AddNew)));
|
|
4590
4723
|
}
|
|
4591
|
-
var templateObject_1$z, templateObject_2$j, templateObject_3$
|
|
4724
|
+
var templateObject_1$z, templateObject_2$j, templateObject_3$d, templateObject_4$8;
|
|
4592
4725
|
|
|
4593
4726
|
var tabSizes = {
|
|
4594
4727
|
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 "]))),
|
|
4595
4728
|
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 "]))),
|
|
4596
4729
|
};
|
|
4597
|
-
var TabBar = styled__default.default.ul(templateObject_3$
|
|
4598
|
-
var Tab = styled__default.default.li(templateObject_4$
|
|
4730
|
+
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);
|
|
4731
|
+
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"
|
|
4599
4732
|
/*
|
|
4600
4733
|
|
|
4601
4734
|
Here's how you use this:
|
|
@@ -4625,7 +4758,7 @@ var Tab = styled__default.default.li(templateObject_4$8 || (templateObject_4$8 =
|
|
|
4625
4758
|
// </div>
|
|
4626
4759
|
// }
|
|
4627
4760
|
])), function (props) { return props.selected
|
|
4628
|
-
? "5px solid ".concat(props.variant === 'secondary' ? colors.secondary1.main : colors.primary1.main)
|
|
4761
|
+
? "5px solid ".concat(props.variant === 'secondary' ? colors$1.secondary1.main : colors$1.primary1.main)
|
|
4629
4762
|
: "none"; }, function (props) { return props.selected ? "1" : ".5"; }, SharedStyles, function (props) { var _a; return tabSizes[(_a = props.size) !== null && _a !== void 0 ? _a : 'medium']; });
|
|
4630
4763
|
var Tabs = /** @class */ (function (_super) {
|
|
4631
4764
|
__extends(Tabs, _super);
|
|
@@ -4683,7 +4816,7 @@ var Tabs = /** @class */ (function (_super) {
|
|
|
4683
4816
|
};
|
|
4684
4817
|
return Tabs;
|
|
4685
4818
|
}(React.Component));
|
|
4686
|
-
var templateObject_1$y, templateObject_2$i, templateObject_3$
|
|
4819
|
+
var templateObject_1$y, templateObject_2$i, templateObject_3$c, templateObject_4$7;
|
|
4687
4820
|
|
|
4688
4821
|
var toggleSizes$1 = {
|
|
4689
4822
|
small: {
|
|
@@ -4721,8 +4854,8 @@ var getSizeStyle = function (style, defaults) {
|
|
|
4721
4854
|
};
|
|
4722
4855
|
};
|
|
4723
4856
|
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 }"])));
|
|
4724
|
-
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);
|
|
4725
|
-
var ToggleLink = styled__default.default.a(templateObject_3$
|
|
4857
|
+
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);
|
|
4858
|
+
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);
|
|
4726
4859
|
var Toggle = function (_a) {
|
|
4727
4860
|
var _b = _a.size, size = _b === void 0 ? 'medium' : _b, props = __rest(_a, ["size"]);
|
|
4728
4861
|
return React__default.default.createElement(Wrapper$3, __assign({ size: size }, props),
|
|
@@ -4730,7 +4863,7 @@ var Toggle = function (_a) {
|
|
|
4730
4863
|
return React__default.default.cloneElement(child, { size: size });
|
|
4731
4864
|
})));
|
|
4732
4865
|
};
|
|
4733
|
-
var templateObject_1$x, templateObject_2$h, templateObject_3$
|
|
4866
|
+
var templateObject_1$x, templateObject_2$h, templateObject_3$b;
|
|
4734
4867
|
|
|
4735
4868
|
var Textarea = styled__default.default.textarea(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), function (p) {
|
|
4736
4869
|
var styles = {
|
|
@@ -4822,8 +4955,8 @@ var templateObject_1$u;
|
|
|
4822
4955
|
|
|
4823
4956
|
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"])));
|
|
4824
4957
|
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"])));
|
|
4825
|
-
var SupplierName = styled__default.default.div(templateObject_3$
|
|
4826
|
-
var ProductWrapper = styled__default.default.div(templateObject_4$
|
|
4958
|
+
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"])));
|
|
4959
|
+
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);
|
|
4827
4960
|
var Product = function (props) {
|
|
4828
4961
|
return React__default.default.createElement(ProductWrapper, __assign({}, props),
|
|
4829
4962
|
React__default.default.createElement(ProductInfo, null,
|
|
@@ -4834,12 +4967,12 @@ var Product = function (props) {
|
|
|
4834
4967
|
props.price && props.currency ? props.currency + "$" + props.price : null,
|
|
4835
4968
|
props.rating ? React__default.default.createElement(StarRating, { rating: props.rating }) : null));
|
|
4836
4969
|
};
|
|
4837
|
-
var templateObject_1$t, templateObject_2$g, templateObject_3$
|
|
4970
|
+
var templateObject_1$t, templateObject_2$g, templateObject_3$a, templateObject_4$6;
|
|
4838
4971
|
|
|
4839
4972
|
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"])));
|
|
4840
|
-
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); });
|
|
4841
|
-
var ArtworkControls = styled__default.default.div(templateObject_3$
|
|
4842
|
-
var ArtworkInfo = styled__default.default.div(templateObject_4$
|
|
4973
|
+
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); });
|
|
4974
|
+
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"])));
|
|
4975
|
+
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"; });
|
|
4843
4976
|
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);
|
|
4844
4977
|
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);
|
|
4845
4978
|
function truncate(filename, max) {
|
|
@@ -4878,12 +5011,12 @@ var Artwork = function (_a) {
|
|
|
4878
5011
|
"Updated ",
|
|
4879
5012
|
props.date) : null));
|
|
4880
5013
|
};
|
|
4881
|
-
var templateObject_1$s, templateObject_2$f, templateObject_3$
|
|
5014
|
+
var templateObject_1$s, templateObject_2$f, templateObject_3$9, templateObject_4$5, templateObject_5$4, templateObject_6$4;
|
|
4882
5015
|
|
|
4883
5016
|
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);" : ''; });
|
|
4884
5017
|
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;"])));
|
|
4885
|
-
var StyledTask = styled__default.default.div(templateObject_3$
|
|
4886
|
-
var TaskBody = styled__default.default.div(templateObject_4$
|
|
5018
|
+
var StyledTask = styled__default.default.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["margin-bottom: 1.5em; ", ""], ["margin-bottom: 1.5em; ", ""])), SharedStyles);
|
|
5019
|
+
var TaskBody = styled__default.default.div(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["margin-left:34px;"], ["margin-left:34px;"])));
|
|
4887
5020
|
var Task = function (_a) {
|
|
4888
5021
|
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"]);
|
|
4889
5022
|
var _c = React.useState(initialChecked), checked = _c[0], setChecked = _c[1];
|
|
@@ -4956,19 +5089,19 @@ var CalendarTask = React__default.default.forwardRef(function (_a, ref) {
|
|
|
4956
5089
|
assignee ? "for " + assignee : null,
|
|
4957
5090
|
assignee ? "on " : null)));
|
|
4958
5091
|
});
|
|
4959
|
-
var templateObject_1$r, templateObject_2$e, templateObject_3$
|
|
5092
|
+
var templateObject_1$r, templateObject_2$e, templateObject_3$8, templateObject_4$4, templateObject_5$3, templateObject_6$3;
|
|
4960
5093
|
|
|
4961
|
-
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); });
|
|
5094
|
+
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); });
|
|
4962
5095
|
var Publisher = function (props) {
|
|
4963
5096
|
return React__default.default.createElement(PublisherWrapper, null,
|
|
4964
5097
|
React__default.default.createElement(Textarea, { placeholder: "Post a note about this project" }));
|
|
4965
5098
|
};
|
|
4966
5099
|
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);
|
|
4967
|
-
var WidePart = styled__default.default.div(templateObject_3$
|
|
4968
|
-
var Date$1 = styled__default.default.span(templateObject_4$
|
|
5100
|
+
var WidePart = styled__default.default.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["flex-grow:1;"], ["flex-grow:1;"])));
|
|
5101
|
+
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); });
|
|
4969
5102
|
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;"])));
|
|
4970
|
-
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); });
|
|
4971
|
-
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); });
|
|
5103
|
+
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); });
|
|
5104
|
+
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); });
|
|
4972
5105
|
var TopLine = styled__default.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["display:flex;"], ["display:flex;"])));
|
|
4973
5106
|
var PostFooter = styled__default.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["font-size:.9em;"], ["font-size:.9em;"])));
|
|
4974
5107
|
var Comments = styled__default.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["margin-top: 1em;"], ["margin-top: 1em;"])));
|
|
@@ -4986,12 +5119,10 @@ var FeedPost = function (props) {
|
|
|
4986
5119
|
props.comments && props.comments.length > 0 ?
|
|
4987
5120
|
React__default.default.createElement(Comments, null, props.comments) : null));
|
|
4988
5121
|
};
|
|
4989
|
-
var templateObject_1$q, templateObject_2$d, templateObject_3$
|
|
5122
|
+
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;
|
|
4990
5123
|
|
|
4991
|
-
var Wrapper$1 = styled__default.default.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n
|
|
4992
|
-
var ErrorTextContainer = styled__default.default.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n
|
|
4993
|
-
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"])));
|
|
4994
|
-
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"])));
|
|
5124
|
+
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);
|
|
5125
|
+
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"])));
|
|
4995
5126
|
var ErrorBoundary = /** @class */ (function (_super) {
|
|
4996
5127
|
__extends(ErrorBoundary, _super);
|
|
4997
5128
|
function ErrorBoundary(props) {
|
|
@@ -5004,22 +5135,29 @@ var ErrorBoundary = /** @class */ (function (_super) {
|
|
|
5004
5135
|
console.log({ error: error, info: info });
|
|
5005
5136
|
};
|
|
5006
5137
|
ErrorBoundary.prototype.render = function () {
|
|
5138
|
+
var goBack = function () {
|
|
5139
|
+
window$1.history.back();
|
|
5140
|
+
};
|
|
5141
|
+
var isNewTab = window$1.history.length === 1;
|
|
5007
5142
|
if (this.state.hasError) {
|
|
5008
5143
|
return (React__default.default.createElement(Wrapper$1, __assign({}, this.props),
|
|
5009
|
-
React__default.default.createElement(
|
|
5010
|
-
React__default.default.createElement(
|
|
5011
|
-
|
|
5012
|
-
|
|
5013
|
-
|
|
5014
|
-
|
|
5015
|
-
|
|
5016
|
-
React__default.default.createElement(
|
|
5144
|
+
React__default.default.createElement(ErrorTextContainer, null,
|
|
5145
|
+
React__default.default.createElement("b", { style: { color: '#2A4D63', fontSize: '64px' } }, "Sorry, something went wrong."),
|
|
5146
|
+
React__default.default.createElement("br", null),
|
|
5147
|
+
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."),
|
|
5148
|
+
React__default.default.createElement("br", null),
|
|
5149
|
+
React__default.default.createElement("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
|
5150
|
+
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"),
|
|
5151
|
+
React__default.default.createElement(Button, { variant: "text", size: "medium", style: { zIndex: 100 }, onClick: function (e) { return window$1.location.href = "/"; } }, "Go to homepage"))),
|
|
5152
|
+
React__default.default.createElement("div", { style: { position: 'absolute', bottom: '0', width: '100%' } },
|
|
5153
|
+
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" },
|
|
5154
|
+
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" })))));
|
|
5017
5155
|
}
|
|
5018
5156
|
return this.props.children;
|
|
5019
5157
|
};
|
|
5020
5158
|
return ErrorBoundary;
|
|
5021
5159
|
}(React.Component));
|
|
5022
|
-
var templateObject_1$p, templateObject_2$c
|
|
5160
|
+
var templateObject_1$p, templateObject_2$c;
|
|
5023
5161
|
|
|
5024
5162
|
var CustomDateInput = React.forwardRef(function (_a, ref) {
|
|
5025
5163
|
var error = _a.error, noMargin = _a.noMargin, onClick = _a.onClick, isClearable = _a.isClearable, props = __rest(_a, ["error", "noMargin", "onClick", "isClearable"]);
|
|
@@ -5115,7 +5253,7 @@ var Dropdown = function (_a) {
|
|
|
5115
5253
|
};
|
|
5116
5254
|
var templateObject_1$o, templateObject_2$b, templateObject_3$6;
|
|
5117
5255
|
|
|
5118
|
-
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);
|
|
5256
|
+
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);
|
|
5119
5257
|
var templateObject_1$n;
|
|
5120
5258
|
|
|
5121
5259
|
var verticalScrollbarWidth = function () {
|
|
@@ -6118,8 +6256,8 @@ Transition.EXITING = EXITING;
|
|
|
6118
6256
|
var Transition$1 = Transition;
|
|
6119
6257
|
|
|
6120
6258
|
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'; });
|
|
6121
|
-
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);
|
|
6122
|
-
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);
|
|
6259
|
+
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);
|
|
6260
|
+
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);
|
|
6123
6261
|
var transitionStatusToClass = {
|
|
6124
6262
|
entering: 'collapsing',
|
|
6125
6263
|
entered: 'collapsed show',
|
|
@@ -6303,7 +6441,7 @@ function Thermometer(_a) {
|
|
|
6303
6441
|
setValue1Width((node === null || node === void 0 ? void 0 : node.clientWidth) || 0);
|
|
6304
6442
|
}, []);
|
|
6305
6443
|
return (React__default.default.createElement("div", __assign({}, props),
|
|
6306
|
-
title ? React__default.default.createElement(Text, { style: { fontWeight: 'bold', fontSize: 18, color: colors.neutrals.bodyText } }, title) : null,
|
|
6444
|
+
title ? React__default.default.createElement(Text, { style: { fontWeight: 'bold', fontSize: 18, color: colors$1.neutrals.bodyText } }, title) : null,
|
|
6307
6445
|
React__default.default.createElement("div", { style: { paddingBottom: 20, paddingTop: 5 } },
|
|
6308
6446
|
React__default.default.createElement("span", { ref: measureTargetRef, style: {
|
|
6309
6447
|
position: 'absolute',
|
|
@@ -6315,13 +6453,13 @@ function Thermometer(_a) {
|
|
|
6315
6453
|
React__default.default.createElement("span", { ref: measureValue1Ref, style: {
|
|
6316
6454
|
position: 'absolute',
|
|
6317
6455
|
paddingRight: 5,
|
|
6318
|
-
color: labelTextColor || colors.secondary3.main,
|
|
6456
|
+
color: labelTextColor || colors$1.secondary3.main,
|
|
6319
6457
|
} },
|
|
6320
6458
|
value1Label + " $",
|
|
6321
6459
|
React__default.default.createElement(Number$1, { commas: true, decimalPoints: 0, num: value1 }))),
|
|
6322
6460
|
React__default.default.createElement("div", { ref: measureContainerRef },
|
|
6323
6461
|
React__default.default.createElement(ProgressWrapper, { style: { marginTop: 10, background: isSecondary ? '#FFF9C5' : '#C9FDE5' } },
|
|
6324
|
-
React__default.default.createElement(ProgressBar, { target: target, value: value1, color: barColor || colors.secondary3.main, offset: calcVal1Width(), elementWidth: value1Width })))));
|
|
6462
|
+
React__default.default.createElement(ProgressBar, { target: target, value: value1, color: barColor || colors$1.secondary3.main, offset: calcVal1Width(), elementWidth: value1Width })))));
|
|
6325
6463
|
}
|
|
6326
6464
|
var templateObject_1$g, templateObject_2$4;
|
|
6327
6465
|
|
|
@@ -6343,7 +6481,7 @@ function LightIndicatorLight(_a) {
|
|
|
6343
6481
|
React__default.default.createElement("defs", null,
|
|
6344
6482
|
React__default.default.createElement("radialGradient", { id: lightID, cx: 0, cy: 0, r: 1, gradientUnits: "userSpaceOnUse", gradientTransform: gradientTransform }, litOrNot)));
|
|
6345
6483
|
}
|
|
6346
|
-
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]; });
|
|
6484
|
+
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]; });
|
|
6347
6485
|
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);
|
|
6348
6486
|
function LightIndicator(_a) {
|
|
6349
6487
|
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"]);
|
|
@@ -6353,7 +6491,7 @@ function LightIndicator(_a) {
|
|
|
6353
6491
|
}
|
|
6354
6492
|
var templateObject_1$f, templateObject_2$3;
|
|
6355
6493
|
|
|
6356
|
-
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]; });
|
|
6494
|
+
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]; });
|
|
6357
6495
|
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);
|
|
6358
6496
|
function DefaultStar(_a) {
|
|
6359
6497
|
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"]);
|
|
@@ -6379,9 +6517,9 @@ function DoneButton(_a) {
|
|
|
6379
6517
|
return (React__default.default.createElement(Button, __assign({ variant: variant, size: size }, Props), "Done"));
|
|
6380
6518
|
}
|
|
6381
6519
|
|
|
6382
|
-
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; });
|
|
6520
|
+
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; });
|
|
6383
6521
|
function LinkWithIcon(_a) {
|
|
6384
|
-
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"]);
|
|
6522
|
+
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"]);
|
|
6385
6523
|
var _f = React.useState(false), isHover = _f[0], setHover = _f[1];
|
|
6386
6524
|
var RenderIcon = React__default.default.useMemo(function () {
|
|
6387
6525
|
if (!Icon) {
|
|
@@ -6411,29 +6549,29 @@ var NotificationExtraContent = React.memo(function (props) {
|
|
|
6411
6549
|
var NotificationIcon = React.memo(function (props) {
|
|
6412
6550
|
var alertType = props.alertType;
|
|
6413
6551
|
if (alertType === "success") {
|
|
6414
|
-
return React__default.default.createElement(CompletedCheckmarkIcon, { color: colors.green.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6552
|
+
return React__default.default.createElement(CompletedCheckmarkIcon, { color: colors$1.green.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6415
6553
|
}
|
|
6416
6554
|
else if (alertType === "error") {
|
|
6417
|
-
return React__default.default.createElement(AlertIcon, { color: colors.errors.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6555
|
+
return React__default.default.createElement(AlertIcon, { color: colors$1.errors.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6418
6556
|
}
|
|
6419
|
-
return React__default.default.createElement(InfoIcon, { color: colors.navy.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6557
|
+
return React__default.default.createElement(InfoIcon, { color: colors$1.navy.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6420
6558
|
});
|
|
6421
6559
|
var notificationVariantStyles = function (alertType) {
|
|
6422
6560
|
switch (alertType) {
|
|
6423
6561
|
case "neutral":
|
|
6424
6562
|
return {
|
|
6425
|
-
backgroundColor: colors.navy.lightest,
|
|
6426
|
-
color: colors.navy.dark,
|
|
6563
|
+
backgroundColor: colors$1.navy.lightest,
|
|
6564
|
+
color: colors$1.navy.dark,
|
|
6427
6565
|
};
|
|
6428
6566
|
case "success":
|
|
6429
6567
|
return {
|
|
6430
|
-
backgroundColor: colors.green.lightest,
|
|
6431
|
-
color: colors.green.darkest,
|
|
6568
|
+
backgroundColor: colors$1.green.lightest,
|
|
6569
|
+
color: colors$1.green.darkest,
|
|
6432
6570
|
};
|
|
6433
6571
|
case "error":
|
|
6434
6572
|
return {
|
|
6435
|
-
backgroundColor: colors.errors.lightest,
|
|
6436
|
-
color: colors.errors.dark,
|
|
6573
|
+
backgroundColor: colors$1.errors.lightest,
|
|
6574
|
+
color: colors$1.errors.dark,
|
|
6437
6575
|
};
|
|
6438
6576
|
default:
|
|
6439
6577
|
return {};
|
|
@@ -7018,8 +7156,8 @@ var BaseCollapsible = function (props) {
|
|
|
7018
7156
|
setHeight(0);
|
|
7019
7157
|
}, [isOpen]);
|
|
7020
7158
|
return (React__default.default.createElement("div", { style: style },
|
|
7021
|
-
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
|
|
7022
|
-
? { border: "3px solid ".concat(colors.teal.main) }
|
|
7159
|
+
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
|
|
7160
|
+
? { border: "3px solid ".concat(colors$1.teal.main) }
|
|
7023
7161
|
: {})) },
|
|
7024
7162
|
React__default.default.createElement(CollapsibleHeader, { isOpen: isOpen, handleToggle: handleToggle, controls: controls }, header || label),
|
|
7025
7163
|
React__default.default.createElement(Col, { xs: true, style: {
|
|
@@ -7062,7 +7200,7 @@ var CollapsibleLabel = function (props) {
|
|
|
7062
7200
|
}
|
|
7063
7201
|
if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
|
|
7064
7202
|
return React__default.default.createElement("span", { style: {
|
|
7065
|
-
color: colors.teal.main,
|
|
7203
|
+
color: colors$1.teal.main,
|
|
7066
7204
|
fontFamily: fontFamilies.bold,
|
|
7067
7205
|
fontStyle: 'normal',
|
|
7068
7206
|
fontWeight: 500,
|
|
@@ -7090,7 +7228,7 @@ var CollapsibleControls = function (props) {
|
|
|
7090
7228
|
}
|
|
7091
7229
|
if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
|
|
7092
7230
|
return React__default.default.createElement("span", { style: {
|
|
7093
|
-
color: colors.teal.main,
|
|
7231
|
+
color: colors$1.teal.main,
|
|
7094
7232
|
fontFamily: fontFamilies.bold,
|
|
7095
7233
|
fontStyle: 'normal',
|
|
7096
7234
|
fontWeight: 500,
|
|
@@ -7115,7 +7253,7 @@ var ConfirmPopup = function (props) {
|
|
|
7115
7253
|
fontFamily: fontStyles.p.medium.fontFamily,
|
|
7116
7254
|
fontSize: fontStyles.p.medium.fontSize,
|
|
7117
7255
|
lineHeight: fontStyles.p.medium.lineHeight,
|
|
7118
|
-
color: colors.neutrals.bodyText
|
|
7256
|
+
color: colors$1.neutrals.bodyText
|
|
7119
7257
|
} }, confirmText),
|
|
7120
7258
|
React__default.default.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
|
|
7121
7259
|
React__default.default.createElement(Button, { size: "medium", variant: 'secondary', mr: 24, onClick: function () {
|
|
@@ -7155,8 +7293,8 @@ var PopupTitle = function (_a) {
|
|
|
7155
7293
|
var PopupContent = function (_a) {
|
|
7156
7294
|
var children = _a.children;
|
|
7157
7295
|
return (React__default.default.createElement("div", { style: {
|
|
7158
|
-
background: colors.errors[10],
|
|
7159
|
-
color: colors.errors.main,
|
|
7296
|
+
background: colors$1.errors[10],
|
|
7297
|
+
color: colors$1.errors.main,
|
|
7160
7298
|
padding: 16,
|
|
7161
7299
|
} },
|
|
7162
7300
|
React__default.default.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
|
|
@@ -7165,12 +7303,12 @@ var PopupContent = function (_a) {
|
|
|
7165
7303
|
verticalAlign: 'middle',
|
|
7166
7304
|
alignSelf: 'center',
|
|
7167
7305
|
} },
|
|
7168
|
-
React__default.default.createElement(AlertIcon, { size: 'medium', color: colors.errors[70] })),
|
|
7306
|
+
React__default.default.createElement(AlertIcon, { size: 'medium', color: colors$1.errors[70] })),
|
|
7169
7307
|
React__default.default.createElement("div", { style: {
|
|
7170
7308
|
fontFamily: 'var(--font-family-regular)',
|
|
7171
7309
|
fontSize: fontStyles.p.large.fontSize,
|
|
7172
7310
|
lineHeight: fontStyles.p.medium.lineHeight,
|
|
7173
|
-
color: colors.errors.main,
|
|
7311
|
+
color: colors$1.errors.main,
|
|
7174
7312
|
} }, children))));
|
|
7175
7313
|
};
|
|
7176
7314
|
|
|
@@ -7206,7 +7344,7 @@ var CalendarDaysBody = function (_a) {
|
|
|
7206
7344
|
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"])));
|
|
7207
7345
|
var templateObject_1$6;
|
|
7208
7346
|
|
|
7209
|
-
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 ") : ''; });
|
|
7347
|
+
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 ") : ''; });
|
|
7210
7348
|
var templateObject_1$5;
|
|
7211
7349
|
|
|
7212
7350
|
var CalendarDaysHeader = function (_a) {
|
|
@@ -7244,11 +7382,11 @@ var DefaultCalendarHeader = function (_a) {
|
|
|
7244
7382
|
React__default.default.createElement(Row, null,
|
|
7245
7383
|
React__default.default.createElement(LabeledCheckbox, { label: "Weekends", checked: true })))),
|
|
7246
7384
|
React__default.default.createElement(Col, { padded: true },
|
|
7247
|
-
React__default.default.createElement("div", { style: { cursor: 'pointer', color: colors.primary, }, onClick: onPrevWeek }, "< Prev Week")),
|
|
7385
|
+
React__default.default.createElement("div", { style: { cursor: 'pointer', color: colors$1.primary, }, onClick: onPrevWeek }, "< Prev Week")),
|
|
7248
7386
|
React__default.default.createElement(Col, { center: true, padded: true },
|
|
7249
|
-
React__default.default.createElement("span", { style: { color: colors.disabledButton } }, dateFns.format(currentMonth, "MMM yyyy"))),
|
|
7387
|
+
React__default.default.createElement("span", { style: { color: colors$1.disabledButton } }, dateFns.format(currentMonth, "MMM yyyy"))),
|
|
7250
7388
|
React__default.default.createElement(Col, { end: true, padded: true },
|
|
7251
|
-
React__default.default.createElement("div", { style: { cursor: 'pointer', color: colors.primary, }, onClick: onNextWeek }, "Next Week >"))));
|
|
7389
|
+
React__default.default.createElement("div", { style: { cursor: 'pointer', color: colors$1.primary, }, onClick: onNextWeek }, "Next Week >"))));
|
|
7252
7390
|
};
|
|
7253
7391
|
|
|
7254
7392
|
var TasksCalendarDayBody = function (_a) {
|
|
@@ -7320,7 +7458,7 @@ var CalendarIconDatePicker = React__default.default.forwardRef(function (_a, ref
|
|
|
7320
7458
|
textAlign: 'center',
|
|
7321
7459
|
borderRadius: 5,
|
|
7322
7460
|
cursor: 'pointer',
|
|
7323
|
-
color: colors.disabledButton,
|
|
7461
|
+
color: colors$1.disabledButton,
|
|
7324
7462
|
} })));
|
|
7325
7463
|
});
|
|
7326
7464
|
var TasksCalendarHeader = function (_a) {
|
|
@@ -7362,7 +7500,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7362
7500
|
}
|
|
7363
7501
|
} })),
|
|
7364
7502
|
React__default.default.createElement("span", null,
|
|
7365
|
-
React__default.default.createElement(WeekNav, { style: { cursor: 'pointer', color: colors.primary, verticalAlign: 'middle' }, onClick: onPrevWeek },
|
|
7503
|
+
React__default.default.createElement(WeekNav, { style: { cursor: 'pointer', color: colors$1.primary, verticalAlign: 'middle' }, onClick: onPrevWeek },
|
|
7366
7504
|
React__default.default.createElement(ChevronIcon, { direction: "left", size: 'large' })),
|
|
7367
7505
|
React__default.default.createElement(WeekNav, { as: Button, variant: "text", size: "primary-light", style: { verticalAlign: "middle", padding: "10px 0px", }, py: 5, onClick: function () {
|
|
7368
7506
|
if (isCurrentWeek) {
|
|
@@ -7370,7 +7508,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7370
7508
|
}
|
|
7371
7509
|
onResetDate();
|
|
7372
7510
|
} }, "Today"),
|
|
7373
|
-
React__default.default.createElement(WeekNav, { style: { cursor: 'pointer', color: colors.primary1.main, verticalAlign: 'middle' }, onClick: onNextWeek },
|
|
7511
|
+
React__default.default.createElement(WeekNav, { style: { cursor: 'pointer', color: colors$1.primary1.main, verticalAlign: 'middle' }, onClick: onNextWeek },
|
|
7374
7512
|
React__default.default.createElement(ChevronIcon, { size: "large" })))),
|
|
7375
7513
|
React__default.default.createElement(Col, { start: 1, xs: true, md: 8, padded: true },
|
|
7376
7514
|
React__default.default.createElement(Tabs, { size: "medium", tabs: tabs })),
|
|
@@ -7378,7 +7516,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7378
7516
|
React__default.default.createElement(Link, { as: "span", onClick: onClickAddTask, style: {
|
|
7379
7517
|
marginRight: 10,
|
|
7380
7518
|
verticalAlign: 'bottom',
|
|
7381
|
-
color: colors.primary1.main,
|
|
7519
|
+
color: colors$1.primary1.main,
|
|
7382
7520
|
fontFamily: [themeOptions.fontFamilies.regular].concat(themeOptions.fontFamilies.fallbacks).join(','),
|
|
7383
7521
|
fontWeight: 600,
|
|
7384
7522
|
} }, "+ Add Task")
|
|
@@ -7684,7 +7822,7 @@ var SimpleWindowedTableStyles = styled__default.default.div(templateObject_1$1 |
|
|
|
7684
7822
|
"border: ".concat(typeof p.bordered === 'string'
|
|
7685
7823
|
? p.bordered
|
|
7686
7824
|
: "1px solid ".concat(getThemeColor(p, 'tableBorder', '#edf2f5')), ";")
|
|
7687
|
-
: ''; }, colors.disabledButtonBorder, colors.disabledButtonBorder, function (p) { return p.hoverRowBg ?
|
|
7825
|
+
: ''; }, colors$1.disabledButtonBorder, colors$1.disabledButtonBorder, function (p) { return p.hoverRowBg ?
|
|
7688
7826
|
".tr:not(.header.tr, .table-footer.tr):hover {\n background: ".concat(typeof p.hoverRowBg === 'string'
|
|
7689
7827
|
? p.hoverRowBg
|
|
7690
7828
|
: getThemeColor(p, 'tableHeaderBg', '#F6FEFF'), ";\n }") : ''; }, function (p) { return p.selectedRowIndex && p.selectedRowStyle ?
|
|
@@ -7806,7 +7944,7 @@ var createAnimationLeftStyle = function (p) {
|
|
|
7806
7944
|
};
|
|
7807
7945
|
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
|
|
7808
7946
|
? getThemeColor(p, 'teal.main', 'var(--color-primary1-main)')
|
|
7809
|
-
: getThemeColor(p, 'teal.20', colors.teal['20']); }, function (p) { return p.stretch
|
|
7947
|
+
: getThemeColor(p, 'teal.20', colors$1.teal['20']); }, function (p) { return p.stretch
|
|
7810
7948
|
? '100%'
|
|
7811
7949
|
: "".concat(stripUnit(toggleSizes[p.size || 'medium'].height) * 2.5, "px"); }, createAnimationLeftStyle, createAnimationLeftStyle);
|
|
7812
7950
|
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
|
|
@@ -7939,6 +8077,7 @@ exports.Collapsibles = Collapsibles;
|
|
|
7939
8077
|
exports.Column = Column;
|
|
7940
8078
|
exports.ColumnSelectIcon = ColumnSelectIcon;
|
|
7941
8079
|
exports.CommentIcon = CommentIcon;
|
|
8080
|
+
exports.CommonskuMainLogo = CommonskuMainLogo;
|
|
7942
8081
|
exports.CommunityIcon = CommunityIcon;
|
|
7943
8082
|
exports.CompletedCheckmarkIcon = CompletedCheckmarkIcon;
|
|
7944
8083
|
exports.ConfirmAlertPopup = ConfirmAlertPopup;
|
|
@@ -7973,6 +8112,7 @@ exports.DropzonedPreviews = DropzonedPreviews;
|
|
|
7973
8112
|
exports.EPOIcon = EPOIcon;
|
|
7974
8113
|
exports.EditIcon = EditIcon;
|
|
7975
8114
|
exports.EllipsisIcon = EllipsisIcon;
|
|
8115
|
+
exports.EmptyStateArrow = EmptyStateArrowIcon;
|
|
7976
8116
|
exports.EpsIcon = EpsIcon;
|
|
7977
8117
|
exports.ErrorBoundary = ErrorBoundary;
|
|
7978
8118
|
exports.EstimateCircleIcon = EstimateCircleIcon;
|
|
@@ -8091,6 +8231,8 @@ exports.SimpleWindowedTable = SimpleWindowedTable;
|
|
|
8091
8231
|
exports.SimpleWindowedTableStyles = SimpleWindowedTableStyles;
|
|
8092
8232
|
exports.SizerCss = SizerCss;
|
|
8093
8233
|
exports.SizerWrapper = SizerWrapper;
|
|
8234
|
+
exports.SkubotLogo = SkubotLogo;
|
|
8235
|
+
exports.SkubotSpinner = SkubotSpinner;
|
|
8094
8236
|
exports.SlideInIcon = SlideInIcon;
|
|
8095
8237
|
exports.Sparkles = Sparkles;
|
|
8096
8238
|
exports.Spinner = Spinner;
|
|
@@ -8147,7 +8289,7 @@ exports.VirtualTable = VirtualTable;
|
|
|
8147
8289
|
exports.VirtualTableStyles = VirtualTableStyles;
|
|
8148
8290
|
exports.Wrapper = Wrapper$4;
|
|
8149
8291
|
exports.XIcon = XIcon;
|
|
8150
|
-
exports.colors = colors;
|
|
8292
|
+
exports.colors = colors$1;
|
|
8151
8293
|
exports.createMeasurementStyle = createMeasurementStyle;
|
|
8152
8294
|
exports.datepickerStyles = datepickerStyles;
|
|
8153
8295
|
exports.fontFamilies = fontFamilies;
|