@commonsku/styles 1.17.9 → 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 +276 -174
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +29 -1
- package/dist/index.mjs +273 -174
- 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/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 +3 -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.mjs
CHANGED
|
@@ -178,6 +178,7 @@ var win = typeof window !== 'undefined' ? window : {
|
|
|
178
178
|
pushState: function () { },
|
|
179
179
|
go: function () { },
|
|
180
180
|
back: function () { },
|
|
181
|
+
length: 1,
|
|
181
182
|
},
|
|
182
183
|
CustomEvent: function CustomEvent() {
|
|
183
184
|
return this;
|
|
@@ -213,11 +214,11 @@ var ssr = {
|
|
|
213
214
|
};
|
|
214
215
|
|
|
215
216
|
var media = {
|
|
216
|
-
xs: function (styles) { return "\n @media only screen and (min-width: 0px) {\n ".concat(typeof styles === 'string' ? css(templateObject_1$
|
|
217
|
-
sm: function (styles) { return "\n @media only screen and (min-width: 640px) {\n ".concat(typeof styles === 'string' ? css(templateObject_2$
|
|
217
|
+
xs: function (styles) { return "\n @media only screen and (min-width: 0px) {\n ".concat(typeof styles === 'string' ? css(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
|
|
218
|
+
sm: function (styles) { return "\n @media only screen and (min-width: 640px) {\n ".concat(typeof styles === 'string' ? css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
|
|
218
219
|
md: function (styles) { return "\n @media only screen and (min-width: 768px) {\n ".concat(typeof styles === 'string' ? css(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
|
|
219
220
|
lg: function (styles) { return "\n @media only screen and (min-width: 1024px) {\n ".concat(typeof styles === 'string' ? css(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
|
|
220
|
-
xl: function (styles) { return "\n @media only screen and (min-width: 1280px) {\n ".concat(typeof styles === 'string' ? css(templateObject_5$
|
|
221
|
+
xl: function (styles) { return "\n @media only screen and (min-width: 1280px) {\n ".concat(typeof styles === 'string' ? css(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
|
|
221
222
|
};
|
|
222
223
|
var sizeMediaWidth = {
|
|
223
224
|
xs: '0px',
|
|
@@ -234,7 +235,7 @@ var sizeMedia = {
|
|
|
234
235
|
xl: "@media only screen and (min-width: ".concat(sizeMediaWidth.xl, ")"),
|
|
235
236
|
};
|
|
236
237
|
var sizes$1 = ['xs', 'sm', 'md', 'lg', 'xl'];
|
|
237
|
-
var templateObject_1$
|
|
238
|
+
var templateObject_1$Y, templateObject_2$z, templateObject_3$m, templateObject_4$g, templateObject_5$b;
|
|
238
239
|
|
|
239
240
|
var valIsValid = function (val) { return val !== null && val !== undefined && val !== ''; }; // not checking for 0
|
|
240
241
|
function isClientSide() {
|
|
@@ -386,7 +387,7 @@ var wait = function (time) {
|
|
|
386
387
|
};
|
|
387
388
|
};
|
|
388
389
|
|
|
389
|
-
var SharedStyles = css(templateObject_1$
|
|
390
|
+
var SharedStyles = 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) {
|
|
390
391
|
return isUndefined(v) ? '' : SHARED_STYLE_MAPS[k](v);
|
|
391
392
|
}).join(''); });
|
|
392
393
|
var SHARED_STYLE_MAPS = {
|
|
@@ -428,8 +429,8 @@ var SHARED_STYLE_MAPS = {
|
|
|
428
429
|
// Custom Styles
|
|
429
430
|
custom: function (val) { return "".concat(val); },
|
|
430
431
|
};
|
|
431
|
-
var Wrapper$4 = styled.div(templateObject_2$
|
|
432
|
-
var templateObject_1$
|
|
432
|
+
var Wrapper$4 = styled.div(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["", ""], ["", ""])), SharedStyles);
|
|
433
|
+
var templateObject_1$X, templateObject_2$y;
|
|
433
434
|
|
|
434
435
|
var primary1 = {
|
|
435
436
|
'10': '#F6FEFF',
|
|
@@ -604,7 +605,7 @@ errors['lightest'] = errors['10'];
|
|
|
604
605
|
errors['light'] = errors['30'];
|
|
605
606
|
errors['dark'] = errors['70'];
|
|
606
607
|
errors['darkest'] = errors['90'];
|
|
607
|
-
var colors = {
|
|
608
|
+
var colors$1 = {
|
|
608
609
|
primary1: primary1,
|
|
609
610
|
secondary1: secondary1,
|
|
610
611
|
secondary2: secondary2,
|
|
@@ -836,7 +837,7 @@ var SVG$1 = styled.svg.attrs(function (p) {
|
|
|
836
837
|
viewBox: p.viewBox || defaultSize.viewBox,
|
|
837
838
|
};
|
|
838
839
|
})(function (p) {
|
|
839
|
-
return css(templateObject_1$
|
|
840
|
+
return css(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), SharedStyles);
|
|
840
841
|
}, function (p) {
|
|
841
842
|
var styles = {};
|
|
842
843
|
var iconSizes = p.iconSizes || iconSize;
|
|
@@ -850,7 +851,7 @@ var SVG$1 = styled.svg.attrs(function (p) {
|
|
|
850
851
|
styles['cursor'] = p.pointer ? 'pointer' : undefined;
|
|
851
852
|
return styles;
|
|
852
853
|
});
|
|
853
|
-
var templateObject_1$
|
|
854
|
+
var templateObject_1$W;
|
|
854
855
|
|
|
855
856
|
function TableIcon(_a) {
|
|
856
857
|
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"]);
|
|
@@ -1224,7 +1225,7 @@ function createFontStyles(p) {
|
|
|
1224
1225
|
return "\n --skufont-".concat(k, ": ").concat(fontFamilies[k], ";\n --font-family-").concat(k, ": ").concat([fontFamilies[k]].concat(fontFamilies['fallbacks']).join(','), ";\n ");
|
|
1225
1226
|
}).join('');
|
|
1226
1227
|
}
|
|
1227
|
-
var GlobalStyle = createGlobalStyle(templateObject_1$
|
|
1228
|
+
var GlobalStyle = 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(_.get(p, ['theme', 'colors'], {}), ''); }, function (p) {
|
|
1228
1229
|
if (!p.additionalStyles) {
|
|
1229
1230
|
return null;
|
|
1230
1231
|
}
|
|
@@ -1238,7 +1239,7 @@ var GlobalStyle = createGlobalStyle(templateObject_1$U || (templateObject_1$U =
|
|
|
1238
1239
|
return null;
|
|
1239
1240
|
}
|
|
1240
1241
|
}, datepickerStyles);
|
|
1241
|
-
var templateObject_1$
|
|
1242
|
+
var templateObject_1$V;
|
|
1242
1243
|
|
|
1243
1244
|
var fontFamilies = {
|
|
1244
1245
|
skuFontRegular: "'skufont-regular'",
|
|
@@ -1335,7 +1336,7 @@ var fontStyles = {
|
|
|
1335
1336
|
}
|
|
1336
1337
|
};
|
|
1337
1338
|
var themeOptions = {
|
|
1338
|
-
colors: colors,
|
|
1339
|
+
colors: colors$1,
|
|
1339
1340
|
fonts: fonts,
|
|
1340
1341
|
fontFamily: "".concat(fonts.join(",")),
|
|
1341
1342
|
fontFamilies: fontFamilies,
|
|
@@ -1363,7 +1364,7 @@ function getColor$1(color, def) {
|
|
|
1363
1364
|
if (!color) {
|
|
1364
1365
|
return '';
|
|
1365
1366
|
}
|
|
1366
|
-
return (_a = _.get(colors, color, _.get(colors, def || '', def))) !== null && _a !== void 0 ? _a : '';
|
|
1367
|
+
return (_a = _.get(colors$1, color, _.get(colors$1, def || '', def))) !== null && _a !== void 0 ? _a : '';
|
|
1367
1368
|
}
|
|
1368
1369
|
function getFontStyle(value, def) {
|
|
1369
1370
|
var _a;
|
|
@@ -1461,7 +1462,7 @@ function CircleProgressIcon(_a) {
|
|
|
1461
1462
|
var dashOffset = dashArray - dashArray * percentage / 100;
|
|
1462
1463
|
return React.createElement(SVG$1, __assign({ size: size, iconSizes: iconSizes, "aria-labelledby": "CircleProgressIcon" }, props),
|
|
1463
1464
|
React.createElement("title", { id: "CircleProgressIcon" }, text !== '' ? "".concat(text, " stage") : percentage ? "".concat(percentage, "% completed") : altText),
|
|
1464
|
-
React.createElement("circle", { className: "circle-background", cx: sqSize / 2, cy: sqSize / 2, r: radius, strokeWidth: "".concat(strokeWidth, "px"), style: { fill: 'none', stroke: colors.disabledButtonBorder, } }),
|
|
1465
|
+
React.createElement("circle", { className: "circle-background", cx: sqSize / 2, cy: sqSize / 2, r: radius, strokeWidth: "".concat(strokeWidth, "px"), style: { fill: 'none', stroke: colors$1.disabledButtonBorder, } }),
|
|
1465
1466
|
React.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: {
|
|
1466
1467
|
strokeDasharray: dashArray,
|
|
1467
1468
|
strokeDashoffset: dashOffset,
|
|
@@ -1473,14 +1474,14 @@ function CircleProgressIcon(_a) {
|
|
|
1473
1474
|
React.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, "%")));
|
|
1474
1475
|
}
|
|
1475
1476
|
|
|
1476
|
-
var SVG = styled.svg(templateObject_1$
|
|
1477
|
-
var templateObject_1$
|
|
1477
|
+
var SVG = styled.svg(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), SharedStyles);
|
|
1478
|
+
var templateObject_1$U;
|
|
1478
1479
|
|
|
1479
1480
|
function Loading(_a) {
|
|
1480
1481
|
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"]);
|
|
1481
1482
|
var colorGradient = colorful
|
|
1482
|
-
? generateColor(startColor || colors.special1, endColor || colors.primary, bars)
|
|
1483
|
-
: generateColor(startColor || colors.primary, endColor || colors.primary0, bars);
|
|
1483
|
+
? generateColor(startColor || colors$1.special1, endColor || colors$1.primary, bars)
|
|
1484
|
+
: generateColor(startColor || colors$1.primary, endColor || colors$1.primary0, bars);
|
|
1484
1485
|
var generateBar = function (v) {
|
|
1485
1486
|
return (React.createElement("rect", { key: "bar_".concat(v), x: 19 * v, y: "0", width: barWidth || 14, height: height, fill: "#".concat(colorGradient[v]), rx: barRadius },
|
|
1486
1487
|
React.createElement("animate", { attributeName: "height", values: "50;10;50", begin: "".concat(v * 0.2, "s"), dur: "".concat(animationDuration / 1000, "s"), repeatCount: "indefinite" })));
|
|
@@ -1495,6 +1496,99 @@ function Loading(_a) {
|
|
|
1495
1496
|
return (React.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()));
|
|
1496
1497
|
}
|
|
1497
1498
|
|
|
1499
|
+
var logoSizes = {
|
|
1500
|
+
small: {
|
|
1501
|
+
width: 24
|
|
1502
|
+
},
|
|
1503
|
+
medium: {
|
|
1504
|
+
width: 64
|
|
1505
|
+
},
|
|
1506
|
+
large: {
|
|
1507
|
+
width: 120
|
|
1508
|
+
},
|
|
1509
|
+
default: {
|
|
1510
|
+
width: 120
|
|
1511
|
+
}
|
|
1512
|
+
};
|
|
1513
|
+
var containerSizes = {
|
|
1514
|
+
small: {
|
|
1515
|
+
width: 48
|
|
1516
|
+
},
|
|
1517
|
+
medium: {
|
|
1518
|
+
width: 100
|
|
1519
|
+
},
|
|
1520
|
+
large: {
|
|
1521
|
+
width: 200
|
|
1522
|
+
},
|
|
1523
|
+
default: {
|
|
1524
|
+
width: 200
|
|
1525
|
+
}
|
|
1526
|
+
};
|
|
1527
|
+
var rotator = 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"])));
|
|
1528
|
+
var colors = 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"])));
|
|
1529
|
+
var dash = 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"])));
|
|
1530
|
+
var Container$1 = styled.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'; });
|
|
1531
|
+
var Spinner$1 = styled.svg(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n animation: ", " 1.4s linear infinite;\n"], ["\n animation: ", " 1.4s linear infinite;\n"])), rotator);
|
|
1532
|
+
var Path = styled.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);
|
|
1533
|
+
var Logo = styled.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"])));
|
|
1534
|
+
function SkubotSpinner(_a) {
|
|
1535
|
+
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"]);
|
|
1536
|
+
return (React.createElement(Container$1, { size: containerSizes[size] ? containerSizes[size].width : 200 },
|
|
1537
|
+
React.createElement(Spinner$1, { width: '200px', height: '200px', viewBox: "0 0 66 66", xmlns: "http://www.w3.org/2000/svg" },
|
|
1538
|
+
React.createElement(Path, { cx: "33", cy: "33", r: "30" })),
|
|
1539
|
+
skubot ?
|
|
1540
|
+
React.createElement(Logo, { width: logoSizes[size] ? logoSizes[size].width : 120, viewBox: "0 0 100 54.9" },
|
|
1541
|
+
React.createElement("circle", { fill: color, cx: "2.7", cy: "30.2", r: "2.7" }),
|
|
1542
|
+
React.createElement("circle", { fill: color, cx: "97.3", cy: "30.2", r: "2.7" }),
|
|
1543
|
+
React.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" }),
|
|
1544
|
+
React.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" }),
|
|
1545
|
+
React.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));
|
|
1546
|
+
}
|
|
1547
|
+
var templateObject_1$T, templateObject_2$x, templateObject_3$l, templateObject_4$f, templateObject_5$a, templateObject_6$a, templateObject_7$4;
|
|
1548
|
+
|
|
1549
|
+
function CommonskuMainLogo(_a) {
|
|
1550
|
+
var _b = _a.color, color = _b === void 0 ? '#00C1DE' : _b; _a.size; _a.altText; _a.width; __rest(_a, ["color", "size", "altText", "width"]);
|
|
1551
|
+
return (React.createElement("svg", { viewBox: "0 0 125 43.9" },
|
|
1552
|
+
React.createElement("g", null,
|
|
1553
|
+
React.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" }),
|
|
1554
|
+
React.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" }),
|
|
1555
|
+
React.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" }),
|
|
1556
|
+
React.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" }),
|
|
1557
|
+
React.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" }),
|
|
1558
|
+
React.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" }),
|
|
1559
|
+
React.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" }),
|
|
1560
|
+
React.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" }),
|
|
1561
|
+
React.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" })),
|
|
1562
|
+
React.createElement("g", null,
|
|
1563
|
+
React.createElement("rect", { x: "6.8", y: "0", fill: color, width: "5.1", height: "27.1" }),
|
|
1564
|
+
React.createElement("rect", { x: "16.5", y: "0", fill: color, width: "2.7", height: "27.1" }),
|
|
1565
|
+
React.createElement("rect", { x: "33.3", y: "0", fill: color, width: "5", height: "27.1" }),
|
|
1566
|
+
React.createElement("rect", { x: "47.8", y: "0", fill: color, width: "4", height: "27.1" }),
|
|
1567
|
+
React.createElement("rect", { x: "71.3", y: "0", fill: color, width: "5.9", height: "27.1" }),
|
|
1568
|
+
React.createElement("rect", { x: "94.2", y: "0", fill: color, width: "4", height: "27.1" }),
|
|
1569
|
+
React.createElement("rect", { x: "114.4", y: "0", fill: color, width: "4", height: "27.1" }),
|
|
1570
|
+
React.createElement("rect", { x: "22.4", y: "0", fill: color, width: "5.9", height: "27.1" }),
|
|
1571
|
+
React.createElement("rect", { x: "41.6", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1572
|
+
React.createElement("rect", { x: "56.3", y: "0", fill: color, width: "5.3", height: "27.1" }),
|
|
1573
|
+
React.createElement("rect", { x: "81.6", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1574
|
+
React.createElement("rect", { x: "1.2", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1575
|
+
React.createElement("rect", { x: "65.2", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1576
|
+
React.createElement("rect", { x: "87.4", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1577
|
+
React.createElement("rect", { x: "107.9", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1578
|
+
React.createElement("rect", { x: "122.1", y: "0", fill: color, width: "2.9", height: "27.1" }),
|
|
1579
|
+
React.createElement("path", { fill: color, d: "M105,27.1h-2.4V0h2.4V27.1z" }))));
|
|
1580
|
+
}
|
|
1581
|
+
|
|
1582
|
+
function SkubotLogo(_a) {
|
|
1583
|
+
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"]);
|
|
1584
|
+
return (React.createElement(SVG$1, { width: width, height: height, viewBox: "0 0 100 54.9" },
|
|
1585
|
+
React.createElement("circle", { fill: color, cx: "2.7", cy: "30.2", r: "2.7" }),
|
|
1586
|
+
React.createElement("circle", { fill: color, cx: "97.3", cy: "30.2", r: "2.7" }),
|
|
1587
|
+
React.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" }),
|
|
1588
|
+
React.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" }),
|
|
1589
|
+
React.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" })));
|
|
1590
|
+
}
|
|
1591
|
+
|
|
1498
1592
|
function SalesArrowIcon(_a) {
|
|
1499
1593
|
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"]);
|
|
1500
1594
|
if (direction === "down") {
|
|
@@ -2886,7 +2980,7 @@ var avatarColors = {
|
|
|
2886
2980
|
};
|
|
2887
2981
|
var AvatarWrapper = styled.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), ";"); });
|
|
2888
2982
|
var AvatarPic = styled.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"])));
|
|
2889
|
-
var AvatarInitials = styled.p(templateObject_3$
|
|
2983
|
+
var AvatarInitials = styled.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); });
|
|
2890
2984
|
var Avatar = function (_a) {
|
|
2891
2985
|
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"]);
|
|
2892
2986
|
if (pic) {
|
|
@@ -2902,7 +2996,7 @@ var Avatar = function (_a) {
|
|
|
2902
2996
|
React.createElement(AvatarInitials, { size: size }, initials !== null && initials !== void 0 ? initials : children));
|
|
2903
2997
|
}
|
|
2904
2998
|
};
|
|
2905
|
-
var templateObject_1$R, templateObject_2$v, templateObject_3$
|
|
2999
|
+
var templateObject_1$R, templateObject_2$v, templateObject_3$k;
|
|
2906
3000
|
|
|
2907
3001
|
var getTotalCols = function (p) { return p.totalCols || 12; };
|
|
2908
3002
|
var SizerCss = 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) {
|
|
@@ -2954,14 +3048,14 @@ var Row = styled.div(templateObject_1$P || (templateObject_1$P = __makeTemplateO
|
|
|
2954
3048
|
var Col = styled.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);
|
|
2955
3049
|
var templateObject_1$P, templateObject_2$t;
|
|
2956
3050
|
|
|
2957
|
-
var headingStyle = 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); });
|
|
3051
|
+
var headingStyle = 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); });
|
|
2958
3052
|
var H1 = styled.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);
|
|
2959
|
-
var H2 = styled.h2(templateObject_3$
|
|
2960
|
-
var H3 = styled.h3(templateObject_4$
|
|
3053
|
+
var H2 = styled.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);
|
|
3054
|
+
var H3 = styled.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);
|
|
2961
3055
|
var H4 = styled.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);
|
|
2962
3056
|
var H5 = styled.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);
|
|
2963
3057
|
var H6 = styled.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);
|
|
2964
|
-
var templateObject_1$O, templateObject_2$s, templateObject_3$
|
|
3058
|
+
var templateObject_1$O, templateObject_2$s, templateObject_3$j, templateObject_4$e, templateObject_5$9, templateObject_6$9, templateObject_7$3;
|
|
2965
3059
|
|
|
2966
3060
|
var StyledBox = styled.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);
|
|
2967
3061
|
var Box = function (_a) {
|
|
@@ -2976,13 +3070,13 @@ var Box = function (_a) {
|
|
|
2976
3070
|
};
|
|
2977
3071
|
var templateObject_1$N;
|
|
2978
3072
|
|
|
2979
|
-
var Background = styled.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);
|
|
3073
|
+
var Background = styled.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);
|
|
2980
3074
|
var templateObject_1$M;
|
|
2981
3075
|
|
|
2982
|
-
var StyledDropArea = styled.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);
|
|
2983
|
-
var PlaceHolder = styled.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); });
|
|
2984
|
-
var ThumbsContainer = styled.aside(templateObject_3$
|
|
2985
|
-
var Thumb = styled.div(templateObject_4$
|
|
3076
|
+
var StyledDropArea = styled.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);
|
|
3077
|
+
var PlaceHolder = styled.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); });
|
|
3078
|
+
var ThumbsContainer = styled.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"])));
|
|
3079
|
+
var Thumb = styled.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); });
|
|
2986
3080
|
var ThumbInner = styled.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"])));
|
|
2987
3081
|
var ImgPreview = styled.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"])));
|
|
2988
3082
|
var DropArea = function (_a) {
|
|
@@ -3041,7 +3135,7 @@ function DropzonedPreviews(_a) {
|
|
|
3041
3135
|
? React.createElement(ThumbsContainer, null, thumbs)
|
|
3042
3136
|
: React.createElement(PlaceHolder, null, placeholder))));
|
|
3043
3137
|
}
|
|
3044
|
-
var templateObject_1$L, templateObject_2$r, templateObject_3$
|
|
3138
|
+
var templateObject_1$L, templateObject_2$r, templateObject_3$i, templateObject_4$d, templateObject_5$8, templateObject_6$8;
|
|
3045
3139
|
|
|
3046
3140
|
/*
|
|
3047
3141
|
|
|
@@ -3119,18 +3213,18 @@ var getSizeStyle$1 = function (style, defaults) {
|
|
|
3119
3213
|
};
|
|
3120
3214
|
};
|
|
3121
3215
|
var getVariantStyles = function (props, variant) {
|
|
3122
|
-
var white = getThemeColor(props, 'neutrals.white', colors.neutrals.white);
|
|
3123
|
-
var disabled = getThemeColor(props, 'neutrals.50', colors.errors['50']);
|
|
3124
|
-
var disabledText = getThemeColor(props, 'neutrals.70', colors.errors['70']);
|
|
3125
|
-
var primary = getThemeColor(props, 'primary1.main', colors.primary1.main);
|
|
3126
|
-
var primaryDark = getThemeColor(props, 'primary1.75', colors.primary1['75']);
|
|
3127
|
-
var primaryLight = getThemeColor(props, 'primary1.20', colors.primary1['20']);
|
|
3128
|
-
var cta = getThemeColor(props, 'secondary1.main', colors.secondary1.main);
|
|
3129
|
-
var ctaDark = getThemeColor(props, 'secondary1.80', colors.secondary1['80']);
|
|
3216
|
+
var white = getThemeColor(props, 'neutrals.white', colors$1.neutrals.white);
|
|
3217
|
+
var disabled = getThemeColor(props, 'neutrals.50', colors$1.errors['50']);
|
|
3218
|
+
var disabledText = getThemeColor(props, 'neutrals.70', colors$1.errors['70']);
|
|
3219
|
+
var primary = getThemeColor(props, 'primary1.main', colors$1.primary1.main);
|
|
3220
|
+
var primaryDark = getThemeColor(props, 'primary1.75', colors$1.primary1['75']);
|
|
3221
|
+
var primaryLight = getThemeColor(props, 'primary1.20', colors$1.primary1['20']);
|
|
3222
|
+
var cta = getThemeColor(props, 'secondary1.main', colors$1.secondary1.main);
|
|
3223
|
+
var ctaDark = getThemeColor(props, 'secondary1.80', colors$1.secondary1['80']);
|
|
3130
3224
|
// const ctaLight = getThemeColor(props, 'secondary1.20', colors.secondary1['20']);
|
|
3131
|
-
var error = getThemeColor(props, 'errors.main', colors.errors.main);
|
|
3132
|
-
var errorLight = getThemeColor(props, 'errors.10', colors.errors['10']);
|
|
3133
|
-
var errorDark = getThemeColor(props, 'errors.70', colors.errors['70']);
|
|
3225
|
+
var error = getThemeColor(props, 'errors.main', colors$1.errors.main);
|
|
3226
|
+
var errorLight = getThemeColor(props, 'errors.10', colors$1.errors['10']);
|
|
3227
|
+
var errorDark = getThemeColor(props, 'errors.70', colors$1.errors['70']);
|
|
3134
3228
|
var customColor = props.variantColor || white;
|
|
3135
3229
|
var customBorderColor = props.variantBorderColor;
|
|
3136
3230
|
var customBg = props.variantBg;
|
|
@@ -3340,12 +3434,12 @@ var getVariantStyles = function (props, variant) {
|
|
|
3340
3434
|
var Button = styled.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) {
|
|
3341
3435
|
var secondary = _a.secondary, cta = _a.cta, props = __rest(_a, ["secondary", "cta"]);
|
|
3342
3436
|
return secondary ? "transparent" :
|
|
3343
|
-
cta ? getThemeColor(props, 'cta', colors.cta) : getThemeColor(props, 'primary', colors.teal.main);
|
|
3344
|
-
}, 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) {
|
|
3437
|
+
cta ? getThemeColor(props, 'cta', colors$1.cta) : getThemeColor(props, 'primary', colors$1.teal.main);
|
|
3438
|
+
}, 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) {
|
|
3345
3439
|
var secondary = _a.secondary, cta = _a.cta, props = __rest(_a, ["secondary", "cta"]);
|
|
3346
|
-
return secondary ? getThemeColor(props, 'primary', colors.primary) :
|
|
3347
|
-
cta ? getThemeColor(props, 'cta', colors.cta) : getThemeColor(props, 'primary', colors.primary);
|
|
3348
|
-
}, 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);
|
|
3440
|
+
return secondary ? getThemeColor(props, 'primary', colors$1.primary) :
|
|
3441
|
+
cta ? getThemeColor(props, 'cta', colors$1.cta) : getThemeColor(props, 'primary', colors$1.primary);
|
|
3442
|
+
}, 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);
|
|
3349
3443
|
var ButtonsGroup = styled.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);
|
|
3350
3444
|
var presets = {
|
|
3351
3445
|
edit: {
|
|
@@ -3496,8 +3590,8 @@ var templateObject_1$J;
|
|
|
3496
3590
|
|
|
3497
3591
|
var InputIconLabel = styled.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) {
|
|
3498
3592
|
return p.error
|
|
3499
|
-
? getThemeColor(p, 'errors.main', colors.errors.main)
|
|
3500
|
-
: getThemeColor(p, 'input.iconWrapper.background', colors.input.iconWrapper.background);
|
|
3593
|
+
? getThemeColor(p, 'errors.main', colors$1.errors.main)
|
|
3594
|
+
: getThemeColor(p, 'input.iconWrapper.background', colors$1.input.iconWrapper.background);
|
|
3501
3595
|
}, 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
|
|
3502
3596
|
? "background: ".concat(getThemeColor(p, 'input.iconWrapper.hover.background'), ";")
|
|
3503
3597
|
: ''; }, function (p) { return p.isActive
|
|
@@ -3522,7 +3616,7 @@ var InputIconLabelContainer = styled.div(templateObject_2$p || (templateObject_2
|
|
|
3522
3616
|
},
|
|
3523
3617
|
};
|
|
3524
3618
|
});
|
|
3525
|
-
var Input = styled.input(templateObject_3$
|
|
3619
|
+
var Input = styled.input(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n &&& {\n ", "\n }\n ", "\n"], ["\n &&& {\n ", "\n }\n ", "\n"])), function (p) {
|
|
3526
3620
|
var styles = {
|
|
3527
3621
|
marginBottom: p.noMargin ? 0 : "1rem",
|
|
3528
3622
|
fontSize: '1rem',
|
|
@@ -3592,11 +3686,11 @@ var LabeledIconInput = React.forwardRef(function (_a, ref) {
|
|
|
3592
3686
|
var containerRef = useRef(null);
|
|
3593
3687
|
var _g = useState(false), isActive = _g[0], setIsActive = _g[1];
|
|
3594
3688
|
var _h = useState(false), isHovering = _h[0], setIsHovering = _h[1];
|
|
3595
|
-
var activeBorderColor = getThemeColor(props, 'input.active.border', colors.input.active.border);
|
|
3596
|
-
var activeTextColor = colors.input.active.text;
|
|
3597
|
-
var errorBorderColor = getThemeColor(props, 'input.error.border', colors.input.error.border);
|
|
3598
|
-
var disabledBackground = colors.input.disabled.background;
|
|
3599
|
-
var disabledTextColor = colors.input.disabled.text;
|
|
3689
|
+
var activeBorderColor = getThemeColor(props, 'input.active.border', colors$1.input.active.border);
|
|
3690
|
+
var activeTextColor = colors$1.input.active.text;
|
|
3691
|
+
var errorBorderColor = getThemeColor(props, 'input.error.border', colors$1.input.error.border);
|
|
3692
|
+
var disabledBackground = colors$1.input.disabled.background;
|
|
3693
|
+
var disabledTextColor = colors$1.input.disabled.text;
|
|
3600
3694
|
var activeStyles = !isActive ? {} : {
|
|
3601
3695
|
borderColor: error ? errorBorderColor : activeBorderColor,
|
|
3602
3696
|
color: getThemeColor(props, 'input.active.text', activeTextColor),
|
|
@@ -3624,16 +3718,16 @@ var LabeledIconInput = React.forwardRef(function (_a, ref) {
|
|
|
3624
3718
|
iconProps['color'] = errorBorderColor;
|
|
3625
3719
|
}
|
|
3626
3720
|
else if (disabled) {
|
|
3627
|
-
iconProps['fill'] = colors.input.icon.disabled.fill;
|
|
3628
|
-
iconProps['color'] = colors.input.icon.disabled.fill;
|
|
3721
|
+
iconProps['fill'] = colors$1.input.icon.disabled.fill;
|
|
3722
|
+
iconProps['color'] = colors$1.input.icon.disabled.fill;
|
|
3629
3723
|
}
|
|
3630
3724
|
else if (isHovering) {
|
|
3631
|
-
iconProps['fill'] = colors.input.icon.hover.fill;
|
|
3632
|
-
iconProps['color'] = colors.input.icon.hover.fill;
|
|
3725
|
+
iconProps['fill'] = colors$1.input.icon.hover.fill;
|
|
3726
|
+
iconProps['color'] = colors$1.input.icon.hover.fill;
|
|
3633
3727
|
}
|
|
3634
3728
|
else if (isActive) {
|
|
3635
|
-
iconProps['fill'] = colors.input.icon.active.fill;
|
|
3636
|
-
iconProps['color'] = colors.input.icon.active.fill;
|
|
3729
|
+
iconProps['fill'] = colors$1.input.icon.active.fill;
|
|
3730
|
+
iconProps['color'] = colors$1.input.icon.active.fill;
|
|
3637
3731
|
}
|
|
3638
3732
|
return React.cloneElement(Icon, iconProps);
|
|
3639
3733
|
}, [Icon, error, disabled, errorBorderColor, isActive, isHovering, iconColor]);
|
|
@@ -3663,7 +3757,7 @@ var LabeledIconInput = React.forwardRef(function (_a, ref) {
|
|
|
3663
3757
|
React.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 }),
|
|
3664
3758
|
iconPosition === 'right' ? React.createElement(InputIconLabel, { style: __assign({ marginBottom: 0, padding: 6 }, iconLabelStyles), isActive: isActive, isDisabled: disabled, isHover: isHovering, iconPosition: iconPosition }, NewIcon) : null)));
|
|
3665
3759
|
});
|
|
3666
|
-
var CheckboxLabel = styled.label(templateObject_4$
|
|
3760
|
+
var CheckboxLabel = styled.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; });
|
|
3667
3761
|
var RadioLabel = styled(CheckboxLabel)(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n &&& {\n padding-left: 32px;\n }\n"], ["\n &&& {\n padding-left: 32px;\n }\n"])));
|
|
3668
3762
|
var Radio = styled.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);
|
|
3669
3763
|
var CheckMark = styled.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);
|
|
@@ -3690,7 +3784,7 @@ var LabeledRadioInButton = function (_a) {
|
|
|
3690
3784
|
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"]);
|
|
3691
3785
|
return (React.createElement(LabeledRadio, { label: label, checked: checked, disabled: disabled, onChange: onChange, readOnly: readOnly, defaultValue: defaultValue, labelStyle: {
|
|
3692
3786
|
padding: "13px 40px",
|
|
3693
|
-
backgroundColor: disabled ? neutrals['40'] : checked ? colors.white : teal['20'],
|
|
3787
|
+
backgroundColor: disabled ? neutrals['40'] : checked ? colors$1.white : teal['20'],
|
|
3694
3788
|
border: disabled ? "solid 3px ".concat(neutrals['40']) : checked ? "solid 3px ".concat(teal.main) : "solid 3px ".concat(teal['20']),
|
|
3695
3789
|
borderRadius: "200px",
|
|
3696
3790
|
color: disabled ? neutrals['70'] : teal.main,
|
|
@@ -3720,7 +3814,7 @@ var LabeledCheckbox = React.forwardRef(function (_a, ref) {
|
|
|
3720
3814
|
label,
|
|
3721
3815
|
React.createElement(Radio, __assign({ ref: ref, name: name, type: "checkbox", checked: checked, isHovering: isHovering, onChange: disabled ? undefined : onChange }, props))));
|
|
3722
3816
|
});
|
|
3723
|
-
var templateObject_1$I, templateObject_2$p, templateObject_3$
|
|
3817
|
+
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;
|
|
3724
3818
|
|
|
3725
3819
|
var Padding = styled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n padding: 20px;\n ", "\n"], ["\n padding: 20px;\n ", "\n"])), SharedStyles);
|
|
3726
3820
|
var templateObject_1$H;
|
|
@@ -3789,23 +3883,23 @@ function skuSelectStyles(props) {
|
|
|
3789
3883
|
return __assign(__assign({}, provided), props.containerStyles);
|
|
3790
3884
|
},
|
|
3791
3885
|
clearIndicator: function (provided, state) {
|
|
3792
|
-
return __assign(__assign(__assign({}, provided), { color: getThemeColor(props, 'select.clearIcon.color', colors.select.clearIcon.color), ':hover': {
|
|
3793
|
-
color: getThemeColor(props, 'select.clearIcon.color', colors.select.clearIcon.color),
|
|
3886
|
+
return __assign(__assign(__assign({}, provided), { color: getThemeColor(props, 'select.clearIcon.color', colors$1.select.clearIcon.color), ':hover': {
|
|
3887
|
+
color: getThemeColor(props, 'select.clearIcon.color', colors$1.select.clearIcon.color),
|
|
3794
3888
|
} }), props.clearIndicatorStyles);
|
|
3795
3889
|
},
|
|
3796
3890
|
dropdownIndicator: function (provided, state) {
|
|
3797
3891
|
var styles = {
|
|
3798
3892
|
color: props.error
|
|
3799
|
-
? getThemeColor(props, 'select.dropdownIcon.error.color', colors.select.dropdownIcon.error.color)
|
|
3800
|
-
: getThemeColor(props, 'select.dropdownIcon.color', colors.select.dropdownIcon.color),
|
|
3893
|
+
? getThemeColor(props, 'select.dropdownIcon.error.color', colors$1.select.dropdownIcon.error.color)
|
|
3894
|
+
: getThemeColor(props, 'select.dropdownIcon.color', colors$1.select.dropdownIcon.color),
|
|
3801
3895
|
':hover': {
|
|
3802
3896
|
color: props.error
|
|
3803
|
-
? getThemeColor(props, 'select.dropdownIcon.error.color', colors.select.dropdownIcon.error.color)
|
|
3804
|
-
: getThemeColor(props, 'select.dropdownIcon.color', colors.select.dropdownIcon.color),
|
|
3897
|
+
? getThemeColor(props, 'select.dropdownIcon.error.color', colors$1.select.dropdownIcon.error.color)
|
|
3898
|
+
: getThemeColor(props, 'select.dropdownIcon.color', colors$1.select.dropdownIcon.color),
|
|
3805
3899
|
},
|
|
3806
3900
|
};
|
|
3807
3901
|
if (state.isDisabled) {
|
|
3808
|
-
styles['color'] = getThemeColor(props, 'select.dropdownIcon.disabled', colors.select.dropdownIcon.disabled);
|
|
3902
|
+
styles['color'] = getThemeColor(props, 'select.dropdownIcon.disabled', colors$1.select.dropdownIcon.disabled);
|
|
3809
3903
|
}
|
|
3810
3904
|
return __assign(__assign(__assign({}, provided), styles), props.dropdownIndicatorStyles);
|
|
3811
3905
|
},
|
|
@@ -3815,8 +3909,8 @@ function skuSelectStyles(props) {
|
|
|
3815
3909
|
},
|
|
3816
3910
|
input: function (provided, state) {
|
|
3817
3911
|
return __assign(__assign(__assign({}, provided), { height: 'auto', borderColor: props.error
|
|
3818
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3819
|
-
: getThemeColor(props, 'select.border', colors.select.border) }), props.inputStyles);
|
|
3912
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3913
|
+
: getThemeColor(props, 'select.border', colors$1.select.border) }), props.inputStyles);
|
|
3820
3914
|
},
|
|
3821
3915
|
control: function (provided, state) {
|
|
3822
3916
|
var styles = {
|
|
@@ -3826,8 +3920,8 @@ function skuSelectStyles(props) {
|
|
|
3826
3920
|
styles['borderWidth'] = '1px';
|
|
3827
3921
|
styles['borderStyle'] = 'solid';
|
|
3828
3922
|
styles['borderColor'] = props.error
|
|
3829
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3830
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
3923
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3924
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3831
3925
|
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 ");
|
|
3832
3926
|
if (state.selectProps.menuPlacement === 'bottom') {
|
|
3833
3927
|
styles['borderBottomRightRadius'] = 0;
|
|
@@ -3841,31 +3935,31 @@ function skuSelectStyles(props) {
|
|
|
3841
3935
|
else if (!state.menuIsOpen && state.isFocused) {
|
|
3842
3936
|
styles['borderWidth'] = '1px';
|
|
3843
3937
|
styles['borderColor'] = props.error
|
|
3844
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3845
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
3938
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3939
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3846
3940
|
styles['boxShadow'] = "0 0 0 1px ".concat(props.error
|
|
3847
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3848
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border));
|
|
3941
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3942
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border));
|
|
3849
3943
|
}
|
|
3850
3944
|
else if (state.isDisabled) {
|
|
3851
|
-
styles['backgroundColor'] = getThemeColor(props, 'select.disabled.background', colors.select.disabled.background);
|
|
3852
|
-
styles['borderColor'] = getThemeColor(props, 'select.disabled.border', colors.select.disabled.border);
|
|
3945
|
+
styles['backgroundColor'] = getThemeColor(props, 'select.disabled.background', colors$1.select.disabled.background);
|
|
3946
|
+
styles['borderColor'] = getThemeColor(props, 'select.disabled.border', colors$1.select.disabled.border);
|
|
3853
3947
|
}
|
|
3854
3948
|
else {
|
|
3855
3949
|
styles['borderColor'] = props.error
|
|
3856
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3950
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3857
3951
|
: provided.borderColor;
|
|
3858
3952
|
}
|
|
3859
3953
|
return (__assign(__assign(__assign(__assign({}, provided), styles), { ':hover': {
|
|
3860
3954
|
borderColor: props.error
|
|
3861
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3862
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border),
|
|
3955
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3956
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border),
|
|
3863
3957
|
} }), props.controlStyles));
|
|
3864
3958
|
},
|
|
3865
3959
|
menu: function (provided, state) {
|
|
3866
3960
|
var borderColor = props.error
|
|
3867
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3868
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
3961
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3962
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3869
3963
|
var styles = {
|
|
3870
3964
|
zIndex: 10,
|
|
3871
3965
|
position: props.menuRelative ? 'relative' : provided.position,
|
|
@@ -3907,7 +4001,7 @@ function skuSelectStyles(props) {
|
|
|
3907
4001
|
},
|
|
3908
4002
|
};
|
|
3909
4003
|
}
|
|
3910
|
-
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) }) })); }; };
|
|
4004
|
+
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) }) })); }; };
|
|
3911
4005
|
// duplicate styles to overide .resku global styles
|
|
3912
4006
|
// : React.ForwardRefExoticComponent<SKUSelectProps & React.RefAttributes<BaseSelect>>
|
|
3913
4007
|
// 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<...>>
|
|
@@ -4014,8 +4108,8 @@ var SidePanel = function (_a) {
|
|
|
4014
4108
|
backdrop && visible ? React.createElement(Backdrop, null) : null);
|
|
4015
4109
|
};
|
|
4016
4110
|
var NameAndPosition = styled.div(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n display: inline-block;\n width: 90%;\n"], ["\n display: inline-block;\n width: 90%;\n"])));
|
|
4017
|
-
var Name = styled.div(templateObject_3$
|
|
4018
|
-
var Position = styled.div(templateObject_4$
|
|
4111
|
+
var Name = styled.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
4112
|
+
var Position = styled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n font-size: .8em;\n"], ["\n font-size: .8em;\n"])));
|
|
4019
4113
|
var Email = styled.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"])));
|
|
4020
4114
|
var Contact = styled.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);
|
|
4021
4115
|
var PanelContact = function (_a) {
|
|
@@ -4052,12 +4146,12 @@ var PanelTileContact = function (_a) {
|
|
|
4052
4146
|
p.phone_extension && 'x' + p.phone_extension) : '';
|
|
4053
4147
|
}) : null)));
|
|
4054
4148
|
};
|
|
4055
|
-
var templateObject_1$C, templateObject_2$m, templateObject_3$
|
|
4149
|
+
var templateObject_1$C, templateObject_2$m, templateObject_3$g, templateObject_4$b, templateObject_5$6, templateObject_6$6;
|
|
4056
4150
|
|
|
4057
4151
|
var sharedStyle = 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"])));
|
|
4058
4152
|
var optionalPadding = 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"; });
|
|
4059
|
-
var Table = styled.table.attrs(function () { return ({ cellPadding: 0, cellSpacing: 0 }); })(templateObject_3$
|
|
4060
|
-
var TH = styled.th(templateObject_4$
|
|
4153
|
+
var Table = styled.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);
|
|
4154
|
+
var TH = styled.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);
|
|
4061
4155
|
var TD$1 = styled.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);
|
|
4062
4156
|
var TR = styled.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;'; });
|
|
4063
4157
|
var THead = styled.thead(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n &&& {\n ", "\n }\n"], ["\n &&& {\n ", "\n }\n"])), SizerCss);
|
|
@@ -4079,7 +4173,7 @@ var THSorted = function (_a) {
|
|
|
4079
4173
|
" ",
|
|
4080
4174
|
children));
|
|
4081
4175
|
};
|
|
4082
|
-
var templateObject_1$B, templateObject_2$l, templateObject_3$
|
|
4176
|
+
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;
|
|
4083
4177
|
|
|
4084
4178
|
var useClickOutside = function (props) {
|
|
4085
4179
|
var ref = props.ref, _a = props.eventType, eventType = _a === void 0 ? 'mousedown' : _a, onClick = props.onClick, onCleanup = props.onCleanup;
|
|
@@ -4334,8 +4428,8 @@ var useFallbackRef = function (forwardedRef) {
|
|
|
4334
4428
|
|
|
4335
4429
|
var Overlay = styled.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; });
|
|
4336
4430
|
var PopupWindow = styled.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);
|
|
4337
|
-
var PopupHeader = styled.div(templateObject_3$
|
|
4338
|
-
var ChevronButton = styled(ChevronIcon)(templateObject_4$
|
|
4431
|
+
var PopupHeader = styled.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);
|
|
4432
|
+
var ChevronButton = styled(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;'; });
|
|
4339
4433
|
var PopupContainer = function (_a) {
|
|
4340
4434
|
var children = _a.children;
|
|
4341
4435
|
var ref = React.useRef(document$1.createElement('div'));
|
|
@@ -4408,12 +4502,12 @@ var ChevronPopupWindow = React.forwardRef(function (props, ref) {
|
|
|
4408
4502
|
var ChevronPopup = function (props) {
|
|
4409
4503
|
return React.createElement(Popup, __assign({ PopupWindowComponent: ChevronPopupWindow }, props));
|
|
4410
4504
|
};
|
|
4411
|
-
var templateObject_1$A, templateObject_2$k, templateObject_3$
|
|
4505
|
+
var templateObject_1$A, templateObject_2$k, templateObject_3$e, templateObject_4$9;
|
|
4412
4506
|
|
|
4413
4507
|
var GridTableContainer = styled.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);
|
|
4414
4508
|
var GridRow = styled.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);
|
|
4415
|
-
var GridCell = styled.div(templateObject_3$
|
|
4416
|
-
var FieldError = styled.p(templateObject_4$
|
|
4509
|
+
var GridCell = styled.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'; });
|
|
4510
|
+
var FieldError = styled.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']);
|
|
4417
4511
|
var defaultTransform = function (v) { return v.target ? v.target.value : v.currentTarget ? v.currentTarget.value : v.value; };
|
|
4418
4512
|
var Column = function (_a) {
|
|
4419
4513
|
_a.name; var title = _a.title; _a.children; var centerContent = _a.centerContent; _a.transform;
|
|
@@ -4596,14 +4690,14 @@ function GridTable(_a) {
|
|
|
4596
4690
|
Adding && NewRow,
|
|
4597
4691
|
onAdd && !Adding && AddNew)));
|
|
4598
4692
|
}
|
|
4599
|
-
var templateObject_1$z, templateObject_2$j, templateObject_3$
|
|
4693
|
+
var templateObject_1$z, templateObject_2$j, templateObject_3$d, templateObject_4$8;
|
|
4600
4694
|
|
|
4601
4695
|
var tabSizes = {
|
|
4602
4696
|
small: 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 "]))),
|
|
4603
4697
|
medium: 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 "]))),
|
|
4604
4698
|
};
|
|
4605
|
-
var TabBar = styled.ul(templateObject_3$
|
|
4606
|
-
var Tab = styled.li(templateObject_4$
|
|
4699
|
+
var TabBar = styled.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);
|
|
4700
|
+
var Tab = styled.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"
|
|
4607
4701
|
/*
|
|
4608
4702
|
|
|
4609
4703
|
Here's how you use this:
|
|
@@ -4633,7 +4727,7 @@ var Tab = styled.li(templateObject_4$8 || (templateObject_4$8 = __makeTemplateOb
|
|
|
4633
4727
|
// </div>
|
|
4634
4728
|
// }
|
|
4635
4729
|
])), function (props) { return props.selected
|
|
4636
|
-
? "5px solid ".concat(props.variant === 'secondary' ? colors.secondary1.main : colors.primary1.main)
|
|
4730
|
+
? "5px solid ".concat(props.variant === 'secondary' ? colors$1.secondary1.main : colors$1.primary1.main)
|
|
4637
4731
|
: "none"; }, function (props) { return props.selected ? "1" : ".5"; }, SharedStyles, function (props) { var _a; return tabSizes[(_a = props.size) !== null && _a !== void 0 ? _a : 'medium']; });
|
|
4638
4732
|
var Tabs = /** @class */ (function (_super) {
|
|
4639
4733
|
__extends(Tabs, _super);
|
|
@@ -4691,7 +4785,7 @@ var Tabs = /** @class */ (function (_super) {
|
|
|
4691
4785
|
};
|
|
4692
4786
|
return Tabs;
|
|
4693
4787
|
}(Component));
|
|
4694
|
-
var templateObject_1$y, templateObject_2$i, templateObject_3$
|
|
4788
|
+
var templateObject_1$y, templateObject_2$i, templateObject_3$c, templateObject_4$7;
|
|
4695
4789
|
|
|
4696
4790
|
var toggleSizes$1 = {
|
|
4697
4791
|
small: {
|
|
@@ -4729,8 +4823,8 @@ var getSizeStyle = function (style, defaults) {
|
|
|
4729
4823
|
};
|
|
4730
4824
|
};
|
|
4731
4825
|
var Wrapper$3 = styled.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 }"])));
|
|
4732
|
-
var Container = styled.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);
|
|
4733
|
-
var ToggleLink = styled.a(templateObject_3$
|
|
4826
|
+
var Container = styled.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);
|
|
4827
|
+
var ToggleLink = styled.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);
|
|
4734
4828
|
var Toggle = function (_a) {
|
|
4735
4829
|
var _b = _a.size, size = _b === void 0 ? 'medium' : _b, props = __rest(_a, ["size"]);
|
|
4736
4830
|
return React.createElement(Wrapper$3, __assign({ size: size }, props),
|
|
@@ -4738,7 +4832,7 @@ var Toggle = function (_a) {
|
|
|
4738
4832
|
return React.cloneElement(child, { size: size });
|
|
4739
4833
|
})));
|
|
4740
4834
|
};
|
|
4741
|
-
var templateObject_1$x, templateObject_2$h, templateObject_3$
|
|
4835
|
+
var templateObject_1$x, templateObject_2$h, templateObject_3$b;
|
|
4742
4836
|
|
|
4743
4837
|
var Textarea = styled.textarea(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), function (p) {
|
|
4744
4838
|
var styles = {
|
|
@@ -4830,8 +4924,8 @@ var templateObject_1$u;
|
|
|
4830
4924
|
|
|
4831
4925
|
var ProductInfo = styled.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"])));
|
|
4832
4926
|
var ProductName = styled.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"])));
|
|
4833
|
-
var SupplierName = styled.div(templateObject_3$
|
|
4834
|
-
var ProductWrapper = styled.div(templateObject_4$
|
|
4927
|
+
var SupplierName = styled.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"])));
|
|
4928
|
+
var ProductWrapper = styled.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);
|
|
4835
4929
|
var Product = function (props) {
|
|
4836
4930
|
return React.createElement(ProductWrapper, __assign({}, props),
|
|
4837
4931
|
React.createElement(ProductInfo, null,
|
|
@@ -4842,12 +4936,12 @@ var Product = function (props) {
|
|
|
4842
4936
|
props.price && props.currency ? props.currency + "$" + props.price : null,
|
|
4843
4937
|
props.rating ? React.createElement(StarRating, { rating: props.rating }) : null));
|
|
4844
4938
|
};
|
|
4845
|
-
var templateObject_1$t, templateObject_2$g, templateObject_3$
|
|
4939
|
+
var templateObject_1$t, templateObject_2$g, templateObject_3$a, templateObject_4$6;
|
|
4846
4940
|
|
|
4847
4941
|
var ArtworkName = styled.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"])));
|
|
4848
|
-
var UpdateDate = styled.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); });
|
|
4849
|
-
var ArtworkControls = styled.div(templateObject_3$
|
|
4850
|
-
var ArtworkInfo = styled.div(templateObject_4$
|
|
4942
|
+
var UpdateDate = styled.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); });
|
|
4943
|
+
var ArtworkControls = styled.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"])));
|
|
4944
|
+
var ArtworkInfo = styled.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"; });
|
|
4851
4945
|
var ArtworkWrapper = styled.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);
|
|
4852
4946
|
var ArtworkPicture = styled.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);
|
|
4853
4947
|
function truncate(filename, max) {
|
|
@@ -4886,12 +4980,12 @@ var Artwork = function (_a) {
|
|
|
4886
4980
|
"Updated ",
|
|
4887
4981
|
props.date) : null));
|
|
4888
4982
|
};
|
|
4889
|
-
var templateObject_1$s, templateObject_2$f, templateObject_3$
|
|
4983
|
+
var templateObject_1$s, templateObject_2$f, templateObject_3$9, templateObject_4$5, templateObject_5$4, templateObject_6$4;
|
|
4890
4984
|
|
|
4891
4985
|
var TaskLabel = styled.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);" : ''; });
|
|
4892
4986
|
var TaskName = styled.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["flex-grow: 1; font-size:13px;"], ["flex-grow: 1; font-size:13px;"])));
|
|
4893
|
-
var StyledTask = styled.div(templateObject_3$
|
|
4894
|
-
var TaskBody = styled.div(templateObject_4$
|
|
4987
|
+
var StyledTask = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["margin-bottom: 1.5em; ", ""], ["margin-bottom: 1.5em; ", ""])), SharedStyles);
|
|
4988
|
+
var TaskBody = styled.div(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["margin-left:34px;"], ["margin-left:34px;"])));
|
|
4895
4989
|
var Task = function (_a) {
|
|
4896
4990
|
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"]);
|
|
4897
4991
|
var _c = useState(initialChecked), checked = _c[0], setChecked = _c[1];
|
|
@@ -4964,19 +5058,19 @@ var CalendarTask = React.forwardRef(function (_a, ref) {
|
|
|
4964
5058
|
assignee ? "for " + assignee : null,
|
|
4965
5059
|
assignee ? "on " : null)));
|
|
4966
5060
|
});
|
|
4967
|
-
var templateObject_1$r, templateObject_2$e, templateObject_3$
|
|
5061
|
+
var templateObject_1$r, templateObject_2$e, templateObject_3$8, templateObject_4$4, templateObject_5$3, templateObject_6$3;
|
|
4968
5062
|
|
|
4969
|
-
var PublisherWrapper = styled.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); });
|
|
5063
|
+
var PublisherWrapper = styled.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); });
|
|
4970
5064
|
var Publisher = function (props) {
|
|
4971
5065
|
return React.createElement(PublisherWrapper, null,
|
|
4972
5066
|
React.createElement(Textarea, { placeholder: "Post a note about this project" }));
|
|
4973
5067
|
};
|
|
4974
5068
|
var PostWrapper = styled.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);
|
|
4975
|
-
var WidePart = styled.div(templateObject_3$
|
|
4976
|
-
var Date$1 = styled.span(templateObject_4$
|
|
5069
|
+
var WidePart = styled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["flex-grow:1;"], ["flex-grow:1;"])));
|
|
5070
|
+
var Date$1 = styled.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); });
|
|
4977
5071
|
var Action = styled.a(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["display: inline-block; margin-left: 10px;"], ["display: inline-block; margin-left: 10px;"])));
|
|
4978
|
-
var Author = styled.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); });
|
|
4979
|
-
var Subject = styled.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); });
|
|
5072
|
+
var Author = styled.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); });
|
|
5073
|
+
var Subject = styled.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); });
|
|
4980
5074
|
var TopLine = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["display:flex;"], ["display:flex;"])));
|
|
4981
5075
|
var PostFooter = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["font-size:.9em;"], ["font-size:.9em;"])));
|
|
4982
5076
|
var Comments = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["margin-top: 1em;"], ["margin-top: 1em;"])));
|
|
@@ -4994,12 +5088,10 @@ var FeedPost = function (props) {
|
|
|
4994
5088
|
props.comments && props.comments.length > 0 ?
|
|
4995
5089
|
React.createElement(Comments, null, props.comments) : null));
|
|
4996
5090
|
};
|
|
4997
|
-
var templateObject_1$q, templateObject_2$d, templateObject_3$
|
|
5091
|
+
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;
|
|
4998
5092
|
|
|
4999
|
-
var Wrapper$1 = styled.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n
|
|
5000
|
-
var ErrorTextContainer = styled.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n
|
|
5001
|
-
var BotContainer = styled.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"])));
|
|
5002
|
-
var BotImg = styled.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"])));
|
|
5093
|
+
var Wrapper$1 = styled.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);
|
|
5094
|
+
var ErrorTextContainer = styled.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"])));
|
|
5003
5095
|
var ErrorBoundary = /** @class */ (function (_super) {
|
|
5004
5096
|
__extends(ErrorBoundary, _super);
|
|
5005
5097
|
function ErrorBoundary(props) {
|
|
@@ -5012,22 +5104,29 @@ var ErrorBoundary = /** @class */ (function (_super) {
|
|
|
5012
5104
|
console.log({ error: error, info: info });
|
|
5013
5105
|
};
|
|
5014
5106
|
ErrorBoundary.prototype.render = function () {
|
|
5107
|
+
var goBack = function () {
|
|
5108
|
+
window$1.history.back();
|
|
5109
|
+
};
|
|
5110
|
+
var isNewTab = window$1.history.length === 1;
|
|
5015
5111
|
if (this.state.hasError) {
|
|
5016
5112
|
return (React.createElement(Wrapper$1, __assign({}, this.props),
|
|
5017
|
-
React.createElement(
|
|
5018
|
-
React.createElement(
|
|
5019
|
-
|
|
5020
|
-
|
|
5021
|
-
|
|
5022
|
-
|
|
5023
|
-
|
|
5024
|
-
React.createElement(
|
|
5113
|
+
React.createElement(ErrorTextContainer, null,
|
|
5114
|
+
React.createElement("b", { style: { color: '#2A4D63', fontSize: '64px' } }, "Sorry, something went wrong."),
|
|
5115
|
+
React.createElement("br", null),
|
|
5116
|
+
React.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."),
|
|
5117
|
+
React.createElement("br", null),
|
|
5118
|
+
React.createElement("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
|
5119
|
+
React.createElement(Button, { variant: "primary", size: "medium", id: "goBackButton", onClick: goBack, style: { marginRight: '25px', zIndex: 100, display: isNewTab ? 'none' : 'table-cell' } }, "Back to previous page"),
|
|
5120
|
+
React.createElement(Button, { variant: "text", size: "medium", style: { zIndex: 100 }, onClick: function (e) { return window$1.location.href = "/"; } }, "Go to homepage"))),
|
|
5121
|
+
React.createElement("div", { style: { position: 'absolute', bottom: '0', width: '100%' } },
|
|
5122
|
+
React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "310", viewBox: "0 0 1510 310", fill: "none", preserveAspectRatio: "none" },
|
|
5123
|
+
React.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" })))));
|
|
5025
5124
|
}
|
|
5026
5125
|
return this.props.children;
|
|
5027
5126
|
};
|
|
5028
5127
|
return ErrorBoundary;
|
|
5029
5128
|
}(Component));
|
|
5030
|
-
var templateObject_1$p, templateObject_2$c
|
|
5129
|
+
var templateObject_1$p, templateObject_2$c;
|
|
5031
5130
|
|
|
5032
5131
|
var CustomDateInput = forwardRef(function (_a, ref) {
|
|
5033
5132
|
var error = _a.error, noMargin = _a.noMargin, onClick = _a.onClick, isClearable = _a.isClearable, props = __rest(_a, ["error", "noMargin", "onClick", "isClearable"]);
|
|
@@ -5123,7 +5222,7 @@ var Dropdown = function (_a) {
|
|
|
5123
5222
|
};
|
|
5124
5223
|
var templateObject_1$o, templateObject_2$b, templateObject_3$6;
|
|
5125
5224
|
|
|
5126
|
-
var Badge = styled.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);
|
|
5225
|
+
var Badge = styled.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);
|
|
5127
5226
|
var templateObject_1$n;
|
|
5128
5227
|
|
|
5129
5228
|
var verticalScrollbarWidth = function () {
|
|
@@ -6126,8 +6225,8 @@ Transition.EXITING = EXITING;
|
|
|
6126
6225
|
var Transition$1 = Transition;
|
|
6127
6226
|
|
|
6128
6227
|
var CollapseStyled = styled.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'; });
|
|
6129
|
-
var CollapseWrapper = styled.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);
|
|
6130
|
-
var CollapsiblePanelTitle = styled.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);
|
|
6228
|
+
var CollapseWrapper = styled.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);
|
|
6229
|
+
var CollapsiblePanelTitle = styled.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);
|
|
6131
6230
|
var transitionStatusToClass = {
|
|
6132
6231
|
entering: 'collapsing',
|
|
6133
6232
|
entered: 'collapsed show',
|
|
@@ -6311,7 +6410,7 @@ function Thermometer(_a) {
|
|
|
6311
6410
|
setValue1Width((node === null || node === void 0 ? void 0 : node.clientWidth) || 0);
|
|
6312
6411
|
}, []);
|
|
6313
6412
|
return (React.createElement("div", __assign({}, props),
|
|
6314
|
-
title ? React.createElement(Text, { style: { fontWeight: 'bold', fontSize: 18, color: colors.neutrals.bodyText } }, title) : null,
|
|
6413
|
+
title ? React.createElement(Text, { style: { fontWeight: 'bold', fontSize: 18, color: colors$1.neutrals.bodyText } }, title) : null,
|
|
6315
6414
|
React.createElement("div", { style: { paddingBottom: 20, paddingTop: 5 } },
|
|
6316
6415
|
React.createElement("span", { ref: measureTargetRef, style: {
|
|
6317
6416
|
position: 'absolute',
|
|
@@ -6323,13 +6422,13 @@ function Thermometer(_a) {
|
|
|
6323
6422
|
React.createElement("span", { ref: measureValue1Ref, style: {
|
|
6324
6423
|
position: 'absolute',
|
|
6325
6424
|
paddingRight: 5,
|
|
6326
|
-
color: labelTextColor || colors.secondary3.main,
|
|
6425
|
+
color: labelTextColor || colors$1.secondary3.main,
|
|
6327
6426
|
} },
|
|
6328
6427
|
value1Label + " $",
|
|
6329
6428
|
React.createElement(Number$1, { commas: true, decimalPoints: 0, num: value1 }))),
|
|
6330
6429
|
React.createElement("div", { ref: measureContainerRef },
|
|
6331
6430
|
React.createElement(ProgressWrapper, { style: { marginTop: 10, background: isSecondary ? '#FFF9C5' : '#C9FDE5' } },
|
|
6332
|
-
React.createElement(ProgressBar, { target: target, value: value1, color: barColor || colors.secondary3.main, offset: calcVal1Width(), elementWidth: value1Width })))));
|
|
6431
|
+
React.createElement(ProgressBar, { target: target, value: value1, color: barColor || colors$1.secondary3.main, offset: calcVal1Width(), elementWidth: value1Width })))));
|
|
6333
6432
|
}
|
|
6334
6433
|
var templateObject_1$g, templateObject_2$4;
|
|
6335
6434
|
|
|
@@ -6351,7 +6450,7 @@ function LightIndicatorLight(_a) {
|
|
|
6351
6450
|
React.createElement("defs", null,
|
|
6352
6451
|
React.createElement("radialGradient", { id: lightID, cx: 0, cy: 0, r: 1, gradientUnits: "userSpaceOnUse", gradientTransform: gradientTransform }, litOrNot)));
|
|
6353
6452
|
}
|
|
6354
|
-
var LightIndicatorText = styled.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]; });
|
|
6453
|
+
var LightIndicatorText = styled.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]; });
|
|
6355
6454
|
var LightIndicatorContainer = styled.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);
|
|
6356
6455
|
function LightIndicator(_a) {
|
|
6357
6456
|
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"]);
|
|
@@ -6361,7 +6460,7 @@ function LightIndicator(_a) {
|
|
|
6361
6460
|
}
|
|
6362
6461
|
var templateObject_1$f, templateObject_2$3;
|
|
6363
6462
|
|
|
6364
|
-
var DefaultStarText = styled.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]; });
|
|
6463
|
+
var DefaultStarText = styled.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]; });
|
|
6365
6464
|
var DefaultStarContainer = styled.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);
|
|
6366
6465
|
function DefaultStar(_a) {
|
|
6367
6466
|
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"]);
|
|
@@ -6387,9 +6486,9 @@ function DoneButton(_a) {
|
|
|
6387
6486
|
return (React.createElement(Button, __assign({ variant: variant, size: size }, Props), "Done"));
|
|
6388
6487
|
}
|
|
6389
6488
|
|
|
6390
|
-
var StyledLink = styled.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; });
|
|
6489
|
+
var StyledLink = styled.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; });
|
|
6391
6490
|
function LinkWithIcon(_a) {
|
|
6392
|
-
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"]);
|
|
6491
|
+
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"]);
|
|
6393
6492
|
var _f = useState(false), isHover = _f[0], setHover = _f[1];
|
|
6394
6493
|
var RenderIcon = React.useMemo(function () {
|
|
6395
6494
|
if (!Icon) {
|
|
@@ -6419,29 +6518,29 @@ var NotificationExtraContent = memo(function (props) {
|
|
|
6419
6518
|
var NotificationIcon = memo(function (props) {
|
|
6420
6519
|
var alertType = props.alertType;
|
|
6421
6520
|
if (alertType === "success") {
|
|
6422
|
-
return React.createElement(CompletedCheckmarkIcon, { color: colors.green.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6521
|
+
return React.createElement(CompletedCheckmarkIcon, { color: colors$1.green.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6423
6522
|
}
|
|
6424
6523
|
else if (alertType === "error") {
|
|
6425
|
-
return React.createElement(AlertIcon, { color: colors.errors.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6524
|
+
return React.createElement(AlertIcon, { color: colors$1.errors.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6426
6525
|
}
|
|
6427
|
-
return React.createElement(InfoIcon, { color: colors.navy.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6526
|
+
return React.createElement(InfoIcon, { color: colors$1.navy.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6428
6527
|
});
|
|
6429
6528
|
var notificationVariantStyles = function (alertType) {
|
|
6430
6529
|
switch (alertType) {
|
|
6431
6530
|
case "neutral":
|
|
6432
6531
|
return {
|
|
6433
|
-
backgroundColor: colors.navy.lightest,
|
|
6434
|
-
color: colors.navy.dark,
|
|
6532
|
+
backgroundColor: colors$1.navy.lightest,
|
|
6533
|
+
color: colors$1.navy.dark,
|
|
6435
6534
|
};
|
|
6436
6535
|
case "success":
|
|
6437
6536
|
return {
|
|
6438
|
-
backgroundColor: colors.green.lightest,
|
|
6439
|
-
color: colors.green.darkest,
|
|
6537
|
+
backgroundColor: colors$1.green.lightest,
|
|
6538
|
+
color: colors$1.green.darkest,
|
|
6440
6539
|
};
|
|
6441
6540
|
case "error":
|
|
6442
6541
|
return {
|
|
6443
|
-
backgroundColor: colors.errors.lightest,
|
|
6444
|
-
color: colors.errors.dark,
|
|
6542
|
+
backgroundColor: colors$1.errors.lightest,
|
|
6543
|
+
color: colors$1.errors.dark,
|
|
6445
6544
|
};
|
|
6446
6545
|
default:
|
|
6447
6546
|
return {};
|
|
@@ -7026,8 +7125,8 @@ var BaseCollapsible = function (props) {
|
|
|
7026
7125
|
setHeight(0);
|
|
7027
7126
|
}, [isOpen]);
|
|
7028
7127
|
return (React.createElement("div", { style: style },
|
|
7029
|
-
React.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
|
|
7030
|
-
? { border: "3px solid ".concat(colors.teal.main) }
|
|
7128
|
+
React.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
|
|
7129
|
+
? { border: "3px solid ".concat(colors$1.teal.main) }
|
|
7031
7130
|
: {})) },
|
|
7032
7131
|
React.createElement(CollapsibleHeader, { isOpen: isOpen, handleToggle: handleToggle, controls: controls }, header || label),
|
|
7033
7132
|
React.createElement(Col, { xs: true, style: {
|
|
@@ -7070,7 +7169,7 @@ var CollapsibleLabel = function (props) {
|
|
|
7070
7169
|
}
|
|
7071
7170
|
if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
|
|
7072
7171
|
return React.createElement("span", { style: {
|
|
7073
|
-
color: colors.teal.main,
|
|
7172
|
+
color: colors$1.teal.main,
|
|
7074
7173
|
fontFamily: fontFamilies.bold,
|
|
7075
7174
|
fontStyle: 'normal',
|
|
7076
7175
|
fontWeight: 500,
|
|
@@ -7098,7 +7197,7 @@ var CollapsibleControls = function (props) {
|
|
|
7098
7197
|
}
|
|
7099
7198
|
if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
|
|
7100
7199
|
return React.createElement("span", { style: {
|
|
7101
|
-
color: colors.teal.main,
|
|
7200
|
+
color: colors$1.teal.main,
|
|
7102
7201
|
fontFamily: fontFamilies.bold,
|
|
7103
7202
|
fontStyle: 'normal',
|
|
7104
7203
|
fontWeight: 500,
|
|
@@ -7123,7 +7222,7 @@ var ConfirmPopup = function (props) {
|
|
|
7123
7222
|
fontFamily: fontStyles.p.medium.fontFamily,
|
|
7124
7223
|
fontSize: fontStyles.p.medium.fontSize,
|
|
7125
7224
|
lineHeight: fontStyles.p.medium.lineHeight,
|
|
7126
|
-
color: colors.neutrals.bodyText
|
|
7225
|
+
color: colors$1.neutrals.bodyText
|
|
7127
7226
|
} }, confirmText),
|
|
7128
7227
|
React.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
|
|
7129
7228
|
React.createElement(Button, { size: "medium", variant: 'secondary', mr: 24, onClick: function () {
|
|
@@ -7163,8 +7262,8 @@ var PopupTitle = function (_a) {
|
|
|
7163
7262
|
var PopupContent = function (_a) {
|
|
7164
7263
|
var children = _a.children;
|
|
7165
7264
|
return (React.createElement("div", { style: {
|
|
7166
|
-
background: colors.errors[10],
|
|
7167
|
-
color: colors.errors.main,
|
|
7265
|
+
background: colors$1.errors[10],
|
|
7266
|
+
color: colors$1.errors.main,
|
|
7168
7267
|
padding: 16,
|
|
7169
7268
|
} },
|
|
7170
7269
|
React.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
|
|
@@ -7173,12 +7272,12 @@ var PopupContent = function (_a) {
|
|
|
7173
7272
|
verticalAlign: 'middle',
|
|
7174
7273
|
alignSelf: 'center',
|
|
7175
7274
|
} },
|
|
7176
|
-
React.createElement(AlertIcon, { size: 'medium', color: colors.errors[70] })),
|
|
7275
|
+
React.createElement(AlertIcon, { size: 'medium', color: colors$1.errors[70] })),
|
|
7177
7276
|
React.createElement("div", { style: {
|
|
7178
7277
|
fontFamily: 'var(--font-family-regular)',
|
|
7179
7278
|
fontSize: fontStyles.p.large.fontSize,
|
|
7180
7279
|
lineHeight: fontStyles.p.medium.lineHeight,
|
|
7181
|
-
color: colors.errors.main,
|
|
7280
|
+
color: colors$1.errors.main,
|
|
7182
7281
|
} }, children))));
|
|
7183
7282
|
};
|
|
7184
7283
|
|
|
@@ -7214,7 +7313,7 @@ var CalendarDaysBody = function (_a) {
|
|
|
7214
7313
|
var DaysHeaderWrapper = styled(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"])));
|
|
7215
7314
|
var templateObject_1$6;
|
|
7216
7315
|
|
|
7217
|
-
var StyledDayText = styled(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 ") : ''; });
|
|
7316
|
+
var StyledDayText = styled(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 ") : ''; });
|
|
7218
7317
|
var templateObject_1$5;
|
|
7219
7318
|
|
|
7220
7319
|
var CalendarDaysHeader = function (_a) {
|
|
@@ -7252,11 +7351,11 @@ var DefaultCalendarHeader = function (_a) {
|
|
|
7252
7351
|
React.createElement(Row, null,
|
|
7253
7352
|
React.createElement(LabeledCheckbox, { label: "Weekends", checked: true })))),
|
|
7254
7353
|
React.createElement(Col, { padded: true },
|
|
7255
|
-
React.createElement("div", { style: { cursor: 'pointer', color: colors.primary, }, onClick: onPrevWeek }, "< Prev Week")),
|
|
7354
|
+
React.createElement("div", { style: { cursor: 'pointer', color: colors$1.primary, }, onClick: onPrevWeek }, "< Prev Week")),
|
|
7256
7355
|
React.createElement(Col, { center: true, padded: true },
|
|
7257
|
-
React.createElement("span", { style: { color: colors.disabledButton } }, format(currentMonth, "MMM yyyy"))),
|
|
7356
|
+
React.createElement("span", { style: { color: colors$1.disabledButton } }, format(currentMonth, "MMM yyyy"))),
|
|
7258
7357
|
React.createElement(Col, { end: true, padded: true },
|
|
7259
|
-
React.createElement("div", { style: { cursor: 'pointer', color: colors.primary, }, onClick: onNextWeek }, "Next Week >"))));
|
|
7358
|
+
React.createElement("div", { style: { cursor: 'pointer', color: colors$1.primary, }, onClick: onNextWeek }, "Next Week >"))));
|
|
7260
7359
|
};
|
|
7261
7360
|
|
|
7262
7361
|
var TasksCalendarDayBody = function (_a) {
|
|
@@ -7328,7 +7427,7 @@ var CalendarIconDatePicker = React.forwardRef(function (_a, ref) {
|
|
|
7328
7427
|
textAlign: 'center',
|
|
7329
7428
|
borderRadius: 5,
|
|
7330
7429
|
cursor: 'pointer',
|
|
7331
|
-
color: colors.disabledButton,
|
|
7430
|
+
color: colors$1.disabledButton,
|
|
7332
7431
|
} })));
|
|
7333
7432
|
});
|
|
7334
7433
|
var TasksCalendarHeader = function (_a) {
|
|
@@ -7370,7 +7469,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7370
7469
|
}
|
|
7371
7470
|
} })),
|
|
7372
7471
|
React.createElement("span", null,
|
|
7373
|
-
React.createElement(WeekNav, { style: { cursor: 'pointer', color: colors.primary, verticalAlign: 'middle' }, onClick: onPrevWeek },
|
|
7472
|
+
React.createElement(WeekNav, { style: { cursor: 'pointer', color: colors$1.primary, verticalAlign: 'middle' }, onClick: onPrevWeek },
|
|
7374
7473
|
React.createElement(ChevronIcon, { direction: "left", size: 'large' })),
|
|
7375
7474
|
React.createElement(WeekNav, { as: Button, variant: "text", size: "primary-light", style: { verticalAlign: "middle", padding: "10px 0px", }, py: 5, onClick: function () {
|
|
7376
7475
|
if (isCurrentWeek) {
|
|
@@ -7378,7 +7477,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7378
7477
|
}
|
|
7379
7478
|
onResetDate();
|
|
7380
7479
|
} }, "Today"),
|
|
7381
|
-
React.createElement(WeekNav, { style: { cursor: 'pointer', color: colors.primary1.main, verticalAlign: 'middle' }, onClick: onNextWeek },
|
|
7480
|
+
React.createElement(WeekNav, { style: { cursor: 'pointer', color: colors$1.primary1.main, verticalAlign: 'middle' }, onClick: onNextWeek },
|
|
7382
7481
|
React.createElement(ChevronIcon, { size: "large" })))),
|
|
7383
7482
|
React.createElement(Col, { start: 1, xs: true, md: 8, padded: true },
|
|
7384
7483
|
React.createElement(Tabs, { size: "medium", tabs: tabs })),
|
|
@@ -7386,7 +7485,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7386
7485
|
React.createElement(Link, { as: "span", onClick: onClickAddTask, style: {
|
|
7387
7486
|
marginRight: 10,
|
|
7388
7487
|
verticalAlign: 'bottom',
|
|
7389
|
-
color: colors.primary1.main,
|
|
7488
|
+
color: colors$1.primary1.main,
|
|
7390
7489
|
fontFamily: [themeOptions.fontFamilies.regular].concat(themeOptions.fontFamilies.fallbacks).join(','),
|
|
7391
7490
|
fontWeight: 600,
|
|
7392
7491
|
} }, "+ Add Task")
|
|
@@ -7692,7 +7791,7 @@ var SimpleWindowedTableStyles = styled.div(templateObject_1$1 || (templateObject
|
|
|
7692
7791
|
"border: ".concat(typeof p.bordered === 'string'
|
|
7693
7792
|
? p.bordered
|
|
7694
7793
|
: "1px solid ".concat(getThemeColor(p, 'tableBorder', '#edf2f5')), ";")
|
|
7695
|
-
: ''; }, colors.disabledButtonBorder, colors.disabledButtonBorder, function (p) { return p.hoverRowBg ?
|
|
7794
|
+
: ''; }, colors$1.disabledButtonBorder, colors$1.disabledButtonBorder, function (p) { return p.hoverRowBg ?
|
|
7696
7795
|
".tr:not(.header.tr, .table-footer.tr):hover {\n background: ".concat(typeof p.hoverRowBg === 'string'
|
|
7697
7796
|
? p.hoverRowBg
|
|
7698
7797
|
: getThemeColor(p, 'tableHeaderBg', '#F6FEFF'), ";\n }") : ''; }, function (p) { return p.selectedRowIndex && p.selectedRowStyle ?
|
|
@@ -7814,7 +7913,7 @@ var createAnimationLeftStyle = function (p) {
|
|
|
7814
7913
|
};
|
|
7815
7914
|
var ContainerStyled = styled(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
|
|
7816
7915
|
? getThemeColor(p, 'teal.main', 'var(--color-primary1-main)')
|
|
7817
|
-
: getThemeColor(p, 'teal.20', colors.teal['20']); }, function (p) { return p.stretch
|
|
7916
|
+
: getThemeColor(p, 'teal.20', colors$1.teal['20']); }, function (p) { return p.stretch
|
|
7818
7917
|
? '100%'
|
|
7819
7918
|
: "".concat(stripUnit(toggleSizes[p.size || 'medium'].height) * 2.5, "px"); }, createAnimationLeftStyle, createAnimationLeftStyle);
|
|
7820
7919
|
var ToggleSwitchDotStyled = styled(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
|
|
@@ -7881,5 +7980,5 @@ var Dropzone = React.forwardRef(function (_a, ref) {
|
|
|
7881
7980
|
React.createElement(RenderChild, { parseProps: parseChildProps }, children))));
|
|
7882
7981
|
});
|
|
7883
7982
|
|
|
7884
|
-
export { AddIcon, AddNoteIcon, AddShoppingCartIcon, AddTaskIcon, AlertIcon, AlertNotification, ArrowIcon, Artwork, SKUAsyncSelect as AsyncSelect, Avatar, AwaitingProofIcon, Backdrop, Background, Badge, BotIcon, Box, BulletIcon, Button, ButtonsGroup, Calendar, CalendarDayBody, CalendarDaysBody, CalendarDaysHeader, CalendarIcon, CalendarTask, CalendarWrapper, CancelButton, ChangeRequestedIcon, ChatIcon, CheckMark, CheckboxIcon, CheckboxLabel, CheckmarkIcon, ChevronIcon, ChevronPopup, CircleProgressIcon, ClientApprovedIcon, ClipboardIcon, ClockIcon, Col, CollaborateIcon, CollapseStyled, CollapseWrapper, Collapsible$1 as Collapsible, CollapsibleArrowIcon, CollapsibleLabel, CollapsiblePanel, CollapsiblePanelTitle, CollapsiblePanels, Collapsible as CollapsibleV2, Collapsibles, Column, ColumnSelectIcon, CommentIcon, CommunityIcon, CompletedCheckmarkIcon, ConfirmAlertPopup, ConfirmPopup, ConnectedIcon, ConnectedPlusIcon, CouponIcon, SKUCreatableSelect as CreatableSelect, CreditCardIcon, Csku, CustomDateInput, Datepicker, DaysBodyWrapper, DefaultCalendarFooter, DefaultCalendarHeader, DefaultStar, DesignIcon, DollarIcon, DoneButton, Dot, DoubleArrowIcon, DownloadIcon, DragIcon, DraggableTasksCalendar, DropArea, DropDownContent$2 as DropDownContent, Dropdown, DropdownItem$2 as DropdownItem, Dropzone, Dropzoned, DropzonedPreviews, EPOIcon, EditIcon, EllipsisIcon, EmptyStateArrowIcon as EmptyStateArrow, EpsIcon, ErrorBoundary, EstimateCircleIcon, EyeIcon, FeedPost, FileUploadIcon, FilledChevronIcon, FolderIcon, GalleryIcon, GearIcon, GlobalStyle, Grid, GridCell, GridIcon, GridItem, GridRow, GridTable, GridTableContainer, H1, H2, H3, H4, H5, H6, HandleIcon, HeadlessTable, HelpIcon, HistoryIcon, IconButton, IconDoc, ImageIcon, Img, InfoIcon, Input, InputIconLabel, InputIconLabelContainer, InputStepper, InputStepperStyled, IntegrationsIcon, InventoryIcon, Label, LabeledAsyncSelect, LabeledCheckbox, LabeledCreatableSelect, LabeledIconInput, LabeledInput, LabeledMultiProgress, LabeledProgress, LabeledRadio, LabeledRadioGroup, LabeledRadioInButton, LabeledRadioInButtonGroup, LabeledSelect, LabeledTextarea, LightIndicator, Link, LinkWithIcon, ListIcon, Loading, LockIcon, MagicEraserIcon, MagicIcon, MailIcon, MarketingStatusIcon, MenuIcon, MergeIcon, MultiProgress, NavConnectIcon, NavFinanceIcon, NavManagementIcon, NavProdIcon, NavReportsIcon, NavResourcesIcon, NavSalesIcon, NoteIcon, Number$1 as Number, NumberInput, OpportunityCircleIcon, OrderStatusIcon, Overlay, Padding, Page, PanelContact, PanelTileContact, PendingApprovalIcon, PercentIcon, PinIcon, Popup, PopupHeader, PresentationCircleIcon, Product, Progress, PromostandardsIcon, ProofReceivedIcon, ProofingCompleteIcon, Publisher, Radio, RadioIcon, RadioLabel, ReceiptLongIcon, RenderChild, ResponsiveTable, Row, SHARED_STYLE_MAPS, SalesArrowIcon, SalesOrderCircleIcon, SearchIcon, SKUSelect as Select, SelectionTable, SharedStyles, ShopIcon, ShoppingCartIcon, ShowPopup, SidePanel, SimpleWindowedTable, SimpleWindowedTableStyles, SizerCss, SizerWrapper, SlideInIcon, Sparkles, Spinner, StarDarkIcon, StarIcon, StarLightIcon, StarRating, StateDropdown, StatusDropdown, StyledCalendarTaskBody, StyledDropArea, StyledDropdown$2 as StyledDropdown, StyledPanel, StyledTask, SubtractIcon, SVG$1 as SvgIcon, TBody, TD$1 as TD, TH, THSorted, THead, TR, Tab, TabBar, Table, TableIcon, Tabs, TagIcon, TargetIcon, Task, TaskBody, TaskIcon, TaskLabel, TaskName, TasksCalendar, TasksCalendarDayBody, TasksCalendarFooter, TemplateIcon, Text, Textarea, Theme, Thermometer, TilesIcon, Toggle, ToggleLink, ToggleSwitch, ToggleSwitchStyled, TrashIcon, TrendIcon, UploadIcon, UserIcon, UsersIcon, VirtualTable, VirtualTableStyles, Wrapper$4 as Wrapper, XIcon, colors, createMeasurementStyle, datepickerStyles, fontFamilies, fontStyles, fonts, getColor$1 as getColor, getFontStyle, getThemeColor, getThemeFontFamily, getThemeFontSize, getThemeFontStyle, getThemeProperty, parseCskuStyles, sizes, themeOptions, toggleSizes$1 as toggleSizes, useCalendar, useClickOutside, useDelayUnmount, useFallbackRef, useLongPress, usePrefersReducedMotion, useRandomInterval, useWindowSize };
|
|
7983
|
+
export { AddIcon, AddNoteIcon, AddShoppingCartIcon, AddTaskIcon, AlertIcon, AlertNotification, ArrowIcon, Artwork, SKUAsyncSelect as AsyncSelect, Avatar, AwaitingProofIcon, Backdrop, Background, Badge, BotIcon, Box, BulletIcon, Button, ButtonsGroup, Calendar, CalendarDayBody, CalendarDaysBody, CalendarDaysHeader, CalendarIcon, CalendarTask, CalendarWrapper, CancelButton, ChangeRequestedIcon, ChatIcon, CheckMark, CheckboxIcon, CheckboxLabel, CheckmarkIcon, ChevronIcon, ChevronPopup, CircleProgressIcon, ClientApprovedIcon, ClipboardIcon, ClockIcon, Col, CollaborateIcon, CollapseStyled, CollapseWrapper, Collapsible$1 as Collapsible, CollapsibleArrowIcon, CollapsibleLabel, CollapsiblePanel, CollapsiblePanelTitle, CollapsiblePanels, Collapsible as CollapsibleV2, Collapsibles, Column, ColumnSelectIcon, CommentIcon, CommonskuMainLogo, CommunityIcon, CompletedCheckmarkIcon, ConfirmAlertPopup, ConfirmPopup, ConnectedIcon, ConnectedPlusIcon, CouponIcon, SKUCreatableSelect as CreatableSelect, CreditCardIcon, Csku, CustomDateInput, Datepicker, DaysBodyWrapper, DefaultCalendarFooter, DefaultCalendarHeader, DefaultStar, DesignIcon, DollarIcon, DoneButton, Dot, DoubleArrowIcon, DownloadIcon, DragIcon, DraggableTasksCalendar, DropArea, DropDownContent$2 as DropDownContent, Dropdown, DropdownItem$2 as DropdownItem, Dropzone, Dropzoned, DropzonedPreviews, EPOIcon, EditIcon, EllipsisIcon, EmptyStateArrowIcon as EmptyStateArrow, EpsIcon, ErrorBoundary, EstimateCircleIcon, EyeIcon, FeedPost, FileUploadIcon, FilledChevronIcon, FolderIcon, GalleryIcon, GearIcon, GlobalStyle, Grid, GridCell, GridIcon, GridItem, GridRow, GridTable, GridTableContainer, H1, H2, H3, H4, H5, H6, HandleIcon, HeadlessTable, HelpIcon, HistoryIcon, IconButton, IconDoc, ImageIcon, Img, InfoIcon, Input, InputIconLabel, InputIconLabelContainer, InputStepper, InputStepperStyled, IntegrationsIcon, InventoryIcon, Label, LabeledAsyncSelect, LabeledCheckbox, LabeledCreatableSelect, LabeledIconInput, LabeledInput, LabeledMultiProgress, LabeledProgress, LabeledRadio, LabeledRadioGroup, LabeledRadioInButton, LabeledRadioInButtonGroup, LabeledSelect, LabeledTextarea, LightIndicator, Link, LinkWithIcon, ListIcon, Loading, LockIcon, MagicEraserIcon, MagicIcon, MailIcon, MarketingStatusIcon, MenuIcon, MergeIcon, MultiProgress, NavConnectIcon, NavFinanceIcon, NavManagementIcon, NavProdIcon, NavReportsIcon, NavResourcesIcon, NavSalesIcon, NoteIcon, Number$1 as Number, NumberInput, OpportunityCircleIcon, OrderStatusIcon, Overlay, Padding, Page, PanelContact, PanelTileContact, PendingApprovalIcon, PercentIcon, PinIcon, Popup, PopupHeader, PresentationCircleIcon, Product, Progress, PromostandardsIcon, ProofReceivedIcon, ProofingCompleteIcon, Publisher, Radio, RadioIcon, RadioLabel, ReceiptLongIcon, RenderChild, ResponsiveTable, Row, SHARED_STYLE_MAPS, SalesArrowIcon, SalesOrderCircleIcon, SearchIcon, SKUSelect as Select, SelectionTable, SharedStyles, ShopIcon, ShoppingCartIcon, ShowPopup, SidePanel, SimpleWindowedTable, SimpleWindowedTableStyles, SizerCss, SizerWrapper, SkubotLogo, SkubotSpinner, SlideInIcon, Sparkles, Spinner, StarDarkIcon, StarIcon, StarLightIcon, StarRating, StateDropdown, StatusDropdown, StyledCalendarTaskBody, StyledDropArea, StyledDropdown$2 as StyledDropdown, StyledPanel, StyledTask, SubtractIcon, SVG$1 as SvgIcon, TBody, TD$1 as TD, TH, THSorted, THead, TR, Tab, TabBar, Table, TableIcon, Tabs, TagIcon, TargetIcon, Task, TaskBody, TaskIcon, TaskLabel, TaskName, TasksCalendar, TasksCalendarDayBody, TasksCalendarFooter, TemplateIcon, Text, Textarea, Theme, Thermometer, TilesIcon, Toggle, ToggleLink, ToggleSwitch, ToggleSwitchStyled, TrashIcon, TrendIcon, UploadIcon, UserIcon, UsersIcon, VirtualTable, VirtualTableStyles, Wrapper$4 as Wrapper, XIcon, colors$1 as colors, createMeasurementStyle, datepickerStyles, fontFamilies, fontStyles, fonts, getColor$1 as getColor, getFontStyle, getThemeColor, getThemeFontFamily, getThemeFontSize, getThemeFontStyle, getThemeProperty, parseCskuStyles, sizes, themeOptions, toggleSizes$1 as toggleSizes, useCalendar, useClickOutside, useDelayUnmount, useFallbackRef, useLongPress, usePrefersReducedMotion, useRandomInterval, useWindowSize };
|
|
7885
7984
|
//# sourceMappingURL=index.mjs.map
|