@commonsku/styles 1.17.9 → 1.17.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +308 -190
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +32 -1
- package/dist/index.mjs +304 -190
- package/dist/index.mjs.map +1 -1
- package/dist/styles/ErrorBoundary.d.ts.map +1 -1
- package/dist/styles/icons/CommonskuMainLogo.d.ts +12 -0
- package/dist/styles/icons/CommonskuMainLogo.d.ts.map +1 -0
- package/dist/styles/icons/ResizableIcon.d.ts +6 -0
- package/dist/styles/icons/ResizableIcon.d.ts.map +1 -0
- package/dist/styles/icons/SkubotLogo.d.ts +12 -0
- package/dist/styles/icons/SkubotLogo.d.ts.map +1 -0
- package/dist/styles/icons/SkubotSpinner.d.ts +13 -0
- package/dist/styles/icons/SkubotSpinner.d.ts.map +1 -0
- package/dist/styles/icons/index.d.ts +4 -0
- package/dist/styles/icons/index.d.ts.map +1 -1
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/ssr.d.ts +2 -0
- package/dist/utils/ssr.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/index.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") {
|
|
@@ -2261,7 +2355,7 @@ function MenuIcon(_a) {
|
|
|
2261
2355
|
React.createElement("path", { d: "M4 18h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1Zm0-5h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1ZM3 7c0 .55.45 1 1 1h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1Z", fill: color }));
|
|
2262
2356
|
}
|
|
2263
2357
|
|
|
2264
|
-
var iconSizes$
|
|
2358
|
+
var iconSizes$8 = {
|
|
2265
2359
|
tiny: {
|
|
2266
2360
|
'font-size': fontStyles.button.small.fontSize,
|
|
2267
2361
|
},
|
|
@@ -2285,7 +2379,7 @@ var getSizeStyle$2 = function (style, defaults) {
|
|
|
2285
2379
|
return function (_a) {
|
|
2286
2380
|
var size = _a.size;
|
|
2287
2381
|
if (size) {
|
|
2288
|
-
return get(iconSizes$
|
|
2382
|
+
return get(iconSizes$8, [size, style]) || defaults;
|
|
2289
2383
|
}
|
|
2290
2384
|
return defaults;
|
|
2291
2385
|
};
|
|
@@ -2350,7 +2444,7 @@ function HandleIcon(_a) {
|
|
|
2350
2444
|
React.createElement("path", { d: "M11 18C11 19.1 10.1 20 9 20C7.9 20 7 19.1 7 18C7 16.9 7.9 16 9 16C10.1 16 11 16.9 11 18ZM9 10C7.9 10 7 10.9 7 12C7 13.1 7.9 14 9 14C10.1 14 11 13.1 11 12C11 10.9 10.1 10 9 10ZM9 4C7.9 4 7 4.9 7 6C7 7.1 7.9 8 9 8C10.1 8 11 7.1 11 6C11 4.9 10.1 4 9 4ZM15 8C16.1 8 17 7.1 17 6C17 4.9 16.1 4 15 4C13.9 4 13 4.9 13 6C13 7.1 13.9 8 15 8ZM15 10C13.9 10 13 10.9 13 12C13 13.1 13.9 14 15 14C16.1 14 17 13.1 17 12C17 10.9 16.1 10 15 10ZM15 16C13.9 16 13 16.9 13 18C13 19.1 13.9 20 15 20C16.1 20 17 19.1 17 18C17 16.9 16.1 16 15 16Z", fill: color }));
|
|
2351
2445
|
}
|
|
2352
2446
|
|
|
2353
|
-
var iconSizes$
|
|
2447
|
+
var iconSizes$7 = {
|
|
2354
2448
|
tiny: {
|
|
2355
2449
|
width: 16,
|
|
2356
2450
|
height: 18,
|
|
@@ -2384,11 +2478,11 @@ var iconSizes$6 = {
|
|
|
2384
2478
|
};
|
|
2385
2479
|
function ShoppingCartIcon(_a) {
|
|
2386
2480
|
var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "Shopping Cart" : _d, props = __rest(_a, ["color", "size", "altText"]);
|
|
2387
|
-
return (React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "ShoppingCartIcon", iconSizes: iconSizes$
|
|
2481
|
+
return (React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "ShoppingCartIcon", iconSizes: iconSizes$7, altText: altText }, props),
|
|
2388
2482
|
React.createElement("path", { d: "M15.5463 11C16.2963 11 16.9563 10.59 17.2963 9.97L20.8763 3.48C21.2463 2.82 20.7663 2 20.0063 2H5.20634L4.26634 0H0.996338V2H2.99634L6.59634 9.59L5.24634 12.03C4.51634 13.37 5.47634 15 6.99634 15H18.9963V13H6.99634L8.09634 11H15.5463ZM6.15634 4H18.3063L15.5463 9H8.52634L6.15634 4ZM6.99634 16C5.89634 16 5.00634 16.9 5.00634 18C5.00634 19.1 5.89634 20 6.99634 20C8.09634 20 8.99634 19.1 8.99634 18C8.99634 16.9 8.09634 16 6.99634 16ZM16.9963 16C15.8963 16 15.0063 16.9 15.0063 18C15.0063 19.1 15.8963 20 16.9963 20C18.0963 20 18.9963 19.1 18.9963 18C18.9963 16.9 18.0963 16 16.9963 16Z", fill: color })));
|
|
2389
2483
|
}
|
|
2390
2484
|
|
|
2391
|
-
var iconSizes$
|
|
2485
|
+
var iconSizes$6 = {
|
|
2392
2486
|
tiny: {
|
|
2393
2487
|
width: 14,
|
|
2394
2488
|
height: 15,
|
|
@@ -2422,7 +2516,7 @@ var iconSizes$5 = {
|
|
|
2422
2516
|
};
|
|
2423
2517
|
function AddShoppingCartIcon(_a) {
|
|
2424
2518
|
var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c; _a.altText; var props = __rest(_a, ["color", "size", "altText"]);
|
|
2425
|
-
return (React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "AddShoppingCartIcon", iconSizes: iconSizes$
|
|
2519
|
+
return (React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "AddShoppingCartIcon", iconSizes: iconSizes$6 }, props),
|
|
2426
2520
|
React.createElement("path", { d: "M10.4199 8.5H12.4199V5.5H15.4199V3.5H12.4199V0.5H10.4199V3.5H7.41992V5.5H10.4199V8.5ZM6.41992 17.5C5.31992 17.5 4.42992 18.4 4.42992 19.5C4.42992 20.6 5.31992 21.5 6.41992 21.5C7.51992 21.5 8.41992 20.6 8.41992 19.5C8.41992 18.4 7.51992 17.5 6.41992 17.5ZM16.4199 17.5C15.3199 17.5 14.4299 18.4 14.4299 19.5C14.4299 20.6 15.3199 21.5 16.4199 21.5C17.5199 21.5 18.4199 20.6 18.4199 19.5C18.4199 18.4 17.5199 17.5 16.4199 17.5ZM7.51992 12.5H14.9699C15.7199 12.5 16.3799 12.09 16.7199 11.47L20.5799 4.46L18.8399 3.5L14.9699 10.5H7.94992L3.68992 1.5H0.419922V3.5H2.41992L6.01992 11.09L4.66992 13.53C3.93992 14.87 4.89992 16.5 6.41992 16.5H18.4199V14.5H6.41992L7.51992 12.5Z", fill: color })));
|
|
2427
2521
|
}
|
|
2428
2522
|
|
|
@@ -2497,7 +2591,7 @@ function HelpIcon(_a) {
|
|
|
2497
2591
|
React.createElement("path", { d: "M9 16H11V14H9V16ZM10 0C4.48 0 0 4.48 0 10C0 15.52 4.48 20 10 20C15.52 20 20 15.52 20 10C20 4.48 15.52 0 10 0ZM10 18C5.59 18 2 14.41 2 10C2 5.59 5.59 2 10 2C14.41 2 18 5.59 18 10C18 14.41 14.41 18 10 18ZM10 4C7.79 4 6 5.79 6 8H8C8 6.9 8.9 6 10 6C11.1 6 12 6.9 12 8C12 10 9 9.75 9 13H11C11 10.75 14 10.5 14 8C14 5.79 12.21 4 10 4Z", fill: color }));
|
|
2498
2592
|
}
|
|
2499
2593
|
|
|
2500
|
-
var iconSizes$
|
|
2594
|
+
var iconSizes$5 = {
|
|
2501
2595
|
tiny: {
|
|
2502
2596
|
width: 188,
|
|
2503
2597
|
height: 44,
|
|
@@ -2532,7 +2626,7 @@ var iconSizes$4 = {
|
|
|
2532
2626
|
function FileUploadIcon(_a) {
|
|
2533
2627
|
var _b = _a.color; _b === void 0 ? teal.main : _b; var _c = _a.size, size = _c === void 0 ? "medium" : _c; _a.altText; var props = __rest(_a, ["color", "size", "altText"]);
|
|
2534
2628
|
var clipId = "clip0_2603_83254_".concat(uniqueId('clip'));
|
|
2535
|
-
return React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "FileUploadIcon", iconSizes: iconSizes$
|
|
2629
|
+
return React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "FileUploadIcon", iconSizes: iconSizes$5 }, props),
|
|
2536
2630
|
React.createElement("g", { clipPath: "url(#".concat(clipId, ")") },
|
|
2537
2631
|
React.createElement("path", { d: "M74.6667 13.3333V50.6667H37.3333V13.3333H74.6667ZM74.6667 8H37.3333C34.4 8 32 10.4 32 13.3333V50.6667C32 53.6 34.4 56 37.3333 56H74.6667C77.6 56 80 53.6 80 50.6667V13.3333C80 10.4 77.6 8 74.6667 8ZM61.7067 31.6267L53.7067 41.9467L48 35.04L40 45.3333H72L61.7067 31.6267Z", fill: "#B8C4CB" })),
|
|
2538
2632
|
React.createElement("path", { d: "M97.26 19H99.9C102.36 19 104.28 17.08 104.28 14.8C104.28 12.52 102.36 10.6 99.9 10.6H97.26V19ZM98.16 18.16V11.44H99.9C101.88 11.44 103.38 12.94 103.38 14.8C103.38 16.66 101.88 18.16 99.9 18.16H98.16ZM105.96 19H106.8V15.82C106.8 14.68 107.64 13.96 108.6 13.96H108.96V13.12H108.72C107.4 13.12 106.8 14.02 106.8 14.02V13.24H105.96V19ZM113.577 19H114.417V15.34C114.417 14.08 113.457 13.12 112.137 13.12C110.757 13.12 109.977 14.2 109.977 14.2L110.517 14.74C110.517 14.74 111.117 13.9 112.137 13.9C112.977 13.9 113.577 14.5 113.577 15.34L111.357 15.7C110.277 15.88 109.677 16.48 109.677 17.44C109.677 18.28 110.517 19.12 111.717 19.12C112.977 19.12 113.577 18.22 113.577 18.22V19ZM113.577 16.42C113.577 17.56 112.797 18.34 111.717 18.34C110.937 18.34 110.517 17.92 110.517 17.44C110.517 16.9 110.877 16.552 111.597 16.42L113.577 16.06V16.42ZM116.151 20.32C116.151 20.32 116.931 21.52 118.551 21.52C120.111 21.52 121.371 20.26 121.371 18.64V13.24H120.531V14.02C120.531 14.02 119.991 13.12 118.611 13.12C117.111 13.12 115.911 14.38 115.911 16C115.911 17.62 117.111 18.88 118.611 18.88C119.991 18.88 120.531 17.98 120.531 17.98V18.64C120.531 19.84 119.631 20.74 118.551 20.74C117.351 20.74 116.691 19.78 116.691 19.78L116.151 20.32ZM118.611 18.1C117.591 18.1 116.751 17.2 116.751 16C116.751 14.8 117.591 13.9 118.611 13.9C119.691 13.9 120.531 14.8 120.531 16C120.531 17.2 119.691 18.1 118.611 18.1ZM129.292 19H130.132V15.34C130.132 14.08 129.172 13.12 127.852 13.12C126.472 13.12 125.692 14.2 125.692 14.2L126.232 14.74C126.232 14.74 126.832 13.9 127.852 13.9C128.692 13.9 129.292 14.5 129.292 15.34L127.072 15.7C125.992 15.88 125.392 16.48 125.392 17.44C125.392 18.28 126.232 19.12 127.432 19.12C128.692 19.12 129.292 18.22 129.292 18.22V19ZM129.292 16.42C129.292 17.56 128.512 18.34 127.432 18.34C126.652 18.34 126.232 17.92 126.232 17.44C126.232 16.9 126.592 16.552 127.312 16.42L129.292 16.06V16.42ZM132.046 19H132.886V15.82C132.886 14.68 133.666 13.9 134.686 13.9C135.586 13.9 136.246 14.56 136.246 15.58V19H137.086V15.58C137.086 14.08 136.126 13.12 134.746 13.12C133.486 13.12 132.886 14.08 132.886 14.08V13.24H132.046V19ZM143.387 19H144.227V10.6H143.387V14.08C143.387 14.08 142.727 13.12 141.407 13.12C139.847 13.12 138.587 14.38 138.587 16.12C138.587 17.86 139.847 19.12 141.407 19.12C142.727 19.12 143.387 18.16 143.387 18.16V19ZM141.407 18.34C140.327 18.34 139.427 17.44 139.427 16.12C139.427 14.8 140.327 13.9 141.407 13.9C142.427 13.9 143.387 14.86 143.387 16.12C143.387 17.38 142.427 18.34 141.407 18.34ZM153.102 19H153.942V10.6H153.102V14.08C153.102 14.08 152.442 13.12 151.122 13.12C149.562 13.12 148.302 14.38 148.302 16.12C148.302 17.86 149.562 19.12 151.122 19.12C152.442 19.12 153.102 18.16 153.102 18.16V19ZM151.122 18.34C150.042 18.34 149.142 17.44 149.142 16.12C149.142 14.8 150.042 13.9 151.122 13.9C152.142 13.9 153.102 14.86 153.102 16.12C153.102 17.38 152.142 18.34 151.122 18.34ZM155.917 19H156.757V15.82C156.757 14.68 157.597 13.96 158.557 13.96H158.917V13.12H158.677C157.357 13.12 156.757 14.02 156.757 14.02V13.24H155.917V19ZM162.457 19.12C164.077 19.12 165.397 17.8 165.397 16.12C165.397 14.44 164.077 13.12 162.457 13.12C160.837 13.12 159.517 14.44 159.517 16.12C159.517 17.8 160.837 19.12 162.457 19.12ZM162.457 18.34C161.317 18.34 160.357 17.368 160.357 16.12C160.357 14.86 161.317 13.9 162.457 13.9C163.597 13.9 164.557 14.86 164.557 16.12C164.557 17.38 163.597 18.34 162.457 18.34ZM166.898 21.52H167.738V18.16C167.738 18.16 168.398 19.12 169.718 19.12C171.278 19.12 172.538 17.86 172.538 16.12C172.538 14.38 171.278 13.12 169.718 13.12C168.398 13.12 167.738 14.08 167.738 14.08V13.24H166.898V21.52ZM169.718 18.34C168.698 18.34 167.738 17.38 167.738 16.12C167.738 14.86 168.698 13.9 169.718 13.9C170.798 13.9 171.698 14.8 171.698 16.12C171.698 17.44 170.798 18.34 169.718 18.34ZM97.02 33H97.86V29.82C97.86 28.68 98.64 27.9 99.66 27.9C100.56 27.9 101.22 28.56 101.22 29.58V33H102.06V29.58C102.06 28.08 101.1 27.12 99.72 27.12C98.46 27.12 97.86 28.08 97.86 28.08V24.6H97.02V33ZM108.3 31.38C108.3 31.38 107.652 32.34 106.44 32.34C105.36 32.34 104.46 31.44 104.4 30.42L109.08 30.432C109.08 30.432 109.14 30.24 109.14 30C109.14 28.32 107.94 27.12 106.38 27.12C104.88 27.12 103.56 28.44 103.56 30.12C103.56 31.8 104.88 33.12 106.44 33.12C108 33.12 108.84 31.92 108.84 31.92L108.3 31.38ZM104.4 29.7C104.52 28.74 105.36 27.9 106.38 27.9C107.4 27.9 108.18 28.68 108.3 29.7H104.4ZM110.636 33H111.476V29.82C111.476 28.68 112.316 27.96 113.276 27.96H113.636V27.12H113.396C112.076 27.12 111.476 28.02 111.476 28.02V27.24H110.636V33ZM118.975 31.38C118.975 31.38 118.327 32.34 117.115 32.34C116.035 32.34 115.135 31.44 115.075 30.42L119.755 30.432C119.755 30.432 119.815 30.24 119.815 30C119.815 28.32 118.615 27.12 117.055 27.12C115.555 27.12 114.235 28.44 114.235 30.12C114.235 31.8 115.555 33.12 117.115 33.12C118.675 33.12 119.515 31.92 119.515 31.92L118.975 31.38ZM115.075 29.7C115.195 28.74 116.035 27.9 117.055 27.9C118.075 27.9 118.855 28.68 118.975 29.7H115.075ZM126.351 33.12C127.971 33.12 129.291 31.8 129.291 30.12C129.291 28.44 127.971 27.12 126.351 27.12C124.731 27.12 123.411 28.44 123.411 30.12C123.411 31.8 124.731 33.12 126.351 33.12ZM126.351 32.34C125.211 32.34 124.251 31.368 124.251 30.12C124.251 28.86 125.211 27.9 126.351 27.9C127.491 27.9 128.451 28.86 128.451 30.12C128.451 31.38 127.491 32.34 126.351 32.34ZM130.792 33H131.632V29.82C131.632 28.68 132.472 27.96 133.432 27.96H133.792V27.12H133.552C132.232 27.12 131.632 28.02 131.632 28.02V27.24H130.792V33Z", fill: "#899CA9" }),
|
|
@@ -2542,7 +2636,7 @@ function FileUploadIcon(_a) {
|
|
|
2542
2636
|
React.createElement("rect", { width: "64", height: "64", fill: "white", transform: "translate(24)" }))));
|
|
2543
2637
|
}
|
|
2544
2638
|
|
|
2545
|
-
var iconSizes$
|
|
2639
|
+
var iconSizes$4 = {
|
|
2546
2640
|
tiny: {
|
|
2547
2641
|
width: 12,
|
|
2548
2642
|
height: 12,
|
|
@@ -2610,13 +2704,13 @@ function DoubleArrowIcon(_a) {
|
|
|
2610
2704
|
'M16.4065 8.94078C15.8865 9.46078 15.8865 10.3008 16.4065 10.8208L21.5665 16.0074L16.3932 21.1808C15.8732 21.7008 15.8732 22.5408 16.3932 23.0608C16.9132 23.5808 17.7532 23.5808 18.2732 23.0608L24.3932 16.9408C24.9132 16.4208 24.9132 15.5808 24.3932 15.0608L18.2865 8.94078C17.7665 8.42078 16.9265 8.42078 16.4065 8.94078Z',
|
|
2611
2705
|
];
|
|
2612
2706
|
}, [direction]);
|
|
2613
|
-
return (React.createElement(SVG$1, __assign({ fill: "none", xmlns: "http://www.w3.org/2000/svg", iconSizes: iconSizes$
|
|
2707
|
+
return (React.createElement(SVG$1, __assign({ fill: "none", xmlns: "http://www.w3.org/2000/svg", iconSizes: iconSizes$4, size: size }, props),
|
|
2614
2708
|
React.createElement("title", { id: "DoubleArrowIcon" }, iconAltText),
|
|
2615
2709
|
React.createElement("path", { d: directionPaths[0], fill: color }),
|
|
2616
2710
|
React.createElement("path", { d: directionPaths[1], fill: color })));
|
|
2617
2711
|
}
|
|
2618
2712
|
|
|
2619
|
-
var iconSizes$
|
|
2713
|
+
var iconSizes$3 = {
|
|
2620
2714
|
tiny: {
|
|
2621
2715
|
width: 16,
|
|
2622
2716
|
height: 16,
|
|
@@ -2651,7 +2745,7 @@ var iconSizes$2 = {
|
|
|
2651
2745
|
function ImageIcon(props) {
|
|
2652
2746
|
var _a = props.color, color = _a === void 0 ? teal.main : _a, _b = props.size, size = _b === void 0 ? "medium" : _b, _c = props.altText, altText = _c === void 0 ? "ImageIcon" : _c, rest = __rest(props, ["color", "size", "altText"]);
|
|
2653
2747
|
var id = uniqueId('clip0_1244_70960');
|
|
2654
|
-
return (React.createElement(SVG$1, __assign({ size: size, iconSizes: iconSizes$
|
|
2748
|
+
return (React.createElement(SVG$1, __assign({ size: size, iconSizes: iconSizes$3, "aria-labelledby": altText, fill: "none" }, rest),
|
|
2655
2749
|
React.createElement("g", { clipPath: "url(#".concat(id, ")") },
|
|
2656
2750
|
React.createElement("path", { d: "M25.3333 6.66667V25.3333H6.66667V6.66667H25.3333ZM25.3333 4H6.66667C5.2 4 4 5.2 4 6.66667V25.3333C4 26.8 5.2 28 6.66667 28H25.3333C26.8 28 28 26.8 28 25.3333V6.66667C28 5.2 26.8 4 25.3333 4ZM18.8533 15.8133L14.8533 20.9733L12 17.52L8 22.6667H24L18.8533 15.8133Z", fill: color })),
|
|
2657
2751
|
React.createElement("defs", null,
|
|
@@ -2659,7 +2753,7 @@ function ImageIcon(props) {
|
|
|
2659
2753
|
React.createElement("rect", { width: "32", height: "32", fill: "white" })))));
|
|
2660
2754
|
}
|
|
2661
2755
|
|
|
2662
|
-
var iconSizes$
|
|
2756
|
+
var iconSizes$2 = {
|
|
2663
2757
|
tiny: {
|
|
2664
2758
|
width: 81,
|
|
2665
2759
|
height: 80,
|
|
@@ -2693,14 +2787,14 @@ var iconSizes$1 = {
|
|
|
2693
2787
|
};
|
|
2694
2788
|
function StarLightIcon(_a) {
|
|
2695
2789
|
var _b = _a.color; _b === void 0 ? teal.main : _b; var _c = _a.size, size = _c === void 0 ? "medium" : _c; _a.altText; var props = __rest(_a, ["color", "size", "altText"]);
|
|
2696
|
-
return (React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "StarLightIcon", iconSizes: iconSizes$
|
|
2790
|
+
return (React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "StarLightIcon", iconSizes: iconSizes$2 }, props),
|
|
2697
2791
|
React.createElement("g", { id: "light", transform: "matrix(0.357231,0,0,0.357231,-1.53898,1.04263)" },
|
|
2698
2792
|
React.createElement("rect", { x: "4.308", y: "-0.3", width: "279.931", height: "279.931", style: { fill: 'none' } }),
|
|
2699
2793
|
React.createElement("g", { transform: "matrix(1.69264,0,0,1.69264,-1244.22,-2149.68)" },
|
|
2700
2794
|
React.createElement("path", { d: "M816.161,1280.05C816.87,1278.39 818.503,1277.31 820.31,1277.31C822.117,1277.31 823.75,1278.39 824.459,1280.05L844.406,1326.83L895.064,1331.35C896.864,1331.51 898.395,1332.73 898.954,1334.44C899.512,1336.16 898.991,1338.05 897.628,1339.24L859.299,1372.67L870.66,1422.24C871.064,1424 870.377,1425.83 868.914,1426.9C867.452,1427.96 865.497,1428.05 863.946,1427.12L820.31,1400.99L776.674,1427.12C775.123,1428.05 773.168,1427.96 771.706,1426.9C770.243,1425.83 769.556,1424 769.96,1422.24L781.321,1372.67L742.992,1339.24C741.629,1338.05 741.108,1336.16 741.666,1334.44C742.225,1332.73 743.756,1331.51 745.556,1331.35L796.214,1326.83L816.161,1280.05Z", style: { fill: 'rgb(236,248,255)', } })))));
|
|
2701
2795
|
}
|
|
2702
2796
|
|
|
2703
|
-
var iconSizes = {
|
|
2797
|
+
var iconSizes$1 = {
|
|
2704
2798
|
tiny: {
|
|
2705
2799
|
width: 81,
|
|
2706
2800
|
height: 80,
|
|
@@ -2734,7 +2828,7 @@ var iconSizes = {
|
|
|
2734
2828
|
};
|
|
2735
2829
|
function StarDarkIcon(_a) {
|
|
2736
2830
|
var _b = _a.color; _b === void 0 ? teal.main : _b; var _c = _a.size, size = _c === void 0 ? "medium" : _c; _a.altText; var props = __rest(_a, ["color", "size", "altText"]);
|
|
2737
|
-
return (React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "StarDarkIcon", iconSizes: iconSizes }, props),
|
|
2831
|
+
return (React.createElement(SVG$1, __assign({ size: size, "aria-labelledby": "StarDarkIcon", iconSizes: iconSizes$1 }, props),
|
|
2738
2832
|
React.createElement("g", { transform: "matrix(1,0,0,1,-126,0)" },
|
|
2739
2833
|
React.createElement("g", { id: "dark", transform: "matrix(0.357231,0,0,0.357231,124.961,0.10718)" },
|
|
2740
2834
|
React.createElement("rect", { x: "4.308", y: "-0.3", width: "279.931", height: "279.931", style: { fill: 'none' } }),
|
|
@@ -2836,6 +2930,21 @@ function DesignIcon(_a) {
|
|
|
2836
2930
|
React.createElement("path", { fill: color, d: "m16.239 11.51 1.57-1.57-3.75-3.75-1.57 1.57-4.14-4.13c-.78-.78-2.05-.78-2.83 0l-1.9 1.9c-.78.78-.78 2.05 0 2.83l4.13 4.13-4.6 4.61c-.1.1-.15.22-.15.36v3.04c0 .28.22.5.5.5h3.04c.13 0 .26-.05.35-.15l4.62-4.62 4.13 4.13c1.32 1.32 2.76.07 2.83 0l1.9-1.9c.78-.78.78-2.05 0-2.83l-4.13-4.12Zm-7.06-.44-4.14-4.13 1.89-1.9 1.27 1.27-.47.49a.996.996 0 1 0 1.41 1.41l.48-.48 1.45 1.45-1.89 1.89Zm7.88 7.89-4.13-4.13 1.9-1.9 1.45 1.45-.48.48a.996.996 0 1 0 1.41 1.41l.48-.48 1.27 1.27-1.9 1.9ZM20.709 7.04a.996.996 0 0 0 0-1.41l-2.34-2.34c-.47-.47-1.12-.29-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83Z" }));
|
|
2837
2931
|
}
|
|
2838
2932
|
|
|
2933
|
+
var iconSizes = iconSize;
|
|
2934
|
+
function ResizableIcon(_a) {
|
|
2935
|
+
var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.altText, altText = _c === void 0 ? "Resizable Icon" : _c, props = __rest(_a, ["color", "altText"]);
|
|
2936
|
+
var size = iconSizes[props.size || "medium"];
|
|
2937
|
+
var clipId = uniqueId('ResizableIcon');
|
|
2938
|
+
return (React.createElement(SVG$1, __assign({ "aria-labelledby": "ResizableIcon" }, props, { size: props.size || "medium" }),
|
|
2939
|
+
React.createElement("title", { id: "ResizableIcon" }, altText),
|
|
2940
|
+
React.createElement("g", { "clip-path": "url(#".concat(clipId, ")") },
|
|
2941
|
+
React.createElement("path", { d: "M16.24 11.5094L17.81 9.93944L14.06 6.18944L12.49 7.75944L8.35 3.62944C7.57 2.84944 6.3 2.84944 5.52 3.62944L3.62 5.52944C2.84 6.30944 2.84 7.57944 3.62 8.35944L7.75 12.4894L3.15 17.0994C3.05 17.1994 3 17.3194 3 17.4594V20.4994C3 20.7794 3.22 20.9994 3.5 20.9994H6.54C6.67 20.9994 6.8 20.9494 6.89 20.8494L11.51 16.2294L15.64 20.3594C16.96 21.6794 18.4 20.4294 18.47 20.3594L20.37 18.4594C21.15 17.6794 21.15 16.4094 20.37 15.6294L16.24 11.5094ZM9.18 11.0694L5.04 6.93944L6.93 5.03944L8.2 6.30944L7.73 6.79944C7.34 7.18944 7.34 7.81944 7.73 8.20944C8.12 8.59944 8.75 8.59944 9.14 8.20944L9.62 7.72944L11.07 9.17944L9.18 11.0694ZM17.06 18.9594L12.93 14.8294L14.83 12.9294L16.28 14.3794L15.8 14.8594C15.41 15.2494 15.41 15.8794 15.8 16.2694C16.19 16.6594 16.82 16.6594 17.21 16.2694L17.69 15.7894L18.96 17.0594L17.06 18.9594Z", fill: color }),
|
|
2942
|
+
React.createElement("path", { d: "M20.71 7.03944C21.1 6.64944 21.1 6.01944 20.71 5.62944L18.37 3.28944C17.9 2.81944 17.25 2.99944 16.96 3.28944L15.13 5.11944L18.88 8.86944L20.71 7.03944Z", fill: color })),
|
|
2943
|
+
React.createElement("defs", null,
|
|
2944
|
+
React.createElement("clipPath", { id: clipId },
|
|
2945
|
+
React.createElement("rect", { width: size.width, height: size.height, fill: "white" })))));
|
|
2946
|
+
}
|
|
2947
|
+
|
|
2839
2948
|
var avatarSizes = {
|
|
2840
2949
|
tiny: {
|
|
2841
2950
|
size: '24px',
|
|
@@ -2886,7 +2995,7 @@ var avatarColors = {
|
|
|
2886
2995
|
};
|
|
2887
2996
|
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
2997
|
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$
|
|
2998
|
+
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
2999
|
var Avatar = function (_a) {
|
|
2891
3000
|
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
3001
|
if (pic) {
|
|
@@ -2902,7 +3011,7 @@ var Avatar = function (_a) {
|
|
|
2902
3011
|
React.createElement(AvatarInitials, { size: size }, initials !== null && initials !== void 0 ? initials : children));
|
|
2903
3012
|
}
|
|
2904
3013
|
};
|
|
2905
|
-
var templateObject_1$R, templateObject_2$v, templateObject_3$
|
|
3014
|
+
var templateObject_1$R, templateObject_2$v, templateObject_3$k;
|
|
2906
3015
|
|
|
2907
3016
|
var getTotalCols = function (p) { return p.totalCols || 12; };
|
|
2908
3017
|
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 +3063,14 @@ var Row = styled.div(templateObject_1$P || (templateObject_1$P = __makeTemplateO
|
|
|
2954
3063
|
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
3064
|
var templateObject_1$P, templateObject_2$t;
|
|
2956
3065
|
|
|
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); });
|
|
3066
|
+
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
3067
|
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$
|
|
3068
|
+
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);
|
|
3069
|
+
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
3070
|
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
3071
|
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
3072
|
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$
|
|
3073
|
+
var templateObject_1$O, templateObject_2$s, templateObject_3$j, templateObject_4$e, templateObject_5$9, templateObject_6$9, templateObject_7$3;
|
|
2965
3074
|
|
|
2966
3075
|
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
3076
|
var Box = function (_a) {
|
|
@@ -2976,13 +3085,13 @@ var Box = function (_a) {
|
|
|
2976
3085
|
};
|
|
2977
3086
|
var templateObject_1$N;
|
|
2978
3087
|
|
|
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);
|
|
3088
|
+
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
3089
|
var templateObject_1$M;
|
|
2981
3090
|
|
|
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$
|
|
3091
|
+
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);
|
|
3092
|
+
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); });
|
|
3093
|
+
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"])));
|
|
3094
|
+
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
3095
|
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
3096
|
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
3097
|
var DropArea = function (_a) {
|
|
@@ -3041,7 +3150,7 @@ function DropzonedPreviews(_a) {
|
|
|
3041
3150
|
? React.createElement(ThumbsContainer, null, thumbs)
|
|
3042
3151
|
: React.createElement(PlaceHolder, null, placeholder))));
|
|
3043
3152
|
}
|
|
3044
|
-
var templateObject_1$L, templateObject_2$r, templateObject_3$
|
|
3153
|
+
var templateObject_1$L, templateObject_2$r, templateObject_3$i, templateObject_4$d, templateObject_5$8, templateObject_6$8;
|
|
3045
3154
|
|
|
3046
3155
|
/*
|
|
3047
3156
|
|
|
@@ -3119,18 +3228,18 @@ var getSizeStyle$1 = function (style, defaults) {
|
|
|
3119
3228
|
};
|
|
3120
3229
|
};
|
|
3121
3230
|
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']);
|
|
3231
|
+
var white = getThemeColor(props, 'neutrals.white', colors$1.neutrals.white);
|
|
3232
|
+
var disabled = getThemeColor(props, 'neutrals.50', colors$1.errors['50']);
|
|
3233
|
+
var disabledText = getThemeColor(props, 'neutrals.70', colors$1.errors['70']);
|
|
3234
|
+
var primary = getThemeColor(props, 'primary1.main', colors$1.primary1.main);
|
|
3235
|
+
var primaryDark = getThemeColor(props, 'primary1.75', colors$1.primary1['75']);
|
|
3236
|
+
var primaryLight = getThemeColor(props, 'primary1.20', colors$1.primary1['20']);
|
|
3237
|
+
var cta = getThemeColor(props, 'secondary1.main', colors$1.secondary1.main);
|
|
3238
|
+
var ctaDark = getThemeColor(props, 'secondary1.80', colors$1.secondary1['80']);
|
|
3130
3239
|
// 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']);
|
|
3240
|
+
var error = getThemeColor(props, 'errors.main', colors$1.errors.main);
|
|
3241
|
+
var errorLight = getThemeColor(props, 'errors.10', colors$1.errors['10']);
|
|
3242
|
+
var errorDark = getThemeColor(props, 'errors.70', colors$1.errors['70']);
|
|
3134
3243
|
var customColor = props.variantColor || white;
|
|
3135
3244
|
var customBorderColor = props.variantBorderColor;
|
|
3136
3245
|
var customBg = props.variantBg;
|
|
@@ -3340,12 +3449,12 @@ var getVariantStyles = function (props, variant) {
|
|
|
3340
3449
|
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
3450
|
var secondary = _a.secondary, cta = _a.cta, props = __rest(_a, ["secondary", "cta"]);
|
|
3342
3451
|
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) {
|
|
3452
|
+
cta ? getThemeColor(props, 'cta', colors$1.cta) : getThemeColor(props, 'primary', colors$1.teal.main);
|
|
3453
|
+
}, 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
3454
|
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);
|
|
3455
|
+
return secondary ? getThemeColor(props, 'primary', colors$1.primary) :
|
|
3456
|
+
cta ? getThemeColor(props, 'cta', colors$1.cta) : getThemeColor(props, 'primary', colors$1.primary);
|
|
3457
|
+
}, 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
3458
|
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
3459
|
var presets = {
|
|
3351
3460
|
edit: {
|
|
@@ -3496,8 +3605,8 @@ var templateObject_1$J;
|
|
|
3496
3605
|
|
|
3497
3606
|
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
3607
|
return p.error
|
|
3499
|
-
? getThemeColor(p, 'errors.main', colors.errors.main)
|
|
3500
|
-
: getThemeColor(p, 'input.iconWrapper.background', colors.input.iconWrapper.background);
|
|
3608
|
+
? getThemeColor(p, 'errors.main', colors$1.errors.main)
|
|
3609
|
+
: getThemeColor(p, 'input.iconWrapper.background', colors$1.input.iconWrapper.background);
|
|
3501
3610
|
}, 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
3611
|
? "background: ".concat(getThemeColor(p, 'input.iconWrapper.hover.background'), ";")
|
|
3503
3612
|
: ''; }, function (p) { return p.isActive
|
|
@@ -3522,7 +3631,7 @@ var InputIconLabelContainer = styled.div(templateObject_2$p || (templateObject_2
|
|
|
3522
3631
|
},
|
|
3523
3632
|
};
|
|
3524
3633
|
});
|
|
3525
|
-
var Input = styled.input(templateObject_3$
|
|
3634
|
+
var Input = styled.input(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n &&& {\n ", "\n }\n ", "\n"], ["\n &&& {\n ", "\n }\n ", "\n"])), function (p) {
|
|
3526
3635
|
var styles = {
|
|
3527
3636
|
marginBottom: p.noMargin ? 0 : "1rem",
|
|
3528
3637
|
fontSize: '1rem',
|
|
@@ -3592,11 +3701,11 @@ var LabeledIconInput = React.forwardRef(function (_a, ref) {
|
|
|
3592
3701
|
var containerRef = useRef(null);
|
|
3593
3702
|
var _g = useState(false), isActive = _g[0], setIsActive = _g[1];
|
|
3594
3703
|
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;
|
|
3704
|
+
var activeBorderColor = getThemeColor(props, 'input.active.border', colors$1.input.active.border);
|
|
3705
|
+
var activeTextColor = colors$1.input.active.text;
|
|
3706
|
+
var errorBorderColor = getThemeColor(props, 'input.error.border', colors$1.input.error.border);
|
|
3707
|
+
var disabledBackground = colors$1.input.disabled.background;
|
|
3708
|
+
var disabledTextColor = colors$1.input.disabled.text;
|
|
3600
3709
|
var activeStyles = !isActive ? {} : {
|
|
3601
3710
|
borderColor: error ? errorBorderColor : activeBorderColor,
|
|
3602
3711
|
color: getThemeColor(props, 'input.active.text', activeTextColor),
|
|
@@ -3624,16 +3733,16 @@ var LabeledIconInput = React.forwardRef(function (_a, ref) {
|
|
|
3624
3733
|
iconProps['color'] = errorBorderColor;
|
|
3625
3734
|
}
|
|
3626
3735
|
else if (disabled) {
|
|
3627
|
-
iconProps['fill'] = colors.input.icon.disabled.fill;
|
|
3628
|
-
iconProps['color'] = colors.input.icon.disabled.fill;
|
|
3736
|
+
iconProps['fill'] = colors$1.input.icon.disabled.fill;
|
|
3737
|
+
iconProps['color'] = colors$1.input.icon.disabled.fill;
|
|
3629
3738
|
}
|
|
3630
3739
|
else if (isHovering) {
|
|
3631
|
-
iconProps['fill'] = colors.input.icon.hover.fill;
|
|
3632
|
-
iconProps['color'] = colors.input.icon.hover.fill;
|
|
3740
|
+
iconProps['fill'] = colors$1.input.icon.hover.fill;
|
|
3741
|
+
iconProps['color'] = colors$1.input.icon.hover.fill;
|
|
3633
3742
|
}
|
|
3634
3743
|
else if (isActive) {
|
|
3635
|
-
iconProps['fill'] = colors.input.icon.active.fill;
|
|
3636
|
-
iconProps['color'] = colors.input.icon.active.fill;
|
|
3744
|
+
iconProps['fill'] = colors$1.input.icon.active.fill;
|
|
3745
|
+
iconProps['color'] = colors$1.input.icon.active.fill;
|
|
3637
3746
|
}
|
|
3638
3747
|
return React.cloneElement(Icon, iconProps);
|
|
3639
3748
|
}, [Icon, error, disabled, errorBorderColor, isActive, isHovering, iconColor]);
|
|
@@ -3663,7 +3772,7 @@ var LabeledIconInput = React.forwardRef(function (_a, ref) {
|
|
|
3663
3772
|
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
3773
|
iconPosition === 'right' ? React.createElement(InputIconLabel, { style: __assign({ marginBottom: 0, padding: 6 }, iconLabelStyles), isActive: isActive, isDisabled: disabled, isHover: isHovering, iconPosition: iconPosition }, NewIcon) : null)));
|
|
3665
3774
|
});
|
|
3666
|
-
var CheckboxLabel = styled.label(templateObject_4$
|
|
3775
|
+
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
3776
|
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
3777
|
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
3778
|
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 +3799,7 @@ var LabeledRadioInButton = function (_a) {
|
|
|
3690
3799
|
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
3800
|
return (React.createElement(LabeledRadio, { label: label, checked: checked, disabled: disabled, onChange: onChange, readOnly: readOnly, defaultValue: defaultValue, labelStyle: {
|
|
3692
3801
|
padding: "13px 40px",
|
|
3693
|
-
backgroundColor: disabled ? neutrals['40'] : checked ? colors.white : teal['20'],
|
|
3802
|
+
backgroundColor: disabled ? neutrals['40'] : checked ? colors$1.white : teal['20'],
|
|
3694
3803
|
border: disabled ? "solid 3px ".concat(neutrals['40']) : checked ? "solid 3px ".concat(teal.main) : "solid 3px ".concat(teal['20']),
|
|
3695
3804
|
borderRadius: "200px",
|
|
3696
3805
|
color: disabled ? neutrals['70'] : teal.main,
|
|
@@ -3720,7 +3829,7 @@ var LabeledCheckbox = React.forwardRef(function (_a, ref) {
|
|
|
3720
3829
|
label,
|
|
3721
3830
|
React.createElement(Radio, __assign({ ref: ref, name: name, type: "checkbox", checked: checked, isHovering: isHovering, onChange: disabled ? undefined : onChange }, props))));
|
|
3722
3831
|
});
|
|
3723
|
-
var templateObject_1$I, templateObject_2$p, templateObject_3$
|
|
3832
|
+
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
3833
|
|
|
3725
3834
|
var Padding = styled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n padding: 20px;\n ", "\n"], ["\n padding: 20px;\n ", "\n"])), SharedStyles);
|
|
3726
3835
|
var templateObject_1$H;
|
|
@@ -3789,23 +3898,23 @@ function skuSelectStyles(props) {
|
|
|
3789
3898
|
return __assign(__assign({}, provided), props.containerStyles);
|
|
3790
3899
|
},
|
|
3791
3900
|
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),
|
|
3901
|
+
return __assign(__assign(__assign({}, provided), { color: getThemeColor(props, 'select.clearIcon.color', colors$1.select.clearIcon.color), ':hover': {
|
|
3902
|
+
color: getThemeColor(props, 'select.clearIcon.color', colors$1.select.clearIcon.color),
|
|
3794
3903
|
} }), props.clearIndicatorStyles);
|
|
3795
3904
|
},
|
|
3796
3905
|
dropdownIndicator: function (provided, state) {
|
|
3797
3906
|
var styles = {
|
|
3798
3907
|
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),
|
|
3908
|
+
? getThemeColor(props, 'select.dropdownIcon.error.color', colors$1.select.dropdownIcon.error.color)
|
|
3909
|
+
: getThemeColor(props, 'select.dropdownIcon.color', colors$1.select.dropdownIcon.color),
|
|
3801
3910
|
':hover': {
|
|
3802
3911
|
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),
|
|
3912
|
+
? getThemeColor(props, 'select.dropdownIcon.error.color', colors$1.select.dropdownIcon.error.color)
|
|
3913
|
+
: getThemeColor(props, 'select.dropdownIcon.color', colors$1.select.dropdownIcon.color),
|
|
3805
3914
|
},
|
|
3806
3915
|
};
|
|
3807
3916
|
if (state.isDisabled) {
|
|
3808
|
-
styles['color'] = getThemeColor(props, 'select.dropdownIcon.disabled', colors.select.dropdownIcon.disabled);
|
|
3917
|
+
styles['color'] = getThemeColor(props, 'select.dropdownIcon.disabled', colors$1.select.dropdownIcon.disabled);
|
|
3809
3918
|
}
|
|
3810
3919
|
return __assign(__assign(__assign({}, provided), styles), props.dropdownIndicatorStyles);
|
|
3811
3920
|
},
|
|
@@ -3815,8 +3924,8 @@ function skuSelectStyles(props) {
|
|
|
3815
3924
|
},
|
|
3816
3925
|
input: function (provided, state) {
|
|
3817
3926
|
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);
|
|
3927
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3928
|
+
: getThemeColor(props, 'select.border', colors$1.select.border) }), props.inputStyles);
|
|
3820
3929
|
},
|
|
3821
3930
|
control: function (provided, state) {
|
|
3822
3931
|
var styles = {
|
|
@@ -3826,8 +3935,8 @@ function skuSelectStyles(props) {
|
|
|
3826
3935
|
styles['borderWidth'] = '1px';
|
|
3827
3936
|
styles['borderStyle'] = 'solid';
|
|
3828
3937
|
styles['borderColor'] = props.error
|
|
3829
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3830
|
-
: 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);
|
|
3831
3940
|
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
3941
|
if (state.selectProps.menuPlacement === 'bottom') {
|
|
3833
3942
|
styles['borderBottomRightRadius'] = 0;
|
|
@@ -3841,31 +3950,31 @@ function skuSelectStyles(props) {
|
|
|
3841
3950
|
else if (!state.menuIsOpen && state.isFocused) {
|
|
3842
3951
|
styles['borderWidth'] = '1px';
|
|
3843
3952
|
styles['borderColor'] = props.error
|
|
3844
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3845
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
3953
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3954
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3846
3955
|
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));
|
|
3956
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3957
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border));
|
|
3849
3958
|
}
|
|
3850
3959
|
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);
|
|
3960
|
+
styles['backgroundColor'] = getThemeColor(props, 'select.disabled.background', colors$1.select.disabled.background);
|
|
3961
|
+
styles['borderColor'] = getThemeColor(props, 'select.disabled.border', colors$1.select.disabled.border);
|
|
3853
3962
|
}
|
|
3854
3963
|
else {
|
|
3855
3964
|
styles['borderColor'] = props.error
|
|
3856
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3965
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3857
3966
|
: provided.borderColor;
|
|
3858
3967
|
}
|
|
3859
3968
|
return (__assign(__assign(__assign(__assign({}, provided), styles), { ':hover': {
|
|
3860
3969
|
borderColor: props.error
|
|
3861
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3862
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border),
|
|
3970
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3971
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border),
|
|
3863
3972
|
} }), props.controlStyles));
|
|
3864
3973
|
},
|
|
3865
3974
|
menu: function (provided, state) {
|
|
3866
3975
|
var borderColor = props.error
|
|
3867
|
-
? getThemeColor(props, 'select.error.border', colors.select.error.border)
|
|
3868
|
-
: getThemeColor(props, 'select.active.border', colors.select.active.border);
|
|
3976
|
+
? getThemeColor(props, 'select.error.border', colors$1.select.error.border)
|
|
3977
|
+
: getThemeColor(props, 'select.active.border', colors$1.select.active.border);
|
|
3869
3978
|
var styles = {
|
|
3870
3979
|
zIndex: 10,
|
|
3871
3980
|
position: props.menuRelative ? 'relative' : provided.position,
|
|
@@ -3907,7 +4016,7 @@ function skuSelectStyles(props) {
|
|
|
3907
4016
|
},
|
|
3908
4017
|
};
|
|
3909
4018
|
}
|
|
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) }) })); }; };
|
|
4019
|
+
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
4020
|
// duplicate styles to overide .resku global styles
|
|
3912
4021
|
// : React.ForwardRefExoticComponent<SKUSelectProps & React.RefAttributes<BaseSelect>>
|
|
3913
4022
|
// 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 +4123,8 @@ var SidePanel = function (_a) {
|
|
|
4014
4123
|
backdrop && visible ? React.createElement(Backdrop, null) : null);
|
|
4015
4124
|
};
|
|
4016
4125
|
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$
|
|
4126
|
+
var Name = styled.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
4127
|
+
var Position = styled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n font-size: .8em;\n"], ["\n font-size: .8em;\n"])));
|
|
4019
4128
|
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
4129
|
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
4130
|
var PanelContact = function (_a) {
|
|
@@ -4052,12 +4161,12 @@ var PanelTileContact = function (_a) {
|
|
|
4052
4161
|
p.phone_extension && 'x' + p.phone_extension) : '';
|
|
4053
4162
|
}) : null)));
|
|
4054
4163
|
};
|
|
4055
|
-
var templateObject_1$C, templateObject_2$m, templateObject_3$
|
|
4164
|
+
var templateObject_1$C, templateObject_2$m, templateObject_3$g, templateObject_4$b, templateObject_5$6, templateObject_6$6;
|
|
4056
4165
|
|
|
4057
4166
|
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
4167
|
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$
|
|
4168
|
+
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);
|
|
4169
|
+
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
4170
|
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
4171
|
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
4172
|
var THead = styled.thead(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n &&& {\n ", "\n }\n"], ["\n &&& {\n ", "\n }\n"])), SizerCss);
|
|
@@ -4079,7 +4188,7 @@ var THSorted = function (_a) {
|
|
|
4079
4188
|
" ",
|
|
4080
4189
|
children));
|
|
4081
4190
|
};
|
|
4082
|
-
var templateObject_1$B, templateObject_2$l, templateObject_3$
|
|
4191
|
+
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
4192
|
|
|
4084
4193
|
var useClickOutside = function (props) {
|
|
4085
4194
|
var ref = props.ref, _a = props.eventType, eventType = _a === void 0 ? 'mousedown' : _a, onClick = props.onClick, onCleanup = props.onCleanup;
|
|
@@ -4334,8 +4443,8 @@ var useFallbackRef = function (forwardedRef) {
|
|
|
4334
4443
|
|
|
4335
4444
|
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
4445
|
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$
|
|
4446
|
+
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);
|
|
4447
|
+
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
4448
|
var PopupContainer = function (_a) {
|
|
4340
4449
|
var children = _a.children;
|
|
4341
4450
|
var ref = React.useRef(document$1.createElement('div'));
|
|
@@ -4408,12 +4517,12 @@ var ChevronPopupWindow = React.forwardRef(function (props, ref) {
|
|
|
4408
4517
|
var ChevronPopup = function (props) {
|
|
4409
4518
|
return React.createElement(Popup, __assign({ PopupWindowComponent: ChevronPopupWindow }, props));
|
|
4410
4519
|
};
|
|
4411
|
-
var templateObject_1$A, templateObject_2$k, templateObject_3$
|
|
4520
|
+
var templateObject_1$A, templateObject_2$k, templateObject_3$e, templateObject_4$9;
|
|
4412
4521
|
|
|
4413
4522
|
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
4523
|
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$
|
|
4524
|
+
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'; });
|
|
4525
|
+
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
4526
|
var defaultTransform = function (v) { return v.target ? v.target.value : v.currentTarget ? v.currentTarget.value : v.value; };
|
|
4418
4527
|
var Column = function (_a) {
|
|
4419
4528
|
_a.name; var title = _a.title; _a.children; var centerContent = _a.centerContent; _a.transform;
|
|
@@ -4596,14 +4705,14 @@ function GridTable(_a) {
|
|
|
4596
4705
|
Adding && NewRow,
|
|
4597
4706
|
onAdd && !Adding && AddNew)));
|
|
4598
4707
|
}
|
|
4599
|
-
var templateObject_1$z, templateObject_2$j, templateObject_3$
|
|
4708
|
+
var templateObject_1$z, templateObject_2$j, templateObject_3$d, templateObject_4$8;
|
|
4600
4709
|
|
|
4601
4710
|
var tabSizes = {
|
|
4602
4711
|
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
4712
|
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
4713
|
};
|
|
4605
|
-
var TabBar = styled.ul(templateObject_3$
|
|
4606
|
-
var Tab = styled.li(templateObject_4$
|
|
4714
|
+
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);
|
|
4715
|
+
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
4716
|
/*
|
|
4608
4717
|
|
|
4609
4718
|
Here's how you use this:
|
|
@@ -4633,7 +4742,7 @@ var Tab = styled.li(templateObject_4$8 || (templateObject_4$8 = __makeTemplateOb
|
|
|
4633
4742
|
// </div>
|
|
4634
4743
|
// }
|
|
4635
4744
|
])), function (props) { return props.selected
|
|
4636
|
-
? "5px solid ".concat(props.variant === 'secondary' ? colors.secondary1.main : colors.primary1.main)
|
|
4745
|
+
? "5px solid ".concat(props.variant === 'secondary' ? colors$1.secondary1.main : colors$1.primary1.main)
|
|
4637
4746
|
: "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
4747
|
var Tabs = /** @class */ (function (_super) {
|
|
4639
4748
|
__extends(Tabs, _super);
|
|
@@ -4691,7 +4800,7 @@ var Tabs = /** @class */ (function (_super) {
|
|
|
4691
4800
|
};
|
|
4692
4801
|
return Tabs;
|
|
4693
4802
|
}(Component));
|
|
4694
|
-
var templateObject_1$y, templateObject_2$i, templateObject_3$
|
|
4803
|
+
var templateObject_1$y, templateObject_2$i, templateObject_3$c, templateObject_4$7;
|
|
4695
4804
|
|
|
4696
4805
|
var toggleSizes$1 = {
|
|
4697
4806
|
small: {
|
|
@@ -4729,8 +4838,8 @@ var getSizeStyle = function (style, defaults) {
|
|
|
4729
4838
|
};
|
|
4730
4839
|
};
|
|
4731
4840
|
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$
|
|
4841
|
+
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);
|
|
4842
|
+
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
4843
|
var Toggle = function (_a) {
|
|
4735
4844
|
var _b = _a.size, size = _b === void 0 ? 'medium' : _b, props = __rest(_a, ["size"]);
|
|
4736
4845
|
return React.createElement(Wrapper$3, __assign({ size: size }, props),
|
|
@@ -4738,7 +4847,7 @@ var Toggle = function (_a) {
|
|
|
4738
4847
|
return React.cloneElement(child, { size: size });
|
|
4739
4848
|
})));
|
|
4740
4849
|
};
|
|
4741
|
-
var templateObject_1$x, templateObject_2$h, templateObject_3$
|
|
4850
|
+
var templateObject_1$x, templateObject_2$h, templateObject_3$b;
|
|
4742
4851
|
|
|
4743
4852
|
var Textarea = styled.textarea(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), function (p) {
|
|
4744
4853
|
var styles = {
|
|
@@ -4830,8 +4939,8 @@ var templateObject_1$u;
|
|
|
4830
4939
|
|
|
4831
4940
|
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
4941
|
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$
|
|
4942
|
+
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"])));
|
|
4943
|
+
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
4944
|
var Product = function (props) {
|
|
4836
4945
|
return React.createElement(ProductWrapper, __assign({}, props),
|
|
4837
4946
|
React.createElement(ProductInfo, null,
|
|
@@ -4842,12 +4951,12 @@ var Product = function (props) {
|
|
|
4842
4951
|
props.price && props.currency ? props.currency + "$" + props.price : null,
|
|
4843
4952
|
props.rating ? React.createElement(StarRating, { rating: props.rating }) : null));
|
|
4844
4953
|
};
|
|
4845
|
-
var templateObject_1$t, templateObject_2$g, templateObject_3$
|
|
4954
|
+
var templateObject_1$t, templateObject_2$g, templateObject_3$a, templateObject_4$6;
|
|
4846
4955
|
|
|
4847
4956
|
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$
|
|
4957
|
+
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); });
|
|
4958
|
+
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"])));
|
|
4959
|
+
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
4960
|
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
4961
|
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
4962
|
function truncate(filename, max) {
|
|
@@ -4886,12 +4995,12 @@ var Artwork = function (_a) {
|
|
|
4886
4995
|
"Updated ",
|
|
4887
4996
|
props.date) : null));
|
|
4888
4997
|
};
|
|
4889
|
-
var templateObject_1$s, templateObject_2$f, templateObject_3$
|
|
4998
|
+
var templateObject_1$s, templateObject_2$f, templateObject_3$9, templateObject_4$5, templateObject_5$4, templateObject_6$4;
|
|
4890
4999
|
|
|
4891
5000
|
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
5001
|
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$
|
|
5002
|
+
var StyledTask = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["margin-bottom: 1.5em; ", ""], ["margin-bottom: 1.5em; ", ""])), SharedStyles);
|
|
5003
|
+
var TaskBody = styled.div(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["margin-left:34px;"], ["margin-left:34px;"])));
|
|
4895
5004
|
var Task = function (_a) {
|
|
4896
5005
|
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
5006
|
var _c = useState(initialChecked), checked = _c[0], setChecked = _c[1];
|
|
@@ -4964,19 +5073,19 @@ var CalendarTask = React.forwardRef(function (_a, ref) {
|
|
|
4964
5073
|
assignee ? "for " + assignee : null,
|
|
4965
5074
|
assignee ? "on " : null)));
|
|
4966
5075
|
});
|
|
4967
|
-
var templateObject_1$r, templateObject_2$e, templateObject_3$
|
|
5076
|
+
var templateObject_1$r, templateObject_2$e, templateObject_3$8, templateObject_4$4, templateObject_5$3, templateObject_6$3;
|
|
4968
5077
|
|
|
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); });
|
|
5078
|
+
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
5079
|
var Publisher = function (props) {
|
|
4971
5080
|
return React.createElement(PublisherWrapper, null,
|
|
4972
5081
|
React.createElement(Textarea, { placeholder: "Post a note about this project" }));
|
|
4973
5082
|
};
|
|
4974
5083
|
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$
|
|
5084
|
+
var WidePart = styled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["flex-grow:1;"], ["flex-grow:1;"])));
|
|
5085
|
+
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
5086
|
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); });
|
|
5087
|
+
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); });
|
|
5088
|
+
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
5089
|
var TopLine = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["display:flex;"], ["display:flex;"])));
|
|
4981
5090
|
var PostFooter = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["font-size:.9em;"], ["font-size:.9em;"])));
|
|
4982
5091
|
var Comments = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["margin-top: 1em;"], ["margin-top: 1em;"])));
|
|
@@ -4994,12 +5103,10 @@ var FeedPost = function (props) {
|
|
|
4994
5103
|
props.comments && props.comments.length > 0 ?
|
|
4995
5104
|
React.createElement(Comments, null, props.comments) : null));
|
|
4996
5105
|
};
|
|
4997
|
-
var templateObject_1$q, templateObject_2$d, templateObject_3$
|
|
5106
|
+
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
5107
|
|
|
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"])));
|
|
5108
|
+
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);
|
|
5109
|
+
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
5110
|
var ErrorBoundary = /** @class */ (function (_super) {
|
|
5004
5111
|
__extends(ErrorBoundary, _super);
|
|
5005
5112
|
function ErrorBoundary(props) {
|
|
@@ -5012,22 +5119,29 @@ var ErrorBoundary = /** @class */ (function (_super) {
|
|
|
5012
5119
|
console.log({ error: error, info: info });
|
|
5013
5120
|
};
|
|
5014
5121
|
ErrorBoundary.prototype.render = function () {
|
|
5122
|
+
var goBack = function () {
|
|
5123
|
+
window$1.history.back();
|
|
5124
|
+
};
|
|
5125
|
+
var isNewTab = window$1.history.length === 1;
|
|
5015
5126
|
if (this.state.hasError) {
|
|
5016
5127
|
return (React.createElement(Wrapper$1, __assign({}, this.props),
|
|
5017
|
-
React.createElement(
|
|
5018
|
-
React.createElement(
|
|
5019
|
-
|
|
5020
|
-
|
|
5021
|
-
|
|
5022
|
-
|
|
5023
|
-
|
|
5024
|
-
React.createElement(
|
|
5128
|
+
React.createElement(ErrorTextContainer, null,
|
|
5129
|
+
React.createElement("b", { style: { color: '#2A4D63', fontSize: '64px' } }, "Sorry, something went wrong."),
|
|
5130
|
+
React.createElement("br", null),
|
|
5131
|
+
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."),
|
|
5132
|
+
React.createElement("br", null),
|
|
5133
|
+
React.createElement("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
|
5134
|
+
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"),
|
|
5135
|
+
React.createElement(Button, { variant: "text", size: "medium", style: { zIndex: 100 }, onClick: function (e) { return window$1.location.href = "/"; } }, "Go to homepage"))),
|
|
5136
|
+
React.createElement("div", { style: { position: 'absolute', bottom: '0', width: '100%' } },
|
|
5137
|
+
React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "310", viewBox: "0 0 1510 310", fill: "none", preserveAspectRatio: "none" },
|
|
5138
|
+
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
5139
|
}
|
|
5026
5140
|
return this.props.children;
|
|
5027
5141
|
};
|
|
5028
5142
|
return ErrorBoundary;
|
|
5029
5143
|
}(Component));
|
|
5030
|
-
var templateObject_1$p, templateObject_2$c
|
|
5144
|
+
var templateObject_1$p, templateObject_2$c;
|
|
5031
5145
|
|
|
5032
5146
|
var CustomDateInput = forwardRef(function (_a, ref) {
|
|
5033
5147
|
var error = _a.error, noMargin = _a.noMargin, onClick = _a.onClick, isClearable = _a.isClearable, props = __rest(_a, ["error", "noMargin", "onClick", "isClearable"]);
|
|
@@ -5123,7 +5237,7 @@ var Dropdown = function (_a) {
|
|
|
5123
5237
|
};
|
|
5124
5238
|
var templateObject_1$o, templateObject_2$b, templateObject_3$6;
|
|
5125
5239
|
|
|
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);
|
|
5240
|
+
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
5241
|
var templateObject_1$n;
|
|
5128
5242
|
|
|
5129
5243
|
var verticalScrollbarWidth = function () {
|
|
@@ -6126,8 +6240,8 @@ Transition.EXITING = EXITING;
|
|
|
6126
6240
|
var Transition$1 = Transition;
|
|
6127
6241
|
|
|
6128
6242
|
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);
|
|
6243
|
+
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);
|
|
6244
|
+
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
6245
|
var transitionStatusToClass = {
|
|
6132
6246
|
entering: 'collapsing',
|
|
6133
6247
|
entered: 'collapsed show',
|
|
@@ -6311,7 +6425,7 @@ function Thermometer(_a) {
|
|
|
6311
6425
|
setValue1Width((node === null || node === void 0 ? void 0 : node.clientWidth) || 0);
|
|
6312
6426
|
}, []);
|
|
6313
6427
|
return (React.createElement("div", __assign({}, props),
|
|
6314
|
-
title ? React.createElement(Text, { style: { fontWeight: 'bold', fontSize: 18, color: colors.neutrals.bodyText } }, title) : null,
|
|
6428
|
+
title ? React.createElement(Text, { style: { fontWeight: 'bold', fontSize: 18, color: colors$1.neutrals.bodyText } }, title) : null,
|
|
6315
6429
|
React.createElement("div", { style: { paddingBottom: 20, paddingTop: 5 } },
|
|
6316
6430
|
React.createElement("span", { ref: measureTargetRef, style: {
|
|
6317
6431
|
position: 'absolute',
|
|
@@ -6323,13 +6437,13 @@ function Thermometer(_a) {
|
|
|
6323
6437
|
React.createElement("span", { ref: measureValue1Ref, style: {
|
|
6324
6438
|
position: 'absolute',
|
|
6325
6439
|
paddingRight: 5,
|
|
6326
|
-
color: labelTextColor || colors.secondary3.main,
|
|
6440
|
+
color: labelTextColor || colors$1.secondary3.main,
|
|
6327
6441
|
} },
|
|
6328
6442
|
value1Label + " $",
|
|
6329
6443
|
React.createElement(Number$1, { commas: true, decimalPoints: 0, num: value1 }))),
|
|
6330
6444
|
React.createElement("div", { ref: measureContainerRef },
|
|
6331
6445
|
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 })))));
|
|
6446
|
+
React.createElement(ProgressBar, { target: target, value: value1, color: barColor || colors$1.secondary3.main, offset: calcVal1Width(), elementWidth: value1Width })))));
|
|
6333
6447
|
}
|
|
6334
6448
|
var templateObject_1$g, templateObject_2$4;
|
|
6335
6449
|
|
|
@@ -6351,7 +6465,7 @@ function LightIndicatorLight(_a) {
|
|
|
6351
6465
|
React.createElement("defs", null,
|
|
6352
6466
|
React.createElement("radialGradient", { id: lightID, cx: 0, cy: 0, r: 1, gradientUnits: "userSpaceOnUse", gradientTransform: gradientTransform }, litOrNot)));
|
|
6353
6467
|
}
|
|
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]; });
|
|
6468
|
+
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
6469
|
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
6470
|
function LightIndicator(_a) {
|
|
6357
6471
|
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 +6475,7 @@ function LightIndicator(_a) {
|
|
|
6361
6475
|
}
|
|
6362
6476
|
var templateObject_1$f, templateObject_2$3;
|
|
6363
6477
|
|
|
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]; });
|
|
6478
|
+
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
6479
|
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
6480
|
function DefaultStar(_a) {
|
|
6367
6481
|
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 +6501,9 @@ function DoneButton(_a) {
|
|
|
6387
6501
|
return (React.createElement(Button, __assign({ variant: variant, size: size }, Props), "Done"));
|
|
6388
6502
|
}
|
|
6389
6503
|
|
|
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; });
|
|
6504
|
+
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
6505
|
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"]);
|
|
6506
|
+
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
6507
|
var _f = useState(false), isHover = _f[0], setHover = _f[1];
|
|
6394
6508
|
var RenderIcon = React.useMemo(function () {
|
|
6395
6509
|
if (!Icon) {
|
|
@@ -6419,29 +6533,29 @@ var NotificationExtraContent = memo(function (props) {
|
|
|
6419
6533
|
var NotificationIcon = memo(function (props) {
|
|
6420
6534
|
var alertType = props.alertType;
|
|
6421
6535
|
if (alertType === "success") {
|
|
6422
|
-
return React.createElement(CompletedCheckmarkIcon, { color: colors.green.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6536
|
+
return React.createElement(CompletedCheckmarkIcon, { color: colors$1.green.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6423
6537
|
}
|
|
6424
6538
|
else if (alertType === "error") {
|
|
6425
|
-
return React.createElement(AlertIcon, { color: colors.errors.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6539
|
+
return React.createElement(AlertIcon, { color: colors$1.errors.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6426
6540
|
}
|
|
6427
|
-
return React.createElement(InfoIcon, { color: colors.navy.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6541
|
+
return React.createElement(InfoIcon, { color: colors$1.navy.dark, mr: 8, style: { flexShrink: 0 } });
|
|
6428
6542
|
});
|
|
6429
6543
|
var notificationVariantStyles = function (alertType) {
|
|
6430
6544
|
switch (alertType) {
|
|
6431
6545
|
case "neutral":
|
|
6432
6546
|
return {
|
|
6433
|
-
backgroundColor: colors.navy.lightest,
|
|
6434
|
-
color: colors.navy.dark,
|
|
6547
|
+
backgroundColor: colors$1.navy.lightest,
|
|
6548
|
+
color: colors$1.navy.dark,
|
|
6435
6549
|
};
|
|
6436
6550
|
case "success":
|
|
6437
6551
|
return {
|
|
6438
|
-
backgroundColor: colors.green.lightest,
|
|
6439
|
-
color: colors.green.darkest,
|
|
6552
|
+
backgroundColor: colors$1.green.lightest,
|
|
6553
|
+
color: colors$1.green.darkest,
|
|
6440
6554
|
};
|
|
6441
6555
|
case "error":
|
|
6442
6556
|
return {
|
|
6443
|
-
backgroundColor: colors.errors.lightest,
|
|
6444
|
-
color: colors.errors.dark,
|
|
6557
|
+
backgroundColor: colors$1.errors.lightest,
|
|
6558
|
+
color: colors$1.errors.dark,
|
|
6445
6559
|
};
|
|
6446
6560
|
default:
|
|
6447
6561
|
return {};
|
|
@@ -7026,8 +7140,8 @@ var BaseCollapsible = function (props) {
|
|
|
7026
7140
|
setHeight(0);
|
|
7027
7141
|
}, [isOpen]);
|
|
7028
7142
|
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) }
|
|
7143
|
+
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
|
|
7144
|
+
? { border: "3px solid ".concat(colors$1.teal.main) }
|
|
7031
7145
|
: {})) },
|
|
7032
7146
|
React.createElement(CollapsibleHeader, { isOpen: isOpen, handleToggle: handleToggle, controls: controls }, header || label),
|
|
7033
7147
|
React.createElement(Col, { xs: true, style: {
|
|
@@ -7070,7 +7184,7 @@ var CollapsibleLabel = function (props) {
|
|
|
7070
7184
|
}
|
|
7071
7185
|
if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
|
|
7072
7186
|
return React.createElement("span", { style: {
|
|
7073
|
-
color: colors.teal.main,
|
|
7187
|
+
color: colors$1.teal.main,
|
|
7074
7188
|
fontFamily: fontFamilies.bold,
|
|
7075
7189
|
fontStyle: 'normal',
|
|
7076
7190
|
fontWeight: 500,
|
|
@@ -7098,7 +7212,7 @@ var CollapsibleControls = function (props) {
|
|
|
7098
7212
|
}
|
|
7099
7213
|
if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
|
|
7100
7214
|
return React.createElement("span", { style: {
|
|
7101
|
-
color: colors.teal.main,
|
|
7215
|
+
color: colors$1.teal.main,
|
|
7102
7216
|
fontFamily: fontFamilies.bold,
|
|
7103
7217
|
fontStyle: 'normal',
|
|
7104
7218
|
fontWeight: 500,
|
|
@@ -7123,7 +7237,7 @@ var ConfirmPopup = function (props) {
|
|
|
7123
7237
|
fontFamily: fontStyles.p.medium.fontFamily,
|
|
7124
7238
|
fontSize: fontStyles.p.medium.fontSize,
|
|
7125
7239
|
lineHeight: fontStyles.p.medium.lineHeight,
|
|
7126
|
-
color: colors.neutrals.bodyText
|
|
7240
|
+
color: colors$1.neutrals.bodyText
|
|
7127
7241
|
} }, confirmText),
|
|
7128
7242
|
React.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
|
|
7129
7243
|
React.createElement(Button, { size: "medium", variant: 'secondary', mr: 24, onClick: function () {
|
|
@@ -7163,8 +7277,8 @@ var PopupTitle = function (_a) {
|
|
|
7163
7277
|
var PopupContent = function (_a) {
|
|
7164
7278
|
var children = _a.children;
|
|
7165
7279
|
return (React.createElement("div", { style: {
|
|
7166
|
-
background: colors.errors[10],
|
|
7167
|
-
color: colors.errors.main,
|
|
7280
|
+
background: colors$1.errors[10],
|
|
7281
|
+
color: colors$1.errors.main,
|
|
7168
7282
|
padding: 16,
|
|
7169
7283
|
} },
|
|
7170
7284
|
React.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
|
|
@@ -7173,12 +7287,12 @@ var PopupContent = function (_a) {
|
|
|
7173
7287
|
verticalAlign: 'middle',
|
|
7174
7288
|
alignSelf: 'center',
|
|
7175
7289
|
} },
|
|
7176
|
-
React.createElement(AlertIcon, { size: 'medium', color: colors.errors[70] })),
|
|
7290
|
+
React.createElement(AlertIcon, { size: 'medium', color: colors$1.errors[70] })),
|
|
7177
7291
|
React.createElement("div", { style: {
|
|
7178
7292
|
fontFamily: 'var(--font-family-regular)',
|
|
7179
7293
|
fontSize: fontStyles.p.large.fontSize,
|
|
7180
7294
|
lineHeight: fontStyles.p.medium.lineHeight,
|
|
7181
|
-
color: colors.errors.main,
|
|
7295
|
+
color: colors$1.errors.main,
|
|
7182
7296
|
} }, children))));
|
|
7183
7297
|
};
|
|
7184
7298
|
|
|
@@ -7214,7 +7328,7 @@ var CalendarDaysBody = function (_a) {
|
|
|
7214
7328
|
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
7329
|
var templateObject_1$6;
|
|
7216
7330
|
|
|
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 ") : ''; });
|
|
7331
|
+
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
7332
|
var templateObject_1$5;
|
|
7219
7333
|
|
|
7220
7334
|
var CalendarDaysHeader = function (_a) {
|
|
@@ -7252,11 +7366,11 @@ var DefaultCalendarHeader = function (_a) {
|
|
|
7252
7366
|
React.createElement(Row, null,
|
|
7253
7367
|
React.createElement(LabeledCheckbox, { label: "Weekends", checked: true })))),
|
|
7254
7368
|
React.createElement(Col, { padded: true },
|
|
7255
|
-
React.createElement("div", { style: { cursor: 'pointer', color: colors.primary, }, onClick: onPrevWeek }, "< Prev Week")),
|
|
7369
|
+
React.createElement("div", { style: { cursor: 'pointer', color: colors$1.primary, }, onClick: onPrevWeek }, "< Prev Week")),
|
|
7256
7370
|
React.createElement(Col, { center: true, padded: true },
|
|
7257
|
-
React.createElement("span", { style: { color: colors.disabledButton } }, format(currentMonth, "MMM yyyy"))),
|
|
7371
|
+
React.createElement("span", { style: { color: colors$1.disabledButton } }, format(currentMonth, "MMM yyyy"))),
|
|
7258
7372
|
React.createElement(Col, { end: true, padded: true },
|
|
7259
|
-
React.createElement("div", { style: { cursor: 'pointer', color: colors.primary, }, onClick: onNextWeek }, "Next Week >"))));
|
|
7373
|
+
React.createElement("div", { style: { cursor: 'pointer', color: colors$1.primary, }, onClick: onNextWeek }, "Next Week >"))));
|
|
7260
7374
|
};
|
|
7261
7375
|
|
|
7262
7376
|
var TasksCalendarDayBody = function (_a) {
|
|
@@ -7328,7 +7442,7 @@ var CalendarIconDatePicker = React.forwardRef(function (_a, ref) {
|
|
|
7328
7442
|
textAlign: 'center',
|
|
7329
7443
|
borderRadius: 5,
|
|
7330
7444
|
cursor: 'pointer',
|
|
7331
|
-
color: colors.disabledButton,
|
|
7445
|
+
color: colors$1.disabledButton,
|
|
7332
7446
|
} })));
|
|
7333
7447
|
});
|
|
7334
7448
|
var TasksCalendarHeader = function (_a) {
|
|
@@ -7370,7 +7484,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7370
7484
|
}
|
|
7371
7485
|
} })),
|
|
7372
7486
|
React.createElement("span", null,
|
|
7373
|
-
React.createElement(WeekNav, { style: { cursor: 'pointer', color: colors.primary, verticalAlign: 'middle' }, onClick: onPrevWeek },
|
|
7487
|
+
React.createElement(WeekNav, { style: { cursor: 'pointer', color: colors$1.primary, verticalAlign: 'middle' }, onClick: onPrevWeek },
|
|
7374
7488
|
React.createElement(ChevronIcon, { direction: "left", size: 'large' })),
|
|
7375
7489
|
React.createElement(WeekNav, { as: Button, variant: "text", size: "primary-light", style: { verticalAlign: "middle", padding: "10px 0px", }, py: 5, onClick: function () {
|
|
7376
7490
|
if (isCurrentWeek) {
|
|
@@ -7378,7 +7492,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7378
7492
|
}
|
|
7379
7493
|
onResetDate();
|
|
7380
7494
|
} }, "Today"),
|
|
7381
|
-
React.createElement(WeekNav, { style: { cursor: 'pointer', color: colors.primary1.main, verticalAlign: 'middle' }, onClick: onNextWeek },
|
|
7495
|
+
React.createElement(WeekNav, { style: { cursor: 'pointer', color: colors$1.primary1.main, verticalAlign: 'middle' }, onClick: onNextWeek },
|
|
7382
7496
|
React.createElement(ChevronIcon, { size: "large" })))),
|
|
7383
7497
|
React.createElement(Col, { start: 1, xs: true, md: 8, padded: true },
|
|
7384
7498
|
React.createElement(Tabs, { size: "medium", tabs: tabs })),
|
|
@@ -7386,7 +7500,7 @@ var TasksCalendarHeader = function (_a) {
|
|
|
7386
7500
|
React.createElement(Link, { as: "span", onClick: onClickAddTask, style: {
|
|
7387
7501
|
marginRight: 10,
|
|
7388
7502
|
verticalAlign: 'bottom',
|
|
7389
|
-
color: colors.primary1.main,
|
|
7503
|
+
color: colors$1.primary1.main,
|
|
7390
7504
|
fontFamily: [themeOptions.fontFamilies.regular].concat(themeOptions.fontFamilies.fallbacks).join(','),
|
|
7391
7505
|
fontWeight: 600,
|
|
7392
7506
|
} }, "+ Add Task")
|
|
@@ -7692,7 +7806,7 @@ var SimpleWindowedTableStyles = styled.div(templateObject_1$1 || (templateObject
|
|
|
7692
7806
|
"border: ".concat(typeof p.bordered === 'string'
|
|
7693
7807
|
? p.bordered
|
|
7694
7808
|
: "1px solid ".concat(getThemeColor(p, 'tableBorder', '#edf2f5')), ";")
|
|
7695
|
-
: ''; }, colors.disabledButtonBorder, colors.disabledButtonBorder, function (p) { return p.hoverRowBg ?
|
|
7809
|
+
: ''; }, colors$1.disabledButtonBorder, colors$1.disabledButtonBorder, function (p) { return p.hoverRowBg ?
|
|
7696
7810
|
".tr:not(.header.tr, .table-footer.tr):hover {\n background: ".concat(typeof p.hoverRowBg === 'string'
|
|
7697
7811
|
? p.hoverRowBg
|
|
7698
7812
|
: getThemeColor(p, 'tableHeaderBg', '#F6FEFF'), ";\n }") : ''; }, function (p) { return p.selectedRowIndex && p.selectedRowStyle ?
|
|
@@ -7814,7 +7928,7 @@ var createAnimationLeftStyle = function (p) {
|
|
|
7814
7928
|
};
|
|
7815
7929
|
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
7930
|
? getThemeColor(p, 'teal.main', 'var(--color-primary1-main)')
|
|
7817
|
-
: getThemeColor(p, 'teal.20', colors.teal['20']); }, function (p) { return p.stretch
|
|
7931
|
+
: getThemeColor(p, 'teal.20', colors$1.teal['20']); }, function (p) { return p.stretch
|
|
7818
7932
|
? '100%'
|
|
7819
7933
|
: "".concat(stripUnit(toggleSizes[p.size || 'medium'].height) * 2.5, "px"); }, createAnimationLeftStyle, createAnimationLeftStyle);
|
|
7820
7934
|
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 +7995,5 @@ var Dropzone = React.forwardRef(function (_a, ref) {
|
|
|
7881
7995
|
React.createElement(RenderChild, { parseProps: parseChildProps }, children))));
|
|
7882
7996
|
});
|
|
7883
7997
|
|
|
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 };
|
|
7998
|
+
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, ResizableIcon, 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
7999
|
//# sourceMappingURL=index.mjs.map
|