@appquality/unguess-design-system 2.10.1 → 2.10.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +36 -0
- package/build/index.d.ts +3 -1
- package/build/index.js +274 -186
- package/build/stories/drawers/index.d.ts +7 -0
- package/package.json +1 -1
- package/build/stories/drawer/_types.d.ts +0 -30
- package/build/stories/drawer/index.d.ts +0 -11
- package/build/stories/drawer/index.stories.d.ts +0 -13
- package/build/stories/drawer/loremIpsum.d.ts +0 -2
package/build/index.js
CHANGED
|
@@ -17,9 +17,9 @@ var React = require('react');
|
|
|
17
17
|
var reactLoaders = require('@zendeskgarden/react-loaders');
|
|
18
18
|
var reactModals = require('@zendeskgarden/react-modals');
|
|
19
19
|
var reactDropdowns = require('@zendeskgarden/react-dropdowns');
|
|
20
|
+
var reactTypography = require('@zendeskgarden/react-typography');
|
|
20
21
|
var reactGrid = require('@zendeskgarden/react-grid');
|
|
21
22
|
var reactChrome = require('@zendeskgarden/react-chrome');
|
|
22
|
-
var reactTypography = require('@zendeskgarden/react-typography');
|
|
23
23
|
var formik = require('formik');
|
|
24
24
|
var reactPagination = require('@zendeskgarden/react-pagination');
|
|
25
25
|
var reactTables = require('@zendeskgarden/react-tables');
|
|
@@ -236,8 +236,8 @@ var components = __assign(__assign({}, reactTheming.DEFAULT_THEME.components), {
|
|
|
236
236
|
|
|
237
237
|
var theme = __assign(__assign({}, reactTheming.DEFAULT_THEME), { colors: __assign(__assign({}, reactTheming.DEFAULT_THEME.colors), { primaryHue: palette.blue[600] }), palette: palette, fonts: __assign(__assign({}, reactTheming.DEFAULT_THEME.fonts), { system: '"Poppins",sans-serif,Helvetica,Arial,sans-serif' }), fontWeights: __assign(__assign({}, reactTheming.DEFAULT_THEME.fontWeights), { semibold: 500 }), gradients: gradients, borderRadii: __assign(__assign({}, reactTheming.DEFAULT_THEME.borderRadii), { lg: "8px", xl: "16px", xxl: "32px" }), components: components, shadows: __assign(__assign({}, reactTheming.DEFAULT_THEME.shadows), { boxShadow: boxShadow }) });
|
|
238
238
|
|
|
239
|
-
var GlobalStyle = styled.createGlobalStyle(templateObject_1$
|
|
240
|
-
var templateObject_1$
|
|
239
|
+
var GlobalStyle = styled.createGlobalStyle(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n ::-webkit-scrollbar-track:hover {\n border-left: solid 1px ", ";\n border-right: solid 1px ", ";\n }\n\n ::-webkit-scrollbar {\n width: 10px;\n }\n\n ::-webkit-scrollbar-track {\n border: solid 2px transparent;\n }\n\n ::-webkit-scrollbar-thumb {\n box-shadow: inset 0 0 10px 10px ", ";\n border: solid 2px transparent;\n border-radius: 25px;\n }\n\n /* This stuff is for Firefox */\n * {\n scrollbar-color: ", " #FFFFFF;\n scrollbar-width: thin;\n }\n \n body {\n font-family: ", ";\n margin: 0;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n \n svg {\n max-height: 100%;\n }\n\n"], ["\n ::-webkit-scrollbar-track:hover {\n border-left: solid 1px ", ";\n border-right: solid 1px ", ";\n }\n\n ::-webkit-scrollbar {\n width: 10px;\n }\n\n ::-webkit-scrollbar-track {\n border: solid 2px transparent;\n }\n\n ::-webkit-scrollbar-thumb {\n box-shadow: inset 0 0 10px 10px ", ";\n border: solid 2px transparent;\n border-radius: 25px;\n }\n\n /* This stuff is for Firefox */\n * {\n scrollbar-color: ", " #FFFFFF;\n scrollbar-width: thin;\n }\n \n body {\n font-family: ", ";\n margin: 0;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n \n svg {\n max-height: 100%;\n }\n\n"])), theme.palette.grey["200"], theme.palette.grey["200"], theme.palette.blue["200"], theme.palette.blue["200"], theme.fonts.system);
|
|
240
|
+
var templateObject_1$U;
|
|
241
241
|
|
|
242
242
|
/**
|
|
243
243
|
* Accordions are headers that can be expanded to reveal content or collapsed to hide it.
|
|
@@ -253,7 +253,7 @@ Accordion.Label = reactAccordions.Accordion.Label;
|
|
|
253
253
|
Accordion.Panel = reactAccordions.Accordion.Panel;
|
|
254
254
|
|
|
255
255
|
// import useWindowSize from "../../hooks/useWindowSize";
|
|
256
|
-
var UgAvatar = styled__default["default"](reactAvatars.Avatar)(templateObject_1$
|
|
256
|
+
var UgAvatar = styled__default["default"](reactAvatars.Avatar)(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
257
257
|
return props.avatarType &&
|
|
258
258
|
props.avatarType !== "image" &&
|
|
259
259
|
"background: ".concat(props.backgroundColor || theme.gradients.dark, ";");
|
|
@@ -278,7 +278,7 @@ var Avatar = function (props) {
|
|
|
278
278
|
return (jsxRuntime.jsx(UgAvatar, __assign({}, props, { badge: fixedBadge, children: wrapChildren(props.avatarType || "text"), size: props.size || "small" })));
|
|
279
279
|
};
|
|
280
280
|
Avatar.Text = UgAvatar.Text;
|
|
281
|
-
var templateObject_1$
|
|
281
|
+
var templateObject_1$T;
|
|
282
282
|
|
|
283
283
|
/**
|
|
284
284
|
* Breadcrumbs mark and communicate a user’s location in the product.
|
|
@@ -299,7 +299,7 @@ var Breadcrumb = function (props) { return jsxRuntime.jsx(reactBreadcrumbs.Bread
|
|
|
299
299
|
*/
|
|
300
300
|
var Anchor = function (props) { return jsxRuntime.jsx(reactButtons.Anchor, __assign({}, props)); };
|
|
301
301
|
|
|
302
|
-
var UgButton = styled__default["default"](reactButtons.Button)(templateObject_1$
|
|
302
|
+
var UgButton = styled__default["default"](reactButtons.Button)(templateObject_1$S || (templateObject_1$S = __makeTemplateObject([""], [""])));
|
|
303
303
|
/**
|
|
304
304
|
* Buttons let users take action quickly.
|
|
305
305
|
* Use a Button to enable actions or decisions that are important to a user’s workflow.
|
|
@@ -311,7 +311,7 @@ var UgButton = styled__default["default"](reactButtons.Button)(templateObject_1$
|
|
|
311
311
|
var Button = function (props) { return jsxRuntime.jsx(UgButton, __assign({}, props)); };
|
|
312
312
|
Button.StartIcon = UgButton.StartIcon;
|
|
313
313
|
Button.EndIcon = UgButton.EndIcon;
|
|
314
|
-
var templateObject_1$
|
|
314
|
+
var templateObject_1$S;
|
|
315
315
|
|
|
316
316
|
/**
|
|
317
317
|
A Button group lets users make a selection from a set of options.
|
|
@@ -364,13 +364,13 @@ var Tag = function (props) { return jsxRuntime.jsx(reactTags.Tag, __assign({}, p
|
|
|
364
364
|
Tag.Avatar = reactTags.Tag.Avatar;
|
|
365
365
|
Tag.Close = reactTags.Tag.Close;
|
|
366
366
|
|
|
367
|
-
var UgLabel$1 = styled__default["default"](reactForms.Label)(templateObject_1$
|
|
367
|
+
var UgLabel$1 = styled__default["default"](reactForms.Label)(templateObject_1$R || (templateObject_1$R = __makeTemplateObject([""], [""])));
|
|
368
368
|
/**
|
|
369
369
|
* A Label is used to specify a title for an input.
|
|
370
370
|
* <hr>
|
|
371
371
|
**/
|
|
372
372
|
var Label = function (props) { return jsxRuntime.jsx(UgLabel$1, __assign({}, props)); };
|
|
373
|
-
var templateObject_1$
|
|
373
|
+
var templateObject_1$R;
|
|
374
374
|
|
|
375
375
|
var _g$4, _path$p, _path2$7, _path3$6, _path4$4, _path5$3, _path6$3, _path7$3, _path8$3, _path9$3, _path10$3, _path11$2;
|
|
376
376
|
|
|
@@ -577,7 +577,7 @@ var SvgArrivalStatusRoundIcon = function SvgArrivalStatusRoundIcon(props) {
|
|
|
577
577
|
})));
|
|
578
578
|
};
|
|
579
579
|
|
|
580
|
-
var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObject_1$
|
|
580
|
+
var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n background-color: ", ";\n border-radius: ", ";\n"], ["\n background-color: ", ";\n border-radius: ", ";\n"])), function (props) { return props.theme.palette.grey[500]; }, function (props) { return props.theme.borderRadii.xxl; });
|
|
581
581
|
/**
|
|
582
582
|
* A Skeleton loader shows users a blank version of a page or section of a page into which content is gradually loaded. It provides a visual estimate of the space needed.
|
|
583
583
|
* <hr>
|
|
@@ -592,19 +592,19 @@ var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObjec
|
|
|
592
592
|
- To communicate a typing status, use Inline instead
|
|
593
593
|
*/
|
|
594
594
|
var Skeleton = function (props) { return jsxRuntime.jsx(UgSkeleton, __assign({}, props)); };
|
|
595
|
-
var templateObject_1$
|
|
595
|
+
var templateObject_1$Q;
|
|
596
596
|
|
|
597
597
|
var CampaignCardSkeleton = function () {
|
|
598
598
|
return (jsxRuntime.jsxs(Wrapper$1, { children: [jsxRuntime.jsx(CardHeader, { children: jsxRuntime.jsx(Skeleton, { width: "30%" }) }), jsxRuntime.jsxs(CardBody$1, { children: [jsxRuntime.jsx(Skeleton, { height: "18px", width: "50%" }), jsxRuntime.jsx("br", {}), jsxRuntime.jsx(Skeleton, { height: "26px", style: { backgroundColor: theme.palette.blue[400] } })] }), jsxRuntime.jsx(Divider$1, {}), jsxRuntime.jsxs(CardFooter$1, { children: [jsxRuntime.jsx(Skeleton, { height: "18px", width: "45%" }), " ", jsxRuntime.jsx(Skeleton, { width: "26px", height: "26px", style: { borderRadius: "100%" } })] })] }));
|
|
599
599
|
};
|
|
600
600
|
|
|
601
|
-
var flexCenter = styled.css(templateObject_1$
|
|
602
|
-
var flexColumnCenter = styled.css(templateObject_2$
|
|
603
|
-
var flexStart = styled.css(templateObject_3$
|
|
601
|
+
var flexCenter = styled.css(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
|
|
602
|
+
var flexColumnCenter = styled.css(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n ", ";\n flex-direction: column;\n"], ["\n ", ";\n flex-direction: column;\n"])), flexCenter);
|
|
603
|
+
var flexStart = styled.css(templateObject_3$c || (templateObject_3$c = __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) {
|
|
604
604
|
var theme = _a.theme;
|
|
605
605
|
return (theme.rtl ? "flex-end" : "flex-start");
|
|
606
606
|
});
|
|
607
|
-
var cardStyle = styled.css(templateObject_4$
|
|
607
|
+
var cardStyle = styled.css(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n display: flex;\n flex-direction: column;\n height: 100%;\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\n &:hover {\n box-shadow: ", ";\n }\n\n cursor: pointer;\n"])), function (_a) {
|
|
608
608
|
var theme = _a.theme;
|
|
609
609
|
return theme.borderRadii.lg;
|
|
610
610
|
}, function (_a) {
|
|
@@ -617,7 +617,7 @@ var cardStyle = styled.css(templateObject_4$6 || (templateObject_4$6 = __makeTem
|
|
|
617
617
|
var theme = _a.theme;
|
|
618
618
|
return theme.shadows.boxShadow(theme);
|
|
619
619
|
});
|
|
620
|
-
var templateObject_1$
|
|
620
|
+
var templateObject_1$P, templateObject_2$h, templateObject_3$c, templateObject_4$8;
|
|
621
621
|
|
|
622
622
|
var getStatusIcon = function (status) {
|
|
623
623
|
switch (status) {
|
|
@@ -641,12 +641,12 @@ var getTypeDataIcon = function (type) {
|
|
|
641
641
|
return SvgFunctionalTestRoundIcon;
|
|
642
642
|
}
|
|
643
643
|
};
|
|
644
|
-
var Wrapper$1 = styled__default["default"](Card)(templateObject_1$
|
|
645
|
-
var StyledTag$1 = styled__default["default"](Tag)(templateObject_2$
|
|
644
|
+
var Wrapper$1 = styled__default["default"](Card)(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), cardStyle);
|
|
645
|
+
var StyledTag$1 = styled__default["default"](Tag)(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n color: ", ";\n max-width: 75%;\n cursor: pointer;\n"], ["\n color: ", ";\n max-width: 75%;\n cursor: pointer;\n"])), function (_a) {
|
|
646
646
|
var theme = _a.theme;
|
|
647
647
|
return theme.palette.grey["700"];
|
|
648
648
|
});
|
|
649
|
-
var StyledTagNew$1 = styled__default["default"](Tag)(templateObject_3$
|
|
649
|
+
var StyledTagNew$1 = styled__default["default"](Tag)(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n height: ", "px;\n padding: ", "px\n ", "px;\n color: ", ";\n"], ["\n height: ", "px;\n padding: ", "px\n ", "px;\n color: ", ";\n"])), function (_a) {
|
|
650
650
|
var theme = _a.theme;
|
|
651
651
|
return theme.space.base * 6;
|
|
652
652
|
}, function (_a) {
|
|
@@ -659,14 +659,14 @@ var StyledTagNew$1 = styled__default["default"](Tag)(templateObject_3$9 || (temp
|
|
|
659
659
|
var theme = _a.theme;
|
|
660
660
|
return theme.palette.white;
|
|
661
661
|
});
|
|
662
|
-
var StyledLabel$2 = styled__default["default"](Label)(templateObject_4$
|
|
662
|
+
var StyledLabel$2 = styled__default["default"](Label)(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n font-size: ", ";\n color: ", ";\n cursor: pointer;\n"], ["\n font-size: ", ";\n color: ", ";\n cursor: pointer;\n"])), function (_a) {
|
|
663
663
|
var theme = _a.theme;
|
|
664
664
|
return theme.fontSizes.sm;
|
|
665
665
|
}, function (_a) {
|
|
666
666
|
var theme = _a.theme;
|
|
667
667
|
return theme.palette.grey["500"];
|
|
668
668
|
});
|
|
669
|
-
var StyledTitleLabel$1 = styled__default["default"](Label)(templateObject_5$
|
|
669
|
+
var StyledTitleLabel$1 = styled__default["default"](Label)(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n color: ", ";\n font-size: ", ";\n word-wrap: break-word;\n cursor: pointer;\n"], ["\n color: ", ";\n font-size: ", ";\n word-wrap: break-word;\n cursor: pointer;\n"])), function (_a) {
|
|
670
670
|
var theme = _a.theme;
|
|
671
671
|
return theme.palette.blue["600"];
|
|
672
672
|
}, function (_a) {
|
|
@@ -703,9 +703,9 @@ var CampaignCard = function (props) {
|
|
|
703
703
|
}
|
|
704
704
|
return props.isLoading ? (jsxRuntime.jsx(CampaignCardSkeleton, {})) : (jsxRuntime.jsxs(Wrapper$1, __assign({}, props, { children: [jsxRuntime.jsxs(CardHeader, { children: [jsxRuntime.jsx(StyledLabel$2, __assign({ isRegular: true }, { children: date })), isNew && (jsxRuntime.jsx(StyledTagNew$1, __assign({ hue: theme.palette.fuschia["600"], isPill: true, size: "medium", title: labelNew ? labelNew : "New!" }, { children: labelNew ? labelNew : "New!" })))] }), jsxRuntime.jsxs(CardBody$1, { children: [jsxRuntime.jsx(StyledLabel$2, __assign({ isRegular: true }, { children: projectTitleCut })), jsxRuntime.jsx(StyledTitleLabel$1, __assign({ isRegular: true }, { children: campaignTitleCut }))] }), jsxRuntime.jsx(Divider$1, {}), jsxRuntime.jsxs(CardFooter$1, { children: [props.pillText && (jsxRuntime.jsxs(StyledTag$1, __assign({ size: "large", isPill: true, isRegular: true, hue: theme.palette.grey[100] }, { children: [jsxRuntime.jsx(Tag.Avatar, { children: jsxRuntime.jsx(PillIcon, {}) }), props.pillText] }))), jsxRuntime.jsx(StatusIcon, {})] })] })));
|
|
705
705
|
};
|
|
706
|
-
var templateObject_1$
|
|
706
|
+
var templateObject_1$O, templateObject_2$g, templateObject_3$b, templateObject_4$7, templateObject_5$4, templateObject_6$2, templateObject_7$1, templateObject_8$1, templateObject_9;
|
|
707
707
|
|
|
708
|
-
var Wrapper = styled__default["default"](Card)(templateObject_1$
|
|
708
|
+
var Wrapper = styled__default["default"](Card)(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n display: flex;\n flex-direction: column;\n\n &:hover {\n box-shadow: ", ";\n }\n"], ["\n border-radius: ", ";\n padding: ", ";\n border: 1px solid ", ";\n display: flex;\n flex-direction: column;\n\n &:hover {\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
709
709
|
var theme = _a.theme;
|
|
710
710
|
return theme.borderRadii.lg;
|
|
711
711
|
}, function (_a) {
|
|
@@ -718,7 +718,7 @@ var Wrapper = styled__default["default"](Card)(templateObject_1$L || (templateOb
|
|
|
718
718
|
var theme = _a.theme;
|
|
719
719
|
return theme.shadows.boxShadow(theme);
|
|
720
720
|
});
|
|
721
|
-
var StyledTagNew = styled__default["default"](Tag)(templateObject_2$
|
|
721
|
+
var StyledTagNew = styled__default["default"](Tag)(templateObject_2$f || (templateObject_2$f = __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) {
|
|
722
722
|
var theme = _a.theme;
|
|
723
723
|
return theme.space.base * 6;
|
|
724
724
|
}, function (_a) {
|
|
@@ -731,21 +731,21 @@ var StyledTagNew = styled__default["default"](Tag)(templateObject_2$d || (templa
|
|
|
731
731
|
var theme = _a.theme;
|
|
732
732
|
return theme.palette.white;
|
|
733
733
|
});
|
|
734
|
-
var StyledLabel$1 = styled__default["default"](Label)(templateObject_3$
|
|
734
|
+
var StyledLabel$1 = styled__default["default"](Label)(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n font-size: ", ";\n color: ", ";\n cursor: pointer;\n"], ["\n font-size: ", ";\n color: ", ";\n cursor: pointer;\n"])), function (_a) {
|
|
735
735
|
var theme = _a.theme;
|
|
736
736
|
return theme.fontSizes.sm;
|
|
737
737
|
}, function (_a) {
|
|
738
738
|
var theme = _a.theme;
|
|
739
739
|
return theme.palette.grey["500"];
|
|
740
740
|
});
|
|
741
|
-
var StyledTitleLabel = styled__default["default"](Label)(templateObject_4$
|
|
741
|
+
var StyledTitleLabel = styled__default["default"](Label)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n color: ", ";\n font-size: ", ";\n word-wrap: break-word;\n cursor: pointer;\n"], ["\n color: ", ";\n font-size: ", ";\n word-wrap: break-word;\n cursor: pointer;\n"])), function (_a) {
|
|
742
742
|
var theme = _a.theme;
|
|
743
743
|
return theme.palette.blue["600"];
|
|
744
744
|
}, function (_a) {
|
|
745
745
|
var theme = _a.theme;
|
|
746
746
|
return theme.fontSizes.lg;
|
|
747
747
|
});
|
|
748
|
-
var Divider = styled__default["default"].div(templateObject_5$
|
|
748
|
+
var Divider = styled__default["default"].div(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n width: 100%;\n height: 1px;\n margin: ", " 0;\n background-color: ", ";\n"], ["\n width: 100%;\n height: 1px;\n margin: ", " 0;\n background-color: ", ";\n"])), function (_a) {
|
|
749
749
|
var theme = _a.theme;
|
|
750
750
|
return theme.space.sm;
|
|
751
751
|
}, function (_a) {
|
|
@@ -756,7 +756,7 @@ var IconContainer$1 = styled__default["default"].div(templateObject_6$1 || (temp
|
|
|
756
756
|
var theme = _a.theme;
|
|
757
757
|
return theme.components.notification.card.padding;
|
|
758
758
|
});
|
|
759
|
-
var CardBody = styled__default["default"].div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n flex: 1;\n"], ["\n display: flex;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n flex: 1;\n"])));
|
|
759
|
+
var CardBody = styled__default["default"].div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n flex: 1;\n cursor: pointer;\n"], ["\n display: flex;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n flex: 1;\n cursor: pointer;\n"])));
|
|
760
760
|
var CardFooter = styled__default["default"].div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n"], ["\n display: flex;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
761
761
|
var ProductCard = function (props) {
|
|
762
762
|
var isNew = props.isNew, productTitle = props.productTitle, labelNew = props.labelNew;
|
|
@@ -764,16 +764,9 @@ var ProductCard = function (props) {
|
|
|
764
764
|
if (productTitle.length > 42) {
|
|
765
765
|
productTitleCut = "".concat(productTitle.substring(0, 39), "...");
|
|
766
766
|
}
|
|
767
|
-
return props.isLoading ? (jsxRuntime.jsx(CampaignCardSkeleton, {})) : (jsxRuntime.jsxs(Wrapper, __assign({}, props, { children: [jsxRuntime.jsxs(CardBody, { children: [isNew && (jsxRuntime.jsx(StyledTagNew, __assign({ hue: theme.palette.fuschia["600"], isPill: true, size: "medium", title: labelNew ? labelNew : "New!" }, { children: labelNew ? labelNew : "New!" }))), props.icon && jsxRuntime.jsx(IconContainer$1, { children: props.icon }), props.preTitle && (jsxRuntime.jsx(StyledLabel$1, __assign({ isRegular: true }, { children: props.preTitle }))), jsxRuntime.jsx(StyledTitleLabel, __assign({ isRegular: true }, { children: productTitleCut }))] }), jsxRuntime.jsx(Divider, {}), jsxRuntime.jsx(CardFooter, { children: jsxRuntime.jsx(Button, __assign({ isPill: true, isPrimary: true, onClick: props.onCtaClick }, { children: props.ctaLabel })) })] })));
|
|
767
|
+
return props.isLoading ? (jsxRuntime.jsx(CampaignCardSkeleton, {})) : (jsxRuntime.jsxs(Wrapper, __assign({}, props, { children: [jsxRuntime.jsxs(CardBody, __assign({ onClick: props.onCtaClick }, { children: [isNew && (jsxRuntime.jsx(StyledTagNew, __assign({ hue: theme.palette.fuschia["600"], isPill: true, size: "medium", title: labelNew ? labelNew : "New!" }, { children: labelNew ? labelNew : "New!" }))), props.icon && jsxRuntime.jsx(IconContainer$1, { children: props.icon }), props.preTitle && (jsxRuntime.jsx(StyledLabel$1, __assign({ isRegular: true }, { children: props.preTitle }))), jsxRuntime.jsx(StyledTitleLabel, __assign({ isRegular: true }, { children: productTitleCut }))] })), jsxRuntime.jsx(Divider, {}), jsxRuntime.jsx(CardFooter, { children: jsxRuntime.jsx(Button, __assign({ isPill: true, isPrimary: true, onClick: props.onCtaClick }, { children: props.ctaLabel })) })] })));
|
|
768
768
|
};
|
|
769
|
-
var templateObject_1$
|
|
770
|
-
|
|
771
|
-
var Drawer = function (props) { return jsxRuntime.jsx(reactModals.DrawerModal, __assign({}, props)); };
|
|
772
|
-
Drawer.Header = reactModals.DrawerModal.Header;
|
|
773
|
-
Drawer.Body = reactModals.DrawerModal.Body;
|
|
774
|
-
Drawer.Footer = reactModals.DrawerModal.Footer;
|
|
775
|
-
Drawer.FooterItem = reactModals.DrawerModal.FooterItem;
|
|
776
|
-
Drawer.Close = reactModals.DrawerModal.Close;
|
|
769
|
+
var templateObject_1$N, templateObject_2$f, templateObject_3$a, templateObject_4$6, templateObject_5$3, templateObject_6$1, templateObject_7, templateObject_8;
|
|
777
770
|
|
|
778
771
|
/**
|
|
779
772
|
* Title is a basic component used to display a title. Often used in card headers.
|
|
@@ -979,7 +972,7 @@ var SvgCampaignExperiential = function SvgCampaignExperiential(props) {
|
|
|
979
972
|
})));
|
|
980
973
|
};
|
|
981
974
|
|
|
982
|
-
var StyledTag = styled__default["default"](Tag)(templateObject_1$
|
|
975
|
+
var StyledTag = styled__default["default"](Tag)(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n background-color: transparent;\n pointer-events: none;\n font-weight: ", ";\n ", "\n svg {\n margin-right: ", " !important;\n }\n\n span {\n font-weight: ", ";\n margin-left: ", ";\n color: ", ";\n }\n"], ["\n background-color: transparent;\n pointer-events: none;\n font-weight: ", ";\n ", "\n svg {\n margin-right: ", " !important;\n }\n\n span {\n font-weight: ", ";\n margin-left: ", ";\n color: ", ";\n }\n"])), function (_a) {
|
|
983
976
|
var theme = _a.theme;
|
|
984
977
|
return theme.fontWeights.regular;
|
|
985
978
|
}, function (_a) {
|
|
@@ -1015,24 +1008,38 @@ var Counter = function (props) {
|
|
|
1015
1008
|
return (jsxRuntime.jsxs(StyledTag, __assign({}, props, { size: props.size || "large" }, { children: [jsxRuntime.jsx(StyledTag.Avatar, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [status === "completed" && jsxRuntime.jsx(SvgCampaignCompleted, {}), status === "progress" && jsxRuntime.jsx(SvgCampaignProgress, {}), status === "incoming" && jsxRuntime.jsx(SvgCampaignIncoming, {}), status === "functional" && jsxRuntime.jsx(SvgCampaignFunctional, {}), status === "experiential" && jsxRuntime.jsx(SvgCampaignExperiential, {})] }) }), props.children, counter !== undefined && jsxRuntime.jsx("span", { children: counter.toString() })] })));
|
|
1016
1009
|
};
|
|
1017
1010
|
Counter.Avatar = StyledTag.Avatar;
|
|
1018
|
-
var templateObject_1$
|
|
1011
|
+
var templateObject_1$M;
|
|
1019
1012
|
|
|
1020
|
-
|
|
1021
|
-
|
|
1013
|
+
/**
|
|
1014
|
+
* A Drawer is a container for supplementary content that is anchored to the edge of a page.
|
|
1015
|
+
* <hr>
|
|
1016
|
+
* Used for this:
|
|
1017
|
+
- To display information or actions that are supplementary to the screen’s primary content
|
|
1018
|
+
- To display a list of actions that affect the screen’s content, such as filtering data
|
|
1019
|
+
*/
|
|
1020
|
+
var Drawer = function (props) { return jsxRuntime.jsx(reactModals.DrawerModal, __assign({}, props)); };
|
|
1021
|
+
Drawer.Header = reactModals.DrawerModal.Header;
|
|
1022
|
+
Drawer.Body = reactModals.DrawerModal.Body;
|
|
1023
|
+
Drawer.Footer = reactModals.DrawerModal.Footer;
|
|
1024
|
+
Drawer.FooterItem = reactModals.DrawerModal.FooterItem;
|
|
1025
|
+
Drawer.Close = reactModals.DrawerModal.Close;
|
|
1026
|
+
|
|
1027
|
+
var Field$1 = styled__default["default"](reactDropdowns.Field)(templateObject_1$L || (templateObject_1$L = __makeTemplateObject([""], [""])));
|
|
1028
|
+
var templateObject_1$L;
|
|
1022
1029
|
|
|
1023
1030
|
var index$1 = /*#__PURE__*/Object.freeze({
|
|
1024
1031
|
__proto__: null,
|
|
1025
1032
|
Field: Field$1
|
|
1026
1033
|
});
|
|
1027
1034
|
|
|
1028
|
-
var UgItem = styled__default["default"](reactDropdowns.Item)(templateObject_1$
|
|
1035
|
+
var UgItem = styled__default["default"](reactDropdowns.Item)(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n &[disabled] svg {\n opacity: 0.5;\n }\n &:hover {\n background-color: ", ";\n }\n"], ["\n &[disabled] svg {\n opacity: 0.5;\n }\n &:hover {\n background-color: ", ";\n }\n"])), function (_a) {
|
|
1029
1036
|
var theme = _a.theme;
|
|
1030
1037
|
return theme.palette.blue[100];
|
|
1031
1038
|
});
|
|
1032
1039
|
var Item = function (props) { return jsxRuntime.jsx(UgItem, __assign({}, props)); };
|
|
1033
|
-
var templateObject_1$
|
|
1040
|
+
var templateObject_1$K;
|
|
1034
1041
|
|
|
1035
|
-
var UgMenu = styled__default["default"](reactDropdowns.Menu)(templateObject_1$
|
|
1042
|
+
var UgMenu = styled__default["default"](reactDropdowns.Menu)(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n width: auto !important;\n min-width: 100%;\n"], ["\n width: auto !important;\n min-width: 100%;\n"])));
|
|
1036
1043
|
/**
|
|
1037
1044
|
* A Menu is a wrapper for items elements
|
|
1038
1045
|
**/
|
|
@@ -1045,7 +1052,7 @@ var ItemMeta = function (props) { return jsxRuntime.jsx(reactDropdowns.ItemMeta,
|
|
|
1045
1052
|
var MediaBody = function (props) { return jsxRuntime.jsx(reactDropdowns.MediaBody, __assign({}, props)); };
|
|
1046
1053
|
var MediaFigure = function (props) { return jsxRuntime.jsx(reactDropdowns.MediaFigure, __assign({}, props)); };
|
|
1047
1054
|
var MediaItem = function (props) { return jsxRuntime.jsx(reactDropdowns.MediaItem, __assign({}, props)); };
|
|
1048
|
-
var templateObject_1$
|
|
1055
|
+
var templateObject_1$J;
|
|
1049
1056
|
|
|
1050
1057
|
/**
|
|
1051
1058
|
* Multiselect lets users select multiple items from a list. Options are dynamically filtered as a user types in the input field and their selections appear as tags in the input field.
|
|
@@ -1056,7 +1063,7 @@ var templateObject_1$H;
|
|
|
1056
1063
|
*/
|
|
1057
1064
|
var Multiselect = function (props) { return (jsxRuntime.jsx(reactDropdowns.Multiselect, __assign({}, props))); };
|
|
1058
1065
|
|
|
1059
|
-
var UgSelect = styled__default["default"](reactDropdowns.Select)(templateObject_1$
|
|
1066
|
+
var UgSelect = styled__default["default"](reactDropdowns.Select)(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
1060
1067
|
return props.isPrimary &&
|
|
1061
1068
|
"\n background-color: ".concat(props.theme.palette.blue[600], ";\n color: white;\n & svg[data-garden-id=\"forms.media_figure\"] {\n color: white;\n }\n ");
|
|
1062
1069
|
});
|
|
@@ -1073,7 +1080,7 @@ var UgSelect = styled__default["default"](reactDropdowns.Select)(templateObject_
|
|
|
1073
1080
|
var Select = function (props) { return jsxRuntime.jsx(UgSelect, __assign({}, props)); };
|
|
1074
1081
|
var Dropdown = function (props) { return (jsxRuntime.jsx(reactDropdowns.Dropdown, __assign({}, props))); };
|
|
1075
1082
|
var Message = function (props) { return jsxRuntime.jsx(reactDropdowns.Message, __assign({}, props)); };
|
|
1076
|
-
var templateObject_1$
|
|
1083
|
+
var templateObject_1$I;
|
|
1077
1084
|
|
|
1078
1085
|
/**
|
|
1079
1086
|
* Autocomplete is an input field that filters results as users type. This helps users find something quickly in a large list of options.
|
|
@@ -1086,7 +1093,7 @@ var templateObject_1$G;
|
|
|
1086
1093
|
*/
|
|
1087
1094
|
var Autocomplete = function (props) { return jsxRuntime.jsx(reactDropdowns.Autocomplete, __assign({}, props)); };
|
|
1088
1095
|
|
|
1089
|
-
var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_1$
|
|
1096
|
+
var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_1$H || (templateObject_1$H = __makeTemplateObject([""], [""])));
|
|
1090
1097
|
/**
|
|
1091
1098
|
* A Checkbox lets users select and unselect options from a list.
|
|
1092
1099
|
* <hr>
|
|
@@ -1098,24 +1105,24 @@ var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_
|
|
|
1098
1105
|
* - To let users activate an option that takes effect immediately, use a Toggle instead
|
|
1099
1106
|
**/
|
|
1100
1107
|
var Checkbox = function (props) { return jsxRuntime.jsx(UgCheckbox, __assign({}, props)); };
|
|
1101
|
-
var templateObject_1$
|
|
1108
|
+
var templateObject_1$H;
|
|
1102
1109
|
|
|
1103
|
-
var StyledCard = styled__default["default"](Card)(templateObject_1$
|
|
1110
|
+
var StyledCard$1 = styled__default["default"](Card)(templateObject_1$G || (templateObject_1$G = __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) {
|
|
1104
1111
|
var theme = _a.theme;
|
|
1105
1112
|
return theme.palette.blue[300];
|
|
1106
1113
|
});
|
|
1107
|
-
var IconWrapper = styled__default["default"].div(templateObject_2$
|
|
1114
|
+
var IconWrapper$1 = styled__default["default"].div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n margin: ", "px auto;\n"], ["\n margin: ", "px auto;\n"])), function (_a) {
|
|
1108
1115
|
var theme = _a.theme;
|
|
1109
1116
|
return theme.space.base;
|
|
1110
1117
|
});
|
|
1111
|
-
var LabelWrapper = styled__default["default"](Label)(templateObject_3$
|
|
1118
|
+
var LabelWrapper = styled__default["default"](Label)(templateObject_3$9 || (templateObject_3$9 = __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) {
|
|
1112
1119
|
var theme = _a.theme;
|
|
1113
1120
|
return theme.space.base;
|
|
1114
1121
|
}, function (_a) {
|
|
1115
1122
|
var theme = _a.theme;
|
|
1116
1123
|
return theme.palette.grey[600];
|
|
1117
1124
|
});
|
|
1118
|
-
var StyledLabel = styled__default["default"](Label)(templateObject_4$
|
|
1125
|
+
var StyledLabel = styled__default["default"](Label)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n margin: ", "px auto;\n"], ["\n margin: ", "px auto;\n"])), function (_a) {
|
|
1119
1126
|
var theme = _a.theme;
|
|
1120
1127
|
return theme.space.base;
|
|
1121
1128
|
});
|
|
@@ -1124,16 +1131,16 @@ var CheckboxCard = function (props) {
|
|
|
1124
1131
|
var handleToggle = function () {
|
|
1125
1132
|
setChecked(!checked);
|
|
1126
1133
|
};
|
|
1127
|
-
return (jsxRuntime.jsxs(StyledCard, __assign({}, props.card, props, props && !props.disabled && { onClick: handleToggle }, { className: checked ? "card-active" : "" }, { children: [jsxRuntime.jsx(IconWrapper, { children: (props.iconActive && checked) ? props.iconActive : props.icon }), jsxRuntime.jsx(LabelWrapper, { children: props.label }), jsxRuntime.jsx(Checkbox, __assign({}, props, { checked: checked, onClick: function (e) { return e.stopPropagation(); } }, { children: jsxRuntime.jsx(StyledLabel, __assign({ hidden: true }, { children: props.label })) }))] })));
|
|
1134
|
+
return (jsxRuntime.jsxs(StyledCard$1, __assign({}, props.card, props, props && !props.disabled && { onClick: handleToggle }, { className: checked ? "card-active" : "" }, { children: [jsxRuntime.jsx(IconWrapper$1, { children: (props.iconActive && checked) ? props.iconActive : props.icon }), jsxRuntime.jsx(LabelWrapper, { children: props.label }), jsxRuntime.jsx(Checkbox, __assign({}, props, { checked: checked, onClick: function (e) { return e.stopPropagation(); } }, { children: jsxRuntime.jsx(StyledLabel, __assign({ hidden: true }, { children: props.label })) }))] })));
|
|
1128
1135
|
};
|
|
1129
|
-
var templateObject_1$
|
|
1136
|
+
var templateObject_1$G, templateObject_2$e, templateObject_3$9, templateObject_4$5;
|
|
1130
1137
|
|
|
1131
|
-
var UgField = styled__default["default"](reactForms.Field)(templateObject_1$
|
|
1138
|
+
var UgField = styled__default["default"](reactForms.Field)(templateObject_1$F || (templateObject_1$F = __makeTemplateObject([""], [""])));
|
|
1132
1139
|
/**
|
|
1133
1140
|
* A Field is a wrapper for input elements
|
|
1134
1141
|
**/
|
|
1135
1142
|
var Field = function (props) { return jsxRuntime.jsx(UgField, __assign({}, props)); };
|
|
1136
|
-
var templateObject_1$
|
|
1143
|
+
var templateObject_1$F;
|
|
1137
1144
|
|
|
1138
1145
|
var index = /*#__PURE__*/Object.freeze({
|
|
1139
1146
|
__proto__: null,
|
|
@@ -1141,7 +1148,7 @@ var index = /*#__PURE__*/Object.freeze({
|
|
|
1141
1148
|
Hint: reactForms.Hint
|
|
1142
1149
|
});
|
|
1143
1150
|
|
|
1144
|
-
var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$
|
|
1151
|
+
var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$E || (templateObject_1$E = __makeTemplateObject([""], [""])));
|
|
1145
1152
|
/**
|
|
1146
1153
|
* An Input lets users enter text into a field.
|
|
1147
1154
|
* <hr>
|
|
@@ -1150,9 +1157,9 @@ var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$C ||
|
|
|
1150
1157
|
* - To enter multiline text, use a Textarea
|
|
1151
1158
|
**/
|
|
1152
1159
|
var Input = function (props) { return jsxRuntime.jsx(UgInput, __assign({}, props)); };
|
|
1153
|
-
var templateObject_1$
|
|
1160
|
+
var templateObject_1$E;
|
|
1154
1161
|
|
|
1155
|
-
var UgMediaInput = styled__default["default"](reactForms.MediaInput)(templateObject_1$
|
|
1162
|
+
var UgMediaInput = styled__default["default"](reactForms.MediaInput)(templateObject_1$D || (templateObject_1$D = __makeTemplateObject([""], [""])));
|
|
1156
1163
|
/**
|
|
1157
1164
|
* Media elements add even more context to an input.
|
|
1158
1165
|
* <hr>
|
|
@@ -1161,9 +1168,9 @@ var UgMediaInput = styled__default["default"](reactForms.MediaInput)(templateObj
|
|
|
1161
1168
|
* - To enter multiline text, use a Textarea
|
|
1162
1169
|
**/
|
|
1163
1170
|
var MediaInput = function (props) { return jsxRuntime.jsx(UgMediaInput, __assign({}, props)); };
|
|
1164
|
-
var templateObject_1$
|
|
1171
|
+
var templateObject_1$D;
|
|
1165
1172
|
|
|
1166
|
-
var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$
|
|
1173
|
+
var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$C || (templateObject_1$C = __makeTemplateObject([""], [""])));
|
|
1167
1174
|
/**
|
|
1168
1175
|
* Radio buttons let users choose a single option among two or more mutually exclusive options.
|
|
1169
1176
|
* <hr>
|
|
@@ -1175,9 +1182,78 @@ var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$A ||
|
|
|
1175
1182
|
* - To select from a long list of options, use Select instead
|
|
1176
1183
|
**/
|
|
1177
1184
|
var Radio = function (props) { return jsxRuntime.jsx(UgRadio, __assign({}, props)); };
|
|
1178
|
-
var templateObject_1$
|
|
1185
|
+
var templateObject_1$C;
|
|
1186
|
+
|
|
1187
|
+
var _path$f;
|
|
1188
|
+
|
|
1189
|
+
function _extends$h() { _extends$h = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$h.apply(this, arguments); }
|
|
1190
|
+
|
|
1191
|
+
var SvgCheckLg = function SvgCheckLg(props) {
|
|
1192
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$h({
|
|
1193
|
+
width: 16,
|
|
1194
|
+
height: 16,
|
|
1195
|
+
viewBox: "0 0 16 16",
|
|
1196
|
+
fill: "#68737D",
|
|
1197
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
1198
|
+
}, props), _path$f || (_path$f = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1199
|
+
fillRule: "evenodd",
|
|
1200
|
+
clipRule: "evenodd",
|
|
1201
|
+
d: "M14.6464 2.64645C14.8417 2.45118 15.1583 2.45118 15.3536 2.64645C15.5488 2.84171 15.5488 3.15829 15.3536 3.35355L5.35355 13.3536C5.15829 13.5488 4.84171 13.5488 4.64645 13.3536L0.646447 9.35355C0.451184 9.15829 0.451184 8.84171 0.646447 8.64645C0.841709 8.45118 1.15829 8.45118 1.35355 8.64645L5 12.2929L14.6464 2.64645Z"
|
|
1202
|
+
})));
|
|
1203
|
+
};
|
|
1204
|
+
|
|
1205
|
+
var StyledCard = styled__default["default"](Card)(templateObject_1$B || (templateObject_1$B = __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) {
|
|
1206
|
+
var theme = _a.theme;
|
|
1207
|
+
return theme.palette.blue[300];
|
|
1208
|
+
});
|
|
1209
|
+
var IconWrapper = styled__default["default"].div(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n margin: ", "px auto;\n"], ["\n margin: ", "px auto;\n"])), function (_a) {
|
|
1210
|
+
var theme = _a.theme;
|
|
1211
|
+
return theme.space.base;
|
|
1212
|
+
});
|
|
1213
|
+
var StyledText = styled__default["default"](reactTypography.LG)(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n margin: ", "px auto;\n color: ", ";\n font-weight: ", ";\n color: ", ";\n user-select: none;\n\n &:focus {\n outline: 0;\n }\n"], ["\n margin: ", "px auto;\n color: ", ";\n font-weight: ", ";\n color: ", ";\n user-select: none;\n\n &:focus {\n outline: 0;\n }\n"])), function (_a) {
|
|
1214
|
+
var theme = _a.theme;
|
|
1215
|
+
return theme.space.base;
|
|
1216
|
+
}, function (_a) {
|
|
1217
|
+
var theme = _a.theme;
|
|
1218
|
+
return theme.palette.grey[600];
|
|
1219
|
+
}, function (_a) {
|
|
1220
|
+
var theme = _a.theme;
|
|
1221
|
+
return theme.fontWeights.medium;
|
|
1222
|
+
}, function (_a) {
|
|
1223
|
+
var theme = _a.theme;
|
|
1224
|
+
return theme.colors.primaryHue;
|
|
1225
|
+
});
|
|
1226
|
+
var Circle = styled__default["default"].div(templateObject_4$4 || (templateObject_4$4 = __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) {
|
|
1227
|
+
var theme = _a.theme;
|
|
1228
|
+
return theme.space.base * 6;
|
|
1229
|
+
}, function (_a) {
|
|
1230
|
+
var theme = _a.theme;
|
|
1231
|
+
return theme.space.base * 6;
|
|
1232
|
+
}, function (_a) {
|
|
1233
|
+
var theme = _a.theme;
|
|
1234
|
+
return theme.space.base * 1.25;
|
|
1235
|
+
}, function (_a) {
|
|
1236
|
+
var theme = _a.theme;
|
|
1237
|
+
return theme.colors.primaryHue;
|
|
1238
|
+
}, function (_a) {
|
|
1239
|
+
var checked = _a.checked;
|
|
1240
|
+
return !checked && "\n opacity: 0;\n visibility: hidden;\n ";
|
|
1241
|
+
});
|
|
1242
|
+
var StyledDivider = styled__default["default"](Divider$1)(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n background-color: ", ";\n margin: ", "px auto;\n"], ["\n background-color: ", ";\n margin: ", "px auto;\n"])), function (_a) {
|
|
1243
|
+
var theme = _a.theme;
|
|
1244
|
+
return theme.palette.blue[100];
|
|
1245
|
+
}, function (_a) {
|
|
1246
|
+
var theme = _a.theme;
|
|
1247
|
+
return theme.space.base * 4;
|
|
1248
|
+
});
|
|
1249
|
+
var RadioCard = function (_a) {
|
|
1250
|
+
var _b;
|
|
1251
|
+
var card = _a.card, icon = _a.icon, iconActive = _a.iconActive, props = __rest(_a, ["card", "icon", "iconActive"]);
|
|
1252
|
+
return (jsxRuntime.jsxs(StyledCard, __assign({}, card, props, { className: props.checked ? "card-active" : "", onClick: function () { props.onChecked && props.onChecked(props.value); } }, { children: [jsxRuntime.jsx(Circle, __assign({ checked: (_b = props.checked) !== null && _b !== void 0 ? _b : false }, { children: jsxRuntime.jsx(SvgCheckLg, { fill: "white" }) })), jsxRuntime.jsx(IconWrapper, { children: (iconActive && props.checked) ? iconActive : icon }), jsxRuntime.jsx("input", { hidden: true, type: "radio", value: props.value, name: props.name, checked: props.checked }), jsxRuntime.jsx(StyledDivider, {}), jsxRuntime.jsx(StyledText, { children: props.label })] })));
|
|
1253
|
+
};
|
|
1254
|
+
var templateObject_1$B, templateObject_2$d, templateObject_3$8, templateObject_4$4, templateObject_5$2;
|
|
1179
1255
|
|
|
1180
|
-
var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_1$
|
|
1256
|
+
var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_1$A || (templateObject_1$A = __makeTemplateObject([""], [""])));
|
|
1181
1257
|
/**
|
|
1182
1258
|
* A Textarea is a form control for multi-line text.
|
|
1183
1259
|
* <hr>
|
|
@@ -1185,9 +1261,9 @@ var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_
|
|
|
1185
1261
|
* - To enter multi-line text
|
|
1186
1262
|
**/
|
|
1187
1263
|
var Textarea = function (props) { return jsxRuntime.jsx(UgTextarea, __assign({}, props)); };
|
|
1188
|
-
var templateObject_1$
|
|
1264
|
+
var templateObject_1$A;
|
|
1189
1265
|
|
|
1190
|
-
var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$
|
|
1266
|
+
var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$z || (templateObject_1$z = __makeTemplateObject([""], [""])));
|
|
1191
1267
|
/**
|
|
1192
1268
|
* 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.
|
|
1193
1269
|
* <hr>
|
|
@@ -1198,7 +1274,7 @@ var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$y
|
|
|
1198
1274
|
* - To let users select from a list of settings, use Checkboxes instead
|
|
1199
1275
|
**/
|
|
1200
1276
|
var Toggle = function (props) { return jsxRuntime.jsx(UgToggle, __assign({}, props)); };
|
|
1201
|
-
var templateObject_1$
|
|
1277
|
+
var templateObject_1$z;
|
|
1202
1278
|
|
|
1203
1279
|
var Col = function (props) { return jsxRuntime.jsx(reactGrid.Col, __assign({}, props)); };
|
|
1204
1280
|
|
|
@@ -1212,58 +1288,58 @@ var Row$1 = function (props) { return jsxRuntime.jsx(reactGrid.Row, __assign({},
|
|
|
1212
1288
|
*/
|
|
1213
1289
|
var Grid = function (props) { return jsxRuntime.jsx(reactGrid.Grid, __assign({}, props)); };
|
|
1214
1290
|
|
|
1215
|
-
var _path$
|
|
1291
|
+
var _path$e;
|
|
1216
1292
|
|
|
1217
|
-
function _extends$
|
|
1293
|
+
function _extends$g() { _extends$g = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$g.apply(this, arguments); }
|
|
1218
1294
|
|
|
1219
1295
|
var SvgUgSquare = function SvgUgSquare(props) {
|
|
1220
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1296
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$g({
|
|
1221
1297
|
width: 24,
|
|
1222
1298
|
height: 24,
|
|
1223
1299
|
viewBox: "0 0 24 24",
|
|
1224
1300
|
fill: "none",
|
|
1225
1301
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1226
|
-
}, props), _path$
|
|
1302
|
+
}, props), _path$e || (_path$e = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1227
1303
|
d: "M19 3H5C3.9 3 3 3.9 3 5V19C3 20.1 3.9 21 5 21H19C20.1 21 21 20.1 21 19V5C21 3.9 20.1 3 19 3ZM18 19H6C5.45 19 5 18.55 5 18V6C5 5.45 5.45 5 6 5H18C18.55 5 19 5.45 19 6V18C19 18.55 18.55 19 18 19Z",
|
|
1228
1304
|
fill: "#E80C7A"
|
|
1229
1305
|
})));
|
|
1230
1306
|
};
|
|
1231
1307
|
|
|
1232
|
-
var _path$
|
|
1308
|
+
var _path$d;
|
|
1233
1309
|
|
|
1234
|
-
function _extends$
|
|
1310
|
+
function _extends$f() { _extends$f = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$f.apply(this, arguments); }
|
|
1235
1311
|
|
|
1236
1312
|
var SvgUgCircle = function SvgUgCircle(props) {
|
|
1237
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1313
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$f({
|
|
1238
1314
|
width: 24,
|
|
1239
1315
|
height: 24,
|
|
1240
1316
|
viewBox: "0 0 24 24",
|
|
1241
1317
|
fill: "none",
|
|
1242
1318
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1243
|
-
}, props), _path$
|
|
1319
|
+
}, props), _path$d || (_path$d = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1244
1320
|
d: "M12 2C6.47 2 2 6.47 2 12C2 17.53 6.47 22 12 22C17.53 22 22 17.53 22 12C22 6.47 17.53 2 12 2ZM12 20C7.58 20 4 16.42 4 12C4 7.58 7.58 4 12 4C16.42 4 20 7.58 20 12C20 16.42 16.42 20 12 20Z",
|
|
1245
1321
|
fill: "#FFCD1A"
|
|
1246
1322
|
})));
|
|
1247
1323
|
};
|
|
1248
1324
|
|
|
1249
|
-
var _path$
|
|
1325
|
+
var _path$c;
|
|
1250
1326
|
|
|
1251
|
-
function _extends$
|
|
1327
|
+
function _extends$e() { _extends$e = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$e.apply(this, arguments); }
|
|
1252
1328
|
|
|
1253
1329
|
var SvgUgTriangle = function SvgUgTriangle(props) {
|
|
1254
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1330
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$e({
|
|
1255
1331
|
width: 24,
|
|
1256
1332
|
height: 24,
|
|
1257
1333
|
viewBox: "0 0 24 24",
|
|
1258
1334
|
fill: "none",
|
|
1259
1335
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1260
|
-
}, props), _path$
|
|
1336
|
+
}, props), _path$c || (_path$c = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1261
1337
|
d: "M11.9993 7.32625L18.3893 17.5563H5.60929L11.9993 7.32625ZM11.1493 4.91625L2.94929 18.0262C2.53929 18.6962 3.01929 19.5563 3.79929 19.5563H20.1993C20.9893 19.5563 21.4593 18.6962 21.0493 18.0262L12.8493 4.91625C12.4593 4.28625 11.5393 4.28625 11.1493 4.91625Z",
|
|
1262
1338
|
fill: "#7B0DFF"
|
|
1263
1339
|
})));
|
|
1264
1340
|
};
|
|
1265
1341
|
|
|
1266
|
-
var StyledUgIcon$1 = styled__default["default"].span(templateObject_1$
|
|
1342
|
+
var StyledUgIcon$1 = styled__default["default"].span(templateObject_1$y || (templateObject_1$y = __makeTemplateObject([""], [""])));
|
|
1267
1343
|
var Icon = function (props) {
|
|
1268
1344
|
var children = function (type, size) {
|
|
1269
1345
|
if (size === void 0) { size = 24; }
|
|
@@ -1276,9 +1352,9 @@ var Icon = function (props) {
|
|
|
1276
1352
|
};
|
|
1277
1353
|
return (jsxRuntime.jsx(StyledUgIcon$1, { children: children(props.type, props.size) }));
|
|
1278
1354
|
};
|
|
1279
|
-
var templateObject_1$
|
|
1355
|
+
var templateObject_1$y;
|
|
1280
1356
|
|
|
1281
|
-
var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObject_1$
|
|
1357
|
+
var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObject_1$x || (templateObject_1$x = __makeTemplateObject([""], [""])));
|
|
1282
1358
|
/**
|
|
1283
1359
|
* A Progress loader communicates progress when downloading or uploading content.
|
|
1284
1360
|
* <hr>
|
|
@@ -1290,9 +1366,9 @@ var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObjec
|
|
|
1290
1366
|
- When loading page content, use a Skeleton loader instead
|
|
1291
1367
|
*/
|
|
1292
1368
|
var Progress = function (props) { return jsxRuntime.jsx(UgProgress, __assign({}, props)); };
|
|
1293
|
-
var templateObject_1$
|
|
1369
|
+
var templateObject_1$x;
|
|
1294
1370
|
|
|
1295
|
-
var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_1$
|
|
1371
|
+
var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject([""], [""])));
|
|
1296
1372
|
/**
|
|
1297
1373
|
* Breadcrumbs mark and communicate a user’s location in the product.
|
|
1298
1374
|
* <hr>
|
|
@@ -1301,9 +1377,9 @@ var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_
|
|
|
1301
1377
|
- To provide a quick way to navigate to ancestor pages
|
|
1302
1378
|
*/
|
|
1303
1379
|
var Spinner = function (props) { return jsxRuntime.jsx(UgSpinner, __assign({}, props)); };
|
|
1304
|
-
var templateObject_1$
|
|
1380
|
+
var templateObject_1$w;
|
|
1305
1381
|
|
|
1306
|
-
var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$
|
|
1382
|
+
var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
|
|
1307
1383
|
var theme = _a.theme;
|
|
1308
1384
|
return theme.palette.white;
|
|
1309
1385
|
});
|
|
@@ -1311,43 +1387,43 @@ var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$u ||
|
|
|
1311
1387
|
* A Body defines the main content of an HTML document which displays on the browser
|
|
1312
1388
|
*/
|
|
1313
1389
|
var Body$1 = function (props) { return jsxRuntime.jsx(UgBody, __assign({}, props)); };
|
|
1314
|
-
var templateObject_1$
|
|
1390
|
+
var templateObject_1$v;
|
|
1315
1391
|
|
|
1316
1392
|
/**
|
|
1317
1393
|
* A Content defines the main content of an HTML document which displays on the browser
|
|
1318
1394
|
*/
|
|
1319
1395
|
var Content = function (props) { return jsxRuntime.jsx(reactChrome.Content, __assign({}, props)); };
|
|
1320
1396
|
|
|
1321
|
-
var _path$
|
|
1397
|
+
var _path$b;
|
|
1322
1398
|
|
|
1323
|
-
function _extends$
|
|
1399
|
+
function _extends$d() { _extends$d = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$d.apply(this, arguments); }
|
|
1324
1400
|
|
|
1325
1401
|
var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
|
|
1326
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1402
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$d({
|
|
1327
1403
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1328
1404
|
width: 16,
|
|
1329
1405
|
height: 16,
|
|
1330
1406
|
focusable: "false",
|
|
1331
1407
|
viewBox: "0 0 16 16"
|
|
1332
|
-
}, props), _path$
|
|
1408
|
+
}, props), _path$b || (_path$b = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1333
1409
|
fill: "currentColor",
|
|
1334
1410
|
d: "M12.688 5.61a.5.5 0 01.69.718l-.066.062-5 4a.5.5 0 01-.542.054l-.082-.054-5-4a.5.5 0 01.55-.83l.074.05L8 9.359l4.688-3.75z"
|
|
1335
1411
|
})));
|
|
1336
1412
|
};
|
|
1337
1413
|
|
|
1338
|
-
var UgHeaderItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$
|
|
1414
|
+
var UgHeaderItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n ", ";\n font-family: ", ";\n"], ["\n ", ";\n font-family: ", ";\n"])), function (props) { return props.hasLogo && "border-right: none"; }, function (_a) {
|
|
1339
1415
|
var theme = _a.theme;
|
|
1340
1416
|
return theme.fonts.system;
|
|
1341
1417
|
});
|
|
1342
1418
|
var HeaderItem = function (props) { return jsxRuntime.jsx(UgHeaderItem, __assign({}, props)); };
|
|
1343
|
-
var templateObject_1$
|
|
1419
|
+
var templateObject_1$u;
|
|
1344
1420
|
|
|
1345
|
-
var UgHeaderItemText = styled__default["default"](reactChrome.HeaderItemText)(templateObject_1$
|
|
1421
|
+
var UgHeaderItemText = styled__default["default"](reactChrome.HeaderItemText)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n font-family: ", ";\n"], ["\n font-family: ", ";\n"])), function (_a) {
|
|
1346
1422
|
var theme = _a.theme;
|
|
1347
1423
|
return theme.fonts.system;
|
|
1348
1424
|
});
|
|
1349
1425
|
var HeaderItemText = function (props) { return jsxRuntime.jsx(UgHeaderItemText, __assign({}, props)); };
|
|
1350
|
-
var templateObject_1$
|
|
1426
|
+
var templateObject_1$t;
|
|
1351
1427
|
|
|
1352
1428
|
var HeaderItemIcon = function (props) { return (jsxRuntime.jsx(reactChrome.HeaderItemIcon, __assign({}, props))); };
|
|
1353
1429
|
|
|
@@ -1377,18 +1453,18 @@ var Logo = function (props) {
|
|
|
1377
1453
|
}[props.type] })));
|
|
1378
1454
|
};
|
|
1379
1455
|
|
|
1380
|
-
var _path$
|
|
1456
|
+
var _path$a;
|
|
1381
1457
|
|
|
1382
|
-
function _extends$
|
|
1458
|
+
function _extends$c() { _extends$c = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$c.apply(this, arguments); }
|
|
1383
1459
|
|
|
1384
1460
|
var SvgMenuStroke = function SvgMenuStroke(props) {
|
|
1385
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1461
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$c({
|
|
1386
1462
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1387
1463
|
width: 16,
|
|
1388
1464
|
height: 16,
|
|
1389
1465
|
focusable: "false",
|
|
1390
1466
|
viewBox: "0 0 16 16"
|
|
1391
|
-
}, props), _path$
|
|
1467
|
+
}, props), _path$a || (_path$a = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1392
1468
|
fill: "none",
|
|
1393
1469
|
stroke: "currentColor",
|
|
1394
1470
|
strokeLinecap: "round",
|
|
@@ -1396,11 +1472,11 @@ var SvgMenuStroke = function SvgMenuStroke(props) {
|
|
|
1396
1472
|
})));
|
|
1397
1473
|
};
|
|
1398
1474
|
|
|
1399
|
-
var LogoIconContainer = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$
|
|
1475
|
+
var LogoIconContainer = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$s || (templateObject_1$s = __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) {
|
|
1400
1476
|
var theme = _a.theme;
|
|
1401
1477
|
return theme.breakpoints.sm;
|
|
1402
1478
|
});
|
|
1403
|
-
var BrandName = styled__default["default"](reactChrome.HeaderItem)(templateObject_2$
|
|
1479
|
+
var BrandName = styled__default["default"](reactChrome.HeaderItem)(templateObject_2$c || (templateObject_2$c = __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) {
|
|
1404
1480
|
var theme = _a.theme;
|
|
1405
1481
|
return theme.palette.blue["600"];
|
|
1406
1482
|
}, function (_a) {
|
|
@@ -1410,7 +1486,7 @@ var BrandName = styled__default["default"](reactChrome.HeaderItem)(templateObjec
|
|
|
1410
1486
|
var theme = _a.theme;
|
|
1411
1487
|
return theme.breakpoints.sm;
|
|
1412
1488
|
});
|
|
1413
|
-
var MenuItem$1 = styled__default["default"](reactChrome.HeaderItem)(templateObject_3$
|
|
1489
|
+
var MenuItem$1 = styled__default["default"](reactChrome.HeaderItem)(templateObject_3$7 || (templateObject_3$7 = __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) {
|
|
1414
1490
|
var theme = _a.theme;
|
|
1415
1491
|
return theme.palette.blue["600"];
|
|
1416
1492
|
}, function (_a) {
|
|
@@ -1420,9 +1496,9 @@ var MenuItem$1 = styled__default["default"](reactChrome.HeaderItem)(templateObje
|
|
|
1420
1496
|
var BrandItem = function (props) {
|
|
1421
1497
|
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.brandName && (jsxRuntime.jsx(BrandName, __assign({}, props, { children: jsxRuntime.jsx(HeaderItemText, { children: props.brandName }) })))] }));
|
|
1422
1498
|
};
|
|
1423
|
-
var templateObject_1$
|
|
1499
|
+
var templateObject_1$s, templateObject_2$c, templateObject_3$7;
|
|
1424
1500
|
|
|
1425
|
-
var UgHeader = styled__default["default"](reactChrome.Header)(templateObject_1$
|
|
1501
|
+
var UgHeader = styled__default["default"](reactChrome.Header)(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n height: ", ";\n"], ["\n height: ", ";\n"])), theme.components.chrome.header.height);
|
|
1426
1502
|
/**
|
|
1427
1503
|
* An Header is a visual way to display general information.
|
|
1428
1504
|
* This can include navList Items, modal, profile settings.
|
|
@@ -1431,13 +1507,13 @@ var Header = function (props) { return jsxRuntime.jsx(UgHeader, __assign({}, pro
|
|
|
1431
1507
|
Header.HeaderItem = HeaderItem;
|
|
1432
1508
|
Header.HeaderItemText = HeaderItemText;
|
|
1433
1509
|
Header.HeaderItemIcon = HeaderItemIcon;
|
|
1434
|
-
var templateObject_1$
|
|
1510
|
+
var templateObject_1$r;
|
|
1435
1511
|
|
|
1436
1512
|
var HeaderSkeleton = function () {
|
|
1437
1513
|
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: jsxRuntime.jsx(Skeleton, { width: "200px", height: 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%" } }) }) }) }))] })));
|
|
1438
1514
|
};
|
|
1439
1515
|
|
|
1440
|
-
var ChevronButton = styled__default["default"](IconButton)(templateObject_1$
|
|
1516
|
+
var ChevronButton = styled__default["default"](IconButton)(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n @media (max-width: ", ") {\n display: none;\n }\n"], ["\n @media (max-width: ", ") {\n display: none;\n }\n"])), function (_a) {
|
|
1441
1517
|
var theme = _a.theme;
|
|
1442
1518
|
return theme.breakpoints.sm;
|
|
1443
1519
|
});
|
|
@@ -1449,9 +1525,9 @@ var AppHeader = function (_a) {
|
|
|
1449
1525
|
var brand = _a.brand, avatar = _a.avatar, isLoading = _a.isLoading, args = __rest(_a, ["brand", "avatar", "isLoading"]);
|
|
1450
1526
|
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, {}) }))] }) }) }))] })));
|
|
1451
1527
|
};
|
|
1452
|
-
var templateObject_1$
|
|
1528
|
+
var templateObject_1$q;
|
|
1453
1529
|
|
|
1454
|
-
var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$
|
|
1530
|
+
var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n border-right: ", ";\n border-color: ", ";\n ", "\n transition: width 0.25s ease-in-out;\n padding-top: ", ";\n padding-left: ", ";\n"], ["\n border-right: ", ";\n border-color: ", ";\n ", "\n transition: width 0.25s ease-in-out;\n padding-top: ", ";\n padding-left: ", ";\n"])), function (_a) {
|
|
1455
1531
|
var theme = _a.theme;
|
|
1456
1532
|
return theme.borders.sm;
|
|
1457
1533
|
}, function (_a) {
|
|
@@ -1473,10 +1549,10 @@ var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$o || (t
|
|
|
1473
1549
|
- To give a consistent dashboard and navigation experience
|
|
1474
1550
|
*/
|
|
1475
1551
|
var Nav = function (props) { return jsxRuntime.jsx(UgNav, __assign({}, props)); };
|
|
1476
|
-
var templateObject_1$
|
|
1552
|
+
var templateObject_1$p;
|
|
1477
1553
|
|
|
1478
|
-
var SelectedItemStyle = styled.css(templateObject_1$
|
|
1479
|
-
var UgNavItem$2 = styled__default["default"](reactChrome.NavItem)(templateObject_2$
|
|
1554
|
+
var SelectedItemStyle = styled.css(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (props) { return props.theme.palette.kale["100"]; });
|
|
1555
|
+
var UgNavItem$2 = styled__default["default"](reactChrome.NavItem)(templateObject_2$b || (templateObject_2$b = __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) {
|
|
1480
1556
|
var theme = _a.theme;
|
|
1481
1557
|
return theme.fonts.system;
|
|
1482
1558
|
}, function (props) { return !props.isExpanded && "display: none;"; }, function (props) { return props.isCurrent && SelectedItemStyle; }, SelectedItemStyle, function (props) { return props.theme.palette.blue["600"]; }, function (props) { return props.theme.fontWeights.medium; }, function (props) {
|
|
@@ -1487,11 +1563,11 @@ var NavItem = function (props) {
|
|
|
1487
1563
|
// const { isExpanded } = props;
|
|
1488
1564
|
return jsxRuntime.jsx(UgNavItem$2, __assign({}, props));
|
|
1489
1565
|
};
|
|
1490
|
-
var templateObject_1$
|
|
1566
|
+
var templateObject_1$o, templateObject_2$b;
|
|
1491
1567
|
|
|
1492
|
-
var UgNavIcon = styled__default["default"](reactChrome.NavItemIcon)(templateObject_1$
|
|
1568
|
+
var UgNavIcon = styled__default["default"](reactChrome.NavItemIcon)(templateObject_1$n || (templateObject_1$n = __makeTemplateObject([""], [""])));
|
|
1493
1569
|
var NavItemIcon = function (props) { return jsxRuntime.jsx(UgNavIcon, __assign({}, props)); };
|
|
1494
|
-
var templateObject_1$
|
|
1570
|
+
var templateObject_1$n;
|
|
1495
1571
|
|
|
1496
1572
|
/**
|
|
1497
1573
|
* Use Ellipsis to automatically provide text content with a native title attribute and text-overflow styling.
|
|
@@ -1500,41 +1576,41 @@ var Ellipsis = function (props) { return jsxRuntime.jsx(reactTypography.Ellipsis
|
|
|
1500
1576
|
|
|
1501
1577
|
var NavItemText = function (props) { return (jsxRuntime.jsx(reactChrome.NavItemText, __assign({}, props, { children: jsxRuntime.jsx(Ellipsis, __assign({ style: { width: "200px" } }, { children: props.children })) }))); };
|
|
1502
1578
|
|
|
1503
|
-
var _path$
|
|
1579
|
+
var _path$9;
|
|
1504
1580
|
|
|
1505
|
-
function _extends$
|
|
1581
|
+
function _extends$b() { _extends$b = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$b.apply(this, arguments); }
|
|
1506
1582
|
|
|
1507
1583
|
var SvgChevronRightStroke = function SvgChevronRightStroke(props) {
|
|
1508
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1584
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$b({
|
|
1509
1585
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1510
1586
|
width: 16,
|
|
1511
1587
|
height: 16,
|
|
1512
1588
|
focusable: "false",
|
|
1513
1589
|
viewBox: "0 0 16 16"
|
|
1514
|
-
}, props), _path$
|
|
1590
|
+
}, props), _path$9 || (_path$9 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1515
1591
|
fill: "currentColor",
|
|
1516
1592
|
d: "M5.61 3.312a.5.5 0 01.718-.69l.062.066 4 5a.5.5 0 01.054.542l-.054.082-4 5a.5.5 0 01-.83-.55l.05-.074L9.359 8l-3.75-4.688z"
|
|
1517
1593
|
})));
|
|
1518
1594
|
};
|
|
1519
1595
|
|
|
1520
|
-
var _path$
|
|
1596
|
+
var _path$8;
|
|
1521
1597
|
|
|
1522
|
-
function _extends$
|
|
1598
|
+
function _extends$a() { _extends$a = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$a.apply(this, arguments); }
|
|
1523
1599
|
|
|
1524
1600
|
var SvgChevronLeftStroke = function SvgChevronLeftStroke(props) {
|
|
1525
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1601
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$a({
|
|
1526
1602
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1527
1603
|
width: 16,
|
|
1528
1604
|
height: 16,
|
|
1529
1605
|
focusable: "false",
|
|
1530
1606
|
viewBox: "0 0 16 16"
|
|
1531
|
-
}, props), _path$
|
|
1607
|
+
}, props), _path$8 || (_path$8 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1532
1608
|
fill: "currentColor",
|
|
1533
1609
|
d: "M10.39 12.688a.5.5 0 01-.718.69l-.062-.066-4-5a.5.5 0 01-.054-.542l.054-.082 4-5a.5.5 0 01.83.55l-.05.074L6.641 8l3.75 4.688z"
|
|
1534
1610
|
})));
|
|
1535
1611
|
};
|
|
1536
1612
|
|
|
1537
|
-
var StyledToggle = styled__default["default"](IconButton)(templateObject_1$
|
|
1613
|
+
var StyledToggle = styled__default["default"](IconButton)(templateObject_1$m || (templateObject_1$m = __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) {
|
|
1538
1614
|
var theme = _a.theme;
|
|
1539
1615
|
return theme.space.base * 6;
|
|
1540
1616
|
}, function (_a) {
|
|
@@ -1559,42 +1635,42 @@ var StyledToggle = styled__default["default"](IconButton)(templateObject_1$l ||
|
|
|
1559
1635
|
var NavToggle = function (props) {
|
|
1560
1636
|
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%" } })) })));
|
|
1561
1637
|
};
|
|
1562
|
-
var templateObject_1$
|
|
1638
|
+
var templateObject_1$m;
|
|
1563
1639
|
|
|
1564
|
-
var UgNavItem$1 = styled__default["default"](reactChrome.NavItem)(templateObject_1$
|
|
1640
|
+
var UgNavItem$1 = styled__default["default"](reactChrome.NavItem)(templateObject_1$l || (templateObject_1$l = __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;"; });
|
|
1565
1641
|
var NavDivider = function (props) { return (jsxRuntime.jsx(UgNavItem$1, __assign({}, props, { children: jsxRuntime.jsx("span", { children: props.children }) }))); };
|
|
1566
|
-
var templateObject_1$
|
|
1642
|
+
var templateObject_1$l;
|
|
1567
1643
|
|
|
1568
|
-
var UgProjectSubtitle = styled__default["default"](NavItemText)(templateObject_1$
|
|
1569
|
-
var UgNavItem = styled__default["default"](NavItem)(templateObject_2$
|
|
1644
|
+
var UgProjectSubtitle = styled__default["default"](NavItemText)(templateObject_1$k || (templateObject_1$k = __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; });
|
|
1645
|
+
var UgNavItem = styled__default["default"](NavItem)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n flex-flow: column;\n align-items: flex-start;\n"], ["\n flex-flow: column;\n align-items: flex-start;\n"])));
|
|
1570
1646
|
var NavItemProject = function (props) { return jsxRuntime.jsx(UgNavItem, __assign({}, props)); };
|
|
1571
1647
|
NavItemProject.Title = NavItemText;
|
|
1572
1648
|
NavItemProject.SubTitle = UgProjectSubtitle;
|
|
1573
|
-
var templateObject_1$
|
|
1649
|
+
var templateObject_1$k, templateObject_2$a;
|
|
1574
1650
|
|
|
1575
|
-
var _path$
|
|
1651
|
+
var _path$7;
|
|
1576
1652
|
|
|
1577
|
-
function _extends$
|
|
1653
|
+
function _extends$9() { _extends$9 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$9.apply(this, arguments); }
|
|
1578
1654
|
|
|
1579
1655
|
var SvgHomeFill = function SvgHomeFill(props) {
|
|
1580
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1656
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$9({
|
|
1581
1657
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1582
1658
|
width: 26,
|
|
1583
1659
|
height: 26,
|
|
1584
1660
|
focusable: "false",
|
|
1585
1661
|
viewBox: "0 0 26 26"
|
|
1586
|
-
}, props), _path$
|
|
1662
|
+
}, props), _path$7 || (_path$7 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1587
1663
|
fill: "currentColor",
|
|
1588
1664
|
d: "M23.885 13.2l-1.328 1.639a.522.522 0 01-.737.084l-1.444-1.155v7.182c0 .577-.474 1.05-1.054 1.05H16.51c-.58 0-1.054-.473-1.054-1.05v-3.182a2.43 2.43 0 00-.716-1.732 2.448 2.448 0 00-1.74-.714 2.45 2.45 0 00-1.739.714 2.43 2.43 0 00-.716 1.732v3.182c0 .577-.474 1.05-1.054 1.05H6.678c-.582 0-1.054-.47-1.054-1.05v-7.182L4.18 14.923a.522.522 0 01-.737-.084L2.115 13.2a.52.52 0 01.084-.735l10.474-8.348a.51.51 0 01.654 0L23.8 12.466a.52.52 0 01.084.735"
|
|
1589
1665
|
})));
|
|
1590
1666
|
};
|
|
1591
1667
|
|
|
1592
|
-
var _linearGradient, _path$
|
|
1668
|
+
var _linearGradient, _path$6;
|
|
1593
1669
|
|
|
1594
|
-
function _extends$
|
|
1670
|
+
function _extends$8() { _extends$8 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$8.apply(this, arguments); }
|
|
1595
1671
|
|
|
1596
1672
|
var SvgHomeFillStyled = function SvgHomeFillStyled(props) {
|
|
1597
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1673
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$8({
|
|
1598
1674
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1599
1675
|
width: 26,
|
|
1600
1676
|
height: 26,
|
|
@@ -1610,7 +1686,7 @@ var SvgHomeFillStyled = function SvgHomeFillStyled(props) {
|
|
|
1610
1686
|
className: "stop3",
|
|
1611
1687
|
offset: "100%",
|
|
1612
1688
|
stopColor: "#001825"
|
|
1613
|
-
}))), _path$
|
|
1689
|
+
}))), _path$6 || (_path$6 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1614
1690
|
fill: "url(#unguessIconGradient)",
|
|
1615
1691
|
d: "M23.885 13.2l-1.328 1.639a.522.522 0 01-.737.084l-1.444-1.155v7.182c0 .577-.474 1.05-1.054 1.05H16.51c-.58 0-1.054-.473-1.054-1.05v-3.182a2.43 2.43 0 00-.716-1.732 2.448 2.448 0 00-1.74-.714 2.45 2.45 0 00-1.739.714 2.43 2.43 0 00-.716 1.732v3.182c0 .577-.474 1.05-1.054 1.05H6.678c-.582 0-1.054-.47-1.054-1.05v-7.182L4.18 14.923a.522.522 0 01-.737-.084L2.115 13.2a.52.52 0 01.084-.735l10.474-8.348a.51.51 0 01.654 0L23.8 12.466a.52.52 0 01.084.735"
|
|
1616
1692
|
})));
|
|
@@ -1618,10 +1694,10 @@ var SvgHomeFillStyled = function SvgHomeFillStyled(props) {
|
|
|
1618
1694
|
|
|
1619
1695
|
var _g, _defs;
|
|
1620
1696
|
|
|
1621
|
-
function _extends$
|
|
1697
|
+
function _extends$7() { _extends$7 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$7.apply(this, arguments); }
|
|
1622
1698
|
|
|
1623
1699
|
var SvgToken = function SvgToken(props) {
|
|
1624
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1700
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$7({
|
|
1625
1701
|
fill: "none",
|
|
1626
1702
|
viewBox: "0 0 32 32",
|
|
1627
1703
|
xmlns: "http://www.w3.org/2000/svg"
|
|
@@ -1673,8 +1749,8 @@ var LoadingSidebar = function () {
|
|
|
1673
1749
|
return (jsxRuntime.jsxs(Nav, __assign({ style: { width: "250px" } }, { 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" })] }))] })));
|
|
1674
1750
|
};
|
|
1675
1751
|
|
|
1676
|
-
var TokenContainer = styled__default["default"].div(templateObject_1$
|
|
1677
|
-
var ScrollingContainer = styled__default["default"].div(templateObject_2$
|
|
1752
|
+
var TokenContainer = styled__default["default"].div(templateObject_1$j || (templateObject_1$j = __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"])));
|
|
1753
|
+
var ScrollingContainer = styled__default["default"].div(templateObject_2$9 || (templateObject_2$9 = __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"])));
|
|
1678
1754
|
/**
|
|
1679
1755
|
* The UNGUESS Sidebar component provides a high-level layout structure and sets a framework for navigating around projects.
|
|
1680
1756
|
* <br>
|
|
@@ -1693,9 +1769,9 @@ var Sidebar = function (props) {
|
|
|
1693
1769
|
return props.isLoading ? jsxRuntime.jsx(LoadingSidebar, {}) : (jsxRuntime.jsxs(Nav, __assign({}, props, { children: [jsxRuntime.jsx(NavToggle, { onClick: toggleNav, isExpanded: props.isExpanded }), props.tokens && (jsxRuntime.jsx(NavItem, __assign({ hasLogo: true, isExpanded: props.isExpanded, style: { pointerEvents: "none", paddingTop: 0 } }, { children: jsxRuntime.jsx(Card, __assign({ style: { padding: theme.space.sm, width: "70%" } }, { children: jsxRuntime.jsxs(TokenContainer, { children: [jsxRuntime.jsx(SvgToken, { width: 32 }), jsxRuntime.jsx(Span, __assign({ isBold: true, style: { marginLeft: theme.space.xs } }, { 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.jsx(NavDivider, __assign({ isExpanded: props.isExpanded }, { children: props.dividerLabel || "" })), jsxRuntime.jsx(ScrollingContainer, { children: props.projects &&
|
|
1694
1770
|
props.projects.map(function (project) { return (jsxRuntime.jsxs(NavItemProject, __assign({ isExpanded: props.isExpanded, isCurrent: nav === project.id, onClick: function () { return navigate(project.id); } }, { children: [jsxRuntime.jsx(NavItemProject.Title, { title: project.title, children: project.title }), jsxRuntime.jsx(NavItemProject.SubTitle, { children: project.campaigns })] }), project.id)); }) }), jsxRuntime.jsxs(NavItem, __assign({ isExpanded: props.isExpanded, hasBrandmark: true, title: "Be smart from the start", style: { pointerEvents: "none", paddingBottom: theme.space.md } }, { children: [jsxRuntime.jsx(NavItemIcon, { children: jsxRuntime.jsx(Logo, { type: "icon", size: 150 }) }), jsxRuntime.jsx(NavItemText, { children: "UNGUESS" })] }))] })));
|
|
1695
1771
|
};
|
|
1696
|
-
var templateObject_1$
|
|
1772
|
+
var templateObject_1$j, templateObject_2$9;
|
|
1697
1773
|
|
|
1698
|
-
var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$
|
|
1774
|
+
var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$i || (templateObject_1$i = __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"], ["\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"])), function (_a) {
|
|
1699
1775
|
var theme = _a.theme;
|
|
1700
1776
|
return theme.breakpoints.sm;
|
|
1701
1777
|
}, function (_a) {
|
|
@@ -1706,13 +1782,13 @@ var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$h ||
|
|
|
1706
1782
|
* A Main defines the main content of an HTML document which displays on the browser
|
|
1707
1783
|
*/
|
|
1708
1784
|
var Main = function (props) { return jsxRuntime.jsx(UgMain, __assign({}, props)); };
|
|
1709
|
-
var templateObject_1$
|
|
1785
|
+
var templateObject_1$i;
|
|
1710
1786
|
|
|
1711
|
-
var StyledHr = styled__default["default"].hr(templateObject_1$
|
|
1787
|
+
var StyledHr = styled__default["default"].hr(templateObject_1$h || (templateObject_1$h = __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]);
|
|
1712
1788
|
var PageLoader = function () {
|
|
1713
1789
|
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, { isLoading: true }), jsxRuntime.jsxs(Main, { children: [jsxRuntime.jsx(Skeleton, { width: "30%", height: "32px" }), jsxRuntime.jsx(StyledHr, { style: { margin: "24px 0" } }), jsxRuntime.jsxs(Row$1, { children: [jsxRuntime.jsx(Col, __assign({ size: 3 }, { children: jsxRuntime.jsx(CampaignCard, { isLoading: true, projectTitle: "", campaignTitle: "", date: "" }) })), jsxRuntime.jsx(Col, __assign({ size: 3 }, { children: jsxRuntime.jsx(CampaignCard, { isLoading: true, projectTitle: "", campaignTitle: "", date: "" }) })), jsxRuntime.jsx(Col, __assign({ size: 3 }, { children: jsxRuntime.jsx(CampaignCard, { isLoading: true, projectTitle: "", campaignTitle: "", date: "" }) })), jsxRuntime.jsx(Col, __assign({ size: 3 }, { children: jsxRuntime.jsx(CampaignCard, { isLoading: true, projectTitle: "", campaignTitle: "", date: "" }) }))] })] })] })] }) })));
|
|
1714
1790
|
};
|
|
1715
|
-
var templateObject_1$
|
|
1791
|
+
var templateObject_1$h;
|
|
1716
1792
|
|
|
1717
1793
|
/**
|
|
1718
1794
|
* Title is a basic component used to display a title. Often used in card headers.
|
|
@@ -1760,7 +1836,7 @@ var LoginForm = function (props) { return (jsxRuntime.jsxs(jsxRuntime.Fragment,
|
|
|
1760
1836
|
: false, isPrimary: true, style: { marginBottom: theme.space.md } }, { children: props.buttonText })), status && (jsxRuntime.jsx("div", __assign({ style: { textAlign: "center" } }, { children: jsxRuntime.jsx(Message, __assign({ validation: "error" }, { children: status.message })) })))] })));
|
|
1761
1837
|
} }))] })), 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"] })))] })); };
|
|
1762
1838
|
|
|
1763
|
-
var ugModalBody = styled__default["default"](reactModals.Body)(templateObject_1$
|
|
1839
|
+
var ugModalBody = styled__default["default"](reactModals.Body)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
|
|
1764
1840
|
var theme = _a.theme;
|
|
1765
1841
|
return theme.palette.grey["800"];
|
|
1766
1842
|
});
|
|
@@ -1769,7 +1845,35 @@ var FooterItem = reactModals.FooterItem;
|
|
|
1769
1845
|
Modal.Header = reactModals.Header;
|
|
1770
1846
|
Modal.Body = ugModalBody;
|
|
1771
1847
|
Modal.Footer = reactModals.Footer;
|
|
1772
|
-
var templateObject_1$
|
|
1848
|
+
var templateObject_1$g;
|
|
1849
|
+
|
|
1850
|
+
var StyledModal$1 = styled__default["default"](Modal)(templateObject_1$f || (templateObject_1$f = __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"])));
|
|
1851
|
+
var StyledHeader = styled__default["default"](Modal.Header)(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-direction: row;\n padding: ", "px ", "px;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-direction: row;\n padding: ", "px ", "px;\n"])), function (_a) {
|
|
1852
|
+
var theme = _a.theme;
|
|
1853
|
+
return theme.space.base * 3;
|
|
1854
|
+
}, function (_a) {
|
|
1855
|
+
var theme = _a.theme;
|
|
1856
|
+
return theme.space.base * 6;
|
|
1857
|
+
});
|
|
1858
|
+
var StyledBody$4 = styled__default["default"](Modal.Body)(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
|
|
1859
|
+
var theme = _a.theme;
|
|
1860
|
+
return theme.palette.grey["100"];
|
|
1861
|
+
});
|
|
1862
|
+
var StyledFooter = styled__default["default"](Modal.Footer)(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n padding: ", "px ", "px;\n"], ["\n padding: ", "px ", "px;\n"])), function (_a) {
|
|
1863
|
+
var theme = _a.theme;
|
|
1864
|
+
return theme.space.base * 4;
|
|
1865
|
+
}, function (_a) {
|
|
1866
|
+
var theme = _a.theme;
|
|
1867
|
+
return theme.space.base * 6;
|
|
1868
|
+
});
|
|
1869
|
+
var StyledModalClose = styled__default["default"](reactModals.Close)(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n position: relative;\n top: unset;\n right: unset;\n"], ["\n position: relative;\n top: unset;\n right: unset;\n"])));
|
|
1870
|
+
var ModalFullScreen = function (props) { return jsxRuntime.jsx(StyledModal$1, __assign({}, props)); };
|
|
1871
|
+
ModalFullScreen.Header = StyledHeader;
|
|
1872
|
+
ModalFullScreen.Body = StyledBody$4;
|
|
1873
|
+
ModalFullScreen.Footer = StyledFooter;
|
|
1874
|
+
ModalFullScreen.Close = StyledModalClose;
|
|
1875
|
+
ModalFullScreen.FooterItem = FooterItem;
|
|
1876
|
+
var templateObject_1$f, templateObject_2$8, templateObject_3$6, templateObject_4$3, templateObject_5$1;
|
|
1773
1877
|
|
|
1774
1878
|
/**
|
|
1775
1879
|
* The Chrome component provides a high-level layout structure and sets a framework for navigating around Zendesk products.
|
|
@@ -1802,36 +1906,36 @@ var Pagination = function (props) { return jsxRuntime.jsx(UgPagination, __assign
|
|
|
1802
1906
|
var CursorPagination = reactPagination.CursorPagination;
|
|
1803
1907
|
var templateObject_1$e;
|
|
1804
1908
|
|
|
1805
|
-
var _path$
|
|
1909
|
+
var _path$5;
|
|
1806
1910
|
|
|
1807
|
-
function _extends$
|
|
1911
|
+
function _extends$6() { _extends$6 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$6.apply(this, arguments); }
|
|
1808
1912
|
|
|
1809
1913
|
var SvgExit = function SvgExit(props) {
|
|
1810
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1914
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$6({
|
|
1811
1915
|
width: 12,
|
|
1812
1916
|
height: 13,
|
|
1813
1917
|
viewBox: "0 0 12 13",
|
|
1814
1918
|
fill: "#68737D",
|
|
1815
1919
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1816
|
-
}, props), _path$
|
|
1920
|
+
}, props), _path$5 || (_path$5 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1817
1921
|
fillRule: "evenodd",
|
|
1818
1922
|
clipRule: "evenodd",
|
|
1819
1923
|
d: "M2.5 12.9992C2.37 12.9992 2.25 12.9492 2.15 12.8592L0.15 10.9292C0.0580183 10.8314 0.0047128 10.7034 0 10.5692V3.42923C0 3.29923 0.06 3.16923 0.15 3.06923L2.15 1.13923C2.3 0.999232 2.51 0.959232 2.7 1.03923C2.88 1.11923 3 1.29923 3 1.49923V2.99923H6C6.55614 2.99923 7 3.44309 7 3.99923V4.99923C7 5.27537 6.77614 5.49923 6.5 5.49923C6.22386 5.49923 6 5.27537 6 4.99923V3.99923H3V9.99923H6V8.99923C6 8.72309 6.22386 8.49923 6.5 8.49923C6.77614 8.49923 7 8.72309 7 8.99923V9.99923C7 10.5554 6.55614 10.9992 6 10.9992H3V12.4992C3 12.6992 2.88 12.8792 2.7 12.9592C2.63 12.9892 2.57 12.9992 2.5 12.9992ZM9.5 9.49923C9.44 9.49923 9.37 9.48923 9.31 9.45923C9.12311 9.38275 9.00074 9.20117 9 8.99923L8.99631 7.49923H5C4.72386 7.49923 4.5 7.27537 4.5 6.99923C4.5 6.72309 4.72386 6.49923 5 6.49923H8.99384L8.99 4.93923C8.99 4.73923 9.11 4.54923 9.3 4.47923C9.49 4.39923 9.7 4.44923 9.84 4.58923L11.51 6.28923C11.89 6.67923 11.89 7.30923 11.5 7.69923L9.85 9.34923C9.75972 9.44637 9.6326 9.50085 9.5 9.49923Z"
|
|
1820
1924
|
})));
|
|
1821
1925
|
};
|
|
1822
1926
|
|
|
1823
|
-
var _path$
|
|
1927
|
+
var _path$4;
|
|
1824
1928
|
|
|
1825
|
-
function _extends$
|
|
1929
|
+
function _extends$5() { _extends$5 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$5.apply(this, arguments); }
|
|
1826
1930
|
|
|
1827
1931
|
var SvgThumbsUp = function SvgThumbsUp(props) {
|
|
1828
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1932
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$5({
|
|
1829
1933
|
width: 16,
|
|
1830
1934
|
height: 16,
|
|
1831
1935
|
viewBox: "0 0 16 16",
|
|
1832
1936
|
fill: "none",
|
|
1833
1937
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1834
|
-
}, props), _path$
|
|
1938
|
+
}, props), _path$4 || (_path$4 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1835
1939
|
fillRule: "evenodd",
|
|
1836
1940
|
clipRule: "evenodd",
|
|
1837
1941
|
d: "M13.5 15C14.2828 15 14.8192 11.8284 15 7.5C15 7.22386 14.7761 7 14.5 7H9.5C9.22386 7 9 6.77614 9 6.5V2C9 1.44772 8.55229 1 8 1C7.44772 1 7 1.44772 7 2C7 4.97341 6.19918 6.46065 5.02719 6.8454C5.01015 6.85409 4.99957 6.87174 5 6.9L4.99891 15C4.99927 15 13.5 15 13.5 15ZM10 6H14.5C15.3284 6 16 6.67157 15.9996 7.52082C15.7692 13.0486 15.2701 16 13.5 16L5.03301 15.9989C4.75408 16.0174 4.48075 15.9146 4.28308 15.7169C4.08542 15.5193 3.98264 15.2459 4 15L4.00008 6.90914C3.99274 6.50762 4.21507 6.13707 4.64189 5.92566C5.41645 5.66747 6 4.58373 6 2C6 0.89543 6.89543 0 8 0C9.10457 0 10 0.89543 10 2V6ZM1 7V15H2V7H1ZM1 6H2C2.55228 6 3 6.44772 3 7V15C3 15.5523 2.55228 16 2 16H1C0.447715 16 0 15.5523 0 15V7C0 6.44772 0.447715 6 1 6Z",
|
|
@@ -1868,36 +1972,36 @@ var MenuItem = function (_a) {
|
|
|
1868
1972
|
};
|
|
1869
1973
|
var templateObject_1$c, templateObject_2$7, templateObject_3$5, templateObject_4$2;
|
|
1870
1974
|
|
|
1871
|
-
var _path$
|
|
1975
|
+
var _path$3;
|
|
1872
1976
|
|
|
1873
|
-
function _extends$
|
|
1977
|
+
function _extends$4() { _extends$4 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
|
|
1874
1978
|
|
|
1875
1979
|
var SvgQuestionMark = function SvgQuestionMark(props) {
|
|
1876
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1980
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$4({
|
|
1877
1981
|
width: 16,
|
|
1878
1982
|
height: 16,
|
|
1879
1983
|
viewBox: "0 0 16 16",
|
|
1880
1984
|
fill: "#68737D",
|
|
1881
1985
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1882
|
-
}, props), _path$
|
|
1986
|
+
}, props), _path$3 || (_path$3 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1883
1987
|
fillRule: "evenodd",
|
|
1884
1988
|
clipRule: "evenodd",
|
|
1885
1989
|
d: "M7.99997 11.5C8.55226 11.5 8.99997 11.0523 8.99997 10.5V9.4C8.99997 8.83787 9.33361 8.32072 9.92997 7.948C11.3791 7.15957 12.2479 5.53522 11.9883 3.84794C11.7161 2.21413 10.3858 0.883851 8.76437 0.613605C6.74482 0.234732 4.81137 1.36258 4.24419 3.20591C4.08177 3.73378 4.37802 4.29336 4.90589 4.45578C5.43375 4.6182 5.99333 4.32195 6.15575 3.79409C6.41982 2.93586 7.36323 2.38554 8.41568 2.58287C9.2141 2.71615 9.88382 3.38587 10.0136 4.1644C10.139 4.98036 9.70294 5.79565 8.92112 6.2221C7.72579 6.96712 6.99997 8.09213 6.99997 9.4V10.5C6.99997 11.0523 7.44769 11.5 7.99997 11.5ZM7.99997 15.5C8.8284 15.5 9.49997 14.8284 9.49997 14C9.49997 13.1716 8.8284 12.5 7.99997 12.5C7.17155 12.5 6.49997 13.1716 6.49997 14C6.49997 14.8284 7.17155 15.5 7.99997 15.5Z"
|
|
1886
1990
|
})));
|
|
1887
1991
|
};
|
|
1888
1992
|
|
|
1889
|
-
var _path$
|
|
1993
|
+
var _path$2;
|
|
1890
1994
|
|
|
1891
|
-
function _extends$
|
|
1995
|
+
function _extends$3() { _extends$3 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); }
|
|
1892
1996
|
|
|
1893
1997
|
var SvgCopy = function SvgCopy(props) {
|
|
1894
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
1998
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$3({
|
|
1895
1999
|
width: 12,
|
|
1896
2000
|
height: 16,
|
|
1897
2001
|
viewBox: "0 0 12 16",
|
|
1898
2002
|
fill: "none",
|
|
1899
2003
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1900
|
-
}, props), _path$
|
|
2004
|
+
}, props), _path$2 || (_path$2 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1901
2005
|
fillRule: "evenodd",
|
|
1902
2006
|
clipRule: "evenodd",
|
|
1903
2007
|
d: "M2.625 10C2.83211 10 3 10.2239 3 10.5C3 10.7761 2.83211 11 2.625 11H0.75C0.335786 11 0 10.5523 0 10V1C0 0.447715 0.335786 0 0.75 0H7.5C7.91421 0 8.25 0.447715 8.25 1V3.5C8.25 3.77614 8.08211 4 7.875 4C7.66789 4 7.5 3.77614 7.5 3.5V1H0.75V10H2.625ZM4.5 6V15H11.25V6H4.5ZM4.5 5H11.25C11.6642 5 12 5.44772 12 6V15C12 15.5523 11.6642 16 11.25 16H4.5C4.08579 16 3.75 15.5523 3.75 15V6C3.75 5.44772 4.08579 5 4.5 5Z",
|
|
@@ -1905,18 +2009,18 @@ var SvgCopy = function SvgCopy(props) {
|
|
|
1905
2009
|
})));
|
|
1906
2010
|
};
|
|
1907
2011
|
|
|
1908
|
-
var _path$
|
|
2012
|
+
var _path$1;
|
|
1909
2013
|
|
|
1910
|
-
function _extends$
|
|
2014
|
+
function _extends$2() { _extends$2 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
|
|
1911
2015
|
|
|
1912
2016
|
var SvgInfoFill = function SvgInfoFill(props) {
|
|
1913
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
2017
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$2({
|
|
1914
2018
|
width: 16,
|
|
1915
2019
|
height: 16,
|
|
1916
2020
|
viewBox: "0 0 16 16",
|
|
1917
2021
|
fill: "#68737D",
|
|
1918
2022
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1919
|
-
}, props), _path$
|
|
2023
|
+
}, props), _path$1 || (_path$1 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1920
2024
|
fillRule: "evenodd",
|
|
1921
2025
|
clipRule: "evenodd",
|
|
1922
2026
|
d: "M7.5 16C3.36 16 0 12.64 0 8.5C0 4.36 3.36 1 7.5 1C11.64 1 15 4.36 15 8.5C15 12.64 11.64 16 7.5 16ZM7 12.5C7 12.78 7.22 13 7.5 13C7.78 13 8 12.78 8 12.5V8C8 7.72 7.78 7.5 7.5 7.5C7.22 7.5 7 7.72 7 8V12.5ZM7.5 4C6.95 4 6.5 4.45 6.5 5C6.5 5.55 6.95 6 7.5 6C8.05 6 8.5 5.55 8.5 5C8.5 4.45 8.05 4 7.5 4Z"
|
|
@@ -1971,24 +2075,6 @@ var HelpItem = function (props) {
|
|
|
1971
2075
|
};
|
|
1972
2076
|
var templateObject_1$9, templateObject_2$6, templateObject_3$4, templateObject_4$1, templateObject_5, templateObject_6;
|
|
1973
2077
|
|
|
1974
|
-
var _path$1;
|
|
1975
|
-
|
|
1976
|
-
function _extends$2() { _extends$2 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
|
|
1977
|
-
|
|
1978
|
-
var SvgCheckLg = function SvgCheckLg(props) {
|
|
1979
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$2({
|
|
1980
|
-
width: 16,
|
|
1981
|
-
height: 16,
|
|
1982
|
-
viewBox: "0 0 16 16",
|
|
1983
|
-
fill: "#68737D",
|
|
1984
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
1985
|
-
}, props), _path$1 || (_path$1 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1986
|
-
fillRule: "evenodd",
|
|
1987
|
-
clipRule: "evenodd",
|
|
1988
|
-
d: "M14.6464 2.64645C14.8417 2.45118 15.1583 2.45118 15.3536 2.64645C15.5488 2.84171 15.5488 3.15829 15.3536 3.35355L5.35355 13.3536C5.15829 13.5488 4.84171 13.5488 4.64645 13.3536L0.646447 9.35355C0.451184 9.15829 0.451184 8.84171 0.646447 8.64645C0.841709 8.45118 1.15829 8.45118 1.35355 8.64645L5 12.2929L14.6464 2.64645Z"
|
|
1989
|
-
})));
|
|
1990
|
-
};
|
|
1991
|
-
|
|
1992
2078
|
function _extends$1() { _extends$1 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
|
|
1993
2079
|
|
|
1994
2080
|
var SvgEmpty = function SvgEmpty(props) {
|
|
@@ -2339,6 +2425,7 @@ exports.MediaItem = MediaItem;
|
|
|
2339
2425
|
exports.Menu = Menu;
|
|
2340
2426
|
exports.Message = Message;
|
|
2341
2427
|
exports.Modal = Modal;
|
|
2428
|
+
exports.ModalFullScreen = ModalFullScreen;
|
|
2342
2429
|
exports.Multiselect = Multiselect;
|
|
2343
2430
|
exports.Nav = Nav;
|
|
2344
2431
|
exports.NavDivider = NavDivider;
|
|
@@ -2358,6 +2445,7 @@ exports.ProductCard = ProductCard;
|
|
|
2358
2445
|
exports.ProfileModal = ProfileModal;
|
|
2359
2446
|
exports.Progress = Progress;
|
|
2360
2447
|
exports.Radio = Radio;
|
|
2448
|
+
exports.RadioCard = RadioCard;
|
|
2361
2449
|
exports.Row = Row$1;
|
|
2362
2450
|
exports.SM = SM;
|
|
2363
2451
|
exports.Select = Select;
|