@appquality/unguess-design-system 2.10.32 → 2.10.35
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/CHANGELOG.md +36 -0
- package/build/index.d.ts +1 -0
- package/build/index.js +330 -242
- package/build/stories/navigation/sidebar/_types.d.ts +1 -0
- package/build/stories/timeline/_types.d.ts +14 -0
- package/build/stories/timeline/index.d.ts +17 -0
- package/build/stories/timeline/index.stories.d.ts +20 -0
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -243,8 +243,8 @@ var components = __assign(__assign({}, reactTheming.DEFAULT_THEME.components), {
|
|
|
243
243
|
|
|
244
244
|
var theme = __assign(__assign({}, reactTheming.DEFAULT_THEME), { colors: __assign(__assign({}, reactTheming.DEFAULT_THEME.colors), { primaryHue: palette.blue[600], warningHue: palette.yellow[600], successHue: palette.teal["M600"], dangerHue: palette.red[400] }), palette: palette, fonts: __assign(__assign({}, reactTheming.DEFAULT_THEME.fonts), { system: '"Poppins",sans-serif,Helvetica,Arial,sans-serif' }), fontWeights: __assign(__assign({}, reactTheming.DEFAULT_THEME.fontWeights), { semibold: 500 }), gradients: gradients, borderRadii: __assign(__assign({}, reactTheming.DEFAULT_THEME.borderRadii), { lg: "8px", xl: "16px", xxl: "32px" }), components: components, shadows: __assign(__assign({}, reactTheming.DEFAULT_THEME.shadows), { boxShadow: boxShadow }) });
|
|
245
245
|
|
|
246
|
-
var GlobalStyle = styled.createGlobalStyle(templateObject_1$
|
|
247
|
-
var templateObject_1$
|
|
246
|
+
var GlobalStyle = styled.createGlobalStyle(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n ::-webkit-scrollbar-track:hover {\n border-left: solid 1px ", ";\n border-right: solid 1px ", ";\n }\n\n ::-webkit-scrollbar {\n width: 10px;\n }\n\n ::-webkit-scrollbar-track {\n border: solid 2px transparent;\n }\n\n ::-webkit-scrollbar-thumb {\n box-shadow: inset 0 0 10px 10px ", ";\n border: solid 2px transparent;\n border-radius: 25px;\n }\n\n /* This stuff is for Firefox */\n * {\n scrollbar-color: ", " #FFFFFF;\n scrollbar-width: thin;\n }\n\n html {\n overflow-y: auto;\n }\n\n body {\n font-family: ", ";\n margin: 0;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n \n svg {\n max-height: 100%;\n }\n\n"], ["\n ::-webkit-scrollbar-track:hover {\n border-left: solid 1px ", ";\n border-right: solid 1px ", ";\n }\n\n ::-webkit-scrollbar {\n width: 10px;\n }\n\n ::-webkit-scrollbar-track {\n border: solid 2px transparent;\n }\n\n ::-webkit-scrollbar-thumb {\n box-shadow: inset 0 0 10px 10px ", ";\n border: solid 2px transparent;\n border-radius: 25px;\n }\n\n /* This stuff is for Firefox */\n * {\n scrollbar-color: ", " #FFFFFF;\n scrollbar-width: thin;\n }\n\n html {\n overflow-y: auto;\n }\n\n body {\n font-family: ", ";\n margin: 0;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n \n svg {\n max-height: 100%;\n }\n\n"])), theme.palette.grey["200"], theme.palette.grey["200"], theme.palette.blue["200"], theme.palette.blue["200"], theme.fonts.system);
|
|
247
|
+
var templateObject_1$Y;
|
|
248
248
|
|
|
249
249
|
/**
|
|
250
250
|
* Accordions are headers that can be expanded to reveal content or collapsed to hide it.
|
|
@@ -259,7 +259,7 @@ Accordion.Header = reactAccordions.Accordion.Header;
|
|
|
259
259
|
Accordion.Label = reactAccordions.Accordion.Label;
|
|
260
260
|
Accordion.Panel = reactAccordions.Accordion.Panel;
|
|
261
261
|
|
|
262
|
-
var UgAlert = styled__default["default"](reactNotifications.Alert)(templateObject_1$
|
|
262
|
+
var UgAlert = styled__default["default"](reactNotifications.Alert)(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n background-color: white;\n color: ", ";\n border-width: 2px;\n"], ["\n background-color: white;\n color: ", ";\n border-width: 2px;\n"])), function (_a) {
|
|
263
263
|
var theme = _a.theme;
|
|
264
264
|
return theme.palette.grey[700];
|
|
265
265
|
});
|
|
@@ -273,10 +273,10 @@ var UgAlert = styled__default["default"](reactNotifications.Alert)(templateObjec
|
|
|
273
273
|
var Alert = function (props) { return jsxRuntime.jsx(UgAlert, __assign({}, props)); };
|
|
274
274
|
Alert.Title = reactNotifications.Title;
|
|
275
275
|
Alert.Close = reactNotifications.Close;
|
|
276
|
-
var templateObject_1$
|
|
276
|
+
var templateObject_1$X;
|
|
277
277
|
|
|
278
278
|
// import useWindowSize from "../../hooks/useWindowSize";
|
|
279
|
-
var UgAvatar = styled__default["default"](reactAvatars.Avatar)(templateObject_1$
|
|
279
|
+
var UgAvatar = styled__default["default"](reactAvatars.Avatar)(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
280
280
|
return props.avatarType &&
|
|
281
281
|
props.avatarType !== "image" &&
|
|
282
282
|
"background: ".concat(props.backgroundColor || theme.gradients.dark, ";");
|
|
@@ -301,7 +301,7 @@ var Avatar = function (props) {
|
|
|
301
301
|
return (jsxRuntime.jsx(UgAvatar, __assign({}, props, { badge: fixedBadge, children: wrapChildren(props.avatarType || "text"), size: props.size || "small" })));
|
|
302
302
|
};
|
|
303
303
|
Avatar.Text = UgAvatar.Text;
|
|
304
|
-
var templateObject_1$
|
|
304
|
+
var templateObject_1$W;
|
|
305
305
|
|
|
306
306
|
/**
|
|
307
307
|
* Breadcrumbs mark and communicate a user’s location in the product.
|
|
@@ -322,7 +322,7 @@ var Breadcrumb = function (props) { return jsxRuntime.jsx(reactBreadcrumbs.Bread
|
|
|
322
322
|
*/
|
|
323
323
|
var Anchor = function (props) { return jsxRuntime.jsx(reactButtons.Anchor, __assign({}, props)); };
|
|
324
324
|
|
|
325
|
-
var UgButton = styled__default["default"](reactButtons.Button)(templateObject_1$
|
|
325
|
+
var UgButton = styled__default["default"](reactButtons.Button)(templateObject_1$V || (templateObject_1$V = __makeTemplateObject([""], [""])));
|
|
326
326
|
/**
|
|
327
327
|
* Buttons let users take action quickly.
|
|
328
328
|
* Use a Button to enable actions or decisions that are important to a user’s workflow.
|
|
@@ -334,7 +334,7 @@ var UgButton = styled__default["default"](reactButtons.Button)(templateObject_1$
|
|
|
334
334
|
var Button = function (props) { return jsxRuntime.jsx(UgButton, __assign({}, props)); };
|
|
335
335
|
Button.StartIcon = UgButton.StartIcon;
|
|
336
336
|
Button.EndIcon = UgButton.EndIcon;
|
|
337
|
-
var templateObject_1$
|
|
337
|
+
var templateObject_1$V;
|
|
338
338
|
|
|
339
339
|
/**
|
|
340
340
|
A Button group lets users make a selection from a set of options.
|
|
@@ -364,7 +364,7 @@ Used for this:
|
|
|
364
364
|
**/
|
|
365
365
|
var SplitButton = function (props) { return (jsxRuntime.jsx(reactButtons.SplitButton, __assign({}, props))); };
|
|
366
366
|
|
|
367
|
-
var ContentCard = styled__default["default"](reactNotifications.Well)(templateObject_1$
|
|
367
|
+
var ContentCard = styled__default["default"](reactNotifications.Well)(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n ", "\n"], ["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n ", "\n"])), function (_a) {
|
|
368
368
|
var theme = _a.theme;
|
|
369
369
|
return theme.borderRadii.lg;
|
|
370
370
|
}, function (_a) {
|
|
@@ -385,11 +385,11 @@ var ContentCard = styled__default["default"](reactNotifications.Well)(templateOb
|
|
|
385
385
|
- To group related content
|
|
386
386
|
*/
|
|
387
387
|
var Card = function (props) { return jsxRuntime.jsx(ContentCard, __assign({}, props)); };
|
|
388
|
-
var ContainerCard = styled__default["default"](Card)(templateObject_2$
|
|
388
|
+
var ContainerCard = styled__default["default"](Card)(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n border-radius: ", ";\n"], ["\n border-radius: ", ";\n"])), function (_a) {
|
|
389
389
|
var theme = _a.theme;
|
|
390
390
|
return theme.borderRadii.xl;
|
|
391
391
|
});
|
|
392
|
-
var templateObject_1$
|
|
392
|
+
var templateObject_1$U, templateObject_2$n;
|
|
393
393
|
|
|
394
394
|
/**
|
|
395
395
|
* Tags let users categorize content using a keyword.
|
|
@@ -406,20 +406,20 @@ var Tag = function (props) { return jsxRuntime.jsx(reactTags.Tag, __assign({}, p
|
|
|
406
406
|
Tag.Avatar = reactTags.Tag.Avatar;
|
|
407
407
|
Tag.Close = reactTags.Tag.Close;
|
|
408
408
|
|
|
409
|
-
var UgLabel$1 = styled__default["default"](reactForms.Label)(templateObject_1$
|
|
409
|
+
var UgLabel$1 = styled__default["default"](reactForms.Label)(templateObject_1$T || (templateObject_1$T = __makeTemplateObject([""], [""])));
|
|
410
410
|
/**
|
|
411
411
|
* A Label is used to specify a title for an input.
|
|
412
412
|
* <hr>
|
|
413
413
|
**/
|
|
414
414
|
var Label = function (props) { return jsxRuntime.jsx(UgLabel$1, __assign({}, props)); };
|
|
415
|
-
var templateObject_1$
|
|
415
|
+
var templateObject_1$T;
|
|
416
416
|
|
|
417
|
-
var _g$4, _path$
|
|
417
|
+
var _g$4, _path$s;
|
|
418
418
|
|
|
419
|
-
function _extends$
|
|
419
|
+
function _extends$u() { _extends$u = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$u.apply(this, arguments); }
|
|
420
420
|
|
|
421
421
|
var SvgFunctionalTestIcon = function SvgFunctionalTestIcon(props) {
|
|
422
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
422
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$u({
|
|
423
423
|
width: 24,
|
|
424
424
|
height: 24,
|
|
425
425
|
viewBox: "0 0 24 24",
|
|
@@ -431,18 +431,18 @@ var SvgFunctionalTestIcon = function SvgFunctionalTestIcon(props) {
|
|
|
431
431
|
opacity: 0.3,
|
|
432
432
|
d: "M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z",
|
|
433
433
|
fill: "#003A57"
|
|
434
|
-
}))), _path$
|
|
434
|
+
}))), _path$s || (_path$s = /*#__PURE__*/React__namespace.createElement("path", {
|
|
435
435
|
d: "M17.9983 7.16705C17.5188 6.58566 17.1422 6.73039 17.1422 6.73039C17.1422 6.73039 16.406 7.02453 16.0401 7.16303C15.6742 7.30153 15.2408 7.17357 15.2408 7.17357L14.7579 6.8851C14.7579 6.8851 14.4296 6.56554 14.3656 6.18067C14.3123 5.78958 14.1888 5.00269 14.1888 5.00269C14.1888 5.00269 14.1356 4.61159 13.3938 4.47257C12.652 4.33356 12.4678 4.68715 12.4678 4.68715C12.4678 4.68715 12.0932 5.38344 11.9091 5.73703C11.7249 6.09062 11.3114 6.27118 11.3114 6.27118L10.7639 6.36908C10.7639 6.36908 10.3144 6.33771 10.0176 6.07271L9.12712 5.27769C9.12712 5.27769 8.8303 5.01268 8.18313 5.38632C7.53595 5.75997 7.61705 6.14953 7.61705 6.14953L7.86033 7.3182C7.94143 7.70776 7.74381 8.11275 7.74381 8.11275L7.38528 8.53794C7.38528 8.53794 7.02217 8.80577 6.62387 8.78845C6.22557 8.77114 5.43527 8.7474 5.43527 8.7474C5.43527 8.7474 5.03697 8.73009 4.78646 9.44201C4.53595 10.1539 4.84804 10.3956 4.84804 10.3956C4.84804 10.3956 5.46774 10.896 5.77983 11.1376C6.09192 11.3793 6.19373 11.8296 6.19373 11.8296L6.20207 12.3921C6.20207 12.3921 6.09618 12.8314 5.79331 13.079C5.49043 13.3266 4.86759 13.8171 4.86759 13.8171C4.86759 13.8171 4.56471 14.0647 4.81769 14.7769C5.08144 15.4828 5.46713 15.4783 5.46713 15.4783C5.46713 15.4783 6.26012 15.4569 6.64582 15.4524C7.03152 15.4479 7.40116 15.7145 7.40116 15.7145L7.76458 16.1447C7.76458 16.1447 7.96976 16.5499 7.89441 16.9425C7.81907 17.3351 7.66208 18.1094 7.66208 18.1094C7.66208 18.1094 7.58674 18.502 8.23785 18.8824C8.88895 19.2629 9.18553 19.0044 9.18553 19.0044C9.18553 19.0044 9.7724 18.4765 10.069 18.218C10.3655 17.9595 10.8115 17.9347 10.8115 17.9347L11.3609 18.0394C11.3609 18.0394 11.77 18.225 11.9608 18.5803C12.1516 18.9356 12.5268 19.6354 12.5268 19.6354C12.5268 19.6354 12.7176 19.9907 13.4583 19.8539C14.1946 19.7343 14.2529 19.337 14.2529 19.337C14.2529 19.337 14.3586 18.5487 14.4232 18.1623C14.4814 17.765 14.8086 17.4598 14.8086 17.4598L15.2939 17.1796C15.2939 17.1796 15.7281 17.0598 16.095 17.1971C16.4682 17.3453 17.1975 17.637 17.1975 17.637C17.1975 17.637 17.5707 17.7851 18.0424 17.2073C18.5142 16.6295 18.3189 16.2913 18.3189 16.2913C18.3189 16.2913 17.9006 15.6164 17.6882 15.2736C17.4759 14.9307 17.5197 14.4836 17.5197 14.4836L17.7038 13.9555C17.7038 13.9555 17.9482 13.5816 18.3203 13.454C18.6925 13.3264 19.4431 13.0822 19.4431 13.0822C19.4431 13.0822 19.8153 12.9546 19.8113 12.2005C19.8074 11.4464 19.4297 11.3153 19.4297 11.3153C19.4297 11.3153 18.6807 11.0641 18.303 10.9331C17.9253 10.802 17.677 10.4217 17.677 10.4217L17.4861 9.8919C17.4861 9.8919 17.4293 9.4447 17.6368 9.1067C17.8443 8.7687 18.2486 8.09891 18.2486 8.09891C18.2486 8.09891 18.4778 7.74844 17.9983 7.16707L17.9983 7.16705ZM9.33902 8.38466L10.6176 10.5992C10.0433 11.149 9.82793 11.9715 10.0567 12.7413L7.86713 14.0054C6.98868 12.0106 7.60355 9.66286 9.33905 8.38457L9.33902 8.38466ZM13.9748 16.414C11.9998 17.2778 9.65918 16.6363 8.37099 14.8783L10.5605 13.6141C11.1128 14.1971 11.9329 14.4219 12.6961 14.1994L13.9748 16.414ZM12.6552 13.132C12.1159 13.4434 11.4325 13.2561 11.1176 12.7107C10.8027 12.1652 10.9822 11.4797 11.5215 11.1684C12.0608 10.857 12.7441 11.0443 13.0591 11.5897C13.374 12.1352 13.1945 12.8207 12.6552 13.132ZM14.8376 15.9158L13.5591 13.7012C14.1333 13.1515 14.3487 12.3289 14.12 11.5591L16.3095 10.295C17.188 12.2898 16.5731 14.6376 14.8376 15.9159L14.8376 15.9158ZM13.6161 10.6863C13.0638 10.1034 12.2437 9.87862 11.4805 10.1011L10.2019 7.88652C12.1769 7.02266 14.5112 7.65314 15.8057 9.42223L13.6161 10.6863Z",
|
|
436
436
|
fill: "#003A57"
|
|
437
437
|
})));
|
|
438
438
|
};
|
|
439
439
|
|
|
440
|
-
var _g$3, _path$
|
|
440
|
+
var _g$3, _path$r, _path2$7, _path3$6, _path4$4, _path5$3, _path6$3, _path7$3, _path8$3, _path9$3, _path10$3, _path11$2;
|
|
441
441
|
|
|
442
|
-
function _extends$
|
|
442
|
+
function _extends$t() { _extends$t = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$t.apply(this, arguments); }
|
|
443
443
|
|
|
444
444
|
var SvgExperientialTestIcon = function SvgExperientialTestIcon(props) {
|
|
445
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
445
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$t({
|
|
446
446
|
width: 24,
|
|
447
447
|
height: 24,
|
|
448
448
|
viewBox: "0 0 24 24",
|
|
@@ -454,7 +454,7 @@ var SvgExperientialTestIcon = function SvgExperientialTestIcon(props) {
|
|
|
454
454
|
opacity: 0.3,
|
|
455
455
|
d: "M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z",
|
|
456
456
|
fill: "#003A57"
|
|
457
|
-
}))), _path$
|
|
457
|
+
}))), _path$r || (_path$r = /*#__PURE__*/React__namespace.createElement("path", {
|
|
458
458
|
d: "M12.4871 3.1964C8.68009 3.1964 5.59901 6.27748 5.59901 10.0844C5.59901 10.2596 5.59901 10.4347 5.62445 10.5854C5.29863 11.1861 4.82313 12.0129 4.24684 12.5138C3.82123 12.8896 3.92102 13.2907 3.97091 13.4404C4.09615 13.7662 4.44641 14.0411 5.02271 14.2417C5.22328 14.3171 5.44831 14.367 5.64889 14.4169L5.67433 16.8463C5.67433 17.7983 6.47565 18.625 7.4531 18.625L8.9305 18.1495L9.08117 19.0262C9.18097 19.6025 9.68191 20.0281 10.2837 20.0281C10.359 20.0281 10.4343 20.0281 10.5087 20.0026L15.1425 19.1769C15.8185 19.0516 16.2441 18.4254 16.1444 17.7494L15.8185 16.1213C17.9975 14.9188 19.375 12.5891 19.375 10.0843C19.375 6.30267 16.2696 3.19629 12.487 3.19629L12.4871 3.1964Z",
|
|
459
459
|
fill: "#003A57",
|
|
460
460
|
stroke: "#003A57"
|
|
@@ -511,12 +511,12 @@ var SvgExperientialTestIcon = function SvgExperientialTestIcon(props) {
|
|
|
511
511
|
})));
|
|
512
512
|
};
|
|
513
513
|
|
|
514
|
-
var _circle$2, _path$
|
|
514
|
+
var _circle$2, _path$q, _path2$6, _path3$5;
|
|
515
515
|
|
|
516
|
-
function _extends$
|
|
516
|
+
function _extends$s() { _extends$s = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$s.apply(this, arguments); }
|
|
517
517
|
|
|
518
518
|
var SvgCompletedStatusRoundIcon = function SvgCompletedStatusRoundIcon(props) {
|
|
519
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
519
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$s({
|
|
520
520
|
width: 32,
|
|
521
521
|
height: 32,
|
|
522
522
|
viewBox: "0 0 32 32",
|
|
@@ -527,7 +527,7 @@ var SvgCompletedStatusRoundIcon = function SvgCompletedStatusRoundIcon(props) {
|
|
|
527
527
|
cy: 16,
|
|
528
528
|
r: 16,
|
|
529
529
|
fill: "#F8F9F9"
|
|
530
|
-
})), _path$
|
|
530
|
+
})), _path$q || (_path$q = /*#__PURE__*/React__namespace.createElement("path", {
|
|
531
531
|
d: "M24.6953 9.73905C25.0148 9.41953 25.0148 8.90149 24.6953 8.58197C24.3758 8.26245 23.8577 8.26245 23.5382 8.58197L15.88 16.2402L14.0849 13.9598C13.8054 13.6048 13.291 13.5435 12.9359 13.823C12.5809 14.1025 12.5196 14.6169 12.7991 14.972L15.1642 17.9763C15.3089 18.16 15.5252 18.2731 15.7586 18.2869C15.9921 18.3008 16.2203 18.2141 16.3856 18.0487L24.6953 9.73905Z",
|
|
532
532
|
fill: "#27DD70"
|
|
533
533
|
})), _path2$6 || (_path2$6 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -539,12 +539,12 @@ var SvgCompletedStatusRoundIcon = function SvgCompletedStatusRoundIcon(props) {
|
|
|
539
539
|
})));
|
|
540
540
|
};
|
|
541
541
|
|
|
542
|
-
var _circle$1, _path$
|
|
542
|
+
var _circle$1, _path$p, _path2$5, _path3$4, _path4$3, _path5$2, _path6$2, _path7$2, _path8$2, _path9$2, _path10$2;
|
|
543
543
|
|
|
544
|
-
function _extends$
|
|
544
|
+
function _extends$r() { _extends$r = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$r.apply(this, arguments); }
|
|
545
545
|
|
|
546
546
|
var SvgOnGoingStatusRoundIcon = function SvgOnGoingStatusRoundIcon(props) {
|
|
547
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
547
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$r({
|
|
548
548
|
width: 32,
|
|
549
549
|
height: 32,
|
|
550
550
|
viewBox: "0 0 32 32",
|
|
@@ -555,7 +555,7 @@ var SvgOnGoingStatusRoundIcon = function SvgOnGoingStatusRoundIcon(props) {
|
|
|
555
555
|
cy: 16,
|
|
556
556
|
r: 16,
|
|
557
557
|
fill: "#F8F9F9"
|
|
558
|
-
})), _path$
|
|
558
|
+
})), _path$p || (_path$p = /*#__PURE__*/React__namespace.createElement("path", {
|
|
559
559
|
d: "M17.059 20.7647C17.059 20.1799 16.585 19.7059 16.0002 19.7059C15.4154 19.7059 14.9414 20.1799 14.9414 20.7647V23.9412C14.9414 24.5259 15.4154 25 16.0002 25C16.585 25 17.059 24.5259 17.059 23.9412V20.7647Z",
|
|
560
560
|
fill: "#D1820A"
|
|
561
561
|
})), _path2$5 || (_path2$5 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -588,12 +588,12 @@ var SvgOnGoingStatusRoundIcon = function SvgOnGoingStatusRoundIcon(props) {
|
|
|
588
588
|
})));
|
|
589
589
|
};
|
|
590
590
|
|
|
591
|
-
var _circle, _path$
|
|
591
|
+
var _circle, _path$o, _path2$4;
|
|
592
592
|
|
|
593
|
-
function _extends$
|
|
593
|
+
function _extends$q() { _extends$q = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$q.apply(this, arguments); }
|
|
594
594
|
|
|
595
595
|
var SvgArrivalStatusRoundIcon = function SvgArrivalStatusRoundIcon(props) {
|
|
596
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
596
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$q({
|
|
597
597
|
width: 32,
|
|
598
598
|
height: 32,
|
|
599
599
|
viewBox: "0 0 32 32",
|
|
@@ -604,7 +604,7 @@ var SvgArrivalStatusRoundIcon = function SvgArrivalStatusRoundIcon(props) {
|
|
|
604
604
|
cy: 16,
|
|
605
605
|
r: 16,
|
|
606
606
|
fill: "#F8F9F9"
|
|
607
|
-
})), _path$
|
|
607
|
+
})), _path$o || (_path$o = /*#__PURE__*/React__namespace.createElement("path", {
|
|
608
608
|
d: "M15.2266 17.0313H18.997M15.2266 13.2607V17.0313V13.2607ZM15.2266 17.0313L24.121 9.03906L15.2266 17.0313Z",
|
|
609
609
|
stroke: "#1371D6",
|
|
610
610
|
strokeWidth: 1.5,
|
|
@@ -619,7 +619,7 @@ var SvgArrivalStatusRoundIcon = function SvgArrivalStatusRoundIcon(props) {
|
|
|
619
619
|
})));
|
|
620
620
|
};
|
|
621
621
|
|
|
622
|
-
var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObject_1$
|
|
622
|
+
var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n background-color: ", ";\n border-radius: ", ";\n"], ["\n background-color: ", ";\n border-radius: ", ";\n"])), function (props) { return props.theme.palette.grey[500]; }, function (props) { return props.theme.borderRadii.xxl; });
|
|
623
623
|
/**
|
|
624
624
|
* A Skeleton loader shows users a blank version of a page or section of a page into which content is gradually loaded. It provides a visual estimate of the space needed.
|
|
625
625
|
* <hr>
|
|
@@ -634,15 +634,15 @@ var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObjec
|
|
|
634
634
|
- To communicate a typing status, use Inline instead
|
|
635
635
|
*/
|
|
636
636
|
var Skeleton = function (props) { return jsxRuntime.jsx(UgSkeleton, __assign({}, props)); };
|
|
637
|
-
var templateObject_1$
|
|
637
|
+
var templateObject_1$S;
|
|
638
638
|
|
|
639
639
|
var CampaignCardSkeleton = function () {
|
|
640
640
|
return (jsxRuntime.jsxs(Wrapper$1, { children: [jsxRuntime.jsx(CardHeader, { children: jsxRuntime.jsx(Skeleton, { width: "30%" }) }), jsxRuntime.jsxs(CardBody$1, { children: [jsxRuntime.jsx(Skeleton, { height: "18px", width: "50%" }), jsxRuntime.jsx("br", {}), jsxRuntime.jsx(Skeleton, { height: "26px", style: { backgroundColor: theme.palette.blue[400] } })] }), jsxRuntime.jsx(Divider$1, {}), jsxRuntime.jsxs(CardFooter$1, { children: [jsxRuntime.jsx(Skeleton, { height: "18px", width: "45%" }), " ", jsxRuntime.jsx(Skeleton, { width: "26px", height: "26px", style: { borderRadius: "100%" } })] })] }));
|
|
641
641
|
};
|
|
642
642
|
|
|
643
|
-
var flexCenter = styled.css(templateObject_1$
|
|
644
|
-
var flexColumnCenter = styled.css(templateObject_2$
|
|
645
|
-
var flexStart = styled.css(templateObject_3$
|
|
643
|
+
var flexCenter = styled.css(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
|
|
644
|
+
var flexColumnCenter = styled.css(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n ", ";\n flex-direction: column;\n"], ["\n ", ";\n flex-direction: column;\n"])), flexCenter);
|
|
645
|
+
var flexStart = styled.css(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: ", ";\n"])), function (_a) {
|
|
646
646
|
var theme = _a.theme;
|
|
647
647
|
return (theme.rtl ? "flex-end" : "flex-start");
|
|
648
648
|
});
|
|
@@ -659,7 +659,7 @@ var cardStyle = styled.css(templateObject_4$b || (templateObject_4$b = __makeTem
|
|
|
659
659
|
var theme = _a.theme;
|
|
660
660
|
return theme.shadows.boxShadow(theme);
|
|
661
661
|
});
|
|
662
|
-
var templateObject_1$
|
|
662
|
+
var templateObject_1$R, templateObject_2$m, templateObject_3$f, templateObject_4$b;
|
|
663
663
|
|
|
664
664
|
var getStatusIcon = function (status) {
|
|
665
665
|
switch (status) {
|
|
@@ -683,12 +683,12 @@ var getTypeDataIcon = function (type) {
|
|
|
683
683
|
return SvgFunctionalTestIcon;
|
|
684
684
|
}
|
|
685
685
|
};
|
|
686
|
-
var Wrapper$1 = styled__default["default"](Card)(templateObject_1$
|
|
687
|
-
var StyledTag$1 = styled__default["default"](Tag)(templateObject_2$
|
|
686
|
+
var Wrapper$1 = styled__default["default"](Card)(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), cardStyle);
|
|
687
|
+
var StyledTag$1 = styled__default["default"](Tag)(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n color: ", ";\n max-width: 75%;\n cursor: pointer;\n"], ["\n color: ", ";\n max-width: 75%;\n cursor: pointer;\n"])), function (_a) {
|
|
688
688
|
var theme = _a.theme;
|
|
689
689
|
return theme.palette.grey["700"];
|
|
690
690
|
});
|
|
691
|
-
var StyledTagNew$1 = styled__default["default"](Tag)(templateObject_3$
|
|
691
|
+
var StyledTagNew$1 = styled__default["default"](Tag)(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n height: ", "px;\n padding: ", "px\n ", "px;\n color: ", ";\n"], ["\n height: ", "px;\n padding: ", "px\n ", "px;\n color: ", ";\n"])), function (_a) {
|
|
692
692
|
var theme = _a.theme;
|
|
693
693
|
return theme.space.base * 6;
|
|
694
694
|
}, function (_a) {
|
|
@@ -745,9 +745,9 @@ var CampaignCard = function (props) {
|
|
|
745
745
|
}
|
|
746
746
|
return props.isLoading ? (jsxRuntime.jsx(CampaignCardSkeleton, {})) : (jsxRuntime.jsxs(Wrapper$1, __assign({}, props, { children: [jsxRuntime.jsxs(CardHeader, { children: [jsxRuntime.jsx(StyledLabel$2, __assign({ isRegular: true }, { children: date })), isNew && (jsxRuntime.jsx(StyledTagNew$1, __assign({ hue: theme.palette.fuschia["600"], isPill: true, size: "medium", title: labelNew ? labelNew : "New!" }, { children: labelNew ? labelNew : "New!" })))] }), jsxRuntime.jsxs(CardBody$1, { children: [jsxRuntime.jsx(StyledLabel$2, __assign({ isRegular: true }, { children: projectTitleCut })), jsxRuntime.jsx(StyledTitleLabel$1, __assign({ isRegular: true }, { children: campaignTitleCut }))] }), jsxRuntime.jsx(Divider$1, {}), jsxRuntime.jsxs(CardFooter$1, { children: [props.pillText && (jsxRuntime.jsxs(StyledTag$1, __assign({ size: "large", isPill: true, isRegular: true, hue: theme.palette.grey[100] }, { children: [jsxRuntime.jsx(Tag.Avatar, { children: jsxRuntime.jsx(PillIcon, {}) }), props.pillText] }))), jsxRuntime.jsx(StatusIcon, {})] })] })));
|
|
747
747
|
};
|
|
748
|
-
var templateObject_1$
|
|
748
|
+
var templateObject_1$Q, templateObject_2$l, templateObject_3$e, templateObject_4$a, templateObject_5$5, templateObject_6$2, templateObject_7$1, templateObject_8$1, templateObject_9;
|
|
749
749
|
|
|
750
|
-
var Wrapper = styled__default["default"](Card)(templateObject_1$
|
|
750
|
+
var Wrapper = styled__default["default"](Card)(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n display: flex;\n flex-direction: column;\n\n &:hover {\n box-shadow: ", ";\n }\n"], ["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n display: flex;\n flex-direction: column;\n\n &:hover {\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
751
751
|
var theme = _a.theme;
|
|
752
752
|
return theme.borderRadii.lg;
|
|
753
753
|
}, function (_a) {
|
|
@@ -760,7 +760,7 @@ var Wrapper = styled__default["default"](Card)(templateObject_1$O || (templateOb
|
|
|
760
760
|
var theme = _a.theme;
|
|
761
761
|
return theme.shadows.boxShadow(theme);
|
|
762
762
|
});
|
|
763
|
-
var StyledTagNew = styled__default["default"](Tag)(templateObject_2$
|
|
763
|
+
var StyledTagNew = styled__default["default"](Tag)(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n height: ", "px;\n padding: ", "px\n ", "px;\n color: ", ";\n position: absolute;\n right: 16px;\n top: 16px;\n"], ["\n height: ", "px;\n padding: ", "px\n ", "px;\n color: ", ";\n position: absolute;\n right: 16px;\n top: 16px;\n"])), function (_a) {
|
|
764
764
|
var theme = _a.theme;
|
|
765
765
|
return theme.space.base * 6;
|
|
766
766
|
}, function (_a) {
|
|
@@ -773,7 +773,7 @@ var StyledTagNew = styled__default["default"](Tag)(templateObject_2$j || (templa
|
|
|
773
773
|
var theme = _a.theme;
|
|
774
774
|
return theme.palette.white;
|
|
775
775
|
});
|
|
776
|
-
var StyledLabel$1 = styled__default["default"](Label)(templateObject_3$
|
|
776
|
+
var StyledLabel$1 = styled__default["default"](Label)(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n font-size: ", ";\n color: ", ";\n cursor: pointer;\n"], ["\n font-size: ", ";\n color: ", ";\n cursor: pointer;\n"])), function (_a) {
|
|
777
777
|
var theme = _a.theme;
|
|
778
778
|
return theme.fontSizes.sm;
|
|
779
779
|
}, function (_a) {
|
|
@@ -808,25 +808,25 @@ var ProductCard = function (props) {
|
|
|
808
808
|
}
|
|
809
809
|
return props.isLoading ? (jsxRuntime.jsx(CampaignCardSkeleton, {})) : (jsxRuntime.jsxs(Wrapper, __assign({}, props, { children: [jsxRuntime.jsxs(CardBody, __assign({ onClick: props.onCtaClick }, { children: [isNew && (jsxRuntime.jsx(StyledTagNew, __assign({ hue: theme.palette.fuschia["600"], isPill: true, size: "medium", title: labelNew ? labelNew : "New!" }, { children: labelNew ? labelNew : "New!" }))), props.icon && jsxRuntime.jsx(IconContainer$1, { children: props.icon }), props.preTitle && (jsxRuntime.jsx(StyledLabel$1, __assign({ isRegular: true }, { children: props.preTitle }))), jsxRuntime.jsx(StyledTitleLabel, __assign({ isRegular: true }, { children: productTitleCut }))] })), jsxRuntime.jsx(Divider, {}), jsxRuntime.jsx(CardFooter, { children: jsxRuntime.jsx(Button, __assign({ isPill: true, isPrimary: true, onClick: props.onCtaClick }, { children: props.ctaLabel })) })] })));
|
|
810
810
|
};
|
|
811
|
-
var templateObject_1$
|
|
811
|
+
var templateObject_1$P, templateObject_2$k, templateObject_3$d, templateObject_4$9, templateObject_5$4, templateObject_6$1, templateObject_7, templateObject_8;
|
|
812
812
|
|
|
813
813
|
/**
|
|
814
814
|
* Title is a basic component used to display a title. Often used in card headers.
|
|
815
815
|
*/
|
|
816
816
|
var Close = function (props) { return jsxRuntime.jsx(reactNotifications.Close, __assign({}, props)); };
|
|
817
817
|
|
|
818
|
-
var _path$
|
|
818
|
+
var _path$n, _path2$3, _path3$3, _path4$2;
|
|
819
819
|
|
|
820
|
-
function _extends$
|
|
820
|
+
function _extends$p() { _extends$p = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$p.apply(this, arguments); }
|
|
821
821
|
|
|
822
822
|
var SvgCampaignCompleted = function SvgCampaignCompleted(props) {
|
|
823
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
823
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$p({
|
|
824
824
|
width: 24,
|
|
825
825
|
height: 24,
|
|
826
826
|
viewBox: "0 0 24 24",
|
|
827
827
|
fill: "none",
|
|
828
828
|
xmlns: "http://www.w3.org/2000/svg"
|
|
829
|
-
}, props), _path$
|
|
829
|
+
}, props), _path$n || (_path$n = /*#__PURE__*/React__namespace.createElement("path", {
|
|
830
830
|
d: "M0 12C0 5.37258 5.37258 0 12 0C18.6274 0 24 5.37258 24 12C24 18.6274 18.6274 24 12 24C5.37258 24 0 18.6274 0 12Z",
|
|
831
831
|
fill: "#F8F9F9"
|
|
832
832
|
})), _path2$3 || (_path2$3 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -841,18 +841,18 @@ var SvgCampaignCompleted = function SvgCampaignCompleted(props) {
|
|
|
841
841
|
})));
|
|
842
842
|
};
|
|
843
843
|
|
|
844
|
-
var _path$
|
|
844
|
+
var _path$m, _path2$2, _path3$2, _path4$1, _path5$1, _path6$1, _path7$1, _path8$1, _path9$1, _path10$1, _path11$1;
|
|
845
845
|
|
|
846
|
-
function _extends$
|
|
846
|
+
function _extends$o() { _extends$o = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$o.apply(this, arguments); }
|
|
847
847
|
|
|
848
848
|
var SvgCampaignProgress = function SvgCampaignProgress(props) {
|
|
849
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
849
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$o({
|
|
850
850
|
width: 24,
|
|
851
851
|
height: 24,
|
|
852
852
|
viewBox: "0 0 24 24",
|
|
853
853
|
fill: "none",
|
|
854
854
|
xmlns: "http://www.w3.org/2000/svg"
|
|
855
|
-
}, props), _path$
|
|
855
|
+
}, props), _path$m || (_path$m = /*#__PURE__*/React__namespace.createElement("path", {
|
|
856
856
|
d: "M0 12C0 5.37258 5.37258 0 12 0C18.6274 0 24 5.37258 24 12C24 18.6274 18.6274 24 12 24C5.37258 24 0 18.6274 0 12Z",
|
|
857
857
|
fill: "#F8F9F9"
|
|
858
858
|
})), _path2$2 || (_path2$2 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -888,18 +888,18 @@ var SvgCampaignProgress = function SvgCampaignProgress(props) {
|
|
|
888
888
|
})));
|
|
889
889
|
};
|
|
890
890
|
|
|
891
|
-
var _path$
|
|
891
|
+
var _path$l, _path2$1, _path3$1;
|
|
892
892
|
|
|
893
|
-
function _extends$
|
|
893
|
+
function _extends$n() { _extends$n = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$n.apply(this, arguments); }
|
|
894
894
|
|
|
895
895
|
var SvgCampaignIncoming = function SvgCampaignIncoming(props) {
|
|
896
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
896
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$n({
|
|
897
897
|
width: 24,
|
|
898
898
|
height: 24,
|
|
899
899
|
viewBox: "0 0 24 24",
|
|
900
900
|
fill: "none",
|
|
901
901
|
xmlns: "http://www.w3.org/2000/svg"
|
|
902
|
-
}, props), _path$
|
|
902
|
+
}, props), _path$l || (_path$l = /*#__PURE__*/React__namespace.createElement("path", {
|
|
903
903
|
d: "M0 12C0 5.37258 5.37258 0 12 0C18.6274 0 24 5.37258 24 12C24 18.6274 18.6274 24 12 24C5.37258 24 0 18.6274 0 12Z",
|
|
904
904
|
fill: "#F8F9F9"
|
|
905
905
|
})), _path2$1 || (_path2$1 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -917,12 +917,12 @@ var SvgCampaignIncoming = function SvgCampaignIncoming(props) {
|
|
|
917
917
|
})));
|
|
918
918
|
};
|
|
919
919
|
|
|
920
|
-
var _g$2, _path$
|
|
920
|
+
var _g$2, _path$k;
|
|
921
921
|
|
|
922
|
-
function _extends$
|
|
922
|
+
function _extends$m() { _extends$m = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$m.apply(this, arguments); }
|
|
923
923
|
|
|
924
924
|
var SvgCampaignFunctional = function SvgCampaignFunctional(props) {
|
|
925
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
925
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$m({
|
|
926
926
|
width: 24,
|
|
927
927
|
height: 24,
|
|
928
928
|
viewBox: "0 0 24 24",
|
|
@@ -934,18 +934,18 @@ var SvgCampaignFunctional = function SvgCampaignFunctional(props) {
|
|
|
934
934
|
opacity: 0.3,
|
|
935
935
|
d: "M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z",
|
|
936
936
|
fill: "#003A57"
|
|
937
|
-
}))), _path$
|
|
937
|
+
}))), _path$k || (_path$k = /*#__PURE__*/React__namespace.createElement("path", {
|
|
938
938
|
d: "M17.9983 7.16705C17.5188 6.58566 17.1422 6.73039 17.1422 6.73039C17.1422 6.73039 16.406 7.02453 16.0401 7.16303C15.6742 7.30153 15.2408 7.17357 15.2408 7.17357L14.7579 6.8851C14.7579 6.8851 14.4296 6.56554 14.3656 6.18067C14.3123 5.78958 14.1888 5.00269 14.1888 5.00269C14.1888 5.00269 14.1356 4.61159 13.3938 4.47257C12.652 4.33356 12.4678 4.68715 12.4678 4.68715C12.4678 4.68715 12.0932 5.38344 11.9091 5.73703C11.7249 6.09062 11.3114 6.27118 11.3114 6.27118L10.7639 6.36908C10.7639 6.36908 10.3144 6.33771 10.0176 6.07271L9.12712 5.27769C9.12712 5.27769 8.8303 5.01268 8.18313 5.38632C7.53595 5.75997 7.61705 6.14953 7.61705 6.14953L7.86033 7.3182C7.94143 7.70776 7.74381 8.11275 7.74381 8.11275L7.38528 8.53794C7.38528 8.53794 7.02217 8.80577 6.62387 8.78845C6.22557 8.77114 5.43527 8.7474 5.43527 8.7474C5.43527 8.7474 5.03697 8.73009 4.78646 9.44201C4.53595 10.1539 4.84804 10.3956 4.84804 10.3956C4.84804 10.3956 5.46774 10.896 5.77983 11.1376C6.09192 11.3793 6.19373 11.8296 6.19373 11.8296L6.20207 12.3921C6.20207 12.3921 6.09618 12.8314 5.79331 13.079C5.49043 13.3266 4.86759 13.8171 4.86759 13.8171C4.86759 13.8171 4.56471 14.0647 4.81769 14.7769C5.08144 15.4828 5.46713 15.4783 5.46713 15.4783C5.46713 15.4783 6.26012 15.4569 6.64582 15.4524C7.03152 15.4479 7.40116 15.7145 7.40116 15.7145L7.76458 16.1447C7.76458 16.1447 7.96976 16.5499 7.89441 16.9425C7.81907 17.3351 7.66208 18.1094 7.66208 18.1094C7.66208 18.1094 7.58674 18.502 8.23785 18.8824C8.88895 19.2629 9.18553 19.0044 9.18553 19.0044C9.18553 19.0044 9.7724 18.4765 10.069 18.218C10.3655 17.9595 10.8115 17.9347 10.8115 17.9347L11.3609 18.0394C11.3609 18.0394 11.77 18.225 11.9608 18.5803C12.1516 18.9356 12.5268 19.6354 12.5268 19.6354C12.5268 19.6354 12.7176 19.9907 13.4583 19.8539C14.1946 19.7343 14.2529 19.337 14.2529 19.337C14.2529 19.337 14.3586 18.5487 14.4232 18.1623C14.4814 17.765 14.8086 17.4598 14.8086 17.4598L15.2939 17.1796C15.2939 17.1796 15.7281 17.0598 16.095 17.1971C16.4682 17.3453 17.1975 17.637 17.1975 17.637C17.1975 17.637 17.5707 17.7851 18.0424 17.2073C18.5142 16.6295 18.3189 16.2913 18.3189 16.2913C18.3189 16.2913 17.9006 15.6164 17.6882 15.2736C17.4759 14.9307 17.5197 14.4836 17.5197 14.4836L17.7038 13.9555C17.7038 13.9555 17.9482 13.5816 18.3203 13.454C18.6925 13.3264 19.4431 13.0822 19.4431 13.0822C19.4431 13.0822 19.8153 12.9546 19.8113 12.2005C19.8074 11.4464 19.4297 11.3153 19.4297 11.3153C19.4297 11.3153 18.6807 11.0641 18.303 10.9331C17.9253 10.802 17.677 10.4217 17.677 10.4217L17.4861 9.8919C17.4861 9.8919 17.4293 9.4447 17.6368 9.1067C17.8443 8.7687 18.2486 8.09891 18.2486 8.09891C18.2486 8.09891 18.4778 7.74844 17.9983 7.16707L17.9983 7.16705ZM9.33902 8.38466L10.6176 10.5992C10.0433 11.149 9.82793 11.9715 10.0567 12.7413L7.86713 14.0054C6.98868 12.0106 7.60355 9.66286 9.33905 8.38457L9.33902 8.38466ZM13.9748 16.414C11.9998 17.2778 9.65918 16.6363 8.37099 14.8783L10.5605 13.6141C11.1128 14.1971 11.9329 14.4219 12.6961 14.1994L13.9748 16.414ZM12.6552 13.132C12.1159 13.4434 11.4325 13.2561 11.1176 12.7107C10.8027 12.1652 10.9822 11.4797 11.5215 11.1684C12.0608 10.857 12.7441 11.0443 13.0591 11.5897C13.374 12.1352 13.1945 12.8207 12.6552 13.132ZM14.8376 15.9158L13.5591 13.7012C14.1333 13.1515 14.3487 12.3289 14.12 11.5591L16.3095 10.295C17.188 12.2898 16.5731 14.6376 14.8376 15.9159L14.8376 15.9158ZM13.6161 10.6863C13.0638 10.1034 12.2437 9.87862 11.4805 10.1011L10.2019 7.88652C12.1769 7.02266 14.5112 7.65314 15.8057 9.42223L13.6161 10.6863Z",
|
|
939
939
|
fill: "#003A57"
|
|
940
940
|
})));
|
|
941
941
|
};
|
|
942
942
|
|
|
943
|
-
var _g$1, _path$
|
|
943
|
+
var _g$1, _path$j, _path2, _path3, _path4, _path5, _path6, _path7, _path8, _path9, _path10, _path11;
|
|
944
944
|
|
|
945
|
-
function _extends$
|
|
945
|
+
function _extends$l() { _extends$l = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$l.apply(this, arguments); }
|
|
946
946
|
|
|
947
947
|
var SvgCampaignExperiential = function SvgCampaignExperiential(props) {
|
|
948
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
948
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$l({
|
|
949
949
|
width: 24,
|
|
950
950
|
height: 24,
|
|
951
951
|
viewBox: "0 0 24 24",
|
|
@@ -957,7 +957,7 @@ var SvgCampaignExperiential = function SvgCampaignExperiential(props) {
|
|
|
957
957
|
opacity: 0.3,
|
|
958
958
|
d: "M12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24Z",
|
|
959
959
|
fill: "#003A57"
|
|
960
|
-
}))), _path$
|
|
960
|
+
}))), _path$j || (_path$j = /*#__PURE__*/React__namespace.createElement("path", {
|
|
961
961
|
d: "M12.4871 3.1964C8.68009 3.1964 5.59901 6.27748 5.59901 10.0844C5.59901 10.2596 5.59901 10.4347 5.62445 10.5854C5.29863 11.1861 4.82313 12.0129 4.24684 12.5138C3.82123 12.8896 3.92102 13.2907 3.97091 13.4404C4.09615 13.7662 4.44641 14.0411 5.02271 14.2417C5.22328 14.3171 5.44831 14.367 5.64889 14.4169L5.67433 16.8463C5.67433 17.7983 6.47565 18.625 7.4531 18.625L8.9305 18.1495L9.08117 19.0262C9.18097 19.6025 9.68191 20.0281 10.2837 20.0281C10.359 20.0281 10.4343 20.0281 10.5087 20.0026L15.1425 19.1769C15.8185 19.0516 16.2441 18.4254 16.1444 17.7494L15.8185 16.1213C17.9975 14.9188 19.375 12.5891 19.375 10.0843C19.375 6.30267 16.2696 3.19629 12.487 3.19629L12.4871 3.1964Z",
|
|
962
962
|
fill: "#003A57",
|
|
963
963
|
stroke: "#003A57"
|
|
@@ -1052,8 +1052,8 @@ function useWindowSize() {
|
|
|
1052
1052
|
return size;
|
|
1053
1053
|
}
|
|
1054
1054
|
|
|
1055
|
-
var StyledSpan = styled__default["default"](Span)(templateObject_1$
|
|
1056
|
-
var StyledTag = styled__default["default"](Tag)(templateObject_2$
|
|
1055
|
+
var StyledSpan = styled__default["default"](Span)(templateObject_1$O || (templateObject_1$O = __makeTemplateObject([""], [""])));
|
|
1056
|
+
var StyledTag = styled__default["default"](Tag)(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n background-color: transparent;\n pointer-events: none;\n font-weight: ", ";\n ", "\n svg {\n margin-right: ", " !important;\n }\n\n ", " {\n font-weight: ", ";\n margin-left: ", ";\n color: ", ";\n }\n"], ["\n background-color: transparent;\n pointer-events: none;\n font-weight: ", ";\n ", "\n svg {\n margin-right: ", " !important;\n }\n\n ", " {\n font-weight: ", ";\n margin-left: ", ";\n color: ", ";\n }\n"])), function (_a) {
|
|
1057
1057
|
var theme = _a.theme;
|
|
1058
1058
|
return theme.fontWeights.regular;
|
|
1059
1059
|
}, function (_a) {
|
|
@@ -1090,7 +1090,7 @@ var Counter = function (props) {
|
|
|
1090
1090
|
return (jsxRuntime.jsxs(StyledTag, __assign({}, props, { size: props.size || "large" }, { children: [jsxRuntime.jsx(StyledTag.Avatar, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [status === "completed" && jsxRuntime.jsx(SvgCampaignCompleted, {}), status === "progress" && jsxRuntime.jsx(SvgCampaignProgress, {}), status === "incoming" && jsxRuntime.jsx(SvgCampaignIncoming, {}), status === "functional" && jsxRuntime.jsx(SvgCampaignFunctional, {}), status === "experiential" && jsxRuntime.jsx(SvgCampaignExperiential, {})] }) }), width > parseInt(theme.breakpoints.sm) && props.children, counter !== undefined && jsxRuntime.jsx(StyledSpan, { children: counter.toString() })] })));
|
|
1091
1091
|
};
|
|
1092
1092
|
Counter.Avatar = StyledTag.Avatar;
|
|
1093
|
-
var templateObject_1$
|
|
1093
|
+
var templateObject_1$O, templateObject_2$j;
|
|
1094
1094
|
|
|
1095
1095
|
/**
|
|
1096
1096
|
* A Drawer is a container for supplementary content that is anchored to the edge of a page.
|
|
@@ -1106,20 +1106,20 @@ Drawer.Footer = reactModals.DrawerModal.Footer;
|
|
|
1106
1106
|
Drawer.FooterItem = reactModals.DrawerModal.FooterItem;
|
|
1107
1107
|
Drawer.Close = reactModals.DrawerModal.Close;
|
|
1108
1108
|
|
|
1109
|
-
var Field$1 = styled__default["default"](reactDropdowns.Field)(templateObject_1$
|
|
1110
|
-
var templateObject_1$
|
|
1109
|
+
var Field$1 = styled__default["default"](reactDropdowns.Field)(templateObject_1$N || (templateObject_1$N = __makeTemplateObject([""], [""])));
|
|
1110
|
+
var templateObject_1$N;
|
|
1111
1111
|
|
|
1112
1112
|
var index$1 = /*#__PURE__*/Object.freeze({
|
|
1113
1113
|
__proto__: null,
|
|
1114
1114
|
Field: Field$1
|
|
1115
1115
|
});
|
|
1116
1116
|
|
|
1117
|
-
var UgItem = styled__default["default"](reactDropdowns.Item)(templateObject_1$
|
|
1117
|
+
var UgItem = styled__default["default"](reactDropdowns.Item)(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n &[disabled] svg {\n opacity: 0.5;\n }\n &:hover {\n background-color: ", ";\n }\n"], ["\n &[disabled] svg {\n opacity: 0.5;\n }\n &:hover {\n background-color: ", ";\n }\n"])), function (_a) {
|
|
1118
1118
|
var theme = _a.theme;
|
|
1119
1119
|
return theme.palette.blue[100];
|
|
1120
1120
|
});
|
|
1121
1121
|
var Item = function (props) { return jsxRuntime.jsx(UgItem, __assign({}, props)); };
|
|
1122
|
-
var templateObject_1$
|
|
1122
|
+
var templateObject_1$M;
|
|
1123
1123
|
|
|
1124
1124
|
/**
|
|
1125
1125
|
* A Menu is a wrapper for items elements
|
|
@@ -1143,7 +1143,7 @@ var MediaItem = function (props) { return jsxRuntime.jsx(reactDropdowns.MediaIte
|
|
|
1143
1143
|
*/
|
|
1144
1144
|
var Multiselect = function (props) { return (jsxRuntime.jsx(reactDropdowns.Multiselect, __assign({}, props))); };
|
|
1145
1145
|
|
|
1146
|
-
var UgSelect = styled__default["default"](reactDropdowns.Select)(templateObject_1$
|
|
1146
|
+
var UgSelect = styled__default["default"](reactDropdowns.Select)(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
1147
1147
|
return props.isPrimary &&
|
|
1148
1148
|
"\n background-color: ".concat(props.theme.palette.blue[600], ";\n color: white;\n & svg[data-garden-id=\"forms.media_figure\"] {\n color: white;\n }\n ");
|
|
1149
1149
|
});
|
|
@@ -1160,7 +1160,7 @@ var UgSelect = styled__default["default"](reactDropdowns.Select)(templateObject_
|
|
|
1160
1160
|
var Select = function (props) { return jsxRuntime.jsx(UgSelect, __assign({}, props)); };
|
|
1161
1161
|
var Dropdown = function (props) { return (jsxRuntime.jsx(reactDropdowns.Dropdown, __assign({}, props))); };
|
|
1162
1162
|
var Message = function (props) { return jsxRuntime.jsx(reactDropdowns.Message, __assign({}, props)); };
|
|
1163
|
-
var templateObject_1$
|
|
1163
|
+
var templateObject_1$L;
|
|
1164
1164
|
|
|
1165
1165
|
/**
|
|
1166
1166
|
* Autocomplete is an input field that filters results as users type. This helps users find something quickly in a large list of options.
|
|
@@ -1175,7 +1175,7 @@ var Autocomplete = function (props) { return jsxRuntime.jsx(reactDropdowns.Autoc
|
|
|
1175
1175
|
|
|
1176
1176
|
var MenuHeaderItem = function (props) { return (jsxRuntime.jsx(reactDropdowns.HeaderItem, __assign({}, props))); };
|
|
1177
1177
|
|
|
1178
|
-
var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_1$
|
|
1178
|
+
var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_1$K || (templateObject_1$K = __makeTemplateObject([""], [""])));
|
|
1179
1179
|
/**
|
|
1180
1180
|
* A Checkbox lets users select and unselect options from a list.
|
|
1181
1181
|
* <hr>
|
|
@@ -1187,17 +1187,17 @@ var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_
|
|
|
1187
1187
|
* - To let users activate an option that takes effect immediately, use a Toggle instead
|
|
1188
1188
|
**/
|
|
1189
1189
|
var Checkbox = function (props) { return jsxRuntime.jsx(UgCheckbox, __assign({}, props)); };
|
|
1190
|
-
var templateObject_1$
|
|
1190
|
+
var templateObject_1$K;
|
|
1191
1191
|
|
|
1192
|
-
var StyledCard$1 = styled__default["default"](Card)(templateObject_1$
|
|
1192
|
+
var StyledCard$1 = styled__default["default"](Card)(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n ", "\n text-align: center;\n justify-content: center;\n align-items: center;\n\n &.card-active {\n border-color: ", ";\n }\n"], ["\n ", "\n text-align: center;\n justify-content: center;\n align-items: center;\n\n &.card-active {\n border-color: ", ";\n }\n"])), cardStyle, function (_a) {
|
|
1193
1193
|
var theme = _a.theme;
|
|
1194
1194
|
return theme.palette.blue[300];
|
|
1195
1195
|
});
|
|
1196
|
-
var IconWrapper$1 = styled__default["default"].div(templateObject_2$
|
|
1196
|
+
var IconWrapper$1 = styled__default["default"].div(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n margin: ", "px auto;\n"], ["\n margin: ", "px auto;\n"])), function (_a) {
|
|
1197
1197
|
var theme = _a.theme;
|
|
1198
1198
|
return theme.space.base;
|
|
1199
1199
|
});
|
|
1200
|
-
var LabelWrapper = styled__default["default"](Label)(templateObject_3$
|
|
1200
|
+
var LabelWrapper = styled__default["default"](Label)(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n margin: ", "px auto;\n color: ", ";\n user-select: none;\n\n &:focus {\n outline: 0;\n }\n"], ["\n margin: ", "px auto;\n color: ", ";\n user-select: none;\n\n &:focus {\n outline: 0;\n }\n"])), function (_a) {
|
|
1201
1201
|
var theme = _a.theme;
|
|
1202
1202
|
return theme.space.base;
|
|
1203
1203
|
}, function (_a) {
|
|
@@ -1216,14 +1216,14 @@ var CheckboxCard = function (props) {
|
|
|
1216
1216
|
};
|
|
1217
1217
|
return (jsxRuntime.jsxs(StyledCard$1, __assign({}, props.card, props, props && !props.disabled && { onClick: handleToggle }, { className: checked ? "card-active" : "" }, { children: [jsxRuntime.jsx(IconWrapper$1, { children: (props.iconActive && checked) ? props.iconActive : props.icon }), jsxRuntime.jsx(LabelWrapper, { children: props.label }), jsxRuntime.jsx(Checkbox, __assign({}, props, { checked: checked, value: checked ? 1 : 0, onClick: function (e) { return e.stopPropagation(); } }, { children: jsxRuntime.jsx(StyledLabel, __assign({ hidden: true }, { children: props.label })) }))] })));
|
|
1218
1218
|
};
|
|
1219
|
-
var templateObject_1$
|
|
1219
|
+
var templateObject_1$J, templateObject_2$i, templateObject_3$c, templateObject_4$8;
|
|
1220
1220
|
|
|
1221
|
-
var UgField = styled__default["default"](reactForms.Field)(templateObject_1$
|
|
1221
|
+
var UgField = styled__default["default"](reactForms.Field)(templateObject_1$I || (templateObject_1$I = __makeTemplateObject([""], [""])));
|
|
1222
1222
|
/**
|
|
1223
1223
|
* A Field is a wrapper for input elements
|
|
1224
1224
|
**/
|
|
1225
1225
|
var Field = function (props) { return jsxRuntime.jsx(UgField, __assign({}, props)); };
|
|
1226
|
-
var templateObject_1$
|
|
1226
|
+
var templateObject_1$I;
|
|
1227
1227
|
|
|
1228
1228
|
var index = /*#__PURE__*/Object.freeze({
|
|
1229
1229
|
__proto__: null,
|
|
@@ -1231,8 +1231,8 @@ var index = /*#__PURE__*/Object.freeze({
|
|
|
1231
1231
|
Hint: reactForms.Hint
|
|
1232
1232
|
});
|
|
1233
1233
|
|
|
1234
|
-
var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$
|
|
1235
|
-
var Hint = styled__default["default"](reactForms.Hint)(templateObject_2$
|
|
1234
|
+
var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$H || (templateObject_1$H = __makeTemplateObject([""], [""])));
|
|
1235
|
+
var Hint = styled__default["default"](reactForms.Hint)(templateObject_2$h || (templateObject_2$h = __makeTemplateObject([""], [""])));
|
|
1236
1236
|
/**
|
|
1237
1237
|
* An Input lets users enter text into a field.
|
|
1238
1238
|
* <hr>
|
|
@@ -1241,9 +1241,9 @@ var Hint = styled__default["default"](reactForms.Hint)(templateObject_2$g || (te
|
|
|
1241
1241
|
* - To enter multiline text, use a Textarea
|
|
1242
1242
|
**/
|
|
1243
1243
|
var Input = function (props) { return jsxRuntime.jsx(UgInput, __assign({}, props)); };
|
|
1244
|
-
var templateObject_1$
|
|
1244
|
+
var templateObject_1$H, templateObject_2$h;
|
|
1245
1245
|
|
|
1246
|
-
var UgMediaInput = styled__default["default"](reactForms.MediaInput)(templateObject_1$
|
|
1246
|
+
var UgMediaInput = styled__default["default"](reactForms.MediaInput)(templateObject_1$G || (templateObject_1$G = __makeTemplateObject([""], [""])));
|
|
1247
1247
|
/**
|
|
1248
1248
|
* Media elements add even more context to an input.
|
|
1249
1249
|
* <hr>
|
|
@@ -1252,9 +1252,9 @@ var UgMediaInput = styled__default["default"](reactForms.MediaInput)(templateObj
|
|
|
1252
1252
|
* - To enter multiline text, use a Textarea
|
|
1253
1253
|
**/
|
|
1254
1254
|
var MediaInput = function (props) { return jsxRuntime.jsx(UgMediaInput, __assign({}, props)); };
|
|
1255
|
-
var templateObject_1$
|
|
1255
|
+
var templateObject_1$G;
|
|
1256
1256
|
|
|
1257
|
-
var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$
|
|
1257
|
+
var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$F || (templateObject_1$F = __makeTemplateObject([""], [""])));
|
|
1258
1258
|
/**
|
|
1259
1259
|
* Radio buttons let users choose a single option among two or more mutually exclusive options.
|
|
1260
1260
|
* <hr>
|
|
@@ -1266,35 +1266,35 @@ var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$E ||
|
|
|
1266
1266
|
* - To select from a long list of options, use Select instead
|
|
1267
1267
|
**/
|
|
1268
1268
|
var Radio = function (props) { return jsxRuntime.jsx(UgRadio, __assign({}, props)); };
|
|
1269
|
-
var templateObject_1$
|
|
1269
|
+
var templateObject_1$F;
|
|
1270
1270
|
|
|
1271
|
-
var _path$
|
|
1271
|
+
var _path$i;
|
|
1272
1272
|
|
|
1273
|
-
function _extends$
|
|
1273
|
+
function _extends$k() { _extends$k = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$k.apply(this, arguments); }
|
|
1274
1274
|
|
|
1275
1275
|
var SvgCheckLg = function SvgCheckLg(props) {
|
|
1276
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1276
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$k({
|
|
1277
1277
|
width: 16,
|
|
1278
1278
|
height: 16,
|
|
1279
1279
|
viewBox: "0 0 16 16",
|
|
1280
1280
|
fill: "#68737D",
|
|
1281
1281
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1282
|
-
}, props), _path$
|
|
1282
|
+
}, props), _path$i || (_path$i = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1283
1283
|
fillRule: "evenodd",
|
|
1284
1284
|
clipRule: "evenodd",
|
|
1285
1285
|
d: "M14.6464 2.64645C14.8417 2.45118 15.1583 2.45118 15.3536 2.64645C15.5488 2.84171 15.5488 3.15829 15.3536 3.35355L5.35355 13.3536C5.15829 13.5488 4.84171 13.5488 4.64645 13.3536L0.646447 9.35355C0.451184 9.15829 0.451184 8.84171 0.646447 8.64645C0.841709 8.45118 1.15829 8.45118 1.35355 8.64645L5 12.2929L14.6464 2.64645Z"
|
|
1286
1286
|
})));
|
|
1287
1287
|
};
|
|
1288
1288
|
|
|
1289
|
-
var StyledCard = styled__default["default"](Card)(templateObject_1$
|
|
1289
|
+
var StyledCard = styled__default["default"](Card)(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n ", "\n text-align: center;\n justify-content: center;\n align-items: center;\n\n &.card-active {\n border-color: ", ";\n }\n"], ["\n ", "\n text-align: center;\n justify-content: center;\n align-items: center;\n\n &.card-active {\n border-color: ", ";\n }\n"])), cardStyle, function (_a) {
|
|
1290
1290
|
var theme = _a.theme;
|
|
1291
1291
|
return theme.palette.blue[300];
|
|
1292
1292
|
});
|
|
1293
|
-
var IconWrapper = styled__default["default"].div(templateObject_2$
|
|
1293
|
+
var IconWrapper = styled__default["default"].div(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n margin: ", "px auto;\n"], ["\n margin: ", "px auto;\n"])), function (_a) {
|
|
1294
1294
|
var theme = _a.theme;
|
|
1295
1295
|
return theme.space.base;
|
|
1296
1296
|
});
|
|
1297
|
-
var StyledText = styled__default["default"](reactTypography.LG)(templateObject_3$
|
|
1297
|
+
var StyledText = styled__default["default"](reactTypography.LG)(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n margin: ", "px auto;\n color: ", ";\n font-weight: ", ";\n color: ", ";\n user-select: none;\n\n &:focus {\n outline: 0;\n }\n"], ["\n margin: ", "px auto;\n color: ", ";\n font-weight: ", ";\n color: ", ";\n user-select: none;\n\n &:focus {\n outline: 0;\n }\n"])), function (_a) {
|
|
1298
1298
|
var theme = _a.theme;
|
|
1299
1299
|
return theme.space.base;
|
|
1300
1300
|
}, function (_a) {
|
|
@@ -1335,9 +1335,9 @@ var RadioCard = function (_a) {
|
|
|
1335
1335
|
var card = _a.card, icon = _a.icon, iconActive = _a.iconActive, props = __rest(_a, ["card", "icon", "iconActive"]);
|
|
1336
1336
|
return (jsxRuntime.jsxs(StyledCard, __assign({}, card, props, { className: props.checked ? "card-active" : "", onClick: function () { props.onChecked && props.onChecked(props.value); } }, { children: [jsxRuntime.jsx(Circle, __assign({ checked: (_b = props.checked) !== null && _b !== void 0 ? _b : false }, { children: jsxRuntime.jsx(SvgCheckLg, { fill: "white" }) })), jsxRuntime.jsx(IconWrapper, { children: (iconActive && props.checked) ? iconActive : icon }), jsxRuntime.jsx("input", { hidden: true, type: "radio", value: props.value, name: props.name, checked: props.checked }), jsxRuntime.jsx(StyledDivider, {}), jsxRuntime.jsx(StyledText, { children: props.label })] })));
|
|
1337
1337
|
};
|
|
1338
|
-
var templateObject_1$
|
|
1338
|
+
var templateObject_1$E, templateObject_2$g, templateObject_3$b, templateObject_4$7, templateObject_5$3;
|
|
1339
1339
|
|
|
1340
|
-
var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_1$
|
|
1340
|
+
var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_1$D || (templateObject_1$D = __makeTemplateObject([""], [""])));
|
|
1341
1341
|
/**
|
|
1342
1342
|
* A Textarea is a form control for multi-line text.
|
|
1343
1343
|
* <hr>
|
|
@@ -1345,9 +1345,9 @@ var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_
|
|
|
1345
1345
|
* - To enter multi-line text
|
|
1346
1346
|
**/
|
|
1347
1347
|
var Textarea = function (props) { return jsxRuntime.jsx(UgTextarea, __assign({}, props)); };
|
|
1348
|
-
var templateObject_1$
|
|
1348
|
+
var templateObject_1$D;
|
|
1349
1349
|
|
|
1350
|
-
var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$
|
|
1350
|
+
var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$C || (templateObject_1$C = __makeTemplateObject([""], [""])));
|
|
1351
1351
|
/**
|
|
1352
1352
|
* A Toggle lets users turn something on and off like a light switch. Unlike a Checkbox, which is used for selection, a Toggle is used for activation.
|
|
1353
1353
|
* <hr>
|
|
@@ -1358,7 +1358,7 @@ var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$B
|
|
|
1358
1358
|
* - To let users select from a list of settings, use Checkboxes instead
|
|
1359
1359
|
**/
|
|
1360
1360
|
var Toggle = function (props) { return jsxRuntime.jsx(UgToggle, __assign({}, props)); };
|
|
1361
|
-
var templateObject_1$
|
|
1361
|
+
var templateObject_1$C;
|
|
1362
1362
|
|
|
1363
1363
|
var Col = function (props) { return jsxRuntime.jsx(reactGrid.Col, __assign({}, props)); };
|
|
1364
1364
|
|
|
@@ -1372,58 +1372,58 @@ var Row$1 = function (props) { return jsxRuntime.jsx(reactGrid.Row, __assign({},
|
|
|
1372
1372
|
*/
|
|
1373
1373
|
var Grid = function (props) { return jsxRuntime.jsx(reactGrid.Grid, __assign({}, props)); };
|
|
1374
1374
|
|
|
1375
|
-
var _path$
|
|
1375
|
+
var _path$h;
|
|
1376
1376
|
|
|
1377
|
-
function _extends$
|
|
1377
|
+
function _extends$j() { _extends$j = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$j.apply(this, arguments); }
|
|
1378
1378
|
|
|
1379
1379
|
var SvgUgSquare = function SvgUgSquare(props) {
|
|
1380
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1380
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$j({
|
|
1381
1381
|
width: 24,
|
|
1382
1382
|
height: 24,
|
|
1383
1383
|
viewBox: "0 0 24 24",
|
|
1384
1384
|
fill: "none",
|
|
1385
1385
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1386
|
-
}, props), _path$
|
|
1386
|
+
}, props), _path$h || (_path$h = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1387
1387
|
d: "M19 3H5C3.9 3 3 3.9 3 5V19C3 20.1 3.9 21 5 21H19C20.1 21 21 20.1 21 19V5C21 3.9 20.1 3 19 3ZM18 19H6C5.45 19 5 18.55 5 18V6C5 5.45 5.45 5 6 5H18C18.55 5 19 5.45 19 6V18C19 18.55 18.55 19 18 19Z",
|
|
1388
1388
|
fill: "#E80C7A"
|
|
1389
1389
|
})));
|
|
1390
1390
|
};
|
|
1391
1391
|
|
|
1392
|
-
var _path$
|
|
1392
|
+
var _path$g;
|
|
1393
1393
|
|
|
1394
|
-
function _extends$
|
|
1394
|
+
function _extends$i() { _extends$i = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$i.apply(this, arguments); }
|
|
1395
1395
|
|
|
1396
1396
|
var SvgUgCircle = function SvgUgCircle(props) {
|
|
1397
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1397
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$i({
|
|
1398
1398
|
width: 24,
|
|
1399
1399
|
height: 24,
|
|
1400
1400
|
viewBox: "0 0 24 24",
|
|
1401
1401
|
fill: "none",
|
|
1402
1402
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1403
|
-
}, props), _path$
|
|
1403
|
+
}, props), _path$g || (_path$g = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1404
1404
|
d: "M12 2C6.47 2 2 6.47 2 12C2 17.53 6.47 22 12 22C17.53 22 22 17.53 22 12C22 6.47 17.53 2 12 2ZM12 20C7.58 20 4 16.42 4 12C4 7.58 7.58 4 12 4C16.42 4 20 7.58 20 12C20 16.42 16.42 20 12 20Z",
|
|
1405
1405
|
fill: "#FFCD1A"
|
|
1406
1406
|
})));
|
|
1407
1407
|
};
|
|
1408
1408
|
|
|
1409
|
-
var _path$
|
|
1409
|
+
var _path$f;
|
|
1410
1410
|
|
|
1411
|
-
function _extends$
|
|
1411
|
+
function _extends$h() { _extends$h = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$h.apply(this, arguments); }
|
|
1412
1412
|
|
|
1413
1413
|
var SvgUgTriangle = function SvgUgTriangle(props) {
|
|
1414
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1414
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$h({
|
|
1415
1415
|
width: 24,
|
|
1416
1416
|
height: 24,
|
|
1417
1417
|
viewBox: "0 0 24 24",
|
|
1418
1418
|
fill: "none",
|
|
1419
1419
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1420
|
-
}, props), _path$
|
|
1420
|
+
}, props), _path$f || (_path$f = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1421
1421
|
d: "M11.9993 7.32625L18.3893 17.5563H5.60929L11.9993 7.32625ZM11.1493 4.91625L2.94929 18.0262C2.53929 18.6962 3.01929 19.5563 3.79929 19.5563H20.1993C20.9893 19.5563 21.4593 18.6962 21.0493 18.0262L12.8493 4.91625C12.4593 4.28625 11.5393 4.28625 11.1493 4.91625Z",
|
|
1422
1422
|
fill: "#7B0DFF"
|
|
1423
1423
|
})));
|
|
1424
1424
|
};
|
|
1425
1425
|
|
|
1426
|
-
var StyledUgIcon$1 = styled__default["default"].span(templateObject_1$
|
|
1426
|
+
var StyledUgIcon$1 = styled__default["default"].span(templateObject_1$B || (templateObject_1$B = __makeTemplateObject([""], [""])));
|
|
1427
1427
|
var Icon = function (props) {
|
|
1428
1428
|
var children = function (type, size) {
|
|
1429
1429
|
if (size === void 0) { size = 24; }
|
|
@@ -1436,9 +1436,9 @@ var Icon = function (props) {
|
|
|
1436
1436
|
};
|
|
1437
1437
|
return (jsxRuntime.jsx(StyledUgIcon$1, { children: children(props.type, props.size) }));
|
|
1438
1438
|
};
|
|
1439
|
-
var templateObject_1$
|
|
1439
|
+
var templateObject_1$B;
|
|
1440
1440
|
|
|
1441
|
-
var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObject_1$
|
|
1441
|
+
var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObject_1$A || (templateObject_1$A = __makeTemplateObject([""], [""])));
|
|
1442
1442
|
/**
|
|
1443
1443
|
* A Progress loader communicates progress when downloading or uploading content.
|
|
1444
1444
|
* <hr>
|
|
@@ -1450,9 +1450,9 @@ var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObjec
|
|
|
1450
1450
|
- When loading page content, use a Skeleton loader instead
|
|
1451
1451
|
*/
|
|
1452
1452
|
var Progress = function (props) { return jsxRuntime.jsx(UgProgress, __assign({}, props)); };
|
|
1453
|
-
var templateObject_1$
|
|
1453
|
+
var templateObject_1$A;
|
|
1454
1454
|
|
|
1455
|
-
var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_1$
|
|
1455
|
+
var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_1$z || (templateObject_1$z = __makeTemplateObject([""], [""])));
|
|
1456
1456
|
/**
|
|
1457
1457
|
* Breadcrumbs mark and communicate a user’s location in the product.
|
|
1458
1458
|
* <hr>
|
|
@@ -1461,9 +1461,9 @@ var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_
|
|
|
1461
1461
|
- To provide a quick way to navigate to ancestor pages
|
|
1462
1462
|
*/
|
|
1463
1463
|
var Spinner = function (props) { return jsxRuntime.jsx(UgSpinner, __assign({}, props)); };
|
|
1464
|
-
var templateObject_1$
|
|
1464
|
+
var templateObject_1$z;
|
|
1465
1465
|
|
|
1466
|
-
var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$
|
|
1466
|
+
var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
|
|
1467
1467
|
var theme = _a.theme;
|
|
1468
1468
|
return theme.palette.white;
|
|
1469
1469
|
});
|
|
@@ -1471,47 +1471,47 @@ var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$x ||
|
|
|
1471
1471
|
* A Body defines the main content of an HTML document which displays on the browser
|
|
1472
1472
|
*/
|
|
1473
1473
|
var Body$1 = function (props) { return jsxRuntime.jsx(UgBody, __assign({}, props)); };
|
|
1474
|
-
var templateObject_1$
|
|
1474
|
+
var templateObject_1$y;
|
|
1475
1475
|
|
|
1476
1476
|
/**
|
|
1477
1477
|
* A Content defines the main content of an HTML document which displays on the browser
|
|
1478
1478
|
*/
|
|
1479
1479
|
var Content = function (props) { return jsxRuntime.jsx(reactChrome.Content, __assign({}, props)); };
|
|
1480
1480
|
|
|
1481
|
-
var _path$
|
|
1481
|
+
var _path$e;
|
|
1482
1482
|
|
|
1483
|
-
function _extends$
|
|
1483
|
+
function _extends$g() { _extends$g = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$g.apply(this, arguments); }
|
|
1484
1484
|
|
|
1485
1485
|
var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
|
|
1486
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1486
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$g({
|
|
1487
1487
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1488
1488
|
width: 16,
|
|
1489
1489
|
height: 16,
|
|
1490
1490
|
focusable: "false",
|
|
1491
1491
|
viewBox: "0 0 16 16"
|
|
1492
|
-
}, props), _path$
|
|
1492
|
+
}, props), _path$e || (_path$e = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1493
1493
|
fill: "currentColor",
|
|
1494
1494
|
d: "M12.688 5.61a.5.5 0 01.69.718l-.066.062-5 4a.5.5 0 01-.542.054l-.082-.054-5-4a.5.5 0 01.55-.83l.074.05L8 9.359l4.688-3.75z"
|
|
1495
1495
|
})));
|
|
1496
1496
|
};
|
|
1497
1497
|
|
|
1498
|
-
var UgHeaderItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$
|
|
1498
|
+
var UgHeaderItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n ", ";\n font-family: ", ";\n"], ["\n ", ";\n font-family: ", ";\n"])), function (props) { return props.hasLogo && "border-right: none"; }, function (_a) {
|
|
1499
1499
|
var theme = _a.theme;
|
|
1500
1500
|
return theme.fonts.system;
|
|
1501
1501
|
});
|
|
1502
|
-
styled__default["default"](reactChrome.HeaderItemWrapper)(templateObject_2$
|
|
1502
|
+
styled__default["default"](reactChrome.HeaderItemWrapper)(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n font-family: ", ";\n"], ["\n font-family: ", ";\n"])), function (_a) {
|
|
1503
1503
|
var theme = _a.theme;
|
|
1504
1504
|
return theme.fonts.system;
|
|
1505
1505
|
});
|
|
1506
1506
|
var HeaderItem = function (props) { return jsxRuntime.jsx(UgHeaderItem, __assign({}, props)); };
|
|
1507
|
-
var templateObject_1$
|
|
1507
|
+
var templateObject_1$x, templateObject_2$f;
|
|
1508
1508
|
|
|
1509
|
-
var UgHeaderItemText = styled__default["default"](reactChrome.HeaderItemText)(templateObject_1$
|
|
1509
|
+
var UgHeaderItemText = styled__default["default"](reactChrome.HeaderItemText)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n font-family: ", ";\n"], ["\n font-family: ", ";\n"])), function (_a) {
|
|
1510
1510
|
var theme = _a.theme;
|
|
1511
1511
|
return theme.fonts.system;
|
|
1512
1512
|
});
|
|
1513
1513
|
var HeaderItemText = function (props) { return jsxRuntime.jsx(UgHeaderItemText, __assign({}, props)); };
|
|
1514
|
-
var templateObject_1$
|
|
1514
|
+
var templateObject_1$w;
|
|
1515
1515
|
|
|
1516
1516
|
var HeaderItemIcon = function (props) { return (jsxRuntime.jsx(reactChrome.HeaderItemIcon, __assign({}, props))); };
|
|
1517
1517
|
|
|
@@ -1541,18 +1541,18 @@ var Logo = function (props) {
|
|
|
1541
1541
|
}[props.type] })));
|
|
1542
1542
|
};
|
|
1543
1543
|
|
|
1544
|
-
var _path$
|
|
1544
|
+
var _path$d;
|
|
1545
1545
|
|
|
1546
|
-
function _extends$
|
|
1546
|
+
function _extends$f() { _extends$f = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$f.apply(this, arguments); }
|
|
1547
1547
|
|
|
1548
1548
|
var SvgMenuStroke = function SvgMenuStroke(props) {
|
|
1549
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1549
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$f({
|
|
1550
1550
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1551
1551
|
width: 16,
|
|
1552
1552
|
height: 16,
|
|
1553
1553
|
focusable: "false",
|
|
1554
1554
|
viewBox: "0 0 16 16"
|
|
1555
|
-
}, props), _path$
|
|
1555
|
+
}, props), _path$d || (_path$d = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1556
1556
|
fill: "none",
|
|
1557
1557
|
stroke: "currentColor",
|
|
1558
1558
|
strokeLinecap: "round",
|
|
@@ -1575,7 +1575,7 @@ var XXXL = function (props) { return jsxRuntime.jsx(reactTypography.XXXL, __assi
|
|
|
1575
1575
|
*/
|
|
1576
1576
|
var Ellipsis = function (props) { return jsxRuntime.jsx(reactTypography.Ellipsis, __assign({}, props)); };
|
|
1577
1577
|
|
|
1578
|
-
var StyledEllipsis = styled__default["default"](Ellipsis)(templateObject_1$
|
|
1578
|
+
var StyledEllipsis = styled__default["default"](Ellipsis)(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
1579
1579
|
var theme = _a.theme, isCompact = _a.isCompact;
|
|
1580
1580
|
return isCompact &&
|
|
1581
1581
|
"\n width: ".concat(theme.components.chrome.nav.workspaceDropdownWidth, "px; \n ");
|
|
@@ -1591,13 +1591,13 @@ var WorkspacesDropdown = function (props) {
|
|
|
1591
1591
|
? selectedWorkspace.company + "'s workspace"
|
|
1592
1592
|
: "Select workspace" })) })) }), jsxRuntime.jsxs(Menu, { children: [jsxRuntime.jsx(MenuHeaderItem, { children: jsxRuntime.jsx(MD, __assign({ isBold: true, style: { color: theme.palette.grey[800] } }, { children: props.workspacesLabel || "Workspaces" })) }), jsxRuntime.jsx(Separator, {}), props.workspaces && props.workspaces.map(function (item) { return (jsxRuntime.jsx(Item, __assign({ value: item }, { children: item.company }))); })] })] })));
|
|
1593
1593
|
};
|
|
1594
|
-
var templateObject_1$
|
|
1594
|
+
var templateObject_1$v;
|
|
1595
1595
|
|
|
1596
|
-
var LogoIconContainer = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$
|
|
1596
|
+
var LogoIconContainer = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n margin-right: 2px;\n border-right: none;\n @media (max-width: ", ") {\n right: 0;\n left: 0;\n margin-right: auto;\n margin-left: auto;\n position: absolute;\n }\n"], ["\n margin-right: 2px;\n border-right: none;\n @media (max-width: ", ") {\n right: 0;\n left: 0;\n margin-right: auto;\n margin-left: auto;\n position: absolute;\n }\n"])), function (_a) {
|
|
1597
1597
|
var theme = _a.theme;
|
|
1598
1598
|
return theme.breakpoints.sm;
|
|
1599
1599
|
});
|
|
1600
|
-
var BrandName = styled__default["default"](reactChrome.HeaderItem)(templateObject_2$
|
|
1600
|
+
var BrandName = styled__default["default"](reactChrome.HeaderItem)(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n margin-right: auto;\n margin-left: -8px;\n color: ", ";\n pointer-events: none;\n font-family: ", ";\n @media (max-width: ", ") {\n display: none;\n }\n"], ["\n margin-right: auto;\n margin-left: -8px;\n color: ", ";\n pointer-events: none;\n font-family: ", ";\n @media (max-width: ", ") {\n display: none;\n }\n"])), function (_a) {
|
|
1601
1601
|
var theme = _a.theme;
|
|
1602
1602
|
return theme.palette.blue["600"];
|
|
1603
1603
|
}, function (_a) {
|
|
@@ -1607,7 +1607,7 @@ var BrandName = styled__default["default"](reactChrome.HeaderItem)(templateObjec
|
|
|
1607
1607
|
var theme = _a.theme;
|
|
1608
1608
|
return theme.breakpoints.sm;
|
|
1609
1609
|
});
|
|
1610
|
-
var DropdownItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_3$
|
|
1610
|
+
var DropdownItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin-right: auto;\n margin-left: -8px;\n color: ", ";\n font-family: ", ";\n z-index: 2;\n @media (max-width: ", ") {\n display: none;\n }\n"], ["\n margin-right: auto;\n margin-left: -8px;\n color: ", ";\n font-family: ", ";\n z-index: 2;\n @media (max-width: ", ") {\n display: none;\n }\n"])), function (_a) {
|
|
1611
1611
|
var theme = _a.theme;
|
|
1612
1612
|
return theme.palette.blue["600"];
|
|
1613
1613
|
}, function (_a) {
|
|
@@ -1627,9 +1627,9 @@ var MenuItem$1 = styled__default["default"](reactChrome.HeaderItem)(templateObje
|
|
|
1627
1627
|
var BrandItem = function (props) {
|
|
1628
1628
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(MenuItem$1, __assign({}, props, { onClick: props.toggleMenu }, { children: [jsxRuntime.jsx(HeaderItemIcon, { children: jsxRuntime.jsx(SvgMenuStroke, {}) }), props.menuLabel && jsxRuntime.jsx(HeaderItemText, { children: props.menuLabel })] })), jsxRuntime.jsx(LogoIconContainer, __assign({}, props, { hasLogo: true }, { children: jsxRuntime.jsx(HeaderItemIcon, { children: jsxRuntime.jsx(Logo, { type: "icon", size: 150 }) }) })), props.workspaces && props.workspaces.length > 1 ? (jsxRuntime.jsx(DropdownItem, { children: jsxRuntime.jsx(WorkspacesDropdown, { workspaces: props.workspaces, workspacesLabel: props.workspacesLabel, activeWorkspace: props.activeWorkspace, onWorkspaceChange: props.onWorkspaceChange }) })) : (jsxRuntime.jsx(jsxRuntime.Fragment, { children: props.brandName && (jsxRuntime.jsx(BrandName, __assign({}, props, { children: jsxRuntime.jsx(HeaderItemText, { children: props.brandName }) }))) }))] }));
|
|
1629
1629
|
};
|
|
1630
|
-
var templateObject_1$
|
|
1630
|
+
var templateObject_1$u, templateObject_2$e, templateObject_3$a, templateObject_4$6;
|
|
1631
1631
|
|
|
1632
|
-
var UgHeader = styled__default["default"](reactChrome.Header)(templateObject_1$
|
|
1632
|
+
var UgHeader = styled__default["default"](reactChrome.Header)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n height: ", ";\n"], ["\n height: ", ";\n"])), theme.components.chrome.header.height);
|
|
1633
1633
|
/**
|
|
1634
1634
|
* An Header is a visual way to display general information.
|
|
1635
1635
|
* This can include navList Items, modal, profile settings.
|
|
@@ -1638,13 +1638,13 @@ var Header = function (props) { return jsxRuntime.jsx(UgHeader, __assign({}, pro
|
|
|
1638
1638
|
Header.HeaderItem = HeaderItem;
|
|
1639
1639
|
Header.HeaderItemText = HeaderItemText;
|
|
1640
1640
|
Header.HeaderItemIcon = HeaderItemIcon;
|
|
1641
|
-
var templateObject_1$
|
|
1641
|
+
var templateObject_1$t;
|
|
1642
1642
|
|
|
1643
1643
|
var HeaderSkeleton = function () {
|
|
1644
1644
|
return (jsxRuntime.jsxs(Header, __assign({ isStandalone: true }, { children: [jsxRuntime.jsx(LogoIconContainer, __assign({ hasLogo: true }, { children: jsxRuntime.jsx(HeaderItemIcon, { children: jsxRuntime.jsx(Logo, { type: "icon", size: 150 }) }) })), jsxRuntime.jsx(HeaderItem, __assign({ style: { marginRight: "auto", marginLeft: "-4px" } }, { children: window.matchMedia("only screen and (min-width: 576px)").matches ? (jsxRuntime.jsx(Skeleton, { width: "200px", height: theme.space.sm })) : (jsxRuntime.jsx(Skeleton, { width: "80px", height: theme.space.sm, style: { marginLeft: theme.space.sm } })) })), jsxRuntime.jsx(HeaderItem, __assign({ isRound: true }, { children: jsxRuntime.jsx(HeaderItemIcon, { children: jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(Skeleton, { width: "32px", height: "32px", style: { borderRadius: "100%" } }) }) }) }))] })));
|
|
1645
1645
|
};
|
|
1646
1646
|
|
|
1647
|
-
var ChevronButton = styled__default["default"](IconButton)(templateObject_1$
|
|
1647
|
+
var ChevronButton = styled__default["default"](IconButton)(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n @media (max-width: ", ") {\n display: none;\n }\n"], ["\n @media (max-width: ", ") {\n display: none;\n }\n"])), function (_a) {
|
|
1648
1648
|
var theme = _a.theme;
|
|
1649
1649
|
return theme.breakpoints.sm;
|
|
1650
1650
|
});
|
|
@@ -1656,9 +1656,9 @@ var AppHeader = function (_a) {
|
|
|
1656
1656
|
var brand = _a.brand, avatar = _a.avatar, isLoading = _a.isLoading, args = __rest(_a, ["brand", "avatar", "isLoading"]);
|
|
1657
1657
|
return isLoading ? jsxRuntime.jsx(HeaderSkeleton, {}) : (jsxRuntime.jsxs(Header, __assign({}, args, { children: [jsxRuntime.jsx(BrandItem, __assign({}, brand, { toggleMenu: args.onSidebarMenuToggle })), args.hasChangelog && args.changelogItem && (jsxRuntime.jsx(HeaderItem, __assign({ style: { marginRight: "-" + theme.space.xs } }, { children: jsxRuntime.jsx(HeaderItemIcon, { children: args.changelogItem }) }))), jsxRuntime.jsx(HeaderItem, __assign({ isRound: true, onClick: args.onProfileModalToggle }, { children: jsxRuntime.jsx(HeaderItemIcon, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Avatar, __assign({}, avatar)), jsxRuntime.jsx(ChevronButton, __assign({ size: "small", isRotated: args.isProfileModalOpen }, { children: jsxRuntime.jsx(SvgChevronDownStroke, {}) }))] }) }) }))] })));
|
|
1658
1658
|
};
|
|
1659
|
-
var templateObject_1$
|
|
1659
|
+
var templateObject_1$s;
|
|
1660
1660
|
|
|
1661
|
-
var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$
|
|
1661
|
+
var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n border-right: ", ";\n border-color: ", ";\n ", "\n transition: width 0.25s ease-in-out;\n padding-top: ", ";\n @media (min-width: ", ") {\n padding-left: ", ";\n }\n"], ["\n border-right: ", ";\n border-color: ", ";\n ", "\n transition: width 0.25s ease-in-out;\n padding-top: ", ";\n @media (min-width: ", ") {\n padding-left: ", ";\n }\n"])), function (_a) {
|
|
1662
1662
|
var theme = _a.theme;
|
|
1663
1663
|
return theme.borders.sm;
|
|
1664
1664
|
}, function (_a) {
|
|
@@ -1685,10 +1685,10 @@ var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$q || (t
|
|
|
1685
1685
|
- To give a consistent dashboard and navigation experience
|
|
1686
1686
|
*/
|
|
1687
1687
|
var Nav = function (props) { return jsxRuntime.jsx(UgNav, __assign({}, props)); };
|
|
1688
|
-
var templateObject_1$
|
|
1688
|
+
var templateObject_1$r;
|
|
1689
1689
|
|
|
1690
|
-
var SelectedItemStyle = styled.css(templateObject_1$
|
|
1691
|
-
var UgNavItem$2 = styled__default["default"](reactChrome.NavItem)(templateObject_2$
|
|
1690
|
+
var SelectedItemStyle = styled.css(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (props) { return props.theme.palette.kale["100"]; });
|
|
1691
|
+
var UgNavItem$2 = styled__default["default"](reactChrome.NavItem)(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n border-top-left-radius: ", "px;\n border-bottom-left-radius: ", "px;\n font-family: ", ";\n ", "\n ", "\n &:hover, &:focus {\n ", "\n }\n opacity: 1;\n color: ", ";\n font-weight: ", ";\n ", "\n"], ["\n border-top-left-radius: ", "px;\n border-bottom-left-radius: ", "px;\n font-family: ", ";\n ", "\n ", "\n &:hover, &:focus {\n ", "\n }\n opacity: 1;\n color: ", ";\n font-weight: ", ";\n ", "\n"])), function (props) { return props.theme.space.base * 6; }, function (props) { return props.theme.space.base * 6; }, function (_a) {
|
|
1692
1692
|
var theme = _a.theme;
|
|
1693
1693
|
return theme.fonts.system;
|
|
1694
1694
|
}, function (props) { return !props.isExpanded && "display: none;"; }, function (props) { return props.isCurrent && SelectedItemStyle; }, SelectedItemStyle, function (props) { return props.theme.palette.blue["600"]; }, function (props) { return props.theme.fontWeights.medium; }, function (props) {
|
|
@@ -1699,49 +1699,49 @@ var NavItem = function (props) {
|
|
|
1699
1699
|
// const { isExpanded } = props;
|
|
1700
1700
|
return jsxRuntime.jsx(UgNavItem$2, __assign({}, props));
|
|
1701
1701
|
};
|
|
1702
|
-
var templateObject_1$
|
|
1702
|
+
var templateObject_1$q, templateObject_2$d;
|
|
1703
1703
|
|
|
1704
|
-
var UgNavIcon = styled__default["default"](reactChrome.NavItemIcon)(templateObject_1$
|
|
1704
|
+
var UgNavIcon = styled__default["default"](reactChrome.NavItemIcon)(templateObject_1$p || (templateObject_1$p = __makeTemplateObject([""], [""])));
|
|
1705
1705
|
var NavItemIcon = function (props) { return jsxRuntime.jsx(UgNavIcon, __assign({}, props)); };
|
|
1706
|
-
var templateObject_1$
|
|
1706
|
+
var templateObject_1$p;
|
|
1707
1707
|
|
|
1708
1708
|
var NavItemText = function (props) { return (jsxRuntime.jsx(reactChrome.NavItemText, __assign({}, props, { children: jsxRuntime.jsx(Ellipsis, __assign({ style: { width: "200px" } }, { children: props.children })) }))); };
|
|
1709
1709
|
|
|
1710
|
-
var _path$
|
|
1710
|
+
var _path$c;
|
|
1711
1711
|
|
|
1712
|
-
function _extends$
|
|
1712
|
+
function _extends$e() { _extends$e = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$e.apply(this, arguments); }
|
|
1713
1713
|
|
|
1714
1714
|
var SvgChevronRightStroke = function SvgChevronRightStroke(props) {
|
|
1715
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1715
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$e({
|
|
1716
1716
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1717
1717
|
width: 16,
|
|
1718
1718
|
height: 16,
|
|
1719
1719
|
focusable: "false",
|
|
1720
1720
|
viewBox: "0 0 16 16"
|
|
1721
|
-
}, props), _path$
|
|
1721
|
+
}, props), _path$c || (_path$c = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1722
1722
|
fill: "currentColor",
|
|
1723
1723
|
d: "M5.61 3.312a.5.5 0 01.718-.69l.062.066 4 5a.5.5 0 01.054.542l-.054.082-4 5a.5.5 0 01-.83-.55l.05-.074L9.359 8l-3.75-4.688z"
|
|
1724
1724
|
})));
|
|
1725
1725
|
};
|
|
1726
1726
|
|
|
1727
|
-
var _path$
|
|
1727
|
+
var _path$b;
|
|
1728
1728
|
|
|
1729
|
-
function _extends$
|
|
1729
|
+
function _extends$d() { _extends$d = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$d.apply(this, arguments); }
|
|
1730
1730
|
|
|
1731
1731
|
var SvgChevronLeftStroke = function SvgChevronLeftStroke(props) {
|
|
1732
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1732
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$d({
|
|
1733
1733
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1734
1734
|
width: 16,
|
|
1735
1735
|
height: 16,
|
|
1736
1736
|
focusable: "false",
|
|
1737
1737
|
viewBox: "0 0 16 16"
|
|
1738
|
-
}, props), _path$
|
|
1738
|
+
}, props), _path$b || (_path$b = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1739
1739
|
fill: "currentColor",
|
|
1740
1740
|
d: "M10.39 12.688a.5.5 0 01-.718.69l-.062-.066-4-5a.5.5 0 01-.054-.542l.054-.082 4-5a.5.5 0 01.83.55l-.05.074L6.641 8l3.75 4.688z"
|
|
1741
1741
|
})));
|
|
1742
1742
|
};
|
|
1743
1743
|
|
|
1744
|
-
var StyledToggle = styled__default["default"](IconButton)(templateObject_1$
|
|
1744
|
+
var StyledToggle = styled__default["default"](IconButton)(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n width: ", "px;\n height: ", "px;\n min-width: ", ";\n position: absolute;\n top: ", "px;\n right: -", "px;\n background: ", "};\n z-index: 1;\n @media (max-width: ", ") {\n display: none;\n }\n"], ["\n width: ", "px;\n height: ", "px;\n min-width: ", ";\n position: absolute;\n top: ", "px;\n right: -", "px;\n background: ", "};\n z-index: 1;\n @media (max-width: ", ") {\n display: none;\n }\n"])), function (_a) {
|
|
1745
1745
|
var theme = _a.theme;
|
|
1746
1746
|
return theme.space.base * 6;
|
|
1747
1747
|
}, function (_a) {
|
|
@@ -1766,42 +1766,42 @@ var StyledToggle = styled__default["default"](IconButton)(templateObject_1$n ||
|
|
|
1766
1766
|
var NavToggle = function (props) {
|
|
1767
1767
|
return (jsxRuntime.jsx(StyledToggle, __assign({}, props, { isPrimary: true, size: "small" }, { children: props.isExpanded ? (jsxRuntime.jsx(SvgChevronLeftStroke, { style: { width: "100%" } })) : (jsxRuntime.jsx(SvgChevronRightStroke, { style: { width: "100%" } })) })));
|
|
1768
1768
|
};
|
|
1769
|
-
var templateObject_1$
|
|
1769
|
+
var templateObject_1$o;
|
|
1770
1770
|
|
|
1771
|
-
var UgNavItem$1 = styled__default["default"](reactChrome.NavItem)(templateObject_1$
|
|
1771
|
+
var UgNavItem$1 = styled__default["default"](reactChrome.NavItem)(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n width: 100%;\n min-height: ", ";\n opacity: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n padding-right: ", ";\n pointer-events: none;\n\n &:after {\n background: ", ";\n height: 1px;\n flex: 1;\n content: \"\";\n }\n\n span {\n background: #fff;\n margin: 0;\n margin-right: ", ";\n color: ", ";\n font-size: ", ";\n }\n ", "\n"], ["\n width: 100%;\n min-height: ", ";\n opacity: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n padding-right: ", ";\n pointer-events: none;\n\n &:after {\n background: ", ";\n height: 1px;\n flex: 1;\n content: \"\";\n }\n\n span {\n background: #fff;\n margin: 0;\n margin-right: ", ";\n color: ", ";\n font-size: ", ";\n }\n ", "\n"])), function (props) { return props.theme.space.lg; }, function (props) { return props.theme.space.sm; }, function (props) { return props.theme.palette.grey["200"]; }, function (props) { return props.theme.space.sm; }, function (props) { return props.theme.palette.grey["500"]; }, function (props) { return props.theme.fontSizes.sm; }, function (props) { return !props.isExpanded && "display: none;"; });
|
|
1772
1772
|
var NavDivider = function (props) { return (jsxRuntime.jsx(UgNavItem$1, __assign({}, props, { children: jsxRuntime.jsx("span", { children: props.children }) }))); };
|
|
1773
|
-
var templateObject_1$
|
|
1773
|
+
var templateObject_1$n;
|
|
1774
1774
|
|
|
1775
|
-
var UgProjectSubtitle = styled__default["default"](NavItemText)(templateObject_1$
|
|
1776
|
-
var UgNavItem = styled__default["default"](NavItem)(templateObject_2$
|
|
1775
|
+
var UgProjectSubtitle = styled__default["default"](NavItemText)(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n color: ", ";\n font-size: ", ";\n"], ["\n color: ", ";\n font-size: ", ";\n"])), function (props) { return props.theme.palette.grey["500"]; }, function (props) { return props.theme.fontSizes.sm; });
|
|
1776
|
+
var UgNavItem = styled__default["default"](NavItem)(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n flex-flow: column;\n align-items: flex-start;\n"], ["\n flex-flow: column;\n align-items: flex-start;\n"])));
|
|
1777
1777
|
var NavItemProject = function (props) { return jsxRuntime.jsx(UgNavItem, __assign({}, props)); };
|
|
1778
1778
|
NavItemProject.Title = NavItemText;
|
|
1779
1779
|
NavItemProject.SubTitle = UgProjectSubtitle;
|
|
1780
|
-
var templateObject_1$
|
|
1780
|
+
var templateObject_1$m, templateObject_2$c;
|
|
1781
1781
|
|
|
1782
|
-
var _path$
|
|
1782
|
+
var _path$a;
|
|
1783
1783
|
|
|
1784
|
-
function _extends$
|
|
1784
|
+
function _extends$c() { _extends$c = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$c.apply(this, arguments); }
|
|
1785
1785
|
|
|
1786
1786
|
var SvgHomeFill = function SvgHomeFill(props) {
|
|
1787
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1787
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$c({
|
|
1788
1788
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1789
1789
|
width: 26,
|
|
1790
1790
|
height: 26,
|
|
1791
1791
|
focusable: "false",
|
|
1792
1792
|
viewBox: "0 0 26 26"
|
|
1793
|
-
}, props), _path$
|
|
1793
|
+
}, props), _path$a || (_path$a = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1794
1794
|
fill: "currentColor",
|
|
1795
1795
|
d: "M23.885 13.2l-1.328 1.639a.522.522 0 01-.737.084l-1.444-1.155v7.182c0 .577-.474 1.05-1.054 1.05H16.51c-.58 0-1.054-.473-1.054-1.05v-3.182a2.43 2.43 0 00-.716-1.732 2.448 2.448 0 00-1.74-.714 2.45 2.45 0 00-1.739.714 2.43 2.43 0 00-.716 1.732v3.182c0 .577-.474 1.05-1.054 1.05H6.678c-.582 0-1.054-.47-1.054-1.05v-7.182L4.18 14.923a.522.522 0 01-.737-.084L2.115 13.2a.52.52 0 01.084-.735l10.474-8.348a.51.51 0 01.654 0L23.8 12.466a.52.52 0 01.084.735"
|
|
1796
1796
|
})));
|
|
1797
1797
|
};
|
|
1798
1798
|
|
|
1799
|
-
var _linearGradient, _path$
|
|
1799
|
+
var _linearGradient, _path$9;
|
|
1800
1800
|
|
|
1801
|
-
function _extends$
|
|
1801
|
+
function _extends$b() { _extends$b = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$b.apply(this, arguments); }
|
|
1802
1802
|
|
|
1803
1803
|
var SvgHomeFillStyled = function SvgHomeFillStyled(props) {
|
|
1804
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1804
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$b({
|
|
1805
1805
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1806
1806
|
width: 26,
|
|
1807
1807
|
height: 26,
|
|
@@ -1817,18 +1817,18 @@ var SvgHomeFillStyled = function SvgHomeFillStyled(props) {
|
|
|
1817
1817
|
className: "stop3",
|
|
1818
1818
|
offset: "100%",
|
|
1819
1819
|
stopColor: "#001825"
|
|
1820
|
-
}))), _path$
|
|
1820
|
+
}))), _path$9 || (_path$9 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1821
1821
|
fill: "url(#unguessIconGradient)",
|
|
1822
1822
|
d: "M23.885 13.2l-1.328 1.639a.522.522 0 01-.737.084l-1.444-1.155v7.182c0 .577-.474 1.05-1.054 1.05H16.51c-.58 0-1.054-.473-1.054-1.05v-3.182a2.43 2.43 0 00-.716-1.732 2.448 2.448 0 00-1.74-.714 2.45 2.45 0 00-1.739.714 2.43 2.43 0 00-.716 1.732v3.182c0 .577-.474 1.05-1.054 1.05H6.678c-.582 0-1.054-.47-1.054-1.05v-7.182L4.18 14.923a.522.522 0 01-.737-.084L2.115 13.2a.52.52 0 01.084-.735l10.474-8.348a.51.51 0 01.654 0L23.8 12.466a.52.52 0 01.084.735"
|
|
1823
1823
|
})));
|
|
1824
1824
|
};
|
|
1825
1825
|
|
|
1826
|
-
var _g, _defs;
|
|
1826
|
+
var _g, _defs$2;
|
|
1827
1827
|
|
|
1828
|
-
function _extends$
|
|
1828
|
+
function _extends$a() { _extends$a = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$a.apply(this, arguments); }
|
|
1829
1829
|
|
|
1830
1830
|
var SvgToken = function SvgToken(props) {
|
|
1831
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1831
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$a({
|
|
1832
1832
|
fill: "none",
|
|
1833
1833
|
viewBox: "0 0 32 32",
|
|
1834
1834
|
xmlns: "http://www.w3.org/2000/svg"
|
|
@@ -1855,7 +1855,7 @@ var SvgToken = function SvgToken(props) {
|
|
|
1855
1855
|
}), /*#__PURE__*/React__namespace.createElement("path", {
|
|
1856
1856
|
d: "m20.986 10.545h-2.381v2.381h2.381v-2.381z",
|
|
1857
1857
|
fill: "#fff"
|
|
1858
|
-
}))), _defs || (_defs = /*#__PURE__*/React__namespace.createElement("defs", null, /*#__PURE__*/React__namespace.createElement("clipPath", {
|
|
1858
|
+
}))), _defs$2 || (_defs$2 = /*#__PURE__*/React__namespace.createElement("defs", null, /*#__PURE__*/React__namespace.createElement("clipPath", {
|
|
1859
1859
|
id: "a"
|
|
1860
1860
|
}, /*#__PURE__*/React__namespace.createElement("rect", {
|
|
1861
1861
|
width: 32,
|
|
@@ -1864,18 +1864,18 @@ var SvgToken = function SvgToken(props) {
|
|
|
1864
1864
|
})))));
|
|
1865
1865
|
};
|
|
1866
1866
|
|
|
1867
|
-
var _path$
|
|
1867
|
+
var _path$8;
|
|
1868
1868
|
|
|
1869
|
-
function _extends$
|
|
1869
|
+
function _extends$9() { _extends$9 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$9.apply(this, arguments); }
|
|
1870
1870
|
|
|
1871
1871
|
var SvgFolderIcon = function SvgFolderIcon(props) {
|
|
1872
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1872
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$9({
|
|
1873
1873
|
width: 12,
|
|
1874
1874
|
height: 12,
|
|
1875
1875
|
viewBox: "0 0 12 12",
|
|
1876
1876
|
fill: "#68737D",
|
|
1877
1877
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1878
|
-
}, props), _path$
|
|
1878
|
+
}, props), _path$8 || (_path$8 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1879
1879
|
fillRule: "evenodd",
|
|
1880
1880
|
clipRule: "evenodd",
|
|
1881
1881
|
d: "M9.99976 4H6.99976V3.5C6.99976 2.62386 6.3759 2 5.49976 2H2.49976C1.62362 2 0.999758 2.62386 0.999758 3.5V6H0.499758C0.174472 6 -0.0642066 6.30569 0.0146868 6.62127L1.01469 10.6213C1.07033 10.8439 1.27032 11 1.49976 11H10.4998C10.7292 11 10.9292 10.8439 10.9848 10.6213L11.9848 6.62127C12.0637 6.30569 11.825 6 11.4998 6H10.9998V5C10.9998 4.42386 10.5759 4 9.99976 4ZM10.8594 7H1.14015L1.89015 10H10.1094L10.8594 7ZM1.99976 6H9.99976V5H5.99976V3.5C5.99976 3.17614 5.82362 3 5.49976 3H2.49976C2.1759 3 1.99976 3.17614 1.99976 3.5V6Z",
|
|
@@ -1883,7 +1883,70 @@ var SvgFolderIcon = function SvgFolderIcon(props) {
|
|
|
1883
1883
|
})));
|
|
1884
1884
|
};
|
|
1885
1885
|
|
|
1886
|
-
var
|
|
1886
|
+
var _path$7, _defs$1;
|
|
1887
|
+
|
|
1888
|
+
function _extends$8() { _extends$8 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$8.apply(this, arguments); }
|
|
1889
|
+
|
|
1890
|
+
var SvgTemplates = function SvgTemplates(props) {
|
|
1891
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$8({
|
|
1892
|
+
width: 26,
|
|
1893
|
+
height: 26,
|
|
1894
|
+
viewBox: "0 0 26 26",
|
|
1895
|
+
fill: "none",
|
|
1896
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
1897
|
+
}, props), _path$7 || (_path$7 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1898
|
+
fillRule: "evenodd",
|
|
1899
|
+
clipRule: "evenodd",
|
|
1900
|
+
d: "M8 5H3.5C3.2 5 3 5.2 3 5.5V18.5C3 18.8 3.2 19 3.5 19H7C10 19 11 21 11 21H12V7C12 6.9 11 5 8 5ZM9 15H6C5.5 15 5 14.5 5 14C5 13.5 5.5 13 6 13H9C9.5 13 10 13.5 10 14C10 14.5 9.5 15 9 15ZM9 11H6C5.5 11 5 10.5 5 10C5 9.5 5.5 9 6 9H9C9.5 9 10 9.5 10 10C10 10.5 9.5 11 9 11ZM14 7V21H15C15 21 16 19 19 19H22.5C22.8 19 23 18.8 23 18.5V5.5C23 5.2 22.8 5 22.5 5H18C15 5 14 6.9 14 7ZM16 14C16 13.5 16.5 13 17 13H20C20.5 13 21 13.5 21 14C21 14.5 20.5 15 20 15H17C16.5 15 16 14.5 16 14ZM16 10C16 9.5 16.5 9 17 9H20C20.5 9 21 9.5 21 10C21 10.5 20.5 11 20 11H17C16.5 11 16 10.5 16 10Z",
|
|
1901
|
+
fill: "url(#paint0_linear_342_21583)"
|
|
1902
|
+
})), _defs$1 || (_defs$1 = /*#__PURE__*/React__namespace.createElement("defs", null, /*#__PURE__*/React__namespace.createElement("linearGradient", {
|
|
1903
|
+
id: "paint0_linear_342_21583",
|
|
1904
|
+
x1: 3,
|
|
1905
|
+
y1: 5,
|
|
1906
|
+
x2: 23.2766,
|
|
1907
|
+
y2: 5.35853,
|
|
1908
|
+
gradientUnits: "userSpaceOnUse"
|
|
1909
|
+
}, /*#__PURE__*/React__namespace.createElement("stop", {
|
|
1910
|
+
stopColor: "#001825"
|
|
1911
|
+
}), /*#__PURE__*/React__namespace.createElement("stop", {
|
|
1912
|
+
offset: 1,
|
|
1913
|
+
stopColor: "#003A57"
|
|
1914
|
+
})))));
|
|
1915
|
+
};
|
|
1916
|
+
|
|
1917
|
+
var _path$6, _defs;
|
|
1918
|
+
|
|
1919
|
+
function _extends$7() { _extends$7 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$7.apply(this, arguments); }
|
|
1920
|
+
|
|
1921
|
+
var SvgTemplatesActive = function SvgTemplatesActive(props) {
|
|
1922
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$7({
|
|
1923
|
+
width: 26,
|
|
1924
|
+
height: 26,
|
|
1925
|
+
viewBox: "0 0 26 26",
|
|
1926
|
+
fill: "none",
|
|
1927
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
1928
|
+
}, props), _path$6 || (_path$6 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1929
|
+
fillRule: "evenodd",
|
|
1930
|
+
clipRule: "evenodd",
|
|
1931
|
+
d: "M8 5H3.5C3.2 5 3 5.2 3 5.5V18.5C3 18.8 3.2 19 3.5 19H7C10 19 11 21 11 21H12V7C12 6.9 11 5 8 5ZM9 15H6C5.5 15 5 14.5 5 14C5 13.5 5.5 13 6 13H9C9.5 13 10 13.5 10 14C10 14.5 9.5 15 9 15ZM9 11H6C5.5 11 5 10.5 5 10C5 9.5 5.5 9 6 9H9C9.5 9 10 9.5 10 10C10 10.5 9.5 11 9 11ZM14 7V21H15C15 21 16 19 19 19H22.5C22.8 19 23 18.8 23 18.5V5.5C23 5.2 22.8 5 22.5 5H18C15 5 14 6.9 14 7ZM16 14C16 13.5 16.5 13 17 13H20C20.5 13 21 13.5 21 14C21 14.5 20.5 15 20 15H17C16.5 15 16 14.5 16 14ZM16 10C16 9.5 16.5 9 17 9H20C20.5 9 21 9.5 21 10C21 10.5 20.5 11 20 11H17C16.5 11 16 10.5 16 10Z",
|
|
1932
|
+
fill: "url(#paint0_linear_342_4104)"
|
|
1933
|
+
})), _defs || (_defs = /*#__PURE__*/React__namespace.createElement("defs", null, /*#__PURE__*/React__namespace.createElement("linearGradient", {
|
|
1934
|
+
id: "paint0_linear_342_4104",
|
|
1935
|
+
x1: 3,
|
|
1936
|
+
y1: 5,
|
|
1937
|
+
x2: 23.2766,
|
|
1938
|
+
y2: 5.35853,
|
|
1939
|
+
gradientUnits: "userSpaceOnUse"
|
|
1940
|
+
}, /*#__PURE__*/React__namespace.createElement("stop", {
|
|
1941
|
+
offset: 0.119792,
|
|
1942
|
+
stopColor: "#003A57"
|
|
1943
|
+
}), /*#__PURE__*/React__namespace.createElement("stop", {
|
|
1944
|
+
offset: 1,
|
|
1945
|
+
stopColor: "#70C38A"
|
|
1946
|
+
})))));
|
|
1947
|
+
};
|
|
1948
|
+
|
|
1949
|
+
var StyledNav = styled__default["default"](Nav)(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n ", ";\n"], ["\n ", ";\n"])), function (_a) {
|
|
1887
1950
|
var isExpanded = _a.isExpanded, theme = _a.theme;
|
|
1888
1951
|
return isExpanded && "width: ".concat(theme.components.chrome.nav.openWidth);
|
|
1889
1952
|
});
|
|
@@ -1891,11 +1954,11 @@ var LoadingSidebar = function (props) {
|
|
|
1891
1954
|
var isExpanded = props.isExpanded;
|
|
1892
1955
|
return (jsxRuntime.jsxs(StyledNav, __assign({}, props, { isExpanded: isExpanded }, { children: [jsxRuntime.jsx(NavToggle, { isExpanded: isExpanded }), jsxRuntime.jsxs(NavItem, __assign({ isExpanded: isExpanded, isCurrent: true }, { children: [jsxRuntime.jsx(NavItemIcon, __assign({ isStyled: true }, { children: jsxRuntime.jsx(Skeleton, { width: "32px", height: "32px", style: { borderRadius: "100%" } }) })), jsxRuntime.jsx(Skeleton, { height: "12px", width: "60%" }), jsxRuntime.jsx(NavItemText, {})] })), jsxRuntime.jsx(NavDivider, { isExpanded: isExpanded }), jsxRuntime.jsxs(NavItemProject, __assign({ isExpanded: isExpanded, isCurrent: false }, { children: [jsxRuntime.jsx(Skeleton, { width: "60%", style: { marginBottom: "6px" } }), jsxRuntime.jsx(Skeleton, { height: "12px", width: "80%" })] }), 1), jsxRuntime.jsxs(NavItemProject, __assign({ isExpanded: isExpanded, isCurrent: false }, { children: [jsxRuntime.jsx(Skeleton, { width: "60%", style: { marginBottom: "6px" } }), jsxRuntime.jsx(Skeleton, { height: "12px", width: "80%" })] }), 2), jsxRuntime.jsxs(NavItemProject, __assign({ isExpanded: isExpanded, isCurrent: false }, { children: [jsxRuntime.jsx(Skeleton, { width: "60%", style: { marginBottom: "6px" } }), jsxRuntime.jsx(Skeleton, { height: "12px", width: "80%" })] }), 3), jsxRuntime.jsxs(NavItemProject, __assign({ isExpanded: isExpanded, isCurrent: false }, { children: [jsxRuntime.jsx(Skeleton, { width: "60%", style: { marginBottom: "6px" } }), jsxRuntime.jsx(Skeleton, { height: "12px", width: "80%" })] }), 3), jsxRuntime.jsxs(NavItem, __assign({ isExpanded: isExpanded, hasBrandmark: true, title: "Be smart from the start", style: { pointerEvents: "none" } }, { children: [jsxRuntime.jsx(NavItemIcon, { children: jsxRuntime.jsx(Skeleton, { width: "32px", height: "32px", style: { borderRadius: "100%" } }) }), jsxRuntime.jsx(NavItemText, { children: "UNGUESS" })] }))] })));
|
|
1893
1956
|
};
|
|
1894
|
-
var templateObject_1$
|
|
1957
|
+
var templateObject_1$l;
|
|
1895
1958
|
|
|
1896
|
-
var TokenContainer = styled__default["default"].div(templateObject_1$
|
|
1897
|
-
var ScrollingContainer = styled__default["default"].div(templateObject_2$
|
|
1898
|
-
var StyledNavItem = styled__default["default"](NavItem)(templateObject_3$
|
|
1959
|
+
var TokenContainer = styled__default["default"].div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
1960
|
+
var ScrollingContainer = styled__default["default"].div(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n order: 1;\n overflow-y: auto;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n order: 1;\n overflow-y: auto;\n height: 100%;\n"])));
|
|
1961
|
+
var StyledNavItem = styled__default["default"](NavItem)(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n ", ";\n\n &:hover,\n &:focus {\n background-color: white;\n }\n"], ["\n ", ";\n\n &:hover,\n &:focus {\n background-color: white;\n }\n"])), function (_a) {
|
|
1899
1962
|
var isExpanded = _a.isExpanded;
|
|
1900
1963
|
return isExpanded &&
|
|
1901
1964
|
"\n display: block;\n padding-right: ".concat(theme.space.md, ";\n ");
|
|
@@ -1919,12 +1982,12 @@ var Sidebar = function (props) {
|
|
|
1919
1982
|
var padding = props.tokens ? {
|
|
1920
1983
|
paddingBottom: 0
|
|
1921
1984
|
} : {};
|
|
1922
|
-
return props.isLoading ? (jsxRuntime.jsx(LoadingSidebar, __assign({}, props))) : (jsxRuntime.jsxs(Nav, __assign({}, props, { children: [jsxRuntime.jsx(NavToggle, { onClick: toggleNav, isExpanded: props.isExpanded }), showWorkspacesDropdown && props.workspaces && props.workspaces.length > 1 && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(StyledNavItem, __assign({ hasLogo: true, isExpanded: props.isExpanded, style: padding }, { children: jsxRuntime.jsx(WorkspacesDropdown, { workspaces: props.workspaces, workspacesLabel: props.workspacesLabel, activeWorkspace: props.activeWorkspace, onWorkspaceChange: props.onWorkspaceChange, isCompact: true }) })), props.tokens && (jsxRuntime.jsx(NavDivider, { isExpanded: props.isExpanded, style: { order: 0 } }))] })), props.tokens && (jsxRuntime.jsx(StyledNavItem, __assign({ hasLogo: true, isExpanded: props.isExpanded, style: { pointerEvents: "none", paddingTop: 0 } }, { children: jsxRuntime.jsx(Card, __assign({ style: { padding: theme.space.sm } }, { children: jsxRuntime.jsxs(TokenContainer, { children: [jsxRuntime.jsx(SvgToken, { width: 32 }), jsxRuntime.jsx(Span, __assign({ isBold: true, style: { marginLeft: theme.space.xs, color: theme.palette.grey[800] } }, { children: props.tokens + " " + (props.tokensLabel || "tokens") }))] }) })) }))), jsxRuntime.jsxs(NavItem, __assign({ isExpanded: props.isExpanded, isCurrent: nav === "home", onClick: function () { return navigate("home"); } }, { children: [jsxRuntime.jsx(NavItemIcon, __assign({ isStyled: true }, { children: nav === "home" ? jsxRuntime.jsx(SvgHomeFillStyled, {}) : jsxRuntime.jsx(SvgHomeFill, {}) })), jsxRuntime.jsx(NavItemText, { children: props.homeItemLabel || "My Campaigns" })] })), jsxRuntime.jsxs(NavDivider, __assign({ isExpanded: props.isExpanded }, { children: [jsxRuntime.jsx(SvgFolderIcon, {}), " ", props.dividerLabel || ""] })), jsxRuntime.jsx(ScrollingContainer, { children: props.projects &&
|
|
1985
|
+
return props.isLoading ? (jsxRuntime.jsx(LoadingSidebar, __assign({}, props))) : (jsxRuntime.jsxs(Nav, __assign({}, props, { children: [jsxRuntime.jsx(NavToggle, { onClick: toggleNav, isExpanded: props.isExpanded }), showWorkspacesDropdown && props.workspaces && props.workspaces.length > 1 && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(StyledNavItem, __assign({ hasLogo: true, isExpanded: props.isExpanded, style: padding }, { children: jsxRuntime.jsx(WorkspacesDropdown, { workspaces: props.workspaces, workspacesLabel: props.workspacesLabel, activeWorkspace: props.activeWorkspace, onWorkspaceChange: props.onWorkspaceChange, isCompact: true }) })), props.tokens && (jsxRuntime.jsx(NavDivider, { isExpanded: props.isExpanded, style: { order: 0 } }))] })), props.tokens && (jsxRuntime.jsx(StyledNavItem, __assign({ hasLogo: true, isExpanded: props.isExpanded, style: { pointerEvents: "none", paddingTop: 0 } }, { children: jsxRuntime.jsx(Card, __assign({ style: { padding: theme.space.sm } }, { children: jsxRuntime.jsxs(TokenContainer, { children: [jsxRuntime.jsx(SvgToken, { width: 32 }), jsxRuntime.jsx(Span, __assign({ isBold: true, style: { marginLeft: theme.space.xs, color: theme.palette.grey[800] } }, { children: props.tokens + " " + (props.tokensLabel || "tokens") }))] }) })) }))), jsxRuntime.jsxs(NavItem, __assign({ isExpanded: props.isExpanded, isCurrent: nav === "home", onClick: function () { return navigate("home"); } }, { children: [jsxRuntime.jsx(NavItemIcon, __assign({ isStyled: true }, { children: nav === "home" ? jsxRuntime.jsx(SvgHomeFillStyled, {}) : jsxRuntime.jsx(SvgHomeFill, {}) })), jsxRuntime.jsx(NavItemText, { children: props.homeItemLabel || "My Campaigns" })] })), jsxRuntime.jsxs(NavItem, __assign({ isExpanded: props.isExpanded, isCurrent: nav === "templates", onClick: function () { return navigate("templates"); } }, { children: [jsxRuntime.jsx(NavItemIcon, __assign({ isStyled: true }, { children: nav === "templates" ? jsxRuntime.jsx(SvgTemplatesActive, {}) : jsxRuntime.jsx(SvgTemplates, {}) })), jsxRuntime.jsx(NavItemText, { children: props.servicesItemLabel || "Templates" })] })), jsxRuntime.jsxs(NavDivider, __assign({ isExpanded: props.isExpanded }, { children: [jsxRuntime.jsx(SvgFolderIcon, {}), " ", props.dividerLabel || ""] })), jsxRuntime.jsx(ScrollingContainer, { children: props.projects &&
|
|
1923
1986
|
props.projects.map(function (project) { return (jsxRuntime.jsxs(NavItemProject, __assign({ isExpanded: props.isExpanded, isCurrent: nav === project.id, onClick: function () { return navigate(project.id); } }, { children: [jsxRuntime.jsx(NavItemProject.Title, { title: project.title, children: project.title }), jsxRuntime.jsx(NavItemProject.SubTitle, { children: project.campaigns })] }), project.id)); }) }), jsxRuntime.jsxs(NavItem, __assign({ isExpanded: props.isExpanded, hasBrandmark: true, title: "Be smart from the start", style: { pointerEvents: "none", paddingBottom: theme.space.md } }, { children: [jsxRuntime.jsx(NavItemIcon, { children: jsxRuntime.jsx(Logo, { type: "icon", size: 150 }) }), jsxRuntime.jsx(NavItemText, { children: "UNGUESS" })] }))] })));
|
|
1924
1987
|
};
|
|
1925
|
-
var templateObject_1$
|
|
1988
|
+
var templateObject_1$k, templateObject_2$b, templateObject_3$9;
|
|
1926
1989
|
|
|
1927
|
-
var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$
|
|
1990
|
+
var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n @media (min-width: ", ") {\n margin: ", "\n }\n \n /* hide scrollbar for IE, Edge and Firefox */\n -ms-overflow-style: none;\n scrollbar-width: none;\n\n ::-webkit-scrollbar {\n display: none;\n }\n"], ["\n @media (min-width: ", ") {\n margin: ", "\n }\n \n /* hide scrollbar for IE, Edge and Firefox */\n -ms-overflow-style: none;\n scrollbar-width: none;\n\n ::-webkit-scrollbar {\n display: none;\n }\n"])), function (_a) {
|
|
1928
1991
|
var theme = _a.theme;
|
|
1929
1992
|
return theme.breakpoints.sm;
|
|
1930
1993
|
}, function (_a) {
|
|
@@ -1935,14 +1998,14 @@ var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$i ||
|
|
|
1935
1998
|
* A Main defines the main content of an HTML document which displays on the browser
|
|
1936
1999
|
*/
|
|
1937
2000
|
var Main = function (props) { return jsxRuntime.jsx(UgMain, __assign({}, props)); };
|
|
1938
|
-
var templateObject_1$
|
|
2001
|
+
var templateObject_1$j;
|
|
1939
2002
|
|
|
1940
|
-
var StyledHr = styled__default["default"].hr(templateObject_1$
|
|
2003
|
+
var StyledHr = styled__default["default"].hr(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n margin: ", "px 0 ", "px 0;\n border: none;\n border-top: 1px solid ", ";\n"], ["\n margin: ", "px 0 ", "px 0;\n border: none;\n border-top: 1px solid ", ";\n"])), theme.space.base * 6, theme.space.base * 8, theme.palette.grey[300]);
|
|
1941
2004
|
var PageLoader = function () {
|
|
1942
2005
|
var isSidebarOpen = window.matchMedia("only screen and (min-width: 576px)").matches;
|
|
1943
2006
|
return (jsxRuntime.jsx(reactChrome.Chrome, __assign({ isFluid: true, hue: theme.palette.white }, { children: jsxRuntime.jsxs(Body$1, { children: [jsxRuntime.jsx(AppHeader, { isLoading: true }), jsxRuntime.jsxs(Content, { children: [jsxRuntime.jsx(Sidebar, { isExpanded: isSidebarOpen, isLoading: true }), jsxRuntime.jsxs(Main, { children: [jsxRuntime.jsx(Skeleton, { width: "30%", height: "32px", style: { marginTop: theme.space.sm, marginLeft: theme.space.sm } }), jsxRuntime.jsx(StyledHr, { style: { margin: "24px 0" } }), jsxRuntime.jsxs(Row$1, { children: [jsxRuntime.jsx(Col, __assign({ xs: 12, md: 6, lg: 3 }, { children: jsxRuntime.jsx(CampaignCard, { isLoading: true, projectTitle: "", campaignTitle: "", date: "" }) })), jsxRuntime.jsx(Col, __assign({ xs: 12, md: 6, lg: 3 }, { children: jsxRuntime.jsx(CampaignCard, { isLoading: true, projectTitle: "", campaignTitle: "", date: "" }) })), jsxRuntime.jsx(Col, __assign({ xs: 12, md: 6, lg: 3 }, { children: jsxRuntime.jsx(CampaignCard, { isLoading: true, projectTitle: "", campaignTitle: "", date: "" }) })), jsxRuntime.jsx(Col, __assign({ xs: 12, md: 6, lg: 3 }, { children: jsxRuntime.jsx(CampaignCard, { isLoading: true, projectTitle: "", campaignTitle: "", date: "" }) }))] })] })] })] }) })));
|
|
1944
2007
|
};
|
|
1945
|
-
var templateObject_1$
|
|
2008
|
+
var templateObject_1$i;
|
|
1946
2009
|
|
|
1947
2010
|
/**
|
|
1948
2011
|
* Title is a basic component used to display a title. Often used in card headers.
|
|
@@ -1980,7 +2043,7 @@ var LoginForm = function (props) { return (jsxRuntime.jsxs(jsxRuntime.Fragment,
|
|
|
1980
2043
|
: false, isPrimary: true, style: { marginBottom: theme.space.md } }, { children: props.buttonText })), status && (jsxRuntime.jsx("div", __assign({ style: { textAlign: "center" } }, { children: jsxRuntime.jsx(Message, __assign({ validation: "error" }, { children: status.message })) })))] })));
|
|
1981
2044
|
} }))] })), props.onBackClick && (jsxRuntime.jsxs(Button, __assign({ onClick: props.onBackClick, isBasic: true, style: { marginTop: theme.space.md } }, { children: [jsxRuntime.jsx(Button.StartIcon, { children: jsxRuntime.jsx(SvgChevronLeftStroke, {}) }), props.backToLabel || "Back to UNGUESS"] })))] })); };
|
|
1982
2045
|
|
|
1983
|
-
var ugModalBody = styled__default["default"](reactModals.Body)(templateObject_1$
|
|
2046
|
+
var ugModalBody = styled__default["default"](reactModals.Body)(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
|
|
1984
2047
|
var theme = _a.theme;
|
|
1985
2048
|
return theme.palette.grey["800"];
|
|
1986
2049
|
});
|
|
@@ -1989,17 +2052,17 @@ var FooterItem = reactModals.FooterItem;
|
|
|
1989
2052
|
Modal.Header = reactModals.Header;
|
|
1990
2053
|
Modal.Body = ugModalBody;
|
|
1991
2054
|
Modal.Footer = reactModals.Footer;
|
|
1992
|
-
var templateObject_1$
|
|
2055
|
+
var templateObject_1$h;
|
|
1993
2056
|
|
|
1994
|
-
var StyledModal$1 = styled__default["default"](Modal)(templateObject_1$
|
|
1995
|
-
var StyledHeader = styled__default["default"](Modal.Header)(templateObject_2$
|
|
2057
|
+
var StyledModal$1 = styled__default["default"](Modal)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n max-height: 100%;\n border-radius: 0;\n left: unset;\n right: unset;\n top: unset;\n bottom: unset;\n"], ["\n width: 100%;\n height: 100%;\n max-height: 100%;\n border-radius: 0;\n left: unset;\n right: unset;\n top: unset;\n bottom: unset;\n"])));
|
|
2058
|
+
var StyledHeader = styled__default["default"](Modal.Header)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-direction: row;\n padding: ", "px ", "px;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-direction: row;\n padding: ", "px ", "px;\n"])), function (_a) {
|
|
1996
2059
|
var theme = _a.theme;
|
|
1997
2060
|
return theme.space.base * 3;
|
|
1998
2061
|
}, function (_a) {
|
|
1999
2062
|
var theme = _a.theme;
|
|
2000
2063
|
return theme.space.base * 6;
|
|
2001
2064
|
});
|
|
2002
|
-
var StyledBody$4 = styled__default["default"](Modal.Body)(templateObject_3$
|
|
2065
|
+
var StyledBody$4 = styled__default["default"](Modal.Body)(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
|
|
2003
2066
|
var theme = _a.theme;
|
|
2004
2067
|
return theme.palette.grey["100"];
|
|
2005
2068
|
});
|
|
@@ -2017,7 +2080,7 @@ ModalFullScreen.Body = StyledBody$4;
|
|
|
2017
2080
|
ModalFullScreen.Footer = StyledFooter;
|
|
2018
2081
|
ModalFullScreen.Close = StyledModalClose;
|
|
2019
2082
|
ModalFullScreen.FooterItem = FooterItem;
|
|
2020
|
-
var templateObject_1$
|
|
2083
|
+
var templateObject_1$g, templateObject_2$a, templateObject_3$8, templateObject_4$5, templateObject_5$2;
|
|
2021
2084
|
|
|
2022
2085
|
/**
|
|
2023
2086
|
* The Chrome component provides a high-level layout structure and sets a framework for navigating around Zendesk products.
|
|
@@ -2038,7 +2101,7 @@ var Notification = function (props) { return (jsxRuntime.jsx(reactNotifications.
|
|
|
2038
2101
|
var ToastProvider = function (props) { return jsxRuntime.jsx(reactNotifications.ToastProvider, __assign({}, props)); };
|
|
2039
2102
|
var useToast = reactNotifications.useToast;
|
|
2040
2103
|
|
|
2041
|
-
var UgPagination = styled__default["default"](reactPagination.Pagination)(templateObject_1$
|
|
2104
|
+
var UgPagination = styled__default["default"](reactPagination.Pagination)(templateObject_1$f || (templateObject_1$f = __makeTemplateObject([""], [""])));
|
|
2042
2105
|
/**
|
|
2043
2106
|
* Pagination separates content into pages and allows users to navigate between those pages.
|
|
2044
2107
|
|
|
@@ -2048,7 +2111,7 @@ var UgPagination = styled__default["default"](reactPagination.Pagination)(templa
|
|
|
2048
2111
|
*/
|
|
2049
2112
|
var Pagination = function (props) { return jsxRuntime.jsx(UgPagination, __assign({}, props)); };
|
|
2050
2113
|
var CursorPagination = reactPagination.CursorPagination;
|
|
2051
|
-
var templateObject_1$
|
|
2114
|
+
var templateObject_1$f;
|
|
2052
2115
|
|
|
2053
2116
|
var _path$5;
|
|
2054
2117
|
|
|
@@ -2087,21 +2150,21 @@ var SvgThumbsUp = function SvgThumbsUp(props) {
|
|
|
2087
2150
|
})));
|
|
2088
2151
|
};
|
|
2089
2152
|
|
|
2090
|
-
var StyledMenuItemIcon = styled__default["default"].div(templateObject_1$
|
|
2153
|
+
var StyledMenuItemIcon = styled__default["default"].div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n display: flex;\n transition: opacity 0.1s ease-in-out;\n opacity: ", ";\n color: ", ";\n margin-left: auto;\n & > * {\n width: ", ";\n height: ", ";\n }\n"], ["\n display: flex;\n transition: opacity 0.1s ease-in-out;\n opacity: ", ";\n color: ", ";\n margin-left: auto;\n & > * {\n width: ", ";\n height: ", ";\n }\n"])), function (props) { return (props.isVisible ? "1" : "0"); }, function (props) { return (props.isDisabled ? "inherit" : theme.palette.grey[600]); }, function (props) { return props.theme.iconSizes.md; }, function (props) { return props.theme.iconSizes.md; });
|
|
2091
2154
|
var MenuItemIcon = function (props) { return (jsxRuntime.jsx(StyledMenuItemIcon, __assign({ isVisible: true }, props, { children: jsxRuntime.jsx(SvgChevronRightStroke, {}) }))); };
|
|
2092
|
-
var templateObject_1$
|
|
2155
|
+
var templateObject_1$e;
|
|
2093
2156
|
|
|
2094
2157
|
/**
|
|
2095
2158
|
* 1. Allows an item to contain a positioned sub-menu.
|
|
2096
2159
|
* 2. Reset stacking context for sub-menu css-arrows.
|
|
2097
2160
|
**/
|
|
2098
|
-
var StyledItem = styled__default["default"].li(templateObject_1$
|
|
2161
|
+
var StyledItem = styled__default["default"].li(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n display: block;\n position: relative; /* [1] */\n z-index: 0; /* [2] */\n cursor: ", ";\n text-decoration: none;\n line-height: ", "px;\n word-wrap: break-word;\n user-select: none;\n &:first-child {\n margin-top: ", "px;\n }\n &:last-child {\n margin-bottom: ", "px;\n }\n &:focus {\n outline: none;\n }\n\n width: fill-available;\n ", "\n height: ", ";\n padding: ", " ", ";\n\n ", ";\n\n ", " {\n right: ", ";\n left: ", ";\n }\n"], ["\n display: block;\n position: relative; /* [1] */\n z-index: 0; /* [2] */\n cursor: ", ";\n text-decoration: none;\n line-height: ", "px;\n word-wrap: break-word;\n user-select: none;\n &:first-child {\n margin-top: ", "px;\n }\n &:last-child {\n margin-bottom: ", "px;\n }\n &:focus {\n outline: none;\n }\n\n width: fill-available;\n ", "\n height: ", ";\n padding: ", " ", ";\n\n ", ";\n\n ", " {\n right: ", ";\n left: ", ";\n }\n"])), function (props) { return (props.disabled ? "default" : "pointer"); }, function (props) { return props.theme.space.base * 5; }, function (props) { return props.theme.space.base; }, function (props) { return props.theme.space.base; }, flexCenter, theme.space.xxl, theme.space.xs, theme.space.md, function (props) { return "\n &:hover,\n &:focus,\n &:active {\n background-color: ".concat(theme.palette.kale[100], ";\n color: ").concat(props.isDanger ? theme.palette.red[500] : theme.palette.grey[800], ";\n }"); }, StyledMenuItemIcon, function (props) {
|
|
2099
2162
|
return props.theme.rtl ? "auto" : "".concat(props.theme.space.base * 3, "px");
|
|
2100
2163
|
}, function (props) {
|
|
2101
2164
|
return props.theme.rtl ? "".concat(props.theme.space.base * 3, "px") : "auto";
|
|
2102
2165
|
});
|
|
2103
|
-
var StyledBody$3 = styled__default["default"].li(templateObject_2$
|
|
2104
|
-
var IconContainer = styled__default["default"].div(templateObject_3$
|
|
2166
|
+
var StyledBody$3 = styled__default["default"].li(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n height: 100%;\n"])));
|
|
2167
|
+
var IconContainer = styled__default["default"].div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n margin-right: ", ";\n margin-top: 3px;\n"], ["\n margin-right: ", ";\n margin-top: 3px;\n"])), function (_a) {
|
|
2105
2168
|
var theme = _a.theme;
|
|
2106
2169
|
return theme.space.sm;
|
|
2107
2170
|
});
|
|
@@ -2114,7 +2177,7 @@ var MenuItem = function (_a) {
|
|
|
2114
2177
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
2115
2178
|
return isActive && content ? (jsxRuntime.jsx(StyledBody$3, { children: content }, props.value)) : (jsxRuntime.jsxs(StyledItem, __assign({}, props, { onClick: function () { return props.setActive(props.value); } }, { children: [props.icon && jsxRuntime.jsx(IconContainer, { children: props.icon }), children, content && jsxRuntime.jsx(MenuItemIcon, {})] }), props.value));
|
|
2116
2179
|
};
|
|
2117
|
-
var templateObject_1$
|
|
2180
|
+
var templateObject_1$d, templateObject_2$9, templateObject_3$7, templateObject_4$4;
|
|
2118
2181
|
|
|
2119
2182
|
var _path$3;
|
|
2120
2183
|
|
|
@@ -2171,16 +2234,16 @@ var SvgInfoFill = function SvgInfoFill(props) {
|
|
|
2171
2234
|
})));
|
|
2172
2235
|
};
|
|
2173
2236
|
|
|
2174
|
-
var StyledButton$2 = styled__default["default"](Button)(templateObject_1$
|
|
2237
|
+
var StyledButton$2 = styled__default["default"](Button)(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n color: ", ";\n font-weight: ", ";\n padding-left: 0;\n justify-content: flex-start;\n\n ", ";\n"], ["\n color: ", ";\n font-weight: ", ";\n padding-left: 0;\n justify-content: flex-start;\n\n ", ";\n"])), function (props) { return props.theme.palette.grey[800]; }, function (props) { return props.theme.fontWeights.bold; }, function (props) { return "\n &:hover,\n &:focus,\n &:active {\n background-color: ".concat(props.theme.palette.kale[100], ";\n color: ").concat(props.isDanger ? props.theme.palette.red[500] : props.theme.palette.grey[800], ";\n }"); });
|
|
2175
2238
|
var PreviousButton = function (props) { return (jsxRuntime.jsxs(StyledButton$2, __assign({}, props, { isStretched: true }, { children: [jsxRuntime.jsx(StyledButton$2.StartIcon, { children: jsxRuntime.jsx(SvgChevronLeftStroke, {}) }), props.children] }))); };
|
|
2176
|
-
var templateObject_1$
|
|
2239
|
+
var templateObject_1$c;
|
|
2177
2240
|
|
|
2178
|
-
var UgParagraph = styled__default["default"](reactTypography.Paragraph)(templateObject_1$
|
|
2241
|
+
var UgParagraph = styled__default["default"](reactTypography.Paragraph)(templateObject_1$b || (templateObject_1$b = __makeTemplateObject([""], [""])));
|
|
2179
2242
|
/**
|
|
2180
2243
|
* Use Paragraph to render blocks of text with Garden styling.
|
|
2181
2244
|
*/
|
|
2182
2245
|
var Paragraph = function (props) { return jsxRuntime.jsx(UgParagraph, __assign({}, props)); };
|
|
2183
|
-
var templateObject_1$
|
|
2246
|
+
var templateObject_1$b;
|
|
2184
2247
|
|
|
2185
2248
|
var getInitials = function (name) {
|
|
2186
2249
|
var names = name.split(" ");
|
|
@@ -2188,9 +2251,9 @@ var getInitials = function (name) {
|
|
|
2188
2251
|
return initials;
|
|
2189
2252
|
};
|
|
2190
2253
|
|
|
2191
|
-
var StyledButton$1 = styled__default["default"](Button)(templateObject_1$
|
|
2192
|
-
var StyledFooterButton = styled__default["default"](StyledButton$1)(templateObject_2$
|
|
2193
|
-
var StyledBody$2 = styled__default["default"].div(templateObject_3$
|
|
2254
|
+
var StyledButton$1 = styled__default["default"](Button)(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n ", ";\n"], ["\n ", ";\n"])), function (props) { return "\n &:hover,\n &:focus,\n &:active {\n background-color: ".concat(props.theme.palette.kale[100], ";\n color: ").concat(props.isDanger ? props.theme.palette.red[500] : props.theme.palette.grey[800], ";\n }"); });
|
|
2255
|
+
var StyledFooterButton = styled__default["default"](StyledButton$1)(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n color: ", ";\n padding-left: 0;\n justify-content: flex-start;\n"], ["\n color: ", ";\n padding-left: 0;\n justify-content: flex-start;\n"])), function (props) { return props.theme.palette.grey[800]; });
|
|
2256
|
+
var StyledBody$2 = styled__default["default"].div(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n margin: ", "px\n ", "px;\n"], ["\n margin: ", "px\n ", "px;\n"])), function (_a) {
|
|
2194
2257
|
var theme = _a.theme;
|
|
2195
2258
|
return theme.space.base * 6;
|
|
2196
2259
|
}, function (_a) {
|
|
@@ -2217,7 +2280,7 @@ var HelpItem = function (props) {
|
|
|
2217
2280
|
var content = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(PreviousButton, __assign({ onClick: function () { return props.setActive(""); }, isBasic: true }, { children: props.title })), jsxRuntime.jsx(Separator, {}), jsxRuntime.jsxs(StyledBody$2, { children: [jsxRuntime.jsx(Paragraph, __assign({ style: { color: theme.palette.grey[600] } }, { children: jsxRuntime.jsx(SM, { children: props.contactLabel }) })), jsxRuntime.jsx(StyledParagraph, { children: jsxRuntime.jsx(Avatar, { children: (_a = props.csm.picture) !== null && _a !== void 0 ? _a : getInitials(props.csm.name), avatarType: props.csm.picture ? "image" : "text", size: "large" }) }), jsxRuntime.jsxs(StyledParagraph, { children: [jsxRuntime.jsx(MD, __assign({ isBold: true }, { children: props.csm.name })), jsxRuntime.jsxs(Description, { children: [jsxRuntime.jsx(Anchor, __assign({ href: "mailto:".concat(props.csm.email), style: { color: theme.palette.grey[600] } }, { children: csmEmailCut })), jsxRuntime.jsxs(StyledButton$1, __assign({ isBasic: true, onClick: copyToClipBoard, size: "small", variant: "isBasic" }, { children: [jsxRuntime.jsx(StyledButton$1.StartIcon, { children: jsxRuntime.jsx(SvgCopy, {}) }), (_b = props.copyLabel) !== null && _b !== void 0 ? _b : "Copy"] }))] })] })] }), jsxRuntime.jsxs(Footer, { children: [jsxRuntime.jsx(Separator, {}), jsxRuntime.jsxs(StyledFooterButton, __assign({ isStretched: true, isBasic: true, onClick: props.toggleChat, style: { paddingLeft: theme.space.xxs } }, { children: [jsxRuntime.jsx(StyledFooterButton.StartIcon, { children: jsxRuntime.jsx(SvgInfoFill, { fill: theme.palette.blue[600] }) }), (_c = props.chatSupportLabel) !== null && _c !== void 0 ? _c : "Report a technical issue"] }))] })] }));
|
|
2218
2281
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(MenuItem, __assign({ content: content, value: props.value, selectedItem: props.selectedItem, setActive: props.setActive, icon: jsxRuntime.jsx(SvgQuestionMark, { fill: theme.palette.grey[600] }) }, { children: props.title })) }));
|
|
2219
2282
|
};
|
|
2220
|
-
var templateObject_1$
|
|
2283
|
+
var templateObject_1$a, templateObject_2$8, templateObject_3$6, templateObject_4$3, templateObject_5$1, templateObject_6;
|
|
2221
2284
|
|
|
2222
2285
|
function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
|
|
2223
2286
|
|
|
@@ -2249,30 +2312,30 @@ var SvgTranslationExists = function SvgTranslationExists(props) {
|
|
|
2249
2312
|
})));
|
|
2250
2313
|
};
|
|
2251
2314
|
|
|
2252
|
-
var StyledBody$1 = styled__default["default"].div(templateObject_1$
|
|
2315
|
+
var StyledBody$1 = styled__default["default"].div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n margin: ", "px\n ", "px;\n"], ["\n margin: ", "px\n ", "px;\n"])), function (_a) {
|
|
2253
2316
|
var theme = _a.theme;
|
|
2254
2317
|
return theme.space.base * 6;
|
|
2255
2318
|
}, function (_a) {
|
|
2256
2319
|
var theme = _a.theme;
|
|
2257
2320
|
return theme.space.base * 4;
|
|
2258
2321
|
});
|
|
2259
|
-
var StyledButtonContainer = styled__default["default"].div(templateObject_2$
|
|
2260
|
-
var StyledButton = styled__default["default"](Button)(templateObject_3$
|
|
2322
|
+
var StyledButtonContainer = styled__default["default"].div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n ", "\n & button { \n justify-content: flex-start;\n }\n"], ["\n ", "\n & button { \n justify-content: flex-start;\n }\n"])), flexStart);
|
|
2323
|
+
var StyledButton = styled__default["default"](Button)(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n ", ";\n"], ["\n ", ";\n"])), function (props) { return "\n &:hover,\n &:focus,\n &:active {\n background-color: ".concat(props.theme.palette.kale[100], ";\n color: ").concat(props.isDanger ? props.theme.palette.red[500] : props.theme.palette.grey[800], ";\n }"); });
|
|
2261
2324
|
var LanguageItem = function (props) {
|
|
2262
2325
|
var _a;
|
|
2263
2326
|
var content = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(PreviousButton, __assign({ onClick: function () { return props.setActive(""); }, isBasic: true }, { children: props.title })), jsxRuntime.jsx(Separator, {}), jsxRuntime.jsx(StyledBody$1, { children: jsxRuntime.jsx(StyledButtonContainer, { children: Object.keys(props.languages).map(function (key) { return (jsxRuntime.jsxs(StyledButton, __assign({ isBasic: true, isStretched: true, value: key, onClick: function () { return props.onSelectLanguage(key); } }, { children: [jsxRuntime.jsx(StyledButton.StartIcon, { children: props.currentLanguage === key ? jsxRuntime.jsx(SvgCheckLg, {}) : jsxRuntime.jsx(SvgEmpty, {}) }), jsxRuntime.jsx(Span, __assign({ isBold: props.currentLanguage === key }, { children: props.languages[key].label }))] }))); }) }) })] }));
|
|
2264
2327
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(MenuItem, __assign({ content: content, value: props.value, selectedItem: props.selectedItem, setActive: props.setActive, icon: jsxRuntime.jsx(SvgTranslationExists, { fill: theme.palette.blue[600] }) }, { children: jsxRuntime.jsxs(MenuItemBody, { children: [props.title, jsxRuntime.jsxs(MD, __assign({ style: { color: theme.palette.grey[600] } }, { children: [(_a = props.currentLanguageLabel) !== null && _a !== void 0 ? _a : "Now:", " " + props.languages[props.currentLanguage].label] }))] }) })) }));
|
|
2265
2328
|
};
|
|
2266
|
-
var templateObject_1$
|
|
2329
|
+
var templateObject_1$9, templateObject_2$7, templateObject_3$5;
|
|
2267
2330
|
|
|
2268
|
-
var ProfileContainer = styled__default["default"].div(templateObject_1$
|
|
2331
|
+
var ProfileContainer = styled__default["default"].div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n ", "\n padding-top: ", "px;\n margin-bottom: ", "px;\n"], ["\n ", "\n padding-top: ", "px;\n margin-bottom: ", "px;\n"])), flexColumnCenter, function (_a) {
|
|
2269
2332
|
var theme = _a.theme;
|
|
2270
2333
|
return theme.space.base * 2;
|
|
2271
2334
|
}, function (_a) {
|
|
2272
2335
|
var theme = _a.theme;
|
|
2273
2336
|
return theme.space.base * 6;
|
|
2274
2337
|
});
|
|
2275
|
-
var CompanyHolder = styled__default["default"](SM)(templateObject_2$
|
|
2338
|
+
var CompanyHolder = styled__default["default"](SM)(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n text-transform: uppercase;\n margin-top: ", "px;\n margin-bottom: ", "px;\n color: ", ";\n"], ["\n text-transform: uppercase;\n margin-top: ", "px;\n margin-bottom: ", "px;\n color: ", ";\n"])), function (_a) {
|
|
2276
2339
|
var theme = _a.theme;
|
|
2277
2340
|
return theme.space.base * 2;
|
|
2278
2341
|
}, function (_a) {
|
|
@@ -2282,7 +2345,7 @@ var CompanyHolder = styled__default["default"](SM)(templateObject_2$5 || (templa
|
|
|
2282
2345
|
var theme = _a.theme;
|
|
2283
2346
|
return theme.palette.blue["600"];
|
|
2284
2347
|
});
|
|
2285
|
-
var UserDetails = styled__default["default"].div(templateObject_3$
|
|
2348
|
+
var UserDetails = styled__default["default"].div(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n margin-top: ", "px;\n margin-bottom: ", "px;\n text-align: center;\n"], ["\n margin-top: ", "px;\n margin-bottom: ", "px;\n text-align: center;\n"])), function (_a) {
|
|
2286
2349
|
var theme = _a.theme;
|
|
2287
2350
|
return theme.space.base * 4;
|
|
2288
2351
|
}, function (_a) {
|
|
@@ -2293,9 +2356,9 @@ var UserContainer = function (props) {
|
|
|
2293
2356
|
var _a;
|
|
2294
2357
|
return (jsxRuntime.jsxs(ProfileContainer, { children: [props.company && jsxRuntime.jsx(CompanyHolder, __assign({ isBold: true }, { children: props.company })), jsxRuntime.jsx(Avatar, { children: (_a = props.picture) !== null && _a !== void 0 ? _a : getInitials(props.name), avatarType: props.picture ? "image" : "text", size: "large" }), jsxRuntime.jsxs(UserDetails, { children: [jsxRuntime.jsx(MD, __assign({ isBold: true, style: { color: theme.palette.blue[600] } }, { children: props.name })), jsxRuntime.jsx(SM, __assign({ style: { color: theme.palette.grey[600] } }, { children: props.email }))] })] }));
|
|
2295
2358
|
};
|
|
2296
|
-
var templateObject_1$
|
|
2359
|
+
var templateObject_1$8, templateObject_2$6, templateObject_3$4;
|
|
2297
2360
|
|
|
2298
|
-
var StyledList = styled__default["default"].ul(templateObject_1$
|
|
2361
|
+
var StyledList = styled__default["default"].ul(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n padding: 0;\n margin: 0;\n"], ["\n padding: 0;\n margin: 0;\n"])));
|
|
2299
2362
|
var UserMenu = function (props) {
|
|
2300
2363
|
var _a = React.useState(""), item = _a[0], setActiveItem = _a[1];
|
|
2301
2364
|
var toggleItem = function (item) {
|
|
@@ -2303,9 +2366,9 @@ var UserMenu = function (props) {
|
|
|
2303
2366
|
};
|
|
2304
2367
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [item === "" && jsxRuntime.jsx(UserContainer, __assign({}, props.user)), jsxRuntime.jsxs(StyledList, { children: [item === "" && props.onFeedbackClick && jsxRuntime.jsx(Separator, {}), props.onFeedbackClick && (jsxRuntime.jsx(MenuItem, __assign({ selectedItem: item, icon: jsxRuntime.jsx(SvgThumbsUp, {}), setActive: function () { return props.onFeedbackClick ? props.onFeedbackClick() : console.log("feedback fired"); } }, { children: jsxRuntime.jsxs(MenuItemBody, { children: [props.feedbackTitle || "Give us your feedback", jsxRuntime.jsx(MD, __assign({ style: { color: theme.palette.grey[600] } }, { children: props.feedbackSubTitle || "Help us improve UNGUESS!" }))] }) }))), item === "" && jsxRuntime.jsx(Separator, {}), jsxRuntime.jsx(HelpItem, { value: "csm", selectedItem: item, setActive: function (i) { return toggleItem(i); }, title: props.csmTitle || "Need Help?", contactLabel: props.csmContactLabel || "Contact your CSM", csm: props.csm, toggleChat: props.onToggleChat, chatSupportLabel: props === null || props === void 0 ? void 0 : props.chatSupportLabel, copyLabel: props === null || props === void 0 ? void 0 : props.copyLabel }), jsxRuntime.jsx(LanguageItem, { title: props.languageTitle || "Change Language", value: "language-selector", selectedItem: item, setActive: function (i) { return toggleItem(i); }, languages: props.languages, currentLanguage: props.currentLanguage, currentLanguageLabel: props.currentLanguageLabel, onSelectLanguage: function (lang) { return props.onSelectLanguage(lang); } }), jsxRuntime.jsx(MenuItem, __assign({ selectedItem: item, icon: jsxRuntime.jsx(SvgExit, { fill: theme.palette.red[600] }), setActive: function () { return props.onLogout(); } }, { children: props.logoutTitle || "Log out" }))] })] }));
|
|
2305
2368
|
};
|
|
2306
|
-
var templateObject_1$
|
|
2369
|
+
var templateObject_1$7;
|
|
2307
2370
|
|
|
2308
|
-
var StyledModal = styled__default["default"](Modal)(templateObject_1$
|
|
2371
|
+
var StyledModal = styled__default["default"](Modal)(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n margin: 0;\n left: auto;\n right: auto;\n top: auto;\n bottom: auto;\n\n max-height: calc(100vh - ", ");\n\n @media (min-width: ", ") {\n margin-top: calc(\n ", "\n );\n margin-right: ", "px;\n }\n"], ["\n margin: 0;\n left: auto;\n right: auto;\n top: auto;\n bottom: auto;\n\n max-height: calc(100vh - ", ");\n\n @media (min-width: ", ") {\n margin-top: calc(\n ", "\n );\n margin-right: ", "px;\n }\n"])), function (_a) {
|
|
2309
2372
|
var theme = _a.theme;
|
|
2310
2373
|
return theme.space.xxl;
|
|
2311
2374
|
}, function (_a) {
|
|
@@ -2318,7 +2381,7 @@ var StyledModal = styled__default["default"](Modal)(templateObject_1$5 || (templ
|
|
|
2318
2381
|
var theme = _a.theme;
|
|
2319
2382
|
return theme.space.base * 3;
|
|
2320
2383
|
});
|
|
2321
|
-
var StyledBody = styled__default["default"](Modal.Body)(templateObject_2$
|
|
2384
|
+
var StyledBody = styled__default["default"](Modal.Body)(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n margin: ", ";\n padding: 0;\n"], ["\n margin: ", ";\n padding: 0;\n"])), function (_a) {
|
|
2322
2385
|
var theme = _a.theme;
|
|
2323
2386
|
return theme.space.xxs + " " + theme.space.xs;
|
|
2324
2387
|
});
|
|
@@ -2343,14 +2406,14 @@ var ProfileModal = function (_a) {
|
|
|
2343
2406
|
};
|
|
2344
2407
|
return (jsxRuntime.jsx(StyledModal, __assign({}, args, { style: { width: "300px" }, backdropProps: backDrop }, { children: jsxRuntime.jsx(StyledBody, { children: jsxRuntime.jsx(UserMenu, __assign({}, menuArgs)) }) })));
|
|
2345
2408
|
};
|
|
2346
|
-
var templateObject_1$
|
|
2409
|
+
var templateObject_1$6, templateObject_2$5;
|
|
2347
2410
|
|
|
2348
|
-
var UgStep = styled__default["default"](reactAccordions.Stepper.Step)(templateObject_1$
|
|
2411
|
+
var UgStep = styled__default["default"](reactAccordions.Stepper.Step)(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n svg {\n color: ", ";\n }\n"], ["\n svg {\n color: ", ";\n }\n"])), function (_a) {
|
|
2349
2412
|
var theme = _a.theme;
|
|
2350
2413
|
return theme.palette.green[700];
|
|
2351
2414
|
});
|
|
2352
|
-
var UgLabel = styled__default["default"](reactAccordions.Stepper.Label)(templateObject_2$
|
|
2353
|
-
var UgStepper = styled__default["default"](reactAccordions.Stepper)(templateObject_3$
|
|
2415
|
+
var UgLabel = styled__default["default"](reactAccordions.Stepper.Label)(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject([""], [""])));
|
|
2416
|
+
var UgStepper = styled__default["default"](reactAccordions.Stepper)(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n\n div[data-garden-id=\"accordions.step_icon\"] {\n background-color: ", ";\n color: ", ";\n font-weight: bold;\n }\n\n ", "\n"], ["\n\n div[data-garden-id=\"accordions.step_icon\"] {\n background-color: ", ";\n color: ", ";\n font-weight: bold;\n }\n\n ", "\n"])), function (_a) {
|
|
2354
2417
|
var theme = _a.theme;
|
|
2355
2418
|
return theme.palette.grey[200];
|
|
2356
2419
|
}, function (_a) {
|
|
@@ -2377,17 +2440,17 @@ var Stepper = function (props) { return jsxRuntime.jsx(UgStepper, __assign({}, p
|
|
|
2377
2440
|
Stepper.Step = UgStep;
|
|
2378
2441
|
Stepper.Label = UgLabel;
|
|
2379
2442
|
Stepper.Content = UgContent;
|
|
2380
|
-
var templateObject_1$
|
|
2443
|
+
var templateObject_1$5, templateObject_2$4, templateObject_3$3, templateObject_4$2;
|
|
2381
2444
|
|
|
2382
|
-
var UgTable = styled__default["default"](reactTables.Table)(templateObject_1$
|
|
2445
|
+
var UgTable = styled__default["default"](reactTables.Table)(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n border: 1px solid ", ";\n border-collapse: separate !important;\n border-radius: ", ";\n"], ["\n border: 1px solid ", ";\n border-collapse: separate !important;\n border-radius: ", ";\n"])), function (_a) {
|
|
2383
2446
|
var theme = _a.theme;
|
|
2384
2447
|
return theme.palette.grey[300];
|
|
2385
2448
|
}, function (_a) {
|
|
2386
2449
|
var theme = _a.theme;
|
|
2387
2450
|
return theme.borderRadii.lg;
|
|
2388
2451
|
});
|
|
2389
|
-
var UgHeaderRow = styled__default["default"](reactTables.HeaderRow)(templateObject_2$
|
|
2390
|
-
var UgHeaderCell = styled__default["default"](reactTables.HeaderCell)(templateObject_3$
|
|
2452
|
+
var UgHeaderRow = styled__default["default"](reactTables.HeaderRow)(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n border: 0;\n"], ["\n border: 0;\n"])));
|
|
2453
|
+
var UgHeaderCell = styled__default["default"](reactTables.HeaderCell)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n border-bottom: 1px solid ", ";\n vertical-align: middle;\n"], ["\n border-bottom: 1px solid ", ";\n vertical-align: middle;\n"])), function (_a) {
|
|
2391
2454
|
var theme = _a.theme;
|
|
2392
2455
|
return theme.palette.grey[300];
|
|
2393
2456
|
});
|
|
@@ -2414,11 +2477,11 @@ var Body = function (props) { return (jsxRuntime.jsx(reactTables.Body, __assign(
|
|
|
2414
2477
|
var Row = function (props) { return jsxRuntime.jsx(UgRow, __assign({}, props)); };
|
|
2415
2478
|
var Cell = function (props) { return jsxRuntime.jsx(UgCell, __assign({}, props)); };
|
|
2416
2479
|
var Caption = function (props) { return (jsxRuntime.jsx(reactTables.Caption, __assign({}, props))); };
|
|
2417
|
-
var templateObject_1$
|
|
2480
|
+
var templateObject_1$4, templateObject_2$3, templateObject_3$2, templateObject_4$1, templateObject_5;
|
|
2418
2481
|
|
|
2419
|
-
var StyledAnimatedToggle = styled__default["default"](reactSpring.animated.div)(templateObject_1$
|
|
2420
|
-
var StyledUgIcon = styled__default["default"](Icon)(templateObject_2$
|
|
2421
|
-
var UgGroupRow = styled__default["default"](reactTables.GroupRow)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n cursor: pointer;\n border: 0;\n\n &:last-child {\n td {\n border-bottom: 0;\n }\n }\n\n &.empty {\n cursor: default;\n\n * {\n color: ", " !important;\n cursor: default !important;\n }\n }\n\n svg {\n vertical-align: middle;\n }\n\n .title {\n padding-left: 10px;\n vertical-align: middle;\n font-size: ", ";\n cursor: pointer;\n }\n"], ["\n cursor: pointer;\n border: 0;\n\n &:last-child {\n td {\n border-bottom: 0;\n }\n }\n\n &.empty {\n cursor: default;\n\n * {\n color: ", " !important;\n cursor: default !important;\n }\n }\n\n svg {\n vertical-align: middle;\n }\n\n .title {\n padding-left: 10px;\n vertical-align: middle;\n font-size: ", ";\n cursor: pointer;\n }\n"])), theme.palette.grey[500], theme.fontSizes.sm);
|
|
2482
|
+
var StyledAnimatedToggle = styled__default["default"](reactSpring.animated.div)(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n display: inline-block;\n float: right;\n"], ["\n display: inline-block;\n float: right;\n"])));
|
|
2483
|
+
var StyledUgIcon = styled__default["default"](Icon)(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject([""], [""])));
|
|
2484
|
+
var UgGroupRow = styled__default["default"](reactTables.GroupRow)(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n cursor: pointer;\n border: 0;\n\n &:last-child {\n td {\n border-bottom: 0;\n }\n }\n\n &.empty {\n cursor: default;\n\n * {\n color: ", " !important;\n cursor: default !important;\n }\n }\n\n svg {\n vertical-align: middle;\n }\n\n .title {\n padding-left: 10px;\n vertical-align: middle;\n font-size: ", ";\n cursor: pointer;\n }\n"], ["\n cursor: pointer;\n border: 0;\n\n &:last-child {\n td {\n border-bottom: 0;\n }\n }\n\n &.empty {\n cursor: default;\n\n * {\n color: ", " !important;\n cursor: default !important;\n }\n }\n\n svg {\n vertical-align: middle;\n }\n\n .title {\n padding-left: 10px;\n vertical-align: middle;\n font-size: ", ";\n cursor: pointer;\n }\n"])), theme.palette.grey[500], theme.fontSizes.sm);
|
|
2422
2485
|
var GroupRow = function (props) { return jsxRuntime.jsx(UgGroupRow, __assign({}, props)); };
|
|
2423
2486
|
var GroupRowComponent = function (props) {
|
|
2424
2487
|
var toggleIconAnimation = reactSpring.useSpring({
|
|
@@ -2447,7 +2510,7 @@ var GroupedTable = function (_a) {
|
|
|
2447
2510
|
return jsxRuntime.jsx(GroupComponent, { columns: columns, group: group }, index);
|
|
2448
2511
|
}) })] })));
|
|
2449
2512
|
};
|
|
2450
|
-
var templateObject_1$
|
|
2513
|
+
var templateObject_1$3, templateObject_2$2, templateObject_3$1, templateObject_4;
|
|
2451
2514
|
|
|
2452
2515
|
/**
|
|
2453
2516
|
* Tiles are Radio buttons styled with icons or images.
|
|
@@ -2467,6 +2530,30 @@ Tiles.Icon = reactForms.Tiles.Icon;
|
|
|
2467
2530
|
Tiles.Label = reactForms.Tiles.Label;
|
|
2468
2531
|
Tiles.Tile = reactForms.Tiles.Tile;
|
|
2469
2532
|
|
|
2533
|
+
var UgTimeline = styled__default["default"](reactAccordions.Timeline)(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject([""], [""])));
|
|
2534
|
+
var UgTimelineContent = styled__default["default"](reactAccordions.Timeline.Content)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n padding: 12px 16px;\n"], ["\n padding: 12px 16px;\n"])));
|
|
2535
|
+
var UgTimelineItem = styled__default["default"](reactAccordions.Timeline.Item)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n div[data-garden-id=\"timeline.content.separator\"] {\n &:after {\n border-left-color: ", ";\n }\n svg {\n width: 24px;\n height: 24px;\n }\n padding: 12px 16px;\n }\n\n ", "\n"], ["\n div[data-garden-id=\"timeline.content.separator\"] {\n &:after {\n border-left-color: ", ";\n }\n svg {\n width: 24px;\n height: 24px;\n }\n padding: 12px 16px;\n }\n\n ", "\n"])), function (_a) {
|
|
2536
|
+
var theme = _a.theme;
|
|
2537
|
+
return theme.palette.grey[300];
|
|
2538
|
+
}, function (_a) {
|
|
2539
|
+
var hiddenLine = _a.hiddenLine;
|
|
2540
|
+
return hiddenLine &&
|
|
2541
|
+
"\n div[data-garden-id=\"timeline.content.separator\"] {\n &:after {\n border-left-color: transparent;\n }\n }\n ";
|
|
2542
|
+
});
|
|
2543
|
+
/**
|
|
2544
|
+
* A Timeline lists events over a period of time.
|
|
2545
|
+
* <hr>
|
|
2546
|
+
* Used for this:
|
|
2547
|
+
- To track an issue over time
|
|
2548
|
+
- To show events associated with an item
|
|
2549
|
+
* Not for this:
|
|
2550
|
+
- To guide users through a step by step process, use a Stepper instead
|
|
2551
|
+
*/
|
|
2552
|
+
var Timeline = function (props) { return jsxRuntime.jsx(UgTimeline, __assign({}, props)); };
|
|
2553
|
+
Timeline.Item = UgTimelineItem;
|
|
2554
|
+
Timeline.Content = UgTimelineContent;
|
|
2555
|
+
var templateObject_1$2, templateObject_2$1, templateObject_3;
|
|
2556
|
+
|
|
2470
2557
|
/**
|
|
2471
2558
|
* A Trigger is a wrapper for input elements
|
|
2472
2559
|
**/
|
|
@@ -2605,6 +2692,7 @@ exports.TableRow = Row;
|
|
|
2605
2692
|
exports.Tag = Tag;
|
|
2606
2693
|
exports.Textarea = Textarea;
|
|
2607
2694
|
exports.Tiles = Tiles;
|
|
2695
|
+
exports.Timeline = Timeline;
|
|
2608
2696
|
exports.Title = Title;
|
|
2609
2697
|
exports.ToastProvider = ToastProvider;
|
|
2610
2698
|
exports.Toggle = Toggle;
|