@appquality/unguess-design-system 2.10.70 → 2.11.1
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.js +235 -192
- package/build/stories/campaign-cards/_types.d.ts +2 -2
- package/build/stories/forms/checkbox/cards/_types.d.ts +2 -2
- package/build/stories/forms/radio/cards/_types.d.ts +2 -2
- package/build/stories/product-cards/_types.d.ts +2 -2
- package/build/stories/service-cards/_types.d.ts +2 -2
- package/build/stories/special-cards/_types.d.ts +3 -1
- package/build/stories/special-cards/index.d.ts +2 -2
- package/build/stories/special-cards/index.stories.d.ts +3 -3
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -254,8 +254,8 @@ var gradients = {
|
|
|
254
254
|
dark: "linear-gradient(90.81deg, ".concat(hex2rgba(palette.blue[800]), " 0%, ").concat(hex2rgba(palette.blue[600]), " 100%);"),
|
|
255
255
|
};
|
|
256
256
|
|
|
257
|
-
var _a, _b, _c, _d, _e, _f, _g$
|
|
258
|
-
var components = __assign(__assign({}, reactTheming.DEFAULT_THEME.components), { chrome: __assign(__assign({}, (_a = reactTheming.DEFAULT_THEME.components) === null || _a === void 0 ? void 0 : _a.chrome), { header: __assign(__assign({}, (_c = (_b = reactTheming.DEFAULT_THEME.components) === null || _b === void 0 ? void 0 : _b.chrome) === null || _c === void 0 ? void 0 : _c.header), { height: "64px" }), nav: __assign(__assign({}, (_e = (_d = reactTheming.DEFAULT_THEME.components) === null || _d === void 0 ? void 0 : _d.chrome) === null || _e === void 0 ? void 0 : _e.nav), { openWidth: 240, closedWidth: 36, workspaceDropdownWidth: 192 }) }), notification: __assign(__assign({}, (_f = reactTheming.DEFAULT_THEME.components) === null || _f === void 0 ? void 0 : _f.notification), { card: __assign(__assign({}, (_h = (_g$
|
|
257
|
+
var _a, _b, _c, _d, _e, _f, _g$6, _h;
|
|
258
|
+
var components = __assign(__assign({}, reactTheming.DEFAULT_THEME.components), { chrome: __assign(__assign({}, (_a = reactTheming.DEFAULT_THEME.components) === null || _a === void 0 ? void 0 : _a.chrome), { header: __assign(__assign({}, (_c = (_b = reactTheming.DEFAULT_THEME.components) === null || _b === void 0 ? void 0 : _b.chrome) === null || _c === void 0 ? void 0 : _c.header), { height: "64px" }), nav: __assign(__assign({}, (_e = (_d = reactTheming.DEFAULT_THEME.components) === null || _d === void 0 ? void 0 : _d.chrome) === null || _e === void 0 ? void 0 : _e.nav), { openWidth: 240, closedWidth: 36, workspaceDropdownWidth: 192 }) }), notification: __assign(__assign({}, (_f = reactTheming.DEFAULT_THEME.components) === null || _f === void 0 ? void 0 : _f.notification), { card: __assign(__assign({}, (_h = (_g$6 = reactTheming.DEFAULT_THEME.components) === null || _g$6 === void 0 ? void 0 : _g$6.notification) === null || _h === void 0 ? void 0 : _h.well), { padding: "16px" }) }), pageHeader: {
|
|
259
259
|
imgMaxHeight: "214px",
|
|
260
260
|
}, autocomplete: {
|
|
261
261
|
thumbSize: "60px",
|
|
@@ -460,7 +460,7 @@ var Tag = function (props) { return jsxRuntime.jsx(reactTags.Tag, __assign({}, p
|
|
|
460
460
|
Tag.Avatar = reactTags.Tag.Avatar;
|
|
461
461
|
Tag.Close = reactTags.Tag.Close;
|
|
462
462
|
|
|
463
|
-
var _g$
|
|
463
|
+
var _g$5, _path$q;
|
|
464
464
|
|
|
465
465
|
function _extends$v() { _extends$v = Object.assign ? Object.assign.bind() : 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$v.apply(this, arguments); }
|
|
466
466
|
|
|
@@ -471,19 +471,19 @@ var SvgCampaignFunctional = function SvgCampaignFunctional(props) {
|
|
|
471
471
|
viewBox: "0 0 24 24",
|
|
472
472
|
fill: "none",
|
|
473
473
|
xmlns: "http://www.w3.org/2000/svg"
|
|
474
|
-
}, props), _g$
|
|
474
|
+
}, props), _g$5 || (_g$5 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
475
475
|
opacity: 0.3
|
|
476
476
|
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
477
477
|
opacity: 0.3,
|
|
478
478
|
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",
|
|
479
479
|
fill: "#003A57"
|
|
480
|
-
}))), _path$
|
|
480
|
+
}))), _path$q || (_path$q = /*#__PURE__*/React__namespace.createElement("path", {
|
|
481
481
|
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",
|
|
482
482
|
fill: "#003A57"
|
|
483
483
|
})));
|
|
484
484
|
};
|
|
485
485
|
|
|
486
|
-
var _g$
|
|
486
|
+
var _g$4, _path$p, _path2$4, _path3$3, _path4$2, _path5$1, _path6$1, _path7$1, _path8$1, _path9$1, _path10$1, _path11$1;
|
|
487
487
|
|
|
488
488
|
function _extends$u() { _extends$u = Object.assign ? Object.assign.bind() : 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); }
|
|
489
489
|
|
|
@@ -494,12 +494,12 @@ var SvgCampaignExperiential = function SvgCampaignExperiential(props) {
|
|
|
494
494
|
viewBox: "0 0 25 24",
|
|
495
495
|
fill: "none",
|
|
496
496
|
xmlns: "http://www.w3.org/2000/svg"
|
|
497
|
-
}, props), _g$
|
|
497
|
+
}, props), _g$4 || (_g$4 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
498
498
|
opacity: 0.3
|
|
499
499
|
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
500
500
|
d: "M12.1641 24C18.7915 24 24.1641 18.6274 24.1641 12C24.1641 5.37258 18.7915 0 12.1641 0C5.53665 0 0.164062 5.37258 0.164062 12C0.164062 18.6274 5.53665 24 12.1641 24Z",
|
|
501
501
|
fill: "#D3ECDB"
|
|
502
|
-
}))), _path$
|
|
502
|
+
}))), _path$p || (_path$p = /*#__PURE__*/React__namespace.createElement("path", {
|
|
503
503
|
opacity: 0.8,
|
|
504
504
|
d: "M12.653 3.1964C8.84605 3.1964 5.76496 6.27748 5.76496 10.0844C5.76496 10.2596 5.76496 10.4347 5.7904 10.5854C5.46458 11.1861 4.98908 12.0129 4.41279 12.5138C3.98719 12.8896 4.08697 13.2907 4.13687 13.4404C4.26211 13.7662 4.61237 14.0411 5.18866 14.2417C5.38924 14.3171 5.61427 14.367 5.81485 14.4169L5.84028 16.8463C5.84028 17.7983 6.6416 18.625 7.61905 18.625L9.09645 18.1495L9.24713 19.0262C9.34693 19.6025 9.84787 20.0281 10.4496 20.0281C10.5249 20.0281 10.6003 20.0281 10.6746 20.0026L15.3084 19.1769C15.9845 19.0516 16.4101 18.4254 16.3103 17.7494L15.9845 16.1213C18.1634 14.9188 19.541 12.5891 19.541 10.0843C19.541 6.30267 16.4356 3.19629 12.6529 3.19629L12.653 3.1964Z",
|
|
505
505
|
fill: "#70C38A"
|
|
@@ -556,7 +556,7 @@ var SvgCampaignExperiential = function SvgCampaignExperiential(props) {
|
|
|
556
556
|
})));
|
|
557
557
|
};
|
|
558
558
|
|
|
559
|
-
var _path$
|
|
559
|
+
var _path$o, _path2$3, _path3$2, _path4$1;
|
|
560
560
|
|
|
561
561
|
function _extends$t() { _extends$t = Object.assign ? Object.assign.bind() : 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); }
|
|
562
562
|
|
|
@@ -567,7 +567,7 @@ var SvgCampaignCompleted = function SvgCampaignCompleted(props) {
|
|
|
567
567
|
viewBox: "0 0 24 24",
|
|
568
568
|
fill: "none",
|
|
569
569
|
xmlns: "http://www.w3.org/2000/svg"
|
|
570
|
-
}, props), _path$
|
|
570
|
+
}, props), _path$o || (_path$o = /*#__PURE__*/React__namespace.createElement("path", {
|
|
571
571
|
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",
|
|
572
572
|
fill: "#F8F9F9"
|
|
573
573
|
})), _path2$3 || (_path2$3 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -582,7 +582,7 @@ var SvgCampaignCompleted = function SvgCampaignCompleted(props) {
|
|
|
582
582
|
})));
|
|
583
583
|
};
|
|
584
584
|
|
|
585
|
-
var _path$
|
|
585
|
+
var _path$n, _path2$2, _path3$1, _path4, _path5, _path6, _path7, _path8, _path9, _path10, _path11;
|
|
586
586
|
|
|
587
587
|
function _extends$s() { _extends$s = Object.assign ? Object.assign.bind() : 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); }
|
|
588
588
|
|
|
@@ -593,7 +593,7 @@ var SvgCampaignProgress = function SvgCampaignProgress(props) {
|
|
|
593
593
|
viewBox: "0 0 24 24",
|
|
594
594
|
fill: "none",
|
|
595
595
|
xmlns: "http://www.w3.org/2000/svg"
|
|
596
|
-
}, props), _path$
|
|
596
|
+
}, props), _path$n || (_path$n = /*#__PURE__*/React__namespace.createElement("path", {
|
|
597
597
|
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",
|
|
598
598
|
fill: "#F8F9F9"
|
|
599
599
|
})), _path2$2 || (_path2$2 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -629,7 +629,7 @@ var SvgCampaignProgress = function SvgCampaignProgress(props) {
|
|
|
629
629
|
})));
|
|
630
630
|
};
|
|
631
631
|
|
|
632
|
-
var _path$
|
|
632
|
+
var _path$m, _path2$1, _path3;
|
|
633
633
|
|
|
634
634
|
function _extends$r() { _extends$r = Object.assign ? Object.assign.bind() : 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); }
|
|
635
635
|
|
|
@@ -640,7 +640,7 @@ var SvgCampaignIncoming = function SvgCampaignIncoming(props) {
|
|
|
640
640
|
viewBox: "0 0 24 24",
|
|
641
641
|
fill: "none",
|
|
642
642
|
xmlns: "http://www.w3.org/2000/svg"
|
|
643
|
-
}, props), _path$
|
|
643
|
+
}, props), _path$m || (_path$m = /*#__PURE__*/React__namespace.createElement("path", {
|
|
644
644
|
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",
|
|
645
645
|
fill: "#F8F9F9"
|
|
646
646
|
})), _path2$1 || (_path2$1 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -717,14 +717,14 @@ var Title$3 = styled__default["default"](LG)(templateObject_2$t || (templateObje
|
|
|
717
717
|
var theme = _a.theme;
|
|
718
718
|
return theme.space.xxs;
|
|
719
719
|
});
|
|
720
|
-
var Description$3 = styled__default["default"](MD)(templateObject_3$
|
|
720
|
+
var Description$3 = styled__default["default"](MD)(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n color: ", ";\n margin-top: ", ";\n"], ["\n color: ", ";\n margin-top: ", ";\n"])), function (_a) {
|
|
721
721
|
var theme = _a.theme;
|
|
722
722
|
return theme.palette.grey[700];
|
|
723
723
|
}, function (_a) {
|
|
724
724
|
var theme = _a.theme;
|
|
725
725
|
return theme.space.xxs;
|
|
726
726
|
});
|
|
727
|
-
var Container$2 = styled__default["default"].div(templateObject_4$
|
|
727
|
+
var Container$2 = styled__default["default"].div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
728
728
|
var theme = _a.theme, align = _a.align;
|
|
729
729
|
return "\n display: flex;\n align-items: ".concat(align || "start", ";\n flex-direction: column;\n flex-grow: 1;\n justify-content: start;\n padding: ").concat(theme.space.xxs, " 0;\n margin-top: ").concat(theme.space.xs, ";\n ");
|
|
730
730
|
});
|
|
@@ -732,7 +732,7 @@ var CardHeader = function (props) { return jsxRuntime.jsx(Container$2, __assign(
|
|
|
732
732
|
CardHeader.Label = Label$2;
|
|
733
733
|
CardHeader.Title = Title$3;
|
|
734
734
|
CardHeader.Text = Description$3;
|
|
735
|
-
var templateObject_1$17, templateObject_2$t, templateObject_3$
|
|
735
|
+
var templateObject_1$17, templateObject_2$t, templateObject_3$i, templateObject_4$b;
|
|
736
736
|
|
|
737
737
|
var Divider = styled__default["default"].div(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject(["\n width: 100%;\n height: 1px;\n margin-top: ", "px;\n margin-bottom: ", ";\n background-color: ", ";\n"], ["\n width: 100%;\n height: 1px;\n margin-top: ", "px;\n margin-bottom: ", ";\n background-color: ", ";\n"])), function (_a) {
|
|
738
738
|
var theme = _a.theme;
|
|
@@ -745,14 +745,14 @@ var Divider = styled__default["default"].div(templateObject_1$16 || (templateObj
|
|
|
745
745
|
return theme.palette.grey["300"];
|
|
746
746
|
});
|
|
747
747
|
var Footer$2 = styled__default["default"].div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n margin-top: auto;\n width: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n margin-top: auto;\n width: 100%;\n"])));
|
|
748
|
-
var Container$1 = styled__default["default"].div(templateObject_3$
|
|
748
|
+
var Container$1 = styled__default["default"].div(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
749
749
|
var theme = _a.theme, direction = _a.direction, justifyContent = _a.justifyContent, wrap = _a.wrap;
|
|
750
750
|
return "\n display: flex;\n align-items: center;\n flex-direction: ".concat(direction || "row", ";\n justify-content: ").concat(justifyContent || "space-between", ";\n padding: ").concat(theme.space.xxs, " 0;\n margin-top: ").concat(theme.space.xs, ";\n ").concat(wrap ? "flex-wrap: wrap;" : "", "\n ");
|
|
751
751
|
});
|
|
752
752
|
var CardFooter = function (props) { return (jsxRuntime.jsxs(Footer$2, { children: [!props.noDivider && jsxRuntime.jsx(Divider, {}), jsxRuntime.jsx(Container$1, __assign({}, props, { children: props.children }))] })); };
|
|
753
|
-
var templateObject_1$16, templateObject_2$s, templateObject_3$
|
|
753
|
+
var templateObject_1$16, templateObject_2$s, templateObject_3$h;
|
|
754
754
|
|
|
755
|
-
var UgContentCard = styled__default["default"](reactNotifications.Well)(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n"], ["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n"])), function (_a) {
|
|
755
|
+
var UgContentCard = styled__default["default"](reactNotifications.Well)(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n\n ", "\n"], ["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n height: 100%;\n display: flex;\n flex-direction: column;\n ", "\n\n ", "\n"])), function (_a) {
|
|
756
756
|
var theme = _a.theme;
|
|
757
757
|
return theme.borderRadii.lg;
|
|
758
758
|
}, function (_a) {
|
|
@@ -765,6 +765,10 @@ var UgContentCard = styled__default["default"](reactNotifications.Well)(template
|
|
|
765
765
|
var isFloating = _a.isFloating, theme = _a.theme;
|
|
766
766
|
return !isFloating &&
|
|
767
767
|
"\n &:hover {\n box-shadow: ".concat(theme.shadows.boxShadow(theme), ";\n }");
|
|
768
|
+
}, function (_a) {
|
|
769
|
+
var isDisabled = _a.isDisabled;
|
|
770
|
+
return isDisabled &&
|
|
771
|
+
"\n pointer-events: none;\n opacity: 0.7;\n ";
|
|
768
772
|
});
|
|
769
773
|
/**
|
|
770
774
|
* A SpecialCard is a spefic type of card with an opinionated set of default spaces and subcomponents order.
|
|
@@ -828,7 +832,7 @@ var StyledTagNew$1 = styled__default["default"](Tag)(templateObject_2$r || (temp
|
|
|
828
832
|
var theme = _a.theme;
|
|
829
833
|
return theme.palette.white;
|
|
830
834
|
});
|
|
831
|
-
var StyledLabel$1 = styled__default["default"](SM)(templateObject_3$
|
|
835
|
+
var StyledLabel$1 = styled__default["default"](SM)(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
|
|
832
836
|
var theme = _a.theme;
|
|
833
837
|
return theme.palette.grey["500"];
|
|
834
838
|
});
|
|
@@ -838,7 +842,7 @@ var CampaignCard = function (_a) {
|
|
|
838
842
|
var PillIcon = getTypeDataIcon(type);
|
|
839
843
|
return props.isLoading ? (jsxRuntime.jsx(CampaignCardSkeleton, {})) : (jsxRuntime.jsxs(SpecialCard, __assign({ title: campaignTitle }, props, { children: [jsxRuntime.jsxs(SpecialCard.Meta, { children: [jsxRuntime.jsx(StyledLabel$1, { 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(SpecialCard.Header, { children: [jsxRuntime.jsx(SpecialCard.Header.Label, { children: projectTitle }), jsxRuntime.jsx(SpecialCard.Header.Title, { children: campaignTitle })] }), jsxRuntime.jsxs(SpecialCard.Footer, { children: [props.pillText && (jsxRuntime.jsxs(StyledTag$2, __assign({ size: "large", isPill: true, isRegular: true, hue: theme.palette.grey[100] }, { children: [jsxRuntime.jsx(Tag.Avatar, { children: jsxRuntime.jsx(PillIcon, {}) }), jsxRuntime.jsx(Ellipsis, __assign({ style: { maxWidth: "180px" } }, { children: props.pillText }))] }))), jsxRuntime.jsx(StatusIcon, {})] })] })));
|
|
840
844
|
};
|
|
841
|
-
var templateObject_1$14, templateObject_2$r, templateObject_3$
|
|
845
|
+
var templateObject_1$14, templateObject_2$r, templateObject_3$g;
|
|
842
846
|
|
|
843
847
|
var StyledTagNew = styled__default["default"](Tag)(templateObject_1$13 || (templateObject_1$13 = __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) {
|
|
844
848
|
var theme = _a.theme;
|
|
@@ -876,14 +880,14 @@ var ServiceTitle = styled__default["default"](LG)(templateObject_2$q || (templat
|
|
|
876
880
|
var theme = _a.theme;
|
|
877
881
|
return theme.fontWeights.semibold;
|
|
878
882
|
});
|
|
879
|
-
var StyledTag$1 = styled__default["default"](Tag)(templateObject_3$
|
|
883
|
+
var StyledTag$1 = styled__default["default"](Tag)(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n margin-right: ", ";\n margin-top: ", ";\n"], ["\n margin-right: ", ";\n margin-top: ", ";\n"])), function (_a) {
|
|
880
884
|
var theme = _a.theme;
|
|
881
885
|
return theme.space.xs;
|
|
882
886
|
}, function (_a) {
|
|
883
887
|
var theme = _a.theme;
|
|
884
888
|
return theme.space.xs;
|
|
885
889
|
});
|
|
886
|
-
var CardContent = styled__default["default"].div(templateObject_4$
|
|
890
|
+
var CardContent = styled__default["default"].div(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n transition: all 0.3s ease-in-out;\n position: relative;\n z-index: 1;\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n justify-content: flex-start;\n flex-grow: 1;\n"], ["\n transition: all 0.3s ease-in-out;\n position: relative;\n z-index: 1;\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n justify-content: flex-start;\n flex-grow: 1;\n"])));
|
|
887
891
|
var ButtonsWrap$1 = styled__default["default"].div(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n width: 100%;\n margin-top: ", "px;\n\n button {\n padding: ", " 0;\n \n }\n\n button:not(:first-child) {\n margin-top: ", "px;\n }\n"], ["\n display: flex;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n width: 100%;\n margin-top: ", "px;\n\n button {\n padding: ", " 0;\n \n }\n\n button:not(:first-child) {\n margin-top: ", "px;\n }\n"])), function (_a) {
|
|
888
892
|
var theme = _a.theme;
|
|
889
893
|
return theme.space.base;
|
|
@@ -911,7 +915,7 @@ var ServiceCard = function (props) {
|
|
|
911
915
|
var serviceIcon = props.serviceIcon, serviceTitle = props.serviceTitle, serviceSubtitle = props.serviceSubtitle;
|
|
912
916
|
return (jsxRuntime.jsxs(StyledCard$1, __assign({}, props, { children: [props.isHoverable && (jsxRuntime.jsxs(HoverBody, { children: [jsxRuntime.jsxs(HoverMetaContainer, { children: [props.hoverTitle && (jsxRuntime.jsx(ServiceTitle, { children: props.hoverTitle })), props.hoverSubtitle && (jsxRuntime.jsx(ServiceSubtitle, { children: props.hoverSubtitle }))] }), props.hoverButtons && (jsxRuntime.jsx(ButtonsWrap$1, { children: props.hoverButtons.map(function (button) { return button; }) }))] })), jsxRuntime.jsxs(CardContent, { children: [jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [serviceIcon && jsxRuntime.jsx(SpecialCard.Thumb, { children: serviceIcon }), jsxRuntime.jsxs(SpecialCard.Header, { children: [jsxRuntime.jsx(SpecialCard.Header.Label, { children: serviceSubtitle }), jsxRuntime.jsx(SpecialCard.Header.Title, { children: serviceTitle })] })] }), props.tags && (jsxRuntime.jsx(SpecialCard.Footer, __assign({ justifyContent: "start", wrap: true }, { children: props.tags.map(function (tag, index) { return (jsxRuntime.jsxs(StyledTag$1, __assign({ size: "large", isPill: true, isRegular: true, hue: theme.palette.grey[100] }, { children: [jsxRuntime.jsx(StyledTag$1.Avatar, { children: tag.icon }), tag.label] }), index)); }) })))] })] })));
|
|
913
917
|
};
|
|
914
|
-
var templateObject_1$12, templateObject_2$q, templateObject_3$
|
|
918
|
+
var templateObject_1$12, templateObject_2$q, templateObject_3$f, templateObject_4$a, templateObject_5$6, templateObject_6$2, templateObject_7$1, templateObject_8$1;
|
|
915
919
|
|
|
916
920
|
var ButtonsWrap = styled__default["default"].div(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n justify-content: flex-start;\n width: 100%;\n"], ["\n display: flex;\n align-items: flex-start;\n flex-direction: column;\n justify-content: flex-start;\n width: 100%;\n"])));
|
|
917
921
|
var InfoCard = function (props) {
|
|
@@ -1043,14 +1047,14 @@ var templateObject_1$Y;
|
|
|
1043
1047
|
|
|
1044
1048
|
var Container = styled__default["default"].div(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n width: 100%;\n"], ["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n width: 100%;\n"])));
|
|
1045
1049
|
var MetaContainer$1 = styled__default["default"].div(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: center;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: center;\n"])));
|
|
1046
|
-
var ThumbContainer = styled__default["default"].div(templateObject_3$
|
|
1050
|
+
var ThumbContainer = styled__default["default"].div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n margin-right: ", ";\n width: 100%;\n max-width: ", ";\n\n > div {\n height: 100%;\n }\n"], ["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n margin-right: ", ";\n width: 100%;\n max-width: ", ";\n\n > div {\n height: 100%;\n }\n"])), function (_a) {
|
|
1047
1051
|
var theme = _a.theme;
|
|
1048
1052
|
return theme.space.sm;
|
|
1049
1053
|
}, function (_a) {
|
|
1050
1054
|
var theme = _a.theme;
|
|
1051
1055
|
return theme.components.autocomplete.thumbSize;
|
|
1052
1056
|
});
|
|
1053
|
-
var Label$1 = styled__default["default"](MD)(templateObject_4$
|
|
1057
|
+
var Label$1 = styled__default["default"](MD)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n font-weight: ", ";\n color: ", ";\n"], ["\n font-weight: ", ";\n color: ", ";\n"])), function (_a) {
|
|
1054
1058
|
var theme = _a.theme;
|
|
1055
1059
|
return theme.fontWeights.medium;
|
|
1056
1060
|
}, function (_a) {
|
|
@@ -1069,7 +1073,7 @@ var ItemContent = function (props) {
|
|
|
1069
1073
|
var thumbSrc = props.thumbSrc, description = props.description, label = props.label;
|
|
1070
1074
|
return (jsxRuntime.jsxs(Container, { children: [thumbSrc && (jsxRuntime.jsx(ThumbContainer, { children: jsxRuntime.jsx(Image$1, { src: thumbSrc }) })), jsxRuntime.jsxs(MetaContainer$1, { children: [label && jsxRuntime.jsx(Label$1, __assign({ isBold: true }, { children: label })), description && jsxRuntime.jsx(Description$2, { children: description })] })] }));
|
|
1071
1075
|
};
|
|
1072
|
-
var templateObject_1$X, templateObject_2$o, templateObject_3$
|
|
1076
|
+
var templateObject_1$X, templateObject_2$o, templateObject_3$e, templateObject_4$9, templateObject_5$5;
|
|
1073
1077
|
|
|
1074
1078
|
/**
|
|
1075
1079
|
* A Menu is a wrapper for items elements
|
|
@@ -1140,7 +1144,7 @@ var editorStyle = styled.css(templateObject_1$V || (templateObject_1$V = __makeT
|
|
|
1140
1144
|
});
|
|
1141
1145
|
var templateObject_1$V;
|
|
1142
1146
|
|
|
1143
|
-
var _path$
|
|
1147
|
+
var _path$l;
|
|
1144
1148
|
|
|
1145
1149
|
function _extends$q() { _extends$q = Object.assign ? Object.assign.bind() : 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); }
|
|
1146
1150
|
|
|
@@ -1151,122 +1155,170 @@ var SvgBoldFill = function SvgBoldFill(props) {
|
|
|
1151
1155
|
height: 16,
|
|
1152
1156
|
focusable: "false",
|
|
1153
1157
|
viewBox: "0 0 16 16"
|
|
1154
|
-
}, props), _path$
|
|
1158
|
+
}, props), _path$l || (_path$l = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1155
1159
|
fill: "currentColor",
|
|
1156
1160
|
d: "M7.5 0C9.952 0 12 2.048 12 4.5a4.483 4.483 0 01-1.27 3.108C12.078 8.39 13 9.855 13 11.5c0 2.452-2.048 4.5-4.5 4.5H4a1 1 0 01-1-1V1a1 1 0 011-1h3.5zM5 14h3.5c1.348 0 2.5-1.152 2.5-2.5S9.848 9 8.5 9H5v5zM7.5 2H5v5h2.5C8.848 7 10 5.848 10 4.5S8.848 2 7.5 2z"
|
|
1157
1161
|
})));
|
|
1158
1162
|
};
|
|
1159
1163
|
|
|
1160
|
-
var _path$
|
|
1164
|
+
var _path$k;
|
|
1161
1165
|
|
|
1162
1166
|
function _extends$p() { _extends$p = Object.assign ? Object.assign.bind() : 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); }
|
|
1163
1167
|
|
|
1164
|
-
var
|
|
1168
|
+
var SvgItalicFill = function SvgItalicFill(props) {
|
|
1165
1169
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$p({
|
|
1166
1170
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1167
1171
|
width: 16,
|
|
1168
1172
|
height: 16,
|
|
1169
1173
|
focusable: "false",
|
|
1170
1174
|
viewBox: "0 0 16 16"
|
|
1171
|
-
}, props), _path$
|
|
1172
|
-
fill: "
|
|
1173
|
-
|
|
1175
|
+
}, props), _path$k || (_path$k = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1176
|
+
fill: "none",
|
|
1177
|
+
stroke: "currentColor",
|
|
1178
|
+
strokeLinecap: "round",
|
|
1179
|
+
strokeWidth: 2,
|
|
1180
|
+
d: "M8 1h3M9.5 1l-3 14M5 15h3"
|
|
1174
1181
|
})));
|
|
1175
1182
|
};
|
|
1176
1183
|
|
|
1177
|
-
var _path$
|
|
1184
|
+
var _path$j, _path2;
|
|
1178
1185
|
|
|
1179
1186
|
function _extends$o() { _extends$o = Object.assign ? Object.assign.bind() : 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); }
|
|
1180
1187
|
|
|
1181
|
-
var
|
|
1188
|
+
var SvgQuoteFill = function SvgQuoteFill(props) {
|
|
1182
1189
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$o({
|
|
1183
1190
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1184
1191
|
width: 16,
|
|
1185
1192
|
height: 16,
|
|
1186
1193
|
focusable: "false",
|
|
1187
1194
|
viewBox: "0 0 16 16"
|
|
1188
|
-
}, props), _path$
|
|
1195
|
+
}, props), _path$j || (_path$j = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1196
|
+
fill: "currentColor",
|
|
1197
|
+
d: "M7 8H4c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v3c0 .55-.45 1-1 1zm6 0h-3c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v3c0 .55-.45 1-1 1z"
|
|
1198
|
+
})), _path2 || (_path2 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1189
1199
|
fill: "none",
|
|
1190
1200
|
stroke: "currentColor",
|
|
1191
1201
|
strokeLinecap: "round",
|
|
1192
1202
|
strokeWidth: 2,
|
|
1193
|
-
d: "
|
|
1203
|
+
d: "M5.5 12C6.5 11 7 9.5 7 8V6m4.5 6c1-1 1.5-2.5 1.5-4V6"
|
|
1194
1204
|
})));
|
|
1195
1205
|
};
|
|
1196
1206
|
|
|
1197
|
-
var
|
|
1207
|
+
var _g$3;
|
|
1198
1208
|
|
|
1199
1209
|
function _extends$n() { _extends$n = Object.assign ? Object.assign.bind() : 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); }
|
|
1200
1210
|
|
|
1201
|
-
var
|
|
1211
|
+
var SvgH1Fill = function SvgH1Fill(props) {
|
|
1202
1212
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$n({
|
|
1203
1213
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1204
1214
|
width: 16,
|
|
1205
1215
|
height: 16,
|
|
1206
1216
|
focusable: "false",
|
|
1207
1217
|
viewBox: "0 0 16 16"
|
|
1208
|
-
}, props),
|
|
1218
|
+
}, props), _g$3 || (_g$3 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
1219
|
+
transform: "translate(-464 -332)"
|
|
1220
|
+
}, /*#__PURE__*/React__namespace.createElement("rect", {
|
|
1221
|
+
width: 16,
|
|
1222
|
+
height: 16,
|
|
1223
|
+
transform: "translate(464 332)",
|
|
1224
|
+
fill: "none"
|
|
1225
|
+
}), /*#__PURE__*/React__namespace.createElement("path", {
|
|
1226
|
+
d: "M3,1V12.273M11.052,1V12.273M3,6.636h8.052",
|
|
1227
|
+
transform: "translate(462 333.5)",
|
|
1209
1228
|
fill: "none",
|
|
1210
1229
|
stroke: "currentColor",
|
|
1211
1230
|
strokeLinecap: "round",
|
|
1212
|
-
|
|
1213
|
-
})
|
|
1231
|
+
strokeWidth: 2
|
|
1232
|
+
}), /*#__PURE__*/React__namespace.createElement("path", {
|
|
1233
|
+
fill: "currentColor",
|
|
1234
|
+
d: "M1.755,15A.731.731,0,0,1,1,14.375a.7.7,0,0,1,.617-.739l.136-.011H2.51V6.346l-.22.2a.81.81,0,0,1-1.018.043.646.646,0,0,1-.137-.92l.086-.1L2.731,4.2l.063-.051.094-.058.091-.041.094-.028.082-.016L3.2,4l.082,0a.734.734,0,0,1,.094.007L3.265,4l.08,0,.113.019.1.028.115.055.083.055L3.8,4.2l.056.056.063.085.045.082.03.085.023.113,0,.063v8.937h.755a.731.731,0,0,1,.753.625.7.7,0,0,1-.617.739L4.775,15Z",
|
|
1235
|
+
transform: "translate(474.469 331)"
|
|
1236
|
+
}))));
|
|
1214
1237
|
};
|
|
1215
1238
|
|
|
1216
|
-
var
|
|
1239
|
+
var _g$2;
|
|
1217
1240
|
|
|
1218
1241
|
function _extends$m() { _extends$m = Object.assign ? Object.assign.bind() : 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); }
|
|
1219
1242
|
|
|
1220
|
-
var
|
|
1243
|
+
var SvgH2Fill = function SvgH2Fill(props) {
|
|
1221
1244
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$m({
|
|
1222
1245
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1223
1246
|
width: 16,
|
|
1224
1247
|
height: 16,
|
|
1225
1248
|
focusable: "false",
|
|
1226
1249
|
viewBox: "0 0 16 16"
|
|
1227
|
-
}, props),
|
|
1228
|
-
|
|
1229
|
-
|
|
1230
|
-
|
|
1250
|
+
}, props), _g$2 || (_g$2 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
1251
|
+
transform: "translate(-464 -332)"
|
|
1252
|
+
}, /*#__PURE__*/React__namespace.createElement("rect", {
|
|
1253
|
+
width: 16,
|
|
1254
|
+
height: 16,
|
|
1255
|
+
transform: "translate(464 332)",
|
|
1256
|
+
fill: "none"
|
|
1257
|
+
}), /*#__PURE__*/React__namespace.createElement("path", {
|
|
1258
|
+
d: "M3,1V12.273M11.052,1V12.273M3,6.636h8.052",
|
|
1259
|
+
transform: "translate(462 333.5)",
|
|
1231
1260
|
fill: "none",
|
|
1232
1261
|
stroke: "currentColor",
|
|
1233
1262
|
strokeLinecap: "round",
|
|
1234
|
-
strokeWidth: 2
|
|
1235
|
-
|
|
1236
|
-
|
|
1263
|
+
strokeWidth: 2
|
|
1264
|
+
}), /*#__PURE__*/React__namespace.createElement("path", {
|
|
1265
|
+
fill: "currentColor",
|
|
1266
|
+
d: "M5.5,6.75a2.576,2.576,0,1,1,5.141,0,4.961,4.961,0,0,1-1.1,3l-.256.348-1,1.291a8.564,8.564,0,0,0-1.222,2.047l-.071.191H10a.656.656,0,0,1,.632.564l.01.124a.677.677,0,0,1-.527.676L10,15H6.143a.627.627,0,0,1-.5-.252.723.723,0,0,1-.133-.57,8.183,8.183,0,0,1,1.753-3.637L8.24,9.292l.085-.111A3.975,3.975,0,0,0,9.355,6.75a1.288,1.288,0,1,0-2.57,0,.644.644,0,1,1-1.285,0Z",
|
|
1267
|
+
transform: "translate(469.359 331)"
|
|
1268
|
+
}))));
|
|
1237
1269
|
};
|
|
1238
1270
|
|
|
1239
|
-
var
|
|
1271
|
+
var _g$1;
|
|
1240
1272
|
|
|
1241
1273
|
function _extends$l() { _extends$l = Object.assign ? Object.assign.bind() : 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); }
|
|
1242
1274
|
|
|
1243
|
-
var
|
|
1275
|
+
var SvgH3Fill = function SvgH3Fill(props) {
|
|
1244
1276
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$l({
|
|
1245
1277
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1246
1278
|
width: 16,
|
|
1247
1279
|
height: 16,
|
|
1248
1280
|
focusable: "false",
|
|
1249
1281
|
viewBox: "0 0 16 16"
|
|
1250
|
-
}, props),
|
|
1282
|
+
}, props), _g$1 || (_g$1 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
1283
|
+
transform: "translate(-464 -332)"
|
|
1284
|
+
}, /*#__PURE__*/React__namespace.createElement("rect", {
|
|
1285
|
+
width: 16,
|
|
1286
|
+
height: 16,
|
|
1287
|
+
transform: "translate(464 332)",
|
|
1288
|
+
fill: "none"
|
|
1289
|
+
}), /*#__PURE__*/React__namespace.createElement("path", {
|
|
1290
|
+
d: "M3,1V12.273M11.052,1V12.273M3,6.636h8.052",
|
|
1291
|
+
transform: "translate(462 333.5)",
|
|
1251
1292
|
fill: "none",
|
|
1252
1293
|
stroke: "currentColor",
|
|
1253
1294
|
strokeLinecap: "round",
|
|
1254
|
-
|
|
1255
|
-
})
|
|
1295
|
+
strokeWidth: 2
|
|
1296
|
+
}), /*#__PURE__*/React__namespace.createElement("path", {
|
|
1297
|
+
fill: "currentColor",
|
|
1298
|
+
d: "M15.375,4A.658.658,0,0,1,16,4.688a3.531,3.531,0,0,1-.744,1.665l-.3.44-.171.238-.384.514-.438.568-.136.168.145.043a2.839,2.839,0,0,1,1.95,2.5l.031.225.015.151.021.294.01.334,0,.424a3.323,3.323,0,0,1-.3,1.339A2.286,2.286,0,0,1,13.5,15c-1.6,0-2.5-1-2.5-2.75a.628.628,0,1,1,1.25,0c0,1,.345,1.375,1.25,1.375a1.053,1.053,0,0,0,1.081-.652,1.9,1.9,0,0,0,.169-.723l0-.378-.015-.415-.021-.238c-.134-1.172-.653-1.719-2.149-1.719a.625.625,0,0,1-.571-.407.741.741,0,0,1,.106-.739l.494-.61.446-.564.4-.518.347-.465.3-.41.282-.411H11.625a.645.645,0,0,1-.615-.564L11,4.688a.673.673,0,0,1,.512-.676L11.625,4Z",
|
|
1299
|
+
transform: "translate(464.001 331)"
|
|
1300
|
+
}))));
|
|
1256
1301
|
};
|
|
1257
1302
|
|
|
1258
|
-
var
|
|
1303
|
+
var StyledIconButton = styled__default["default"](IconButton)(templateObject_1$U || (templateObject_1$U = __makeTemplateObject([""], [""])));
|
|
1304
|
+
var MenuContainer = styled__default["default"](Card)(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n padding: ", ";\n\n ", " {\n :first-child {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n :last-child {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n\n :not(:first-child):not(:last-child) {\n border-radius: 0;\n }\n }\n"], ["\n padding: ", ";\n\n ", " {\n :first-child {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n :last-child {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n\n :not(:first-child):not(:last-child) {\n border-radius: 0;\n }\n }\n"])), function (_a) {
|
|
1259
1305
|
var theme = _a.theme;
|
|
1260
1306
|
return theme.space.xxs;
|
|
1261
|
-
});
|
|
1307
|
+
}, StyledIconButton);
|
|
1262
1308
|
var FloatingMenu = function (props) {
|
|
1263
1309
|
var editor = props.editor;
|
|
1264
1310
|
if (!editor) {
|
|
1265
1311
|
return null;
|
|
1266
1312
|
}
|
|
1267
|
-
return (jsxRuntime.jsx(react.BubbleMenu, __assign({}, props, { editor: editor }, { children: jsxRuntime.jsxs(MenuContainer, __assign({ isFloating: true }, { children: [jsxRuntime.jsx(
|
|
1313
|
+
return (jsxRuntime.jsx(react.BubbleMenu, __assign({}, props, { editor: editor }, { children: jsxRuntime.jsxs(MenuContainer, __assign({ isFloating: true }, { children: [jsxRuntime.jsx(StyledIconButton, __assign({ size: "small", onClick: function () {
|
|
1314
|
+
return editor.chain().focus().toggleHeading({ level: 1 }).run();
|
|
1315
|
+
}, isBasic: !editor.isActive("heading", { level: 1 }), isPrimary: editor.isActive("heading", { level: 1 }), isPill: false }, { children: jsxRuntime.jsx(SvgH1Fill, {}, "ug-h1-button-bubble-menu") })), jsxRuntime.jsx(StyledIconButton, __assign({ size: "small", onClick: function () {
|
|
1316
|
+
return editor.chain().focus().toggleHeading({ level: 2 }).run();
|
|
1317
|
+
}, isBasic: !editor.isActive("heading", { level: 2 }), isPrimary: editor.isActive("heading", { level: 2 }), isPill: false }, { children: jsxRuntime.jsx(SvgH2Fill, {}, "ug-h2-button-bubble-menu") })), jsxRuntime.jsx(StyledIconButton, __assign({ size: "small", onClick: function () {
|
|
1318
|
+
return editor.chain().focus().toggleHeading({ level: 3 }).run();
|
|
1319
|
+
}, isBasic: !editor.isActive("heading", { level: 3 }), isPrimary: editor.isActive("heading", { level: 3 }), isPill: false }, { children: jsxRuntime.jsx(SvgH3Fill, {}, "ug-h3-button-bubble-menu") })), jsxRuntime.jsx(StyledIconButton, __assign({ size: "small", onClick: function () { return editor.chain().focus().toggleBold().run(); }, isBasic: !editor.isActive("bold"), isPrimary: editor.isActive("bold"), isPill: false }, { children: jsxRuntime.jsx(SvgBoldFill, {}, "ug-bold-button-bubble-menu") })), jsxRuntime.jsx(StyledIconButton, __assign({ size: "small", onClick: function () { return editor.chain().focus().toggleItalic().run(); }, isBasic: !editor.isActive("italic"), isPrimary: editor.isActive("italic"), isPill: false }, { children: jsxRuntime.jsx(SvgItalicFill, {}, "ug-italic-button-bubble-menu") })), jsxRuntime.jsx(StyledIconButton, __assign({ size: "small", onClick: function () { return editor.chain().focus().toggleBlockquote().run(); }, isBasic: !editor.isActive("blockquote"), isPrimary: editor.isActive("blockquote"), isPill: false }, { children: jsxRuntime.jsx(SvgQuoteFill, {}, "ug-quote-button-bubble-menu") }))] })) })));
|
|
1268
1320
|
};
|
|
1269
|
-
var templateObject_1$U;
|
|
1321
|
+
var templateObject_1$U, templateObject_2$n;
|
|
1270
1322
|
|
|
1271
1323
|
var Header$1 = styled__default["default"].div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n padding: ", " ", ";\n border-bottom: 1px solid ", ";\n"], ["\n display: flex;\n flex-direction: column;\n padding: ", " ", ";\n border-bottom: 1px solid ", ";\n"])), function (_a) {
|
|
1272
1324
|
var theme = _a.theme;
|
|
@@ -1278,7 +1330,7 @@ var Header$1 = styled__default["default"].div(templateObject_1$T || (templateObj
|
|
|
1278
1330
|
var theme = _a.theme;
|
|
1279
1331
|
return theme.palette.grey[300];
|
|
1280
1332
|
});
|
|
1281
|
-
var Title$2 = styled__default["default"](MD)(templateObject_2$
|
|
1333
|
+
var Title$2 = styled__default["default"](MD)(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
1282
1334
|
var validation = _a.validation, theme = _a.theme;
|
|
1283
1335
|
if (validation === "success") {
|
|
1284
1336
|
return "color: ".concat(theme.colors.successHue, ";");
|
|
@@ -1297,7 +1349,7 @@ var EditorHeader = function (props) {
|
|
|
1297
1349
|
var title = props.title, validation = props.validation;
|
|
1298
1350
|
return (jsxRuntime.jsx(Header$1, { children: jsxRuntime.jsx(Title$2, __assign({ isBold: true, validation: validation }, { children: title || "Write" })) }));
|
|
1299
1351
|
};
|
|
1300
|
-
var templateObject_1$T, templateObject_2$
|
|
1352
|
+
var templateObject_1$T, templateObject_2$m;
|
|
1301
1353
|
|
|
1302
1354
|
var Footer$1 = styled__default["default"].div(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n padding: ", " 16px;\n background-color: ", ";\n"], ["\n display: flex;\n flex-direction: row;\n padding: ", " 16px;\n background-color: ", ";\n"])), function (_a) {
|
|
1303
1355
|
var theme = _a.theme;
|
|
@@ -1306,12 +1358,12 @@ var Footer$1 = styled__default["default"].div(templateObject_1$S || (templateObj
|
|
|
1306
1358
|
var theme = _a.theme;
|
|
1307
1359
|
return theme.palette.grey[100];
|
|
1308
1360
|
});
|
|
1309
|
-
var Text = styled__default["default"](SM)(templateObject_2$
|
|
1361
|
+
var Text = styled__default["default"](SM)(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n line-height: 1.7;\n"], ["\n line-height: 1.7;\n"])));
|
|
1310
1362
|
var EditorFooter = function (_a) {
|
|
1311
1363
|
var saveText = _a.saveText;
|
|
1312
1364
|
return jsxRuntime.jsxs(Footer$1, { children: [jsxRuntime.jsxs(Tag, { children: [isMac() ? "Cmd" : "Ctrl", "+enter"] }), "\u00A0", jsxRuntime.jsx(Text, { children: saveText || "to save" })] });
|
|
1313
1365
|
};
|
|
1314
|
-
var templateObject_1$S, templateObject_2$
|
|
1366
|
+
var templateObject_1$S, templateObject_2$l;
|
|
1315
1367
|
|
|
1316
1368
|
var EditorContainer = styled__default["default"].div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n border: 2px solid;\n border-radius: ", ";\n &:focus-within {\n outline: ", ";\n outline-style: solid;\n }\n\n ", "\n\n ", "\n\n .ProseMirror {\n padding: ", ";\n background-color: #fff;\n min-height: 100px;\n outline: none;\n\n ", "\n\n ", "\n }\n"], ["\n border: 2px solid;\n border-radius: ", ";\n &:focus-within {\n outline: ", ";\n outline-style: solid;\n }\n\n ", "\n\n ", "\n\n .ProseMirror {\n padding: ", ";\n background-color: #fff;\n min-height: 100px;\n outline: none;\n\n ", "\n\n ", "\n }\n"])), function (_a) {
|
|
1317
1369
|
var theme = _a.theme;
|
|
@@ -1421,43 +1473,7 @@ var UgLabel$1 = styled__default["default"](reactForms.Label)(templateObject_1$P
|
|
|
1421
1473
|
var Label = function (props) { return jsxRuntime.jsx(UgLabel$1, __assign({}, props)); };
|
|
1422
1474
|
var templateObject_1$P;
|
|
1423
1475
|
|
|
1424
|
-
var
|
|
1425
|
-
var flexColumnCenter = styled.css(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n ", ";\n flex-direction: column;\n"], ["\n ", ";\n flex-direction: column;\n"])), flexCenter);
|
|
1426
|
-
var flexStart = styled.css(templateObject_3$e || (templateObject_3$e = __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) {
|
|
1427
|
-
var theme = _a.theme;
|
|
1428
|
-
return (theme.rtl ? "flex-end" : "flex-start");
|
|
1429
|
-
});
|
|
1430
|
-
var cardStyle = styled.css(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n display: flex;\n flex-direction: column;\n height: 100%;\n position: relative;\n overflow: hidden;\n\n &:hover {\n box-shadow: ", ";\n }\n\n cursor: pointer;\n"], ["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n display: flex;\n flex-direction: column;\n height: 100%;\n position: relative;\n overflow: hidden;\n\n &:hover {\n box-shadow: ", ";\n }\n\n cursor: pointer;\n"])), function (_a) {
|
|
1431
|
-
var theme = _a.theme;
|
|
1432
|
-
return theme.borderRadii.lg;
|
|
1433
|
-
}, function (_a) {
|
|
1434
|
-
var theme = _a.theme;
|
|
1435
|
-
return theme.components.notification.card.padding;
|
|
1436
|
-
}, function (_a) {
|
|
1437
|
-
var theme = _a.theme;
|
|
1438
|
-
return theme.palette.grey["200"];
|
|
1439
|
-
}, function (_a) {
|
|
1440
|
-
var theme = _a.theme;
|
|
1441
|
-
return theme.shadows.boxShadow(theme);
|
|
1442
|
-
});
|
|
1443
|
-
var templateObject_1$O, templateObject_2$l, templateObject_3$e, templateObject_4$9;
|
|
1444
|
-
|
|
1445
|
-
styled__default["default"](Card)(templateObject_1$N || (templateObject_1$N = __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) {
|
|
1446
|
-
var theme = _a.theme;
|
|
1447
|
-
return theme.palette.blue[300];
|
|
1448
|
-
});
|
|
1449
|
-
styled__default["default"].div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n margin: ", "px auto;\n"], ["\n margin: ", "px auto;\n"])), function (_a) {
|
|
1450
|
-
var theme = _a.theme;
|
|
1451
|
-
return theme.space.base;
|
|
1452
|
-
});
|
|
1453
|
-
styled__default["default"](Label)(templateObject_3$d || (templateObject_3$d = __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) {
|
|
1454
|
-
var theme = _a.theme;
|
|
1455
|
-
return theme.space.base;
|
|
1456
|
-
}, function (_a) {
|
|
1457
|
-
var theme = _a.theme;
|
|
1458
|
-
return theme.palette.grey[700];
|
|
1459
|
-
});
|
|
1460
|
-
var StyledLabel = styled__default["default"](Label)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n margin: ", "px auto;\n"], ["\n margin: ", "px auto;\n"])), function (_a) {
|
|
1476
|
+
var StyledLabel = styled__default["default"](Label)(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n margin: ", "px auto;\n"], ["\n margin: ", "px auto;\n"])), function (_a) {
|
|
1461
1477
|
var theme = _a.theme;
|
|
1462
1478
|
return theme.space.base;
|
|
1463
1479
|
});
|
|
@@ -1470,14 +1486,14 @@ var CheckboxCard = function (props) {
|
|
|
1470
1486
|
};
|
|
1471
1487
|
return (jsxRuntime.jsxs(SpecialCard, __assign({ title: props.label }, cardArgs, (props && !props.disabled && { onClick: handleToggle }), { className: checked ? "card-active" : "" }, { children: [jsxRuntime.jsx(SpecialCard.Thumb, __assign({ isStretched: true }, { children: props.iconActive && checked ? props.iconActive : props.icon })), jsxRuntime.jsx(SpecialCard.Header, __assign({ align: "center" }, { children: jsxRuntime.jsx(SpecialCard.Header.Text, { children: jsxRuntime.jsx(MD, __assign({ isBold: true, style: checked ? { color: theme.colors.primaryHue } : {} }, { children: props.label })) }) })), jsxRuntime.jsx(SpecialCard.Footer, __assign({ direction: "column", justifyContent: "center", noDivider: true }, { children: 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 })) })) }))] })));
|
|
1472
1488
|
};
|
|
1473
|
-
var templateObject_1$
|
|
1489
|
+
var templateObject_1$O;
|
|
1474
1490
|
|
|
1475
|
-
var UgField = styled__default["default"](reactForms.Field)(templateObject_1$
|
|
1491
|
+
var UgField = styled__default["default"](reactForms.Field)(templateObject_1$N || (templateObject_1$N = __makeTemplateObject([""], [""])));
|
|
1476
1492
|
/**
|
|
1477
1493
|
* A Field is a wrapper for input elements
|
|
1478
1494
|
**/
|
|
1479
1495
|
var Field = function (props) { return jsxRuntime.jsx(UgField, __assign({}, props)); };
|
|
1480
|
-
var templateObject_1$
|
|
1496
|
+
var templateObject_1$N;
|
|
1481
1497
|
|
|
1482
1498
|
var index = /*#__PURE__*/Object.freeze({
|
|
1483
1499
|
__proto__: null,
|
|
@@ -1485,8 +1501,8 @@ var index = /*#__PURE__*/Object.freeze({
|
|
|
1485
1501
|
Hint: reactForms.Hint
|
|
1486
1502
|
});
|
|
1487
1503
|
|
|
1488
|
-
var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$
|
|
1489
|
-
var Hint = styled__default["default"](reactForms.Hint)(templateObject_2$
|
|
1504
|
+
var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$M || (templateObject_1$M = __makeTemplateObject([""], [""])));
|
|
1505
|
+
var Hint = styled__default["default"](reactForms.Hint)(templateObject_2$k || (templateObject_2$k = __makeTemplateObject([""], [""])));
|
|
1490
1506
|
/**
|
|
1491
1507
|
* An Input lets users enter text into a field.
|
|
1492
1508
|
* <hr>
|
|
@@ -1495,9 +1511,9 @@ var Hint = styled__default["default"](reactForms.Hint)(templateObject_2$j || (te
|
|
|
1495
1511
|
* - To enter multiline text, use a Textarea
|
|
1496
1512
|
**/
|
|
1497
1513
|
var Input = function (props) { return jsxRuntime.jsx(UgInput, __assign({}, props)); };
|
|
1498
|
-
var templateObject_1$
|
|
1514
|
+
var templateObject_1$M, templateObject_2$k;
|
|
1499
1515
|
|
|
1500
|
-
var UgMediaInput = styled__default["default"](reactForms.MediaInput)(templateObject_1$
|
|
1516
|
+
var UgMediaInput = styled__default["default"](reactForms.MediaInput)(templateObject_1$L || (templateObject_1$L = __makeTemplateObject([""], [""])));
|
|
1501
1517
|
/**
|
|
1502
1518
|
* Media elements add even more context to an input.
|
|
1503
1519
|
* <hr>
|
|
@@ -1506,9 +1522,9 @@ var UgMediaInput = styled__default["default"](reactForms.MediaInput)(templateObj
|
|
|
1506
1522
|
* - To enter multiline text, use a Textarea
|
|
1507
1523
|
**/
|
|
1508
1524
|
var MediaInput = function (props) { return jsxRuntime.jsx(UgMediaInput, __assign({}, props)); };
|
|
1509
|
-
var templateObject_1$
|
|
1525
|
+
var templateObject_1$L;
|
|
1510
1526
|
|
|
1511
|
-
var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$
|
|
1527
|
+
var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$K || (templateObject_1$K = __makeTemplateObject([""], [""])));
|
|
1512
1528
|
/**
|
|
1513
1529
|
* Radio buttons let users choose a single option among two or more mutually exclusive options.
|
|
1514
1530
|
* <hr>
|
|
@@ -1520,7 +1536,7 @@ var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$J ||
|
|
|
1520
1536
|
* - To select from a long list of options, use Select instead
|
|
1521
1537
|
**/
|
|
1522
1538
|
var Radio = function (props) { return jsxRuntime.jsx(UgRadio, __assign({}, props)); };
|
|
1523
|
-
var templateObject_1$
|
|
1539
|
+
var templateObject_1$K;
|
|
1524
1540
|
|
|
1525
1541
|
var _path$i;
|
|
1526
1542
|
|
|
@@ -1540,7 +1556,7 @@ var SvgCheckLg = function SvgCheckLg(props) {
|
|
|
1540
1556
|
})));
|
|
1541
1557
|
};
|
|
1542
1558
|
|
|
1543
|
-
var StyledText = styled__default["default"](reactTypography.LG)(templateObject_1$
|
|
1559
|
+
var StyledText = styled__default["default"](reactTypography.LG)(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n margin: ", "px auto;\n color: ", ";\n font-weight: ", ";\n user-select: none;\n\n &:focus {\n outline: 0;\n }\n"], ["\n margin: ", "px auto;\n color: ", ";\n font-weight: ", ";\n user-select: none;\n\n &:focus {\n outline: 0;\n }\n"])), function (_a) {
|
|
1544
1560
|
var theme = _a.theme;
|
|
1545
1561
|
return theme.space.base;
|
|
1546
1562
|
}, function (_a) {
|
|
@@ -1550,7 +1566,7 @@ var StyledText = styled__default["default"](reactTypography.LG)(templateObject_1
|
|
|
1550
1566
|
var theme = _a.theme;
|
|
1551
1567
|
return theme.fontWeights.medium;
|
|
1552
1568
|
});
|
|
1553
|
-
var Circle = styled__default["default"].div(templateObject_2$
|
|
1569
|
+
var Circle = styled__default["default"].div(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n border-radius: 50%;\n background-color: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n margin-left: auto;\n ", "\n"], ["\n width: ", "px;\n height: ", "px;\n padding: ", "px;\n border-radius: 50%;\n background-color: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n margin-left: auto;\n ", "\n"])), function (_a) {
|
|
1554
1570
|
var theme = _a.theme;
|
|
1555
1571
|
return theme.space.base * 6;
|
|
1556
1572
|
}, function (_a) {
|
|
@@ -1574,9 +1590,9 @@ var RadioCard = function (_a) {
|
|
|
1574
1590
|
props.onChecked && props.onChecked(props.value);
|
|
1575
1591
|
} }, { children: [jsxRuntime.jsx(SpecialCard.Meta, __assign({ justifyContent: "end" }, { children: jsxRuntime.jsx(Circle, __assign({ checked: (_b = props.checked) !== null && _b !== void 0 ? _b : false }, { children: jsxRuntime.jsx(SvgCheckLg, { fill: "white" }) })) })), jsxRuntime.jsx(SpecialCard.Thumb, __assign({ isStretched: true }, { children: iconActive && props.checked ? iconActive : icon })), jsxRuntime.jsx("input", { hidden: true, type: "radio", value: props.value, name: props.name, checked: props.checked }), jsxRuntime.jsx(SpecialCard.Footer, __assign({ direction: "column", justifyContent: "center" }, { children: jsxRuntime.jsx(StyledText, __assign({ style: props.checked ? { color: theme.colors.primaryHue } : {} }, { children: props.label })) }))] })));
|
|
1576
1592
|
};
|
|
1577
|
-
var templateObject_1$
|
|
1593
|
+
var templateObject_1$J, templateObject_2$j;
|
|
1578
1594
|
|
|
1579
|
-
var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_1$
|
|
1595
|
+
var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_1$I || (templateObject_1$I = __makeTemplateObject([""], [""])));
|
|
1580
1596
|
/**
|
|
1581
1597
|
* A Textarea is a form control for multi-line text.
|
|
1582
1598
|
* <hr>
|
|
@@ -1584,9 +1600,9 @@ var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_
|
|
|
1584
1600
|
* - To enter multi-line text
|
|
1585
1601
|
**/
|
|
1586
1602
|
var Textarea = function (props) { return jsxRuntime.jsx(UgTextarea, __assign({}, props)); };
|
|
1587
|
-
var templateObject_1$
|
|
1603
|
+
var templateObject_1$I;
|
|
1588
1604
|
|
|
1589
|
-
var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$
|
|
1605
|
+
var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$H || (templateObject_1$H = __makeTemplateObject([""], [""])));
|
|
1590
1606
|
/**
|
|
1591
1607
|
* 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.
|
|
1592
1608
|
* <hr>
|
|
@@ -1597,11 +1613,11 @@ var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$G
|
|
|
1597
1613
|
* - To let users select from a list of settings, use Checkboxes instead
|
|
1598
1614
|
**/
|
|
1599
1615
|
var Toggle = function (props) { return jsxRuntime.jsx(UgToggle, __assign({}, props)); };
|
|
1600
|
-
var templateObject_1$
|
|
1616
|
+
var templateObject_1$H;
|
|
1601
1617
|
|
|
1602
|
-
var StyledCol$1 = styled__default["default"](reactGrid.Col)(templateObject_1$
|
|
1618
|
+
var StyledCol$1 = styled__default["default"](reactGrid.Col)(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n margin-bottom: ", ";\n\n @media screen and (max-width: ", ") {\n margin-bottom: ", ";\n }\n"], ["\n margin-bottom: ", ";\n\n @media screen and (max-width: ", ") {\n margin-bottom: ", ";\n }\n"])), theme.space.lg, theme.breakpoints.sm, theme.space.md);
|
|
1603
1619
|
var Col = function (props) { return jsxRuntime.jsx(StyledCol$1, __assign({}, props)); };
|
|
1604
|
-
var templateObject_1$
|
|
1620
|
+
var templateObject_1$G;
|
|
1605
1621
|
|
|
1606
1622
|
var Row$1 = function (props) { return jsxRuntime.jsx(reactGrid.Row, __assign({}, props)); };
|
|
1607
1623
|
|
|
@@ -1664,15 +1680,15 @@ var SvgUgTriangle = function SvgUgTriangle(props) {
|
|
|
1664
1680
|
})));
|
|
1665
1681
|
};
|
|
1666
1682
|
|
|
1667
|
-
var StyledUgIcon$1 = styled__default["default"].span(templateObject_1$
|
|
1683
|
+
var StyledUgIcon$1 = styled__default["default"].span(templateObject_1$F || (templateObject_1$F = __makeTemplateObject([""], [""])));
|
|
1668
1684
|
var Icon = function (props) {
|
|
1669
1685
|
var type = props.type, size = props.size;
|
|
1670
1686
|
var dim = size !== null && size !== void 0 ? size : 24;
|
|
1671
1687
|
return (jsxRuntime.jsxs(StyledUgIcon$1, { children: [type === "square" && jsxRuntime.jsx(SvgUgSquare, { width: dim, height: dim }), type === "triangle" && jsxRuntime.jsx(SvgUgTriangle, { width: dim, height: dim }), type === "circle" && jsxRuntime.jsx(SvgUgCircle, { width: dim, height: dim })] }));
|
|
1672
1688
|
};
|
|
1673
|
-
var templateObject_1$
|
|
1689
|
+
var templateObject_1$F;
|
|
1674
1690
|
|
|
1675
|
-
var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObject_1$
|
|
1691
|
+
var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObject_1$E || (templateObject_1$E = __makeTemplateObject([""], [""])));
|
|
1676
1692
|
/**
|
|
1677
1693
|
* A Progress loader communicates progress when downloading or uploading content.
|
|
1678
1694
|
* <hr>
|
|
@@ -1684,9 +1700,9 @@ var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObjec
|
|
|
1684
1700
|
- When loading page content, use a Skeleton loader instead
|
|
1685
1701
|
*/
|
|
1686
1702
|
var Progress = function (props) { return jsxRuntime.jsx(UgProgress, __assign({}, props)); };
|
|
1687
|
-
var templateObject_1$
|
|
1703
|
+
var templateObject_1$E;
|
|
1688
1704
|
|
|
1689
|
-
var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_1$
|
|
1705
|
+
var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_1$D || (templateObject_1$D = __makeTemplateObject([""], [""])));
|
|
1690
1706
|
/**
|
|
1691
1707
|
* Breadcrumbs mark and communicate a user’s location in the product.
|
|
1692
1708
|
* <hr>
|
|
@@ -1695,9 +1711,9 @@ var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_
|
|
|
1695
1711
|
- To provide a quick way to navigate to ancestor pages
|
|
1696
1712
|
*/
|
|
1697
1713
|
var Spinner = function (props) { return jsxRuntime.jsx(UgSpinner, __assign({}, props)); };
|
|
1698
|
-
var templateObject_1$
|
|
1714
|
+
var templateObject_1$D;
|
|
1699
1715
|
|
|
1700
|
-
var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$
|
|
1716
|
+
var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
|
|
1701
1717
|
var theme = _a.theme;
|
|
1702
1718
|
return theme.palette.white;
|
|
1703
1719
|
});
|
|
@@ -1705,7 +1721,7 @@ var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$B ||
|
|
|
1705
1721
|
* A Body defines the main content of an HTML document which displays on the browser
|
|
1706
1722
|
*/
|
|
1707
1723
|
var Body$1 = function (props) { return jsxRuntime.jsx(UgBody, __assign({}, props)); };
|
|
1708
|
-
var templateObject_1$
|
|
1724
|
+
var templateObject_1$C;
|
|
1709
1725
|
|
|
1710
1726
|
/**
|
|
1711
1727
|
* A Content defines the main content of an HTML document which displays on the browser
|
|
@@ -1729,23 +1745,23 @@ var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
|
|
|
1729
1745
|
})));
|
|
1730
1746
|
};
|
|
1731
1747
|
|
|
1732
|
-
var UgHeaderItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$
|
|
1748
|
+
var UgHeaderItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n ", ";\n font-family: ", ";\n"], ["\n ", ";\n font-family: ", ";\n"])), function (props) { return props.hasLogo && "border-right: none"; }, function (_a) {
|
|
1733
1749
|
var theme = _a.theme;
|
|
1734
1750
|
return theme.fonts.system;
|
|
1735
1751
|
});
|
|
1736
|
-
styled__default["default"](reactChrome.HeaderItemWrapper)(templateObject_2$
|
|
1752
|
+
styled__default["default"](reactChrome.HeaderItemWrapper)(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n font-family: ", ";\n"], ["\n font-family: ", ";\n"])), function (_a) {
|
|
1737
1753
|
var theme = _a.theme;
|
|
1738
1754
|
return theme.fonts.system;
|
|
1739
1755
|
});
|
|
1740
1756
|
var HeaderItem = function (props) { return jsxRuntime.jsx(UgHeaderItem, __assign({}, props)); };
|
|
1741
|
-
var templateObject_1$
|
|
1757
|
+
var templateObject_1$B, templateObject_2$i;
|
|
1742
1758
|
|
|
1743
|
-
var UgHeaderItemText = styled__default["default"](reactChrome.HeaderItemText)(templateObject_1$
|
|
1759
|
+
var UgHeaderItemText = styled__default["default"](reactChrome.HeaderItemText)(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n font-family: ", ";\n"], ["\n font-family: ", ";\n"])), function (_a) {
|
|
1744
1760
|
var theme = _a.theme;
|
|
1745
1761
|
return theme.fonts.system;
|
|
1746
1762
|
});
|
|
1747
1763
|
var HeaderItemText = function (props) { return jsxRuntime.jsx(UgHeaderItemText, __assign({}, props)); };
|
|
1748
|
-
var templateObject_1$
|
|
1764
|
+
var templateObject_1$A;
|
|
1749
1765
|
|
|
1750
1766
|
var HeaderItemIcon = function (props) { return (jsxRuntime.jsx(reactChrome.HeaderItemIcon, __assign({}, props))); };
|
|
1751
1767
|
|
|
@@ -1794,7 +1810,7 @@ var SvgMenuStroke = function SvgMenuStroke(props) {
|
|
|
1794
1810
|
})));
|
|
1795
1811
|
};
|
|
1796
1812
|
|
|
1797
|
-
var StyledEllipsis = styled__default["default"](Ellipsis)(templateObject_1$
|
|
1813
|
+
var StyledEllipsis = styled__default["default"](Ellipsis)(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
1798
1814
|
var theme = _a.theme, isCompact = _a.isCompact;
|
|
1799
1815
|
return isCompact &&
|
|
1800
1816
|
"\n width: ".concat(theme.components.chrome.nav.workspaceDropdownWidth, "px; \n ");
|
|
@@ -1810,13 +1826,13 @@ var WorkspacesDropdown = function (props) {
|
|
|
1810
1826
|
? selectedWorkspace.company + "'s workspace"
|
|
1811
1827
|
: "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 }))); })] })] })));
|
|
1812
1828
|
};
|
|
1813
|
-
var templateObject_1$
|
|
1829
|
+
var templateObject_1$z;
|
|
1814
1830
|
|
|
1815
|
-
var LogoIconContainer = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$
|
|
1831
|
+
var LogoIconContainer = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$y || (templateObject_1$y = __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) {
|
|
1816
1832
|
var theme = _a.theme;
|
|
1817
1833
|
return theme.breakpoints.md;
|
|
1818
1834
|
});
|
|
1819
|
-
var BrandName = styled__default["default"](reactChrome.HeaderItem)(templateObject_2$
|
|
1835
|
+
var BrandName = styled__default["default"](reactChrome.HeaderItem)(templateObject_2$h || (templateObject_2$h = __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) {
|
|
1820
1836
|
var theme = _a.theme;
|
|
1821
1837
|
return theme.colors.primaryHue;
|
|
1822
1838
|
}, function (_a) {
|
|
@@ -1826,7 +1842,7 @@ var BrandName = styled__default["default"](reactChrome.HeaderItem)(templateObjec
|
|
|
1826
1842
|
var theme = _a.theme;
|
|
1827
1843
|
return theme.breakpoints.md;
|
|
1828
1844
|
});
|
|
1829
|
-
var DropdownItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_3$
|
|
1845
|
+
var DropdownItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_3$d || (templateObject_3$d = __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) {
|
|
1830
1846
|
var theme = _a.theme;
|
|
1831
1847
|
return theme.colors.primaryHue;
|
|
1832
1848
|
}, function (_a) {
|
|
@@ -1836,7 +1852,7 @@ var DropdownItem = styled__default["default"](reactChrome.HeaderItem)(templateOb
|
|
|
1836
1852
|
var theme = _a.theme;
|
|
1837
1853
|
return theme.breakpoints.md;
|
|
1838
1854
|
});
|
|
1839
|
-
var MenuItem$1 = styled__default["default"](reactChrome.HeaderItem)(templateObject_4$
|
|
1855
|
+
var MenuItem$1 = styled__default["default"](reactChrome.HeaderItem)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n color: ", ";\n position: absolute;\n left: 0;\n @media (min-width: ", ") {\n display: none;\n }\n"], ["\n color: ", ";\n position: absolute;\n left: 0;\n @media (min-width: ", ") {\n display: none;\n }\n"])), function (_a) {
|
|
1840
1856
|
var theme = _a.theme;
|
|
1841
1857
|
return theme.colors.primaryHue;
|
|
1842
1858
|
}, function (_a) {
|
|
@@ -1846,9 +1862,9 @@ var MenuItem$1 = styled__default["default"](reactChrome.HeaderItem)(templateObje
|
|
|
1846
1862
|
var BrandItem = function (props) {
|
|
1847
1863
|
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 }) }))) }))] }));
|
|
1848
1864
|
};
|
|
1849
|
-
var templateObject_1$
|
|
1865
|
+
var templateObject_1$y, templateObject_2$h, templateObject_3$d, templateObject_4$8;
|
|
1850
1866
|
|
|
1851
|
-
var UgHeader = styled__default["default"](reactChrome.Header)(templateObject_1$
|
|
1867
|
+
var UgHeader = styled__default["default"](reactChrome.Header)(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n height: ", ";\n"], ["\n height: ", ";\n"])), theme.components.chrome.header.height);
|
|
1852
1868
|
/**
|
|
1853
1869
|
* An Header is a visual way to display general information.
|
|
1854
1870
|
* This can include navList Items, modal, profile settings.
|
|
@@ -1857,13 +1873,13 @@ var Header = function (props) { return jsxRuntime.jsx(UgHeader, __assign({}, pro
|
|
|
1857
1873
|
Header.HeaderItem = HeaderItem;
|
|
1858
1874
|
Header.HeaderItemText = HeaderItemText;
|
|
1859
1875
|
Header.HeaderItemIcon = HeaderItemIcon;
|
|
1860
|
-
var templateObject_1$
|
|
1876
|
+
var templateObject_1$x;
|
|
1861
1877
|
|
|
1862
1878
|
var HeaderSkeleton = function () {
|
|
1863
1879
|
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%" } }) }) }) }))] })));
|
|
1864
1880
|
};
|
|
1865
1881
|
|
|
1866
|
-
var ChevronButton = styled__default["default"](IconButton)(templateObject_1$
|
|
1882
|
+
var ChevronButton = styled__default["default"](IconButton)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n @media (max-width: ", ") {\n display: none;\n }\n"], ["\n @media (max-width: ", ") {\n display: none;\n }\n"])), function (_a) {
|
|
1867
1883
|
var theme = _a.theme;
|
|
1868
1884
|
return theme.breakpoints.sm;
|
|
1869
1885
|
});
|
|
@@ -1875,9 +1891,9 @@ var AppHeader = function (_a) {
|
|
|
1875
1891
|
var brand = _a.brand, avatar = _a.avatar, isLoading = _a.isLoading, args = __rest(_a, ["brand", "avatar", "isLoading"]);
|
|
1876
1892
|
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, {}) }))] }) }) }))] })));
|
|
1877
1893
|
};
|
|
1878
|
-
var templateObject_1$
|
|
1894
|
+
var templateObject_1$w;
|
|
1879
1895
|
|
|
1880
|
-
var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$
|
|
1896
|
+
var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$v || (templateObject_1$v = __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) {
|
|
1881
1897
|
var theme = _a.theme;
|
|
1882
1898
|
return theme.borders.sm;
|
|
1883
1899
|
}, function (_a) {
|
|
@@ -1904,10 +1920,10 @@ var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$u || (t
|
|
|
1904
1920
|
- To give a consistent dashboard and navigation experience
|
|
1905
1921
|
*/
|
|
1906
1922
|
var Nav = function (props) { return jsxRuntime.jsx(UgNav, __assign({}, props)); };
|
|
1907
|
-
var templateObject_1$
|
|
1923
|
+
var templateObject_1$v;
|
|
1908
1924
|
|
|
1909
|
-
var SelectedItemStyle = styled.css(templateObject_1$
|
|
1910
|
-
var UgNavItem$2 = styled__default["default"](reactChrome.NavItem)(templateObject_2$
|
|
1925
|
+
var SelectedItemStyle = styled.css(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (props) { return props.theme.palette.kale["100"]; });
|
|
1926
|
+
var UgNavItem$2 = styled__default["default"](reactChrome.NavItem)(templateObject_2$g || (templateObject_2$g = __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) {
|
|
1911
1927
|
var theme = _a.theme;
|
|
1912
1928
|
return theme.fonts.system;
|
|
1913
1929
|
}, function (props) { return !props.isExpanded && "display: none;"; }, function (props) { return props.isCurrent && SelectedItemStyle; }, SelectedItemStyle, function (props) { return props.theme.colors.primaryHue; }, function (props) { return props.theme.fontWeights.medium; }, function (props) {
|
|
@@ -1918,11 +1934,11 @@ var NavItem = function (props) {
|
|
|
1918
1934
|
// const { isExpanded } = props;
|
|
1919
1935
|
return jsxRuntime.jsx(UgNavItem$2, __assign({}, props));
|
|
1920
1936
|
};
|
|
1921
|
-
var templateObject_1$
|
|
1937
|
+
var templateObject_1$u, templateObject_2$g;
|
|
1922
1938
|
|
|
1923
|
-
var UgNavIcon = styled__default["default"](reactChrome.NavItemIcon)(templateObject_1$
|
|
1939
|
+
var UgNavIcon = styled__default["default"](reactChrome.NavItemIcon)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject([""], [""])));
|
|
1924
1940
|
var NavItemIcon = function (props) { return jsxRuntime.jsx(UgNavIcon, __assign({}, props)); };
|
|
1925
|
-
var templateObject_1$
|
|
1941
|
+
var templateObject_1$t;
|
|
1926
1942
|
|
|
1927
1943
|
var NavItemText = function (props) { return (jsxRuntime.jsx(reactChrome.NavItemText, __assign({}, props, { children: jsxRuntime.jsx(Ellipsis, __assign({ style: { width: "200px" } }, { children: props.children })) }))); };
|
|
1928
1944
|
|
|
@@ -1960,7 +1976,7 @@ var SvgChevronLeftStroke = function SvgChevronLeftStroke(props) {
|
|
|
1960
1976
|
})));
|
|
1961
1977
|
};
|
|
1962
1978
|
|
|
1963
|
-
var StyledToggle = styled__default["default"](IconButton)(templateObject_1$
|
|
1979
|
+
var StyledToggle = styled__default["default"](IconButton)(templateObject_1$s || (templateObject_1$s = __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) {
|
|
1964
1980
|
var theme = _a.theme;
|
|
1965
1981
|
return theme.space.base * 6;
|
|
1966
1982
|
}, function (_a) {
|
|
@@ -1985,18 +2001,18 @@ var StyledToggle = styled__default["default"](IconButton)(templateObject_1$r ||
|
|
|
1985
2001
|
var NavToggle = function (props) {
|
|
1986
2002
|
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%" } })) })));
|
|
1987
2003
|
};
|
|
1988
|
-
var templateObject_1$
|
|
2004
|
+
var templateObject_1$s;
|
|
1989
2005
|
|
|
1990
|
-
var UgNavItem$1 = styled__default["default"](reactChrome.NavItem)(templateObject_1$
|
|
2006
|
+
var UgNavItem$1 = styled__default["default"](reactChrome.NavItem)(templateObject_1$r || (templateObject_1$r = __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;"; });
|
|
1991
2007
|
var NavDivider = function (props) { return (jsxRuntime.jsx(UgNavItem$1, __assign({}, props, { children: jsxRuntime.jsx("span", { children: props.children }) }))); };
|
|
1992
|
-
var templateObject_1$
|
|
2008
|
+
var templateObject_1$r;
|
|
1993
2009
|
|
|
1994
|
-
var UgProjectSubtitle = styled__default["default"](NavItemText)(templateObject_1$
|
|
1995
|
-
var UgNavItem = styled__default["default"](NavItem)(templateObject_2$
|
|
2010
|
+
var UgProjectSubtitle = styled__default["default"](NavItemText)(templateObject_1$q || (templateObject_1$q = __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; });
|
|
2011
|
+
var UgNavItem = styled__default["default"](NavItem)(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n flex-flow: column;\n align-items: flex-start;\n"], ["\n flex-flow: column;\n align-items: flex-start;\n"])));
|
|
1996
2012
|
var NavItemProject = function (props) { return jsxRuntime.jsx(UgNavItem, __assign({}, props)); };
|
|
1997
2013
|
NavItemProject.Title = NavItemText;
|
|
1998
2014
|
NavItemProject.SubTitle = UgProjectSubtitle;
|
|
1999
|
-
var templateObject_1$
|
|
2015
|
+
var templateObject_1$q, templateObject_2$f;
|
|
2000
2016
|
|
|
2001
2017
|
var _path$a;
|
|
2002
2018
|
|
|
@@ -2165,7 +2181,7 @@ var SvgTemplatesActive = function SvgTemplatesActive(props) {
|
|
|
2165
2181
|
})))));
|
|
2166
2182
|
};
|
|
2167
2183
|
|
|
2168
|
-
var StyledNav = styled__default["default"](Nav)(templateObject_1$
|
|
2184
|
+
var StyledNav = styled__default["default"](Nav)(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n ", ";\n"], ["\n ", ";\n"])), function (_a) {
|
|
2169
2185
|
var isExpanded = _a.isExpanded, theme = _a.theme;
|
|
2170
2186
|
return isExpanded && "width: ".concat(theme.components.chrome.nav.openWidth);
|
|
2171
2187
|
});
|
|
@@ -2173,11 +2189,11 @@ var LoadingSidebar = function (props) {
|
|
|
2173
2189
|
var isExpanded = props.isExpanded;
|
|
2174
2190
|
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" })] }))] })));
|
|
2175
2191
|
};
|
|
2176
|
-
var templateObject_1$
|
|
2192
|
+
var templateObject_1$p;
|
|
2177
2193
|
|
|
2178
|
-
var TokenContainer = styled__default["default"].div(templateObject_1$
|
|
2179
|
-
var ScrollingContainer = styled__default["default"].div(templateObject_2$
|
|
2180
|
-
var StyledNavItem = styled__default["default"](NavItem)(templateObject_3$
|
|
2194
|
+
var TokenContainer = styled__default["default"].div(templateObject_1$o || (templateObject_1$o = __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"])));
|
|
2195
|
+
var ScrollingContainer = styled__default["default"].div(templateObject_2$e || (templateObject_2$e = __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"])));
|
|
2196
|
+
var StyledNavItem = styled__default["default"](NavItem)(templateObject_3$c || (templateObject_3$c = __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) {
|
|
2181
2197
|
var isExpanded = _a.isExpanded;
|
|
2182
2198
|
return isExpanded &&
|
|
2183
2199
|
"\n display: block;\n padding-right: ".concat(theme.space.md, ";\n ");
|
|
@@ -2212,9 +2228,9 @@ var Sidebar = function (props) {
|
|
|
2212
2228
|
} }, { 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 === "services", onClick: function () { return navigate("services"); } }, { children: [jsxRuntime.jsx(NavItemIcon, __assign({ isStyled: true }, { children: nav === "services" ? jsxRuntime.jsx(SvgTemplatesActive, {}) : jsxRuntime.jsx(SvgTemplates, {}) })), jsxRuntime.jsx(NavItemText, { children: props.servicesItemLabel || "Services" })] })), jsxRuntime.jsxs(NavDivider, __assign({ isExpanded: props.isExpanded }, { children: [jsxRuntime.jsx(SvgFolderIcon, {}), " ", props.dividerLabel || ""] })), jsxRuntime.jsx(ScrollingContainer, { children: props.projects &&
|
|
2213
2229
|
props.projects.map(function (project) { return (jsxRuntime.jsxs(NavItemProject, __assign({ isExpanded: props.isExpanded, isCurrent: nav === "projects/".concat(project.id), onClick: function () { return navigate("projects", 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" })] }))] })));
|
|
2214
2230
|
};
|
|
2215
|
-
var templateObject_1$
|
|
2231
|
+
var templateObject_1$o, templateObject_2$e, templateObject_3$c;
|
|
2216
2232
|
|
|
2217
|
-
var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$
|
|
2233
|
+
var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$n || (templateObject_1$n = __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) {
|
|
2218
2234
|
var theme = _a.theme;
|
|
2219
2235
|
return theme.breakpoints.sm;
|
|
2220
2236
|
}, function (_a) {
|
|
@@ -2225,21 +2241,21 @@ var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$m ||
|
|
|
2225
2241
|
* A Main defines the main content of an HTML document which displays on the browser
|
|
2226
2242
|
*/
|
|
2227
2243
|
var Main$1 = function (props) { return jsxRuntime.jsx(UgMain, __assign({}, props)); };
|
|
2228
|
-
var templateObject_1$
|
|
2244
|
+
var templateObject_1$n;
|
|
2229
2245
|
|
|
2230
|
-
var StyledHr = styled__default["default"].hr(templateObject_1$
|
|
2246
|
+
var StyledHr = styled__default["default"].hr(templateObject_1$m || (templateObject_1$m = __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]);
|
|
2231
2247
|
var PageLoader = function () {
|
|
2232
2248
|
var isSidebarOpen = window.matchMedia("only screen and (min-width: 576px)").matches;
|
|
2233
2249
|
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$1, { 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: "" }) }))] })] })] })] }) })));
|
|
2234
2250
|
};
|
|
2235
|
-
var templateObject_1$
|
|
2251
|
+
var templateObject_1$m;
|
|
2236
2252
|
|
|
2237
2253
|
/**
|
|
2238
2254
|
* Title is a basic component used to display a title. Often used in card headers.
|
|
2239
2255
|
*/
|
|
2240
2256
|
var Title$1 = function (props) { return jsxRuntime.jsx(reactNotifications.Title, __assign({}, props)); };
|
|
2241
2257
|
|
|
2242
|
-
var StyledCard = styled__default["default"](ContainerCard)(templateObject_1$
|
|
2258
|
+
var StyledCard = styled__default["default"](ContainerCard)(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n @media screen and (max-width: ", ") {\n border: 0;\n }\n"], ["\n @media screen and (max-width: ", ") {\n border: 0;\n }\n"])), theme.breakpoints.sm);
|
|
2243
2259
|
/**
|
|
2244
2260
|
* Login Form
|
|
2245
2261
|
* <hr>
|
|
@@ -2270,9 +2286,9 @@ var LoginForm = function (props) {
|
|
|
2270
2286
|
: false, isPrimary: true, isPill: true, themeColor: theme.colors.accentHue, 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 })) })))] })));
|
|
2271
2287
|
} }))] })), 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"] })))] }));
|
|
2272
2288
|
};
|
|
2273
|
-
var templateObject_1$
|
|
2289
|
+
var templateObject_1$l;
|
|
2274
2290
|
|
|
2275
|
-
var ugModalBody = styled__default["default"](reactModals.Body)(templateObject_1$
|
|
2291
|
+
var ugModalBody = styled__default["default"](reactModals.Body)(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
|
|
2276
2292
|
var theme = _a.theme;
|
|
2277
2293
|
return theme.palette.grey["800"];
|
|
2278
2294
|
});
|
|
@@ -2281,10 +2297,10 @@ var FooterItem = reactModals.FooterItem;
|
|
|
2281
2297
|
Modal.Header = reactModals.Header;
|
|
2282
2298
|
Modal.Body = ugModalBody;
|
|
2283
2299
|
Modal.Footer = reactModals.Footer;
|
|
2284
|
-
var templateObject_1$
|
|
2300
|
+
var templateObject_1$k;
|
|
2285
2301
|
|
|
2286
|
-
var StyledModal$1 = styled__default["default"](Modal)(templateObject_1$
|
|
2287
|
-
var StyledHeader = styled__default["default"](Modal.Header)(templateObject_2$
|
|
2302
|
+
var StyledModal$1 = styled__default["default"](Modal)(templateObject_1$j || (templateObject_1$j = __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"])));
|
|
2303
|
+
var StyledHeader = styled__default["default"](Modal.Header)(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-direction: row;\n padding: ", ";\n\n @media (max-width: ", ") {\n padding: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-direction: row;\n padding: ", ";\n\n @media (max-width: ", ") {\n padding: ", ";\n }\n"])), function (_a) {
|
|
2288
2304
|
var theme = _a.theme;
|
|
2289
2305
|
return "".concat(theme.space.sm, " ").concat(theme.space.base * 6, "px");
|
|
2290
2306
|
}, function (_a) {
|
|
@@ -2294,7 +2310,7 @@ var StyledHeader = styled__default["default"](Modal.Header)(templateObject_2$c |
|
|
|
2294
2310
|
var theme = _a.theme;
|
|
2295
2311
|
return theme.space.md;
|
|
2296
2312
|
});
|
|
2297
|
-
var StyledBody$4 = styled__default["default"](Modal.Body)(templateObject_3$
|
|
2313
|
+
var StyledBody$4 = styled__default["default"](Modal.Body)(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n background-color: ", ";\n padding: ", ";\n\n @media (max-width: ", ") {\n padding: ", ";\n }\n"], ["\n background-color: ", ";\n padding: ", ";\n\n @media (max-width: ", ") {\n padding: ", ";\n }\n"])), function (_a) {
|
|
2298
2314
|
var theme = _a.theme;
|
|
2299
2315
|
return theme.palette.grey["100"];
|
|
2300
2316
|
}, function (_a) {
|
|
@@ -2307,7 +2323,7 @@ var StyledBody$4 = styled__default["default"](Modal.Body)(templateObject_3$a ||
|
|
|
2307
2323
|
var theme = _a.theme;
|
|
2308
2324
|
return "".concat(theme.space.lg, " ").concat(theme.space.md);
|
|
2309
2325
|
});
|
|
2310
|
-
var StyledFooter = styled__default["default"](Modal.Footer)(templateObject_4$
|
|
2326
|
+
var StyledFooter = styled__default["default"](Modal.Footer)(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n padding: ", "px\n ", "px;\n"], ["\n padding: ", "px\n ", "px;\n"])), function (_a) {
|
|
2311
2327
|
var theme = _a.theme;
|
|
2312
2328
|
return theme.space.base * 4;
|
|
2313
2329
|
}, function (_a) {
|
|
@@ -2321,7 +2337,7 @@ ModalFullScreen.Body = StyledBody$4;
|
|
|
2321
2337
|
ModalFullScreen.Footer = StyledFooter;
|
|
2322
2338
|
ModalFullScreen.Close = StyledModalClose;
|
|
2323
2339
|
ModalFullScreen.FooterItem = FooterItem;
|
|
2324
|
-
var templateObject_1$
|
|
2340
|
+
var templateObject_1$j, templateObject_2$d, templateObject_3$b, templateObject_4$7, templateObject_5$4;
|
|
2325
2341
|
|
|
2326
2342
|
/**
|
|
2327
2343
|
* The Chrome component provides a high-level layout structure and sets a framework for navigating around Zendesk products.
|
|
@@ -2342,7 +2358,7 @@ var Notification = function (props) { return (jsxRuntime.jsx(reactNotifications.
|
|
|
2342
2358
|
var ToastProvider = function (props) { return jsxRuntime.jsx(reactNotifications.ToastProvider, __assign({}, props)); };
|
|
2343
2359
|
var useToast = reactNotifications.useToast;
|
|
2344
2360
|
|
|
2345
|
-
var UgPagination = styled__default["default"](reactPagination.Pagination)(templateObject_1$
|
|
2361
|
+
var UgPagination = styled__default["default"](reactPagination.Pagination)(templateObject_1$i || (templateObject_1$i = __makeTemplateObject([""], [""])));
|
|
2346
2362
|
/**
|
|
2347
2363
|
* Pagination separates content into pages and allows users to navigate between those pages.
|
|
2348
2364
|
|
|
@@ -2352,21 +2368,21 @@ var UgPagination = styled__default["default"](reactPagination.Pagination)(templa
|
|
|
2352
2368
|
*/
|
|
2353
2369
|
var Pagination = function (props) { return jsxRuntime.jsx(UgPagination, __assign({}, props)); };
|
|
2354
2370
|
var CursorPagination = reactPagination.CursorPagination;
|
|
2355
|
-
var templateObject_1$
|
|
2371
|
+
var templateObject_1$i;
|
|
2356
2372
|
|
|
2357
|
-
var MainContainer = styled__default["default"].div(templateObject_1$
|
|
2358
|
-
var InformationContainer = styled__default["default"].div(templateObject_2$
|
|
2373
|
+
var MainContainer = styled__default["default"].div(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
2374
|
+
var InformationContainer = styled__default["default"].div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n padding: ", "; 0;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n flex-wrap: wrap;\n flex-direction: column;\n\n @media screen and (max-width: ", ") \n height: auto;\n } \n"], ["\n padding: ", "; 0;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n flex-wrap: wrap;\n flex-direction: column;\n\n @media screen and (max-width: ", ") \n height: auto;\n } \n"])), function (_a) {
|
|
2359
2375
|
var theme = _a.theme;
|
|
2360
2376
|
return theme.space.xs;
|
|
2361
2377
|
}, function (_a) {
|
|
2362
2378
|
var theme = _a.theme;
|
|
2363
2379
|
return theme.breakpoints.sm;
|
|
2364
2380
|
});
|
|
2365
|
-
var MetaContainer = styled__default["default"].div(templateObject_3$
|
|
2381
|
+
var MetaContainer = styled__default["default"].div(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: row;\n flex-wrap: wrap;\n\n @media screen and (max-width: ", ") {\n display: none;\n }\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: row;\n flex-wrap: wrap;\n\n @media screen and (max-width: ", ") {\n display: none;\n }\n"])), function (_a) {
|
|
2366
2382
|
var theme = _a.theme;
|
|
2367
2383
|
return theme.breakpoints.sm;
|
|
2368
2384
|
});
|
|
2369
|
-
var Overline = styled__default["default"](MD)(templateObject_4$
|
|
2385
|
+
var Overline = styled__default["default"](MD)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n color: ", ";\n margin-bottom: ", ";\n font-weight: ", ";\n line-height: ", ";\n"], ["\n color: ", ";\n margin-bottom: ", ";\n font-weight: ", ";\n line-height: ", ";\n"])), function (_a) {
|
|
2370
2386
|
var theme = _a.theme;
|
|
2371
2387
|
return theme.palette.grey[600];
|
|
2372
2388
|
}, function (_a) {
|
|
@@ -2417,9 +2433,9 @@ var Image = styled__default["default"].img(templateObject_9 || (templateObject_9
|
|
|
2417
2433
|
var Main = function (props) {
|
|
2418
2434
|
return (jsxRuntime.jsx(MainContainer, { children: jsxRuntime.jsxs(Row$1, { children: [jsxRuntime.jsx(StyledCol, __assign({ xs: 12, sm: props.metaImage ? 6 : 12 }, { children: jsxRuntime.jsxs(InformationContainer, { children: [props.infoOverline && jsxRuntime.jsx(Overline, { children: props.infoOverline }), props.infoTitle && jsxRuntime.jsx(Title, { children: props.infoTitle }), props.infoDescription && (jsxRuntime.jsx(Description$1, { children: props.infoDescription })), props.infoCounters && jsxRuntime.jsx(Counters, { children: props.infoCounters })] }) })), props.metaImage && (jsxRuntime.jsx(StyledCol, __assign({ xs: 12, sm: props.metaImage ? 6 : 12 }, { children: jsxRuntime.jsx(MetaContainer, { children: jsxRuntime.jsx(Image, { src: props.metaImage, title: props.infoTitle, alt: props.infoTitle }) }) })))] }) }));
|
|
2419
2435
|
};
|
|
2420
|
-
var templateObject_1$
|
|
2436
|
+
var templateObject_1$h, templateObject_2$c, templateObject_3$a, templateObject_4$6, templateObject_5$3, templateObject_6$1, templateObject_7, templateObject_8, templateObject_9;
|
|
2421
2437
|
|
|
2422
|
-
var StyledPageHeader = styled__default["default"].div(templateObject_1$
|
|
2438
|
+
var StyledPageHeader = styled__default["default"].div(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n background-color: ", ";\n padding: ", ";\n box-sizing: border-box;\n border-bottom: 1px solid ", ";\n\n @media (max-width: ", ") {\n padding: ", ";\n }\n\n max-width: ", ";\n\n @media (min-width: ", ") {\n margin: 0 auto;\n }\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n background-color: ", ";\n padding: ", ";\n box-sizing: border-box;\n border-bottom: 1px solid ", ";\n\n @media (max-width: ", ") {\n padding: ", ";\n }\n\n max-width: ", ";\n\n @media (min-width: ", ") {\n margin: 0 auto;\n }\n"])), function (_a) {
|
|
2423
2439
|
var theme = _a.theme;
|
|
2424
2440
|
return theme.palette.white;
|
|
2425
2441
|
}, function (_a) {
|
|
@@ -2434,15 +2450,21 @@ var StyledPageHeader = styled__default["default"].div(templateObject_1$f || (tem
|
|
|
2434
2450
|
}, function (_a) {
|
|
2435
2451
|
var theme = _a.theme;
|
|
2436
2452
|
return "".concat(theme.space.md, " ").concat(theme.space.md, " ").concat(theme.space.xs);
|
|
2453
|
+
}, function (_a) {
|
|
2454
|
+
var theme = _a.theme;
|
|
2455
|
+
return theme.breakpoints.xl;
|
|
2456
|
+
}, function (_a) {
|
|
2457
|
+
var theme = _a.theme;
|
|
2458
|
+
return theme.breakpoints.xl;
|
|
2437
2459
|
});
|
|
2438
|
-
var PullLeft = styled__default["default"].div(templateObject_2$
|
|
2460
|
+
var PullLeft = styled__default["default"].div(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n flex-wrap: wrap;\n width: 100%;\n padding: ", ";\n margin-bottom: ", ";\n"], ["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n flex-wrap: wrap;\n width: 100%;\n padding: ", ";\n margin-bottom: ", ";\n"])), function (_a) {
|
|
2439
2461
|
var theme = _a.theme;
|
|
2440
2462
|
return "".concat(theme.space.xs, " 10px");
|
|
2441
2463
|
}, function (_a) {
|
|
2442
2464
|
var theme = _a.theme;
|
|
2443
2465
|
return theme.space.xs;
|
|
2444
2466
|
});
|
|
2445
|
-
var ButtonContainer = styled__default["default"].div(templateObject_3$
|
|
2467
|
+
var ButtonContainer = styled__default["default"].div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n flex-wrap: wrap;\n width: 100%;\n margin: ", " 0;\n"], ["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n flex-wrap: wrap;\n width: 100%;\n margin: ", " 0;\n"])), function (_a) {
|
|
2446
2468
|
var theme = _a.theme;
|
|
2447
2469
|
return theme.space.md;
|
|
2448
2470
|
});
|
|
@@ -2463,7 +2485,7 @@ var PageHeader = function (props) {
|
|
|
2463
2485
|
PageHeader.Breadcrumb = StyledBreadcrumb;
|
|
2464
2486
|
PageHeader.Main = Main;
|
|
2465
2487
|
PageHeader.Buttons = Buttons;
|
|
2466
|
-
var templateObject_1$
|
|
2488
|
+
var templateObject_1$g, templateObject_2$b, templateObject_3$9;
|
|
2467
2489
|
|
|
2468
2490
|
var _path$5;
|
|
2469
2491
|
|
|
@@ -2502,9 +2524,30 @@ var SvgThumbsUp = function SvgThumbsUp(props) {
|
|
|
2502
2524
|
})));
|
|
2503
2525
|
};
|
|
2504
2526
|
|
|
2505
|
-
var StyledMenuItemIcon = styled__default["default"].div(templateObject_1$
|
|
2527
|
+
var StyledMenuItemIcon = styled__default["default"].div(templateObject_1$f || (templateObject_1$f = __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; });
|
|
2506
2528
|
var MenuItemIcon = function (props) { return (jsxRuntime.jsx(StyledMenuItemIcon, __assign({ isVisible: true }, props, { children: jsxRuntime.jsx(SvgChevronRightStroke, {}) }))); };
|
|
2507
|
-
var templateObject_1$
|
|
2529
|
+
var templateObject_1$f;
|
|
2530
|
+
|
|
2531
|
+
var flexCenter = styled.css(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
|
|
2532
|
+
var flexColumnCenter = styled.css(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n ", ";\n flex-direction: column;\n"], ["\n ", ";\n flex-direction: column;\n"])), flexCenter);
|
|
2533
|
+
var flexStart = styled.css(templateObject_3$8 || (templateObject_3$8 = __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) {
|
|
2534
|
+
var theme = _a.theme;
|
|
2535
|
+
return (theme.rtl ? "flex-end" : "flex-start");
|
|
2536
|
+
});
|
|
2537
|
+
styled.css(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n display: flex;\n flex-direction: column;\n height: 100%;\n position: relative;\n overflow: hidden;\n\n &:hover {\n box-shadow: ", ";\n }\n\n cursor: pointer;\n"], ["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n display: flex;\n flex-direction: column;\n height: 100%;\n position: relative;\n overflow: hidden;\n\n &:hover {\n box-shadow: ", ";\n }\n\n cursor: pointer;\n"])), function (_a) {
|
|
2538
|
+
var theme = _a.theme;
|
|
2539
|
+
return theme.borderRadii.lg;
|
|
2540
|
+
}, function (_a) {
|
|
2541
|
+
var theme = _a.theme;
|
|
2542
|
+
return theme.components.notification.card.padding;
|
|
2543
|
+
}, function (_a) {
|
|
2544
|
+
var theme = _a.theme;
|
|
2545
|
+
return theme.palette.grey["200"];
|
|
2546
|
+
}, function (_a) {
|
|
2547
|
+
var theme = _a.theme;
|
|
2548
|
+
return theme.shadows.boxShadow(theme);
|
|
2549
|
+
});
|
|
2550
|
+
var templateObject_1$e, templateObject_2$a, templateObject_3$8, templateObject_4$5;
|
|
2508
2551
|
|
|
2509
2552
|
/**
|
|
2510
2553
|
* 1. Allows an item to contain a positioned sub-menu.
|