@czi-sds/components 18.1.2 → 19.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.d.ts +182 -115
- package/dist/index.cjs.js +632 -362
- package/dist/index.esm.d.ts +182 -115
- package/dist/index.esm.js +631 -365
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +2 -2
package/dist/index.cjs.js
CHANGED
|
@@ -88,7 +88,7 @@ var FontWeight;
|
|
|
88
88
|
(function (FontWeight) {
|
|
89
89
|
FontWeight[FontWeight["bold"] = 700] = "bold";
|
|
90
90
|
FontWeight[FontWeight["light"] = 300] = "light";
|
|
91
|
-
FontWeight[FontWeight["medium"] =
|
|
91
|
+
FontWeight[FontWeight["medium"] = 500] = "medium";
|
|
92
92
|
FontWeight[FontWeight["regular"] = 400] = "regular";
|
|
93
93
|
FontWeight[FontWeight["semibold"] = 600] = "semibold";
|
|
94
94
|
})(FontWeight || (FontWeight = {}));
|
|
@@ -491,6 +491,10 @@ function makeThemeOptions(appTheme) {
|
|
|
491
491
|
var defaultThemeOptions = makeThemeOptions(defaultAppTheme);
|
|
492
492
|
var defaultTheme = createThemeAdaptor(defaultThemeOptions);
|
|
493
493
|
|
|
494
|
+
function focusVisibleA11yStyle() {
|
|
495
|
+
return "\n &.Mui-focusVisible, &:focus-visible {\n outline: 5px auto Highlight;\n outline: 5px auto -webkit-focus-ring-color;\n }\n ";
|
|
496
|
+
}
|
|
497
|
+
|
|
494
498
|
var getSpaces = function (_a) {
|
|
495
499
|
var _b;
|
|
496
500
|
var theme = _a.theme;
|
|
@@ -563,7 +567,7 @@ var fontCaps = function (fontSize) {
|
|
|
563
567
|
if (!typography)
|
|
564
568
|
return null;
|
|
565
569
|
var caps = typography.styles.caps;
|
|
566
|
-
return react.css(templateObject_1$
|
|
570
|
+
return react.css(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n ", "\n text-transform: uppercase;\n "], ["\n ", "\n text-transform: uppercase;\n "])), themeToCss(caps[fontSize]));
|
|
567
571
|
};
|
|
568
572
|
};
|
|
569
573
|
var fontCapsXxs = fontCaps("xxs");
|
|
@@ -587,35 +591,35 @@ var fontHeaderXs = fontHeader("xs");
|
|
|
587
591
|
var fontHeaderXxs = fontHeader("xxs");
|
|
588
592
|
var fontHeaderXxxs = fontHeader("xxxs");
|
|
589
593
|
function themeToCss(fontTheme) {
|
|
590
|
-
return react.css(templateObject_2$
|
|
594
|
+
return react.css(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n font-size: ", "px;\n line-height: ", ";\n letter-spacing: ", ";\n font-weight: ", ";\n text-transform: ", ";\n "], ["\n font-size: ", "px;\n line-height: ", ";\n letter-spacing: ", ";\n font-weight: ", ";\n text-transform: ", ";\n "])), fontTheme.fontSize, fontTheme.lineHeight, fontTheme.letterSpacing, fontTheme.fontWeight, fontTheme.textTransform);
|
|
591
595
|
}
|
|
592
|
-
var templateObject_1$
|
|
596
|
+
var templateObject_1$U, templateObject_2$B;
|
|
593
597
|
|
|
594
|
-
var StyledAccordionDetails = styles.styled(material.AccordionDetails)(templateObject_2$
|
|
598
|
+
var StyledAccordionDetails = styles.styled(material.AccordionDetails)(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$2, function (props) {
|
|
595
599
|
var spaces = getSpaces(props);
|
|
596
|
-
return react.css(templateObject_1$
|
|
600
|
+
return react.css(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n padding: ", "px;\n padding-top: ", "px;\n "], ["\n padding: ", "px;\n padding-top: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.xxs);
|
|
597
601
|
});
|
|
598
|
-
var templateObject_1$
|
|
602
|
+
var templateObject_1$T, templateObject_2$A;
|
|
599
603
|
|
|
600
604
|
var AccordionDetails = function (props) {
|
|
601
605
|
var children = props.children;
|
|
602
606
|
return jsxRuntime.jsx(StyledAccordionDetails, { children: children });
|
|
603
607
|
};
|
|
604
608
|
|
|
605
|
-
var _path$
|
|
606
|
-
function _extends$
|
|
609
|
+
var _path$1Q, _path2$u, _path3$4;
|
|
610
|
+
function _extends$1Z() { _extends$1Z = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1Z.apply(this, arguments); }
|
|
607
611
|
var SvgIconBacteriaLarge = function SvgIconBacteriaLarge(props) {
|
|
608
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
612
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1Z({
|
|
609
613
|
xmlns: "http://www.w3.org/2000/svg",
|
|
610
614
|
width: 22,
|
|
611
615
|
height: 22
|
|
612
|
-
}, props), _path$
|
|
616
|
+
}, props), _path$1Q || (_path$1Q = /*#__PURE__*/React__namespace.createElement("path", {
|
|
613
617
|
fillRule: "evenodd",
|
|
614
618
|
d: "M11.188 13.473a1.793 1.793 0 1 1-3.585 0 1.793 1.793 0 0 1 3.585 0Zm-1.792.693a.693.693 0 1 0 0-1.385.693.693 0 0 0 0 1.385Z",
|
|
615
619
|
clipRule: "evenodd"
|
|
616
|
-
})), _path2$
|
|
620
|
+
})), _path2$u || (_path2$u = /*#__PURE__*/React__namespace.createElement("path", {
|
|
617
621
|
d: "M13.06 7.332a.938.938 0 1 0 0-1.877.938.938 0 0 0 0 1.877ZM11.72 11.128a.693.693 0 0 1 .221-.954l.947-.59a.693.693 0 1 1 .733 1.176l-.947.59a.693.693 0 0 1-.954-.222ZM9.312 8.534a.693.693 0 1 0 1.366-.228L10.45 6.94a.693.693 0 1 0-1.366.228l.228 1.367Z"
|
|
618
|
-
})), _path3$
|
|
622
|
+
})), _path3$4 || (_path3$4 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
619
623
|
fillRule: "evenodd",
|
|
620
624
|
d: "M13.932 2.232a5.174 5.174 0 0 0-2.462-.28L10.944.808a.693.693 0 1 0-1.259.58l.429.93a5.23 5.23 0 0 0-.518.253l-.582-.692a.693.693 0 0 0-1.061.891l.532.633c-.187.184-.36.382-.52.595l-.822-.269a.693.693 0 0 0-.431 1.317l.573.187-.028.073-2 5.413-.38-.32a.693.693 0 0 0-.89 1.06l.869.732c-.05.394-.054.789-.015 1.175l-.934.159a.693.693 0 1 0 .232 1.366l1.026-.174a5.19 5.19 0 0 0 2.18 2.588c-.078.16-.168.327-.265.506l-.013.026c-.158.292-.34.628-.465.962-.13.346-.23.766-.144 1.21.089.468.363.86.785 1.174.45.336.924.45 1.397.393.434-.053.818-.248 1.118-.419.14-.08.256-.15.364-.216.162-.099.304-.185.476-.272.254-.128.45-.186.626-.186.477 0 .681.16.77.252a.565.565 0 0 1 .113.172.7.7 0 0 0 1.354-.355l-.675.166.675-.166v-.002l-.001-.002-.001-.004-.003-.01-.006-.022a1.72 1.72 0 0 0-.095-.243 1.967 1.967 0 0 0-.349-.501c-.359-.376-.933-.685-1.782-.685-.487 0-.912.162-1.256.336-.211.106-.449.25-.649.37-.096.059-.184.111-.255.152-.27.154-.451.228-.595.245-.104.013-.22.002-.39-.125-.198-.148-.235-.255-.246-.314-.016-.084-.007-.222.08-.457.089-.236.227-.493.4-.813l.006-.013c.1-.186.212-.393.316-.61a5.184 5.184 0 0 0 3.84-.435l.708.844a.693.693 0 0 0 1.062-.89l-.645-.77a5.16 5.16 0 0 0 .94-1.211l1.127.096a.693.693 0 1 0 .118-1.38l-.68-.059 1.9-5.142a5.14 5.14 0 0 0 .066-.191l.605.223a.693.693 0 1 0 .48-1.3l-.832-.307a5.175 5.175 0 0 0-.05-.968l.807-.123a.693.693 0 1 0-.21-1.37l-.98.15a5.222 5.222 0 0 0-.516-.913l.684-.578a.693.693 0 0 0-.895-1.058l-.733.62a5.187 5.187 0 0 0-1.5-.86Zm-.36 11.927 2.12-5.737A3.796 3.796 0 0 0 8.57 5.79l-2.12 5.738a3.796 3.796 0 0 0 7.121 2.63Z",
|
|
621
625
|
clipRule: "evenodd"
|
|
@@ -623,9 +627,9 @@ var SvgIconBacteriaLarge = function SvgIconBacteriaLarge(props) {
|
|
|
623
627
|
};
|
|
624
628
|
|
|
625
629
|
var _g$4, _defs$3;
|
|
626
|
-
function _extends$
|
|
630
|
+
function _extends$1Y() { _extends$1Y = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1Y.apply(this, arguments); }
|
|
627
631
|
var SvgIconBacteriaSmall = function SvgIconBacteriaSmall(props) {
|
|
628
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
632
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1Y({
|
|
629
633
|
xmlns: "http://www.w3.org/2000/svg",
|
|
630
634
|
width: 14,
|
|
631
635
|
height: 14
|
|
@@ -645,134 +649,134 @@ var SvgIconBacteriaSmall = function SvgIconBacteriaSmall(props) {
|
|
|
645
649
|
})))));
|
|
646
650
|
};
|
|
647
651
|
|
|
648
|
-
var _path$
|
|
649
|
-
function _extends$
|
|
652
|
+
var _path$1P;
|
|
653
|
+
function _extends$1X() { _extends$1X = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1X.apply(this, arguments); }
|
|
650
654
|
var SvgIconBarChartHorizontal3Small = function SvgIconBarChartHorizontal3Small(props) {
|
|
651
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
655
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1X({
|
|
652
656
|
xmlns: "http://www.w3.org/2000/svg",
|
|
653
657
|
width: 14,
|
|
654
658
|
height: 14,
|
|
655
659
|
fill: "none"
|
|
656
|
-
}, props), _path$
|
|
660
|
+
}, props), _path$1P || (_path$1P = /*#__PURE__*/React__namespace.createElement("path", {
|
|
657
661
|
d: "M1 2.13a1 1 0 0 1 1-1h6.4a1 1 0 0 1 1 1v.75a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-.75Zm0 4.5a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v.75a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-.75Zm0 4.5a1 1 0 0 1 1-1h2.8a1 1 0 0 1 1 1v.75a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-.75Z",
|
|
658
662
|
clipRule: "evenodd"
|
|
659
663
|
})));
|
|
660
664
|
};
|
|
661
665
|
|
|
662
|
-
var _path$
|
|
663
|
-
function _extends$
|
|
666
|
+
var _path$1O;
|
|
667
|
+
function _extends$1W() { _extends$1W = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1W.apply(this, arguments); }
|
|
664
668
|
var SvgIconBarChartVertical3Small = function SvgIconBarChartVertical3Small(props) {
|
|
665
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
669
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1W({
|
|
666
670
|
xmlns: "http://www.w3.org/2000/svg",
|
|
667
671
|
width: 14,
|
|
668
672
|
height: 14
|
|
669
|
-
}, props), _path$
|
|
673
|
+
}, props), _path$1O || (_path$1O = /*#__PURE__*/React__namespace.createElement("path", {
|
|
670
674
|
fillRule: "evenodd",
|
|
671
675
|
d: "M1.13 12V5.6a1 1 0 0 1 1-1h.75a1 1 0 0 1 1 1V12a1 1 0 0 1-1 1h-.75a1 1 0 0 1-1-1Zm4.5 0V2a1 1 0 0 1 1-1h.75a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1h-.75a1 1 0 0 1-1-1Zm4.5 0V9.2a1 1 0 0 1 1-1h.75a1 1 0 0 1 1 1V12a1 1 0 0 1-1 1h-.75a1 1 0 0 1-1-1Z"
|
|
672
676
|
})));
|
|
673
677
|
};
|
|
674
678
|
|
|
675
|
-
var _path$
|
|
676
|
-
function _extends$
|
|
679
|
+
var _path$1N;
|
|
680
|
+
function _extends$1V() { _extends$1V = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1V.apply(this, arguments); }
|
|
677
681
|
var SvgIconBarChartVertical4Small = function SvgIconBarChartVertical4Small(props) {
|
|
678
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
682
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1V({
|
|
679
683
|
xmlns: "http://www.w3.org/2000/svg",
|
|
680
684
|
width: 14,
|
|
681
685
|
height: 14
|
|
682
|
-
}, props), _path$
|
|
686
|
+
}, props), _path$1N || (_path$1N = /*#__PURE__*/React__namespace.createElement("path", {
|
|
683
687
|
fillRule: "evenodd",
|
|
684
688
|
d: "M5.61 2.707c.477 0 .864.387.864.864v8.715a.864.864 0 1 1-1.727 0V3.571c0-.477.387-.864.864-.864Zm-2.746 2.23c.476 0 .863.387.863.864v6.474a.864.864 0 1 1-1.727 0V5.801c0-.477.387-.863.864-.863ZM8.358.9c.477 0 .863.387.863.864v10.511a.864.864 0 1 1-1.727 0V1.764c0-.477.387-.864.864-.864Zm2.747 4.22c.477 0 .863.387.863.864v6.291a.864.864 0 0 1-1.727 0v-6.29c0-.478.387-.864.864-.864Z"
|
|
685
689
|
})));
|
|
686
690
|
};
|
|
687
691
|
|
|
688
|
-
var _path$
|
|
689
|
-
function _extends$
|
|
692
|
+
var _path$1M;
|
|
693
|
+
function _extends$1U() { _extends$1U = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1U.apply(this, arguments); }
|
|
690
694
|
var SvgIconBookLarge = function SvgIconBookLarge(props) {
|
|
691
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
695
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1U({
|
|
692
696
|
xmlns: "http://www.w3.org/2000/svg",
|
|
693
697
|
width: 22,
|
|
694
698
|
height: 22,
|
|
695
699
|
fill: "none"
|
|
696
|
-
}, props), _path$
|
|
700
|
+
}, props), _path$1M || (_path$1M = /*#__PURE__*/React__namespace.createElement("path", {
|
|
697
701
|
d: "M17.322 1.42H5.378A2.787 2.787 0 0 0 2.59 4.207V17.911a.754.754 0 0 0 .022.111 2.788 2.788 0 0 0 2.765 2.565h11.945a2.091 2.091 0 0 0 2.09-2.091V3.511a2.09 2.09 0 0 0-2.09-2.091Zm.697 2.09v11.614H7.552V2.814h9.77a.696.696 0 0 1 .697.697ZM5.378 2.815h.78v12.31h-.78c-.491.002-.972.136-1.394.387V4.208a1.394 1.394 0 0 1 1.394-1.394Zm11.944 16.379H5.378a1.34 1.34 0 1 1 0-2.676h12.64v1.98a.697.697 0 0 1-.696.696ZM9.988 5.707c0-.385.312-.697.697-.697h4.2a.697.697 0 1 1 0 1.394h-4.2a.697.697 0 0 1-.697-.697Z"
|
|
698
702
|
})));
|
|
699
703
|
};
|
|
700
704
|
|
|
701
|
-
var _path$
|
|
702
|
-
function _extends$
|
|
705
|
+
var _path$1L, _path2$t;
|
|
706
|
+
function _extends$1T() { _extends$1T = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1T.apply(this, arguments); }
|
|
703
707
|
var SvgIconCheckCircleLarge = function SvgIconCheckCircleLarge(props) {
|
|
704
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
708
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1T({
|
|
705
709
|
xmlns: "http://www.w3.org/2000/svg",
|
|
706
710
|
width: 22,
|
|
707
711
|
height: 22
|
|
708
|
-
}, props), _path$
|
|
712
|
+
}, props), _path$1L || (_path$1L = /*#__PURE__*/React__namespace.createElement("path", {
|
|
709
713
|
d: "M15.92 7.982a.825.825 0 0 0-1.34-.964l-4.801 6.67-2.916-3.24a.825.825 0 1 0-1.226 1.104l3.662 4.069a.75.75 0 0 0 1.166-.063l5.455-7.576Z"
|
|
710
|
-
})), _path2$
|
|
714
|
+
})), _path2$t || (_path2$t = /*#__PURE__*/React__namespace.createElement("path", {
|
|
711
715
|
fillRule: "evenodd",
|
|
712
716
|
d: "M20.5 11a9.5 9.5 0 1 1-19 0 9.5 9.5 0 0 1 19 0Zm-1.45 0a8.05 8.05 0 1 1-16.1 0 8.05 8.05 0 0 1 16.1 0Z",
|
|
713
717
|
clipRule: "evenodd"
|
|
714
718
|
})));
|
|
715
719
|
};
|
|
716
720
|
|
|
717
|
-
var _path$
|
|
718
|
-
function _extends$
|
|
721
|
+
var _path$1K;
|
|
722
|
+
function _extends$1S() { _extends$1S = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1S.apply(this, arguments); }
|
|
719
723
|
var SvgIconCheckCircleSmall = function SvgIconCheckCircleSmall(props) {
|
|
720
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
724
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1S({
|
|
721
725
|
xmlns: "http://www.w3.org/2000/svg",
|
|
722
726
|
width: 14,
|
|
723
727
|
height: 14
|
|
724
|
-
}, props), _path$
|
|
728
|
+
}, props), _path$1K || (_path$1K = /*#__PURE__*/React__namespace.createElement("path", {
|
|
725
729
|
fillRule: "evenodd",
|
|
726
730
|
d: "M12.6 7A5.6 5.6 0 1 1 1.4 7a5.6 5.6 0 0 1 11.2 0ZM14 7A7 7 0 1 1 0 7a7 7 0 0 1 14 0Zm-3.662-1.826a.725.725 0 1 0-1.176-.848l-3.075 4.27L4.29 6.598a.725.725 0 1 0-1.078.97l2.587 2.875a.5.5 0 0 0 .777-.043l3.763-5.226Z",
|
|
727
731
|
clipRule: "evenodd"
|
|
728
732
|
})));
|
|
729
733
|
};
|
|
730
734
|
|
|
731
|
-
var _path$
|
|
732
|
-
function _extends$
|
|
735
|
+
var _path$1J;
|
|
736
|
+
function _extends$1R() { _extends$1R = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1R.apply(this, arguments); }
|
|
733
737
|
var SvgIconCheckSmall = function SvgIconCheckSmall(props) {
|
|
734
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
738
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1R({
|
|
735
739
|
xmlns: "http://www.w3.org/2000/svg",
|
|
736
740
|
width: 14,
|
|
737
741
|
height: 14
|
|
738
|
-
}, props), _path$
|
|
742
|
+
}, props), _path$1J || (_path$1J = /*#__PURE__*/React__namespace.createElement("path", {
|
|
739
743
|
fillRule: "evenodd",
|
|
740
744
|
d: "M12.415 1.011a.78.78 0 0 0-.484.334L5.65 9.862l-3.248-3.67c-.207-.287-.55-.399-.86-.258-.294.132-.497.462-.535.848-.038.38.087.76.333.985l3.826 4.325c.33.37.833.338 1.131-.066l6.825-9.257c.233-.307.294-.774.153-1.166-.148-.411-.492-.66-.86-.592Z"
|
|
741
745
|
})));
|
|
742
746
|
};
|
|
743
747
|
|
|
744
|
-
var _path$
|
|
745
|
-
function _extends$
|
|
748
|
+
var _path$1I;
|
|
749
|
+
function _extends$1Q() { _extends$1Q = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1Q.apply(this, arguments); }
|
|
746
750
|
var SvgIconChevronDownLarge = function SvgIconChevronDownLarge(props) {
|
|
747
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
751
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1Q({
|
|
748
752
|
xmlns: "http://www.w3.org/2000/svg",
|
|
749
753
|
width: 22,
|
|
750
754
|
height: 22,
|
|
751
755
|
fill: "none"
|
|
752
|
-
}, props), _path$
|
|
756
|
+
}, props), _path$1I || (_path$1I = /*#__PURE__*/React__namespace.createElement("path", {
|
|
753
757
|
d: "M11.562 16.106a.75.75 0 0 1-1.067.002L1.972 7.517a.75.75 0 0 1 .004-1.061l.568-.563a.75.75 0 0 1 1.06.004l6.886 6.94a.75.75 0 0 0 1.067-.002L18.39 5.9a.75.75 0 0 1 1.06-.007l.57.561a.75.75 0 0 1 .008 1.06l-8.466 8.591Z",
|
|
754
758
|
clipRule: "evenodd"
|
|
755
759
|
})));
|
|
756
760
|
};
|
|
757
761
|
|
|
758
|
-
var _path$
|
|
759
|
-
function _extends$
|
|
762
|
+
var _path$1H;
|
|
763
|
+
function _extends$1P() { _extends$1P = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1P.apply(this, arguments); }
|
|
760
764
|
var SvgIconChevronDownSmall = function SvgIconChevronDownSmall(props) {
|
|
761
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
765
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1P({
|
|
762
766
|
xmlns: "http://www.w3.org/2000/svg",
|
|
763
767
|
width: 14,
|
|
764
768
|
height: 14,
|
|
765
769
|
fill: "none"
|
|
766
|
-
}, props), _path$
|
|
770
|
+
}, props), _path$1H || (_path$1H = /*#__PURE__*/React__namespace.createElement("path", {
|
|
767
771
|
d: "M7.374 10.461a.5.5 0 0 1-.711.001L1.116 4.871a.5.5 0 0 1 .002-.707l.64-.634a.5.5 0 0 1 .706.003L6.658 7.76a.5.5 0 0 0 .711-.001l4.162-4.223a.5.5 0 0 1 .707-.005l.641.632a.5.5 0 0 1 .005.707l-5.51 5.591Z",
|
|
768
772
|
clipRule: "evenodd"
|
|
769
773
|
})));
|
|
770
774
|
};
|
|
771
775
|
|
|
772
776
|
var _g$3, _defs$2;
|
|
773
|
-
function _extends$
|
|
777
|
+
function _extends$1O() { _extends$1O = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1O.apply(this, arguments); }
|
|
774
778
|
var SvgIconChevronLeft2Small = function SvgIconChevronLeft2Small(props) {
|
|
775
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
779
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1O({
|
|
776
780
|
xmlns: "http://www.w3.org/2000/svg",
|
|
777
781
|
width: 14,
|
|
778
782
|
height: 14,
|
|
@@ -791,38 +795,38 @@ var SvgIconChevronLeft2Small = function SvgIconChevronLeft2Small(props) {
|
|
|
791
795
|
})))));
|
|
792
796
|
};
|
|
793
797
|
|
|
794
|
-
var _path$
|
|
795
|
-
function _extends$
|
|
798
|
+
var _path$1G;
|
|
799
|
+
function _extends$1N() { _extends$1N = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1N.apply(this, arguments); }
|
|
796
800
|
var SvgIconChevronLeftLarge = function SvgIconChevronLeftLarge(props) {
|
|
797
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
801
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1N({
|
|
798
802
|
xmlns: "http://www.w3.org/2000/svg",
|
|
799
803
|
width: 22,
|
|
800
804
|
height: 22,
|
|
801
805
|
fill: "none"
|
|
802
|
-
}, props), _path$
|
|
806
|
+
}, props), _path$1G || (_path$1G = /*#__PURE__*/React__namespace.createElement("path", {
|
|
803
807
|
d: "M5.611 11.316a.75.75 0 0 1-.002-1.067l8.582-8.532a.749.749 0 0 1 1.06.003l.565.567a.751.751 0 0 1-.004 1.061L8.88 10.24a.75.75 0 0 0 .002 1.067l6.941 6.826a.751.751 0 0 1 .009 1.061l-.562.57a.75.75 0 0 1-1.061.009l-8.598-8.457Z",
|
|
804
808
|
clipRule: "evenodd"
|
|
805
809
|
})));
|
|
806
810
|
};
|
|
807
811
|
|
|
808
|
-
var _path$
|
|
809
|
-
function _extends$
|
|
812
|
+
var _path$1F;
|
|
813
|
+
function _extends$1M() { _extends$1M = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1M.apply(this, arguments); }
|
|
810
814
|
var SvgIconChevronLeftSmall = function SvgIconChevronLeftSmall(props) {
|
|
811
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
815
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1M({
|
|
812
816
|
xmlns: "http://www.w3.org/2000/svg",
|
|
813
817
|
width: 14,
|
|
814
818
|
height: 14,
|
|
815
819
|
fill: "none"
|
|
816
|
-
}, props), _path$
|
|
820
|
+
}, props), _path$1F || (_path$1F = /*#__PURE__*/React__namespace.createElement("path", {
|
|
817
821
|
d: "M3.536 7.373a.5.5 0 0 1-.001-.71l5.59-5.548a.5.5 0 0 1 .708.003l.634.639a.5.5 0 0 1-.003.707L6.237 6.658a.5.5 0 0 0 .001.71l4.223 4.162a.5.5 0 0 1 .005.708l-.632.64a.5.5 0 0 1-.707.006l-5.591-5.51Z",
|
|
818
822
|
clipRule: "evenodd"
|
|
819
823
|
})));
|
|
820
824
|
};
|
|
821
825
|
|
|
822
826
|
var _g$2, _defs$1;
|
|
823
|
-
function _extends$
|
|
827
|
+
function _extends$1L() { _extends$1L = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1L.apply(this, arguments); }
|
|
824
828
|
var SvgIconChevronRight2Small = function SvgIconChevronRight2Small(props) {
|
|
825
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
829
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1L({
|
|
826
830
|
xmlns: "http://www.w3.org/2000/svg",
|
|
827
831
|
width: 14,
|
|
828
832
|
height: 14,
|
|
@@ -841,136 +845,172 @@ var SvgIconChevronRight2Small = function SvgIconChevronRight2Small(props) {
|
|
|
841
845
|
})))));
|
|
842
846
|
};
|
|
843
847
|
|
|
844
|
-
var _path$
|
|
845
|
-
function _extends$
|
|
848
|
+
var _path$1E;
|
|
849
|
+
function _extends$1K() { _extends$1K = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1K.apply(this, arguments); }
|
|
846
850
|
var SvgIconChevronRightLarge = function SvgIconChevronRightLarge(props) {
|
|
847
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
851
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1K({
|
|
848
852
|
xmlns: "http://www.w3.org/2000/svg",
|
|
849
853
|
width: 22,
|
|
850
854
|
height: 22,
|
|
851
855
|
fill: "none"
|
|
852
|
-
}, props), _path$
|
|
856
|
+
}, props), _path$1E || (_path$1E = /*#__PURE__*/React__namespace.createElement("path", {
|
|
853
857
|
d: "M16.389 10.686a.75.75 0 0 1 .002 1.068l-8.586 8.528a.749.749 0 0 1-1.06-.004l-.564-.568a.749.749 0 0 1 .003-1.06l6.936-6.889a.75.75 0 0 0-.002-1.067l-6.937-6.83a.749.749 0 0 1-.009-1.06l.561-.57a.748.748 0 0 1 1.06-.008l8.596 8.46Z",
|
|
854
858
|
clipRule: "evenodd"
|
|
855
859
|
})));
|
|
856
860
|
};
|
|
857
861
|
|
|
858
|
-
var _path$
|
|
859
|
-
function _extends$
|
|
862
|
+
var _path$1D;
|
|
863
|
+
function _extends$1J() { _extends$1J = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1J.apply(this, arguments); }
|
|
860
864
|
var SvgIconChevronRightSmall = function SvgIconChevronRightSmall(props) {
|
|
861
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
865
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1J({
|
|
862
866
|
xmlns: "http://www.w3.org/2000/svg",
|
|
863
867
|
width: 14,
|
|
864
868
|
height: 14,
|
|
865
869
|
fill: "none"
|
|
866
|
-
}, props), _path$
|
|
870
|
+
}, props), _path$1D || (_path$1D = /*#__PURE__*/React__namespace.createElement("path", {
|
|
867
871
|
d: "M10.463 6.624a.5.5 0 0 1 .001.711l-5.591 5.548a.5.5 0 0 1-.707-.003l-.634-.64a.5.5 0 0 1 .003-.706L7.762 7.34a.5.5 0 0 0-.001-.711L3.538 2.467a.5.5 0 0 1-.005-.707l.632-.641a.5.5 0 0 1 .707-.005l5.59 5.51Z",
|
|
868
872
|
clipRule: "evenodd"
|
|
869
873
|
})));
|
|
870
874
|
};
|
|
871
875
|
|
|
872
|
-
var _path$
|
|
873
|
-
function _extends$
|
|
876
|
+
var _path$1C;
|
|
877
|
+
function _extends$1I() { _extends$1I = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1I.apply(this, arguments); }
|
|
874
878
|
var SvgIconChevronUpLarge = function SvgIconChevronUpLarge(props) {
|
|
875
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
879
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1I({
|
|
876
880
|
xmlns: "http://www.w3.org/2000/svg",
|
|
877
881
|
width: 22,
|
|
878
882
|
height: 22,
|
|
879
883
|
fill: "none"
|
|
880
|
-
}, props), _path$
|
|
884
|
+
}, props), _path$1C || (_path$1C = /*#__PURE__*/React__namespace.createElement("path", {
|
|
881
885
|
d: "M10.432 5.894a.75.75 0 0 1 1.067-.002l8.523 8.59a.75.75 0 0 1-.004 1.062l-.568.563a.75.75 0 0 1-1.06-.004l-6.886-6.94a.75.75 0 0 0-1.066.002l-6.834 6.933a.75.75 0 0 1-1.06.008l-.57-.562a.75.75 0 0 1-.008-1.06l8.466-8.59Z",
|
|
882
886
|
clipRule: "evenodd"
|
|
883
887
|
})));
|
|
884
888
|
};
|
|
885
889
|
|
|
886
|
-
var _path$
|
|
887
|
-
function _extends$
|
|
890
|
+
var _path$1B;
|
|
891
|
+
function _extends$1H() { _extends$1H = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1H.apply(this, arguments); }
|
|
888
892
|
var SvgIconChevronUpSmall = function SvgIconChevronUpSmall(props) {
|
|
889
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
893
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1H({
|
|
890
894
|
xmlns: "http://www.w3.org/2000/svg",
|
|
891
895
|
width: 14,
|
|
892
896
|
height: 14,
|
|
893
897
|
fill: "none"
|
|
894
|
-
}, props), _path$
|
|
898
|
+
}, props), _path$1B || (_path$1B = /*#__PURE__*/React__namespace.createElement("path", {
|
|
895
899
|
d: "M6.624 3.539a.5.5 0 0 1 .711-.001l5.548 5.591a.5.5 0 0 1-.003.707l-.64.634a.5.5 0 0 1-.706-.003L7.34 6.24a.5.5 0 0 0-.711.001l-4.162 4.223a.5.5 0 0 1-.707.005l-.641-.632a.5.5 0 0 1-.005-.707l5.51-5.591Z",
|
|
896
900
|
clipRule: "evenodd"
|
|
897
901
|
})));
|
|
898
902
|
};
|
|
899
903
|
|
|
900
|
-
var _path$
|
|
901
|
-
function _extends$
|
|
904
|
+
var _path$1A;
|
|
905
|
+
function _extends$1G() { _extends$1G = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1G.apply(this, arguments); }
|
|
902
906
|
var SvgIconCirclesOverlapLarge = function SvgIconCirclesOverlapLarge(props) {
|
|
903
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
907
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1G({
|
|
904
908
|
xmlns: "http://www.w3.org/2000/svg",
|
|
905
909
|
width: 22,
|
|
906
910
|
height: 22
|
|
907
|
-
}, props), _path$
|
|
911
|
+
}, props), _path$1A || (_path$1A = /*#__PURE__*/React__namespace.createElement("path", {
|
|
908
912
|
fillRule: "evenodd",
|
|
909
913
|
d: "M7.219 18.219c1.386 0 2.681-.391 3.781-1.069a7.219 7.219 0 1 0 0-12.3 7.219 7.219 0 1 0-3.781 13.37Zm0-1.45c.91 0 1.771-.211 2.537-.587A7.197 7.197 0 0 1 7.562 11c0-2.033.841-3.87 2.194-5.182a5.769 5.769 0 1 0-2.537 10.951ZM14.78 5.23c-.91 0-1.771.211-2.537.587A7.198 7.198 0 0 1 14.438 11c0 2.033-.841 3.87-2.194 5.182a5.769 5.769 0 1 0 2.537-10.951ZM11.37 6.994l-1.19.526c-.235.312-.44.648-.61 1.004l2.255-.998a5.795 5.795 0 0 0-.455-.532Zm1.18 1.797-3.492 1.545-.005-.012a5.828 5.828 0 0 0-.039.764l3.757-1.663a5.713 5.713 0 0 0-.22-.634Zm.438 2.124L9.23 12.577c.062.22.137.433.223.64l3.495-1.546a5.823 5.823 0 0 0 .038-.756Zm-.562 2.573-2.244.993c.143.188.296.367.46.537l1.16-.514c.242-.314.45-.655.624-1.016Z",
|
|
910
914
|
clipRule: "evenodd"
|
|
911
915
|
})));
|
|
912
916
|
};
|
|
913
917
|
|
|
914
|
-
var _path$
|
|
915
|
-
function _extends$
|
|
918
|
+
var _path$1z, _path2$s;
|
|
919
|
+
function _extends$1F() { _extends$1F = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1F.apply(this, arguments); }
|
|
916
920
|
var SvgIconCirclesOverlapSmall = function SvgIconCirclesOverlapSmall(props) {
|
|
917
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
921
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1F({
|
|
918
922
|
xmlns: "http://www.w3.org/2000/svg",
|
|
919
923
|
width: 14,
|
|
920
924
|
height: 14
|
|
921
|
-
}, props), _path$
|
|
925
|
+
}, props), _path$1z || (_path$1z = /*#__PURE__*/React__namespace.createElement("path", {
|
|
922
926
|
fillRule: "evenodd",
|
|
923
927
|
d: "M7 10.914a4.594 4.594 0 1 1 0-7.828 4.594 4.594 0 1 1 0 7.828Zm-1.099-.945a3.244 3.244 0 1 1 0-5.939A4.576 4.576 0 0 0 4.813 7c0 1.132.41 2.169 1.088 2.97ZM8.1 4.031a3.244 3.244 0 1 1 0 5.939A4.575 4.575 0 0 0 9.187 7c0-1.132-.41-2.169-1.088-2.97ZM7 4.825c.52.575.838 1.338.838 2.175 0 .837-.318 1.6-.838 2.175A3.232 3.232 0 0 1 6.162 7c0-.837.318-1.6.838-2.175Z",
|
|
924
928
|
clipRule: "evenodd"
|
|
925
|
-
})), _path2$
|
|
929
|
+
})), _path2$s || (_path2$s = /*#__PURE__*/React__namespace.createElement("path", {
|
|
926
930
|
d: "M7.838 7c0-.837-.318-1.6-.838-2.175A3.232 3.232 0 0 0 6.162 7c0 .837.318 1.6.838 2.175.52-.575.838-1.338.838-2.175Z"
|
|
927
931
|
})));
|
|
928
932
|
};
|
|
929
933
|
|
|
930
|
-
var _path$
|
|
931
|
-
function _extends$
|
|
934
|
+
var _path$1y, _path2$r;
|
|
935
|
+
function _extends$1E() { _extends$1E = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1E.apply(this, arguments); }
|
|
936
|
+
var SvgIconCodeLarge = function SvgIconCodeLarge(props) {
|
|
937
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1E({
|
|
938
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
939
|
+
width: 22,
|
|
940
|
+
height: 22,
|
|
941
|
+
fill: "none"
|
|
942
|
+
}, props), _path$1y || (_path$1y = /*#__PURE__*/React__namespace.createElement("path", {
|
|
943
|
+
d: "M12.176 3.332a.447.447 0 0 1 .547-.316l.785.21c.239.065.38.31.316.548L9.833 18.67a.447.447 0 0 1-.547.316l-.786-.21a.447.447 0 0 1-.316-.548l3.992-14.896Z"
|
|
944
|
+
})), _path2$r || (_path2$r = /*#__PURE__*/React__namespace.createElement("path", {
|
|
945
|
+
d: "M.133 11.328a.447.447 0 0 1 0-.635l4.994-4.956a.447.447 0 0 1 .632.003l.566.57a.447.447 0 0 1-.002.632L2.546 10.69a.447.447 0 0 0 .001.635l3.773 3.718a.447.447 0 0 1 .004.632l-.564.573a.447.447 0 0 1-.632.004L.133 11.328ZM21.867 10.66c.177.174.177.46 0 .634l-4.994 4.956a.447.447 0 0 1-.632-.002l-.566-.571a.447.447 0 0 1 .002-.632l3.777-3.746a.447.447 0 0 0-.001-.636L15.68 6.945a.447.447 0 0 1-.004-.631l.564-.573a.447.447 0 0 1 .632-.005l4.995 4.923Z",
|
|
946
|
+
clipRule: "evenodd"
|
|
947
|
+
})));
|
|
948
|
+
};
|
|
949
|
+
|
|
950
|
+
var _path$1x;
|
|
951
|
+
function _extends$1D() { _extends$1D = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1D.apply(this, arguments); }
|
|
932
952
|
var SvgIconCompassLarge = function SvgIconCompassLarge(props) {
|
|
933
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
953
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1D({
|
|
934
954
|
xmlns: "http://www.w3.org/2000/svg",
|
|
935
955
|
width: 22,
|
|
936
956
|
height: 22
|
|
937
|
-
}, props), _path$
|
|
957
|
+
}, props), _path$1x || (_path$1x = /*#__PURE__*/React__namespace.createElement("path", {
|
|
938
958
|
fillRule: "evenodd",
|
|
939
959
|
d: "M12.403 2.71a.7.7 0 0 0-.628-.696l-.071-.004h-1.399a.7.7 0 0 0-.695.628v.077a9.465 9.465 0 0 1 2.793 0V2.71Zm-4.195 0s-.008.204-.007.327a9.393 9.393 0 0 0-6.585 8.964 9.39 9.39 0 1 0 12.183-8.967v-.432a2.1 2.1 0 0 0-2.095-1.99h-1.399l-.107.003a2.1 2.1 0 0 0-1.99 2.095Zm-5.056 8.503a7.894 7.894 0 0 1 7.064-7.065.867.867 0 0 0-.012.146v.831c0 .46.359.831.8.831.443 0 .801-.372.801-.831v-.831a.867.867 0 0 0-.012-.146 7.894 7.894 0 0 1 7.064 7.065.875.875 0 0 0-.147-.013h-.833c-.46 0-.833.359-.833.8 0 .443.373.801.833.801h.833c.05 0 .1-.004.147-.012a7.894 7.894 0 0 1-7.064 7.064.866.866 0 0 0 .012-.145v-.832c0-.459-.358-.831-.8-.831-.442 0-.8.372-.8.831v.832c0 .05.003.098.011.145a7.894 7.894 0 0 1-7.064-7.064.875.875 0 0 0 .147.012h.833c.46 0 .833-.358.833-.8 0-.442-.373-.8-.833-.8H3.3c-.05 0-.099.003-.147.011ZM14.6 7.786a.45.45 0 0 1 .652.558l-.033.061-2.541 5.047a.42.42 0 0 1-.136.16l-.062.037-5.082 2.541a.448.448 0 0 1-.197.05.449.449 0 0 1-.319-.135.449.449 0 0 1-.112-.45l.027-.066 2.54-5.065a.422.422 0 0 1 .137-.16l.061-.037 5.064-2.541Zm-1.15 1.768-2.59 1.298 1.293 1.293 1.298-2.59Z",
|
|
940
960
|
clipRule: "evenodd"
|
|
941
961
|
})));
|
|
942
962
|
};
|
|
943
963
|
|
|
944
|
-
var _path$
|
|
945
|
-
function _extends$
|
|
964
|
+
var _path$1w, _path2$q;
|
|
965
|
+
function _extends$1C() { _extends$1C = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1C.apply(this, arguments); }
|
|
946
966
|
var SvgIconCopyLarge = function SvgIconCopyLarge(props) {
|
|
947
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
967
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1C({
|
|
948
968
|
xmlns: "http://www.w3.org/2000/svg",
|
|
949
969
|
width: 22,
|
|
950
970
|
height: 22
|
|
951
|
-
}, props), _path$
|
|
971
|
+
}, props), _path$1w || (_path$1w = /*#__PURE__*/React__namespace.createElement("path", {
|
|
952
972
|
d: "M5.526 16.883h6.566c.445 0 .794-.271.794-.617s-.349-.617-.794-.617H5.526c-.445 0-.794.271-.794.617s.35.617.794.617ZM12.092 14.287H5.526c-.438 0-.794-.28-.794-.626 0-.34.35-.608.794-.608h6.566c.438 0 .794.28.794.625 0 .341-.349.609-.794.609Z"
|
|
953
|
-
})), _path2$
|
|
973
|
+
})), _path2$q || (_path2$q = /*#__PURE__*/React__namespace.createElement("path", {
|
|
954
974
|
fillRule: "evenodd",
|
|
955
975
|
d: "M20.247 5.2c0-.202-.083-.4-.229-.544L16.053.657a.78.78 0 0 0-.544-.227H7.731c-.879 0-1.621.744-1.621 1.625v2.764H3.35c-.894 0-1.621.728-1.621 1.625V19.94c0 .897.727 1.626 1.621 1.626h10.916c.895 0 1.623-.73 1.623-1.626v-2.764h2.756c.88 0 1.624-.745 1.624-1.624l-.023-10.353ZM3.295 6.421c0-.03.026-.056.056-.056h7.006v3.2c0 .427.346.774.773.774h3.193v9.58c0 .028-.026.055-.056.055H3.35a.058.058 0 0 1-.056-.056V6.422Zm12.366 2.601-3.966-3.998a.779.779 0 0 0-.543-.228H7.675V2.055c0-.03.025-.056.056-.056h7.006v3.2c0 .427.346.774.772.774h3.194v9.579c0 .029-.026.056-.057.056H15.89V9.567c0-.2-.084-.4-.23-.544Zm-3.737-.252V7.455l1.314 1.316h-1.314Zm4.357-4.367V3.087l1.315 1.317H16.28Z",
|
|
956
976
|
clipRule: "evenodd"
|
|
957
977
|
})));
|
|
958
978
|
};
|
|
959
979
|
|
|
960
|
-
var _path$
|
|
961
|
-
function _extends$
|
|
980
|
+
var _path$1v;
|
|
981
|
+
function _extends$1B() { _extends$1B = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1B.apply(this, arguments); }
|
|
962
982
|
var SvgIconCopySmall = function SvgIconCopySmall(props) {
|
|
963
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
983
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1B({
|
|
964
984
|
xmlns: "http://www.w3.org/2000/svg",
|
|
965
985
|
width: 14,
|
|
966
986
|
height: 14
|
|
967
|
-
}, props), _path$
|
|
987
|
+
}, props), _path$1v || (_path$1v = /*#__PURE__*/React__namespace.createElement("path", {
|
|
968
988
|
fillRule: "evenodd",
|
|
969
989
|
d: "M9.87.75c.13 0 .257.031.388.102l.098.06.096.081 2.196 2.213a.826.826 0 0 1 .233.453l.01.129.013 5.738c0 .603-.432 1.128-1.028 1.264l-.13.024-.137.008-1.99-.001v1.136c0 .565-.362 1.052-.89 1.229l-.136.038-.131.022-.138.008h-5.93c-.61 0-1.13-.427-1.264-1.028l-.022-.131-.008-.138V4.48c0-.612.425-1.132 1.026-1.266l.13-.023.138-.008h1.99V2.046c0-.557.368-1.047.893-1.227l.135-.038.13-.023.136-.008H9.87ZM6.15 4.581H2.5v7.273h5.72l-.002-5.241H7.057a.902.902 0 0 1-.858-.62l-.036-.132-.012-.136V4.581Zm3.277-2.43H5.786v1.225h.963c.142 0 .282.034.426.11l.108.064.106.088 1.964 1.978a.87.87 0 0 1 .225.373l.031.121.012.133v3.18h1.869l.003-5.241h-1.16a.901.901 0 0 1-.857-.62L9.44 3.43l-.011-.135-.002-1.144Z",
|
|
970
990
|
clipRule: "evenodd"
|
|
971
991
|
})));
|
|
972
992
|
};
|
|
973
993
|
|
|
994
|
+
var _path$1u, _path2$p, _path3$3;
|
|
995
|
+
function _extends$1A() { _extends$1A = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1A.apply(this, arguments); }
|
|
996
|
+
var SvgIconCubeLarge = function SvgIconCubeLarge(props) {
|
|
997
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1A({
|
|
998
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
999
|
+
width: 22,
|
|
1000
|
+
height: 22,
|
|
1001
|
+
fill: "none"
|
|
1002
|
+
}, props), _path$1u || (_path$1u = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1003
|
+
d: "M10.636.344a.75.75 0 0 1 .728 0l9 5a.75.75 0 0 1 0 1.312l-9 5a.75.75 0 0 1-.728 0l-9-5a.75.75 0 0 1 0-1.312l9-5ZM3.544 6 11 10.142 18.456 6 11 1.858 3.544 6Z",
|
|
1004
|
+
clipRule: "evenodd"
|
|
1005
|
+
})), _path2$p || (_path2$p = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1006
|
+
d: "M20.38 5.354c.23.134.37.38.37.646v10a.75.75 0 0 1-.386.656l-9 5A.75.75 0 0 1 10.25 21V11a.75.75 0 0 1 .386-.656l9-5a.75.75 0 0 1 .744.01Zm-8.63 6.087v8.284l7.5-4.166V7.275l-7.5 4.166Z",
|
|
1007
|
+
clipRule: "evenodd"
|
|
1008
|
+
})), _path3$3 || (_path3$3 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1009
|
+
d: "M1.62 5.354A.75.75 0 0 0 1.25 6v10a.75.75 0 0 0 .386.656l9 5A.75.75 0 0 0 11.75 21V11a.75.75 0 0 0-.386-.656l-9-5a.75.75 0 0 0-.744.01Zm8.63 6.087v8.284l-7.5-4.166V7.275l7.5 4.166Z",
|
|
1010
|
+
clipRule: "evenodd"
|
|
1011
|
+
})));
|
|
1012
|
+
};
|
|
1013
|
+
|
|
974
1014
|
var _path$1t;
|
|
975
1015
|
function _extends$1z() { _extends$1z = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1z.apply(this, arguments); }
|
|
976
1016
|
var SvgIconDnaLarge = function SvgIconDnaLarge(props) {
|
|
@@ -2356,31 +2396,31 @@ var SvgIconSquareOnDashedSquareLarge = function SvgIconSquareOnDashedSquareLarge
|
|
|
2356
2396
|
})));
|
|
2357
2397
|
};
|
|
2358
2398
|
|
|
2359
|
-
var _path$p;
|
|
2399
|
+
var _path$p, _path2$8;
|
|
2360
2400
|
function _extends$r() { _extends$r = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$r.apply(this, arguments); }
|
|
2361
|
-
var
|
|
2401
|
+
var SvgIconStarLarge = function SvgIconStarLarge(props) {
|
|
2362
2402
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$r({
|
|
2363
2403
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2364
|
-
width:
|
|
2365
|
-
height:
|
|
2404
|
+
width: 22,
|
|
2405
|
+
height: 22
|
|
2366
2406
|
}, props), _path$p || (_path$p = /*#__PURE__*/React__namespace.createElement("path", {
|
|
2367
|
-
|
|
2407
|
+
fillRule: "evenodd",
|
|
2408
|
+
d: "m10.993 7.986-.586 1.41a1.7 1.7 0 0 1-1.434 1.041l-1.522.122 1.16.993a1.7 1.7 0 0 1 .547 1.686l-.354 1.485 1.303-.796a1.7 1.7 0 0 1 1.772 0l1.303.796-.354-1.485a1.7 1.7 0 0 1 .547-1.686l1.16-.993-1.522-.122a1.7 1.7 0 0 1-1.434-1.042l-.586-1.41Zm.923-1.556c-.341-.821-1.505-.821-1.846 0L9.068 8.839a.25.25 0 0 1-.211.153l-2.6.208c-.887.071-1.247 1.178-.571 1.757l1.981 1.697a.25.25 0 0 1 .08.248l-.605 2.537c-.206.865.735 1.55 1.494 1.085l2.227-1.36a.25.25 0 0 1 .26 0l2.227 1.36c.759.464 1.7-.22 1.494-1.085l-.606-2.537a.25.25 0 0 1 .08-.248l1.982-1.697c.675-.58.316-1.686-.57-1.757l-2.601-.208a.25.25 0 0 1-.21-.153L11.915 6.43Z",
|
|
2409
|
+
clipRule: "evenodd"
|
|
2410
|
+
})), _path2$8 || (_path2$8 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
2411
|
+
d: "M10.268 1.935a.725.725 0 0 1 1.45 0v1.55a.725.725 0 0 1-1.45 0v-1.55ZM20.4 10.269a.725.725 0 0 1 0 1.45h-1.55a.725.725 0 0 1 0-1.45h1.55ZM17.224 3.733a.725.725 0 1 1 1.026 1.025l-1.096 1.096a.725.725 0 1 1-1.026-1.025l1.096-1.096ZM19.007 17.232a.725.725 0 0 1-1.026 1.026l-1.096-1.096a.725.725 0 1 1 1.026-1.026l1.096 1.096ZM10.268 18.503a.725.725 0 0 1 1.45 0v1.55a.725.725 0 1 1-1.45 0v-1.55ZM3.135 10.269a.725.725 0 0 1 0 1.45h-1.55a.725.725 0 0 1 0-1.45h1.55ZM4.078 16.136a.725.725 0 0 1 1.025 1.026l-1.096 1.096a.725.725 0 0 1-1.025-1.026l1.096-1.096ZM5.857 4.829A.725.725 0 1 1 4.83 5.854L3.735 4.758a.725.725 0 0 1 1.026-1.025l1.096 1.096Z"
|
|
2368
2412
|
})));
|
|
2369
2413
|
};
|
|
2370
2414
|
|
|
2371
|
-
var _path$o
|
|
2415
|
+
var _path$o;
|
|
2372
2416
|
function _extends$q() { _extends$q = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$q.apply(this, arguments); }
|
|
2373
|
-
var
|
|
2417
|
+
var SvgIconStarburstSmall = function SvgIconStarburstSmall(props) {
|
|
2374
2418
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$q({
|
|
2375
2419
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2376
|
-
width:
|
|
2377
|
-
height:
|
|
2420
|
+
width: 14,
|
|
2421
|
+
height: 14
|
|
2378
2422
|
}, props), _path$o || (_path$o = /*#__PURE__*/React__namespace.createElement("path", {
|
|
2379
|
-
|
|
2380
|
-
d: "m10.993 7.986-.586 1.41a1.7 1.7 0 0 1-1.434 1.041l-1.522.122 1.16.993a1.7 1.7 0 0 1 .547 1.686l-.354 1.485 1.303-.796a1.7 1.7 0 0 1 1.772 0l1.303.796-.354-1.485a1.7 1.7 0 0 1 .547-1.686l1.16-.993-1.522-.122a1.7 1.7 0 0 1-1.434-1.042l-.586-1.41Zm.923-1.556c-.341-.821-1.505-.821-1.846 0L9.068 8.839a.25.25 0 0 1-.211.153l-2.6.208c-.887.071-1.247 1.178-.571 1.757l1.981 1.697a.25.25 0 0 1 .08.248l-.605 2.537c-.206.865.735 1.55 1.494 1.085l2.227-1.36a.25.25 0 0 1 .26 0l2.227 1.36c.759.464 1.7-.22 1.494-1.085l-.606-2.537a.25.25 0 0 1 .08-.248l1.982-1.697c.675-.58.316-1.686-.57-1.757l-2.601-.208a.25.25 0 0 1-.21-.153L11.915 6.43Z",
|
|
2381
|
-
clipRule: "evenodd"
|
|
2382
|
-
})), _path2$8 || (_path2$8 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
2383
|
-
d: "M10.268 1.935a.725.725 0 0 1 1.45 0v1.55a.725.725 0 0 1-1.45 0v-1.55ZM20.4 10.269a.725.725 0 0 1 0 1.45h-1.55a.725.725 0 0 1 0-1.45h1.55ZM17.224 3.733a.725.725 0 1 1 1.026 1.025l-1.096 1.096a.725.725 0 1 1-1.026-1.025l1.096-1.096ZM19.007 17.232a.725.725 0 0 1-1.026 1.026l-1.096-1.096a.725.725 0 1 1 1.026-1.026l1.096 1.096ZM10.268 18.503a.725.725 0 0 1 1.45 0v1.55a.725.725 0 1 1-1.45 0v-1.55ZM3.135 10.269a.725.725 0 0 1 0 1.45h-1.55a.725.725 0 0 1 0-1.45h1.55ZM4.078 16.136a.725.725 0 0 1 1.025 1.026l-1.096 1.096a.725.725 0 0 1-1.025-1.026l1.096-1.096ZM5.857 4.829A.725.725 0 1 1 4.83 5.854L3.735 4.758a.725.725 0 0 1 1.026-1.025l1.096 1.096Z"
|
|
2423
|
+
d: "m11.977 8.821.742 2.154-.846.165-1.391.272c-.299.009-.41.101-.47.393l-.816 2.128-.755-.419-1.237-.687c-.236-.184-.379-.185-.614-.001l-1.993 1.107-.309-.806-.507-1.321c-.063-.293-.174-.386-.472-.395l-2.236-.436.281-.816.461-1.337c.14-.265.117-.407-.106-.604L.274 6.446l.74-.444 1.214-.729c.278-.111.348-.235.306-.531l.04-2.28.853.136 1.396.223c.286.091.422.043.579-.211L6.896.889l.566.652.93 1.071c.156.253.289.3.575.209l2.254-.359.014.865.023 1.415c-.043.296.029.418.306.531l1.955 1.173-.543.671-.893 1.102c-.223.198-.246.338-.106.602Zm-1.058-1.548.348-.429-.475-.285c-.539-.379-.975-1.133-1.034-1.791l-.009-.552-.546.087c-.656.055-1.477-.242-1.945-.711l-.362-.415-.362.417c-.469.468-1.285.764-1.941.709l-.549-.087-.01.552c-.058.658-.492 1.41-1.032 1.791l-.476.285.349.43c.379.543.528 1.399.36 2.034l-.182.525.544.106c.638.171 1.303.73 1.584 1.327l.198.517.483-.269c.597-.276 1.468-.277 2.066-.001l.486.27.198-.516c.28-.598.949-1.158 1.586-1.328l.541-.106-.18-.524c-.17-.636-.019-1.494.36-2.036Z"
|
|
2384
2424
|
})));
|
|
2385
2425
|
};
|
|
2386
2426
|
|
|
@@ -2763,6 +2803,10 @@ var iconMap = {
|
|
|
2763
2803
|
largeIcon: SvgIconCirclesOverlapLarge,
|
|
2764
2804
|
smallIcon: SvgIconCirclesOverlapSmall,
|
|
2765
2805
|
},
|
|
2806
|
+
code: {
|
|
2807
|
+
largeIcon: SvgIconCodeLarge,
|
|
2808
|
+
smallIcon: null,
|
|
2809
|
+
},
|
|
2766
2810
|
compass: {
|
|
2767
2811
|
largeIcon: SvgIconCompassLarge,
|
|
2768
2812
|
smallIcon: null,
|
|
@@ -2771,6 +2815,10 @@ var iconMap = {
|
|
|
2771
2815
|
largeIcon: SvgIconCopyLarge,
|
|
2772
2816
|
smallIcon: SvgIconCopySmall,
|
|
2773
2817
|
},
|
|
2818
|
+
cube: {
|
|
2819
|
+
largeIcon: SvgIconCubeLarge,
|
|
2820
|
+
smallIcon: null,
|
|
2821
|
+
},
|
|
2774
2822
|
dna: {
|
|
2775
2823
|
largeIcon: SvgIconDnaLarge,
|
|
2776
2824
|
smallIcon: null,
|
|
@@ -3088,30 +3136,30 @@ function iconSize(props) {
|
|
|
3088
3136
|
var _a, _b;
|
|
3089
3137
|
var sdsSize = props.sdsSize;
|
|
3090
3138
|
var iconSizes = getIconSizes(props);
|
|
3091
|
-
return react.css(templateObject_1$
|
|
3139
|
+
return react.css(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n height: ", "px;\n width: ", "px;\n "], ["\n height: ", "px;\n width: ", "px;\n "])), (_a = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes[sdsSize]) === null || _a === void 0 ? void 0 : _a.height, (_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes[sdsSize]) === null || _b === void 0 ? void 0 : _b.width);
|
|
3092
3140
|
}
|
|
3093
3141
|
function buttonStyle() {
|
|
3094
|
-
return react.css(templateObject_2$
|
|
3142
|
+
return react.css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n color: inherit;\n "], ["\n color: inherit;\n "])));
|
|
3095
3143
|
}
|
|
3096
3144
|
function staticStyle(props) {
|
|
3097
3145
|
var _a = props.iconColor, iconColor = _a === void 0 ? "primary" : _a, _b = props.shade, shade = _b === void 0 ? 400 : _b;
|
|
3098
3146
|
var colors = getColors(props);
|
|
3099
|
-
return react.css(templateObject_3$
|
|
3147
|
+
return react.css(templateObject_3$q || (templateObject_3$q = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), colors === null || colors === void 0 ? void 0 : colors[iconColor][shade]);
|
|
3100
3148
|
}
|
|
3101
3149
|
function interactive(props) {
|
|
3102
3150
|
var colors = getColors(props);
|
|
3103
3151
|
var _a = props.iconColor, iconColor = _a === void 0 ? "primary" : _a, _b = props.shade, shade = _b === void 0 ? 400 : _b;
|
|
3104
|
-
return react.css(templateObject_4$
|
|
3152
|
+
return react.css(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n\n &:disabled {\n color: ", ";\n }\n "], ["\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n\n &:disabled {\n color: ", ";\n }\n "])), colors === null || colors === void 0 ? void 0 : colors.gray[500], colors === null || colors === void 0 ? void 0 : colors.gray[600], colors === null || colors === void 0 ? void 0 : colors[iconColor][shade], colors === null || colors === void 0 ? void 0 : colors.gray[300]);
|
|
3105
3153
|
}
|
|
3106
|
-
var doNotForwardProps$
|
|
3154
|
+
var doNotForwardProps$n = ["sdsIcon", "sdsSize", "sdsType", "iconColor"];
|
|
3107
3155
|
var StyledSvgIcon = styles.styled(material.SvgIcon, {
|
|
3108
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
3156
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
3109
3157
|
})(templateObject_6$c || (templateObject_6$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3110
3158
|
var sdsType = props.sdsType;
|
|
3111
3159
|
return react.css(templateObject_5$f || (templateObject_5$f = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n "])), sdsType !== "iconButton" && iconSize(props), sdsType === "static" && staticStyle(props), sdsType === "interactive" && interactive(props), sdsType === "button" && buttonStyle());
|
|
3112
3160
|
});
|
|
3113
3161
|
var StyledIcon = styles.styled("div")(templateObject_7$9 || (templateObject_7$9 = __makeTemplateObject(["\n /* display: contents causes an element's children to appear as if they were direct children of the element's parent, ignoring the element itself. This can be useful when a wrapper element should be ignored when using CSS grid or similar layout techniques. */\n display: contents;\n"], ["\n /* display: contents causes an element's children to appear as if they were direct children of the element's parent, ignoring the element itself. This can be useful when a wrapper element should be ignored when using CSS grid or similar layout techniques. */\n display: contents;\n"])));
|
|
3114
|
-
var templateObject_1$
|
|
3162
|
+
var templateObject_1$S, templateObject_2$z, templateObject_3$q, templateObject_4$k, templateObject_5$f, templateObject_6$c, templateObject_7$9;
|
|
3115
3163
|
|
|
3116
3164
|
/**
|
|
3117
3165
|
* @see https://mui.com/material-ui/icons/#icons
|
|
@@ -3132,16 +3180,16 @@ var Icon = React.forwardRef(function Icon(_a, ref) {
|
|
|
3132
3180
|
return null;
|
|
3133
3181
|
});
|
|
3134
3182
|
|
|
3135
|
-
var StyledAccordionHeader = styles.styled(material.AccordionSummary)(templateObject_2$
|
|
3183
|
+
var StyledAccordionHeader = styles.styled(material.AccordionSummary)(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderS, function (props) {
|
|
3136
3184
|
var spaces = getSpaces(props);
|
|
3137
3185
|
var colors = getColors(props);
|
|
3138
|
-
return react.css(templateObject_1$
|
|
3186
|
+
return react.css(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n padding: ", "px;\n min-height: 40px;\n align-items: flex-start;\n box-sizing: border-box;\n\n &.Mui-expanded {\n min-height: 40px;\n }\n\n .MuiAccordionSummary-content {\n margin: 0;\n flex-direction: column;\n\n &.Mui-expanded {\n margin: 0;\n }\n }\n\n .MuiAccordionSummary-expandIconWrapper {\n padding: 0px;\n margin-right: 0;\n margin-left: ", "px;\n svg {\n color: ", ";\n }\n }\n "], ["\n padding: ", "px;\n min-height: 40px;\n align-items: flex-start;\n box-sizing: border-box;\n\n &.Mui-expanded {\n min-height: 40px;\n }\n\n .MuiAccordionSummary-content {\n margin: 0;\n flex-direction: column;\n\n &.Mui-expanded {\n margin: 0;\n }\n }\n\n .MuiAccordionSummary-expandIconWrapper {\n padding: 0px;\n margin-right: 0;\n margin-left: ", "px;\n svg {\n color: ", ";\n }\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.m, colors === null || colors === void 0 ? void 0 : colors.gray[500]);
|
|
3139
3187
|
});
|
|
3140
|
-
var StyledSubtitle = styles.styled("p")(templateObject_4$
|
|
3188
|
+
var StyledSubtitle = styles.styled("p")(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
3141
3189
|
var colors = getColors(props);
|
|
3142
|
-
return react.css(templateObject_3$
|
|
3190
|
+
return react.css(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n color: ", ";\n margin: 0;\n "], ["\n color: ", ";\n margin: 0;\n "])), colors === null || colors === void 0 ? void 0 : colors.gray[500]);
|
|
3143
3191
|
});
|
|
3144
|
-
var templateObject_1$
|
|
3192
|
+
var templateObject_1$R, templateObject_2$y, templateObject_3$p, templateObject_4$j;
|
|
3145
3193
|
|
|
3146
3194
|
var AccordionHeader = function (props) {
|
|
3147
3195
|
var children = props.children, id = props.id, subtitle = props.subtitle;
|
|
@@ -3153,18 +3201,18 @@ var StyledAccordion = styles.styled(material.Accordion, {
|
|
|
3153
3201
|
shouldForwardProp: function (prop) {
|
|
3154
3202
|
return !sdsPropNames$5.includes(prop.toString());
|
|
3155
3203
|
},
|
|
3156
|
-
})(templateObject_2$
|
|
3204
|
+
})(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3157
3205
|
var useDivider = props.useDivider, togglePosition = props.togglePosition;
|
|
3158
3206
|
var shadows = getShadows(props);
|
|
3159
3207
|
var typography = getTypography(props);
|
|
3160
3208
|
var border = getBorders(props);
|
|
3161
|
-
return react.css(templateObject_1$
|
|
3209
|
+
return react.css(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n &.MuiAccordion-root {\n box-shadow: ", ";\n font-family: ", ";\n border-bottom: ", ";\n height: fit-content;\n\n & .MuiAccordionSummary-root {\n padding: 10px;\n min-height: 40px;\n\n &.Mui-expanded {\n min-height: unset;\n }\n\n & .MuiAccordionSummary-expandIcon,\n & .MuiAccordionSummary-expandIconWrapper {\n padding: 0;\n align-self: flex-start;\n }\n }\n\n .MuiAccordionDetails-root {\n padding: 10px;\n padding-top: 4px;\n }\n\n &:before {\n opacity: 0;\n }\n\n &.Mui-expanded {\n margin: 0;\n }\n ", "\n }\n "], ["\n &.MuiAccordion-root {\n box-shadow: ", ";\n font-family: ", ";\n border-bottom: ", ";\n height: fit-content;\n\n & .MuiAccordionSummary-root {\n padding: 10px;\n min-height: 40px;\n\n &.Mui-expanded {\n min-height: unset;\n }\n\n & .MuiAccordionSummary-expandIcon,\n & .MuiAccordionSummary-expandIconWrapper {\n padding: 0;\n align-self: flex-start;\n }\n }\n\n .MuiAccordionDetails-root {\n padding: 10px;\n padding-top: 4px;\n }\n\n &:before {\n opacity: 0;\n }\n\n &.Mui-expanded {\n margin: 0;\n }\n ", "\n }\n "])), shadows === null || shadows === void 0 ? void 0 : shadows.none, typography === null || typography === void 0 ? void 0 : typography.fontFamily, useDivider ? border === null || border === void 0 ? void 0 : border.gray[300] : "none", togglePosition === "left" && leftPosition(props));
|
|
3162
3210
|
});
|
|
3163
3211
|
var leftPosition = function (props) {
|
|
3164
3212
|
var spaces = getSpaces(props);
|
|
3165
|
-
return react.css(templateObject_3$
|
|
3213
|
+
return react.css(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n &.MuiAccordion-root {\n & .MuiAccordionSummary-root {\n flex-direction: row-reverse;\n\n .MuiAccordionSummary-content {\n padding-left: ", "px;\n }\n\n .MuiAccordionSummary-expandIconWrapper {\n margin: 0;\n transform: rotate(-90deg);\n align-self: flex-start;\n margin-top: ", "px;\n\n &.Mui-expanded {\n transform: rotate(0deg);\n }\n }\n }\n\n & .MuiAccordionDetails-root {\n padding-left: 30px;\n }\n }\n "], ["\n &.MuiAccordion-root {\n & .MuiAccordionSummary-root {\n flex-direction: row-reverse;\n\n .MuiAccordionSummary-content {\n padding-left: ", "px;\n }\n\n .MuiAccordionSummary-expandIconWrapper {\n margin: 0;\n transform: rotate(-90deg);\n align-self: flex-start;\n margin-top: ", "px;\n\n &.Mui-expanded {\n transform: rotate(0deg);\n }\n }\n }\n\n & .MuiAccordionDetails-root {\n padding-left: 30px;\n }\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.xxs);
|
|
3166
3214
|
};
|
|
3167
|
-
var templateObject_1$
|
|
3215
|
+
var templateObject_1$Q, templateObject_2$x, templateObject_3$o;
|
|
3168
3216
|
|
|
3169
3217
|
/**
|
|
3170
3218
|
* @see https://mui.com/material-ui/react-accordion/
|
|
@@ -3180,7 +3228,7 @@ var Accordion = React.forwardRef(function (props, ref) {
|
|
|
3180
3228
|
return (jsxRuntime.jsx(StyledAccordion, __assign({ square: true, useDivider: useDivider, togglePosition: togglePosition, expanded: expanded === id, onChange: handleChange(id), ref: ref }, props, { children: children })));
|
|
3181
3229
|
});
|
|
3182
3230
|
|
|
3183
|
-
var StyledAlert = styles.styled(material.Alert)(templateObject_1$
|
|
3231
|
+
var StyledAlert = styles.styled(material.Alert)(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3184
3232
|
var colors = getColors(props);
|
|
3185
3233
|
var spacings = getSpaces(props);
|
|
3186
3234
|
var shadows = getShadows(props);
|
|
@@ -3191,7 +3239,7 @@ var StyledAlert = styles.styled(material.Alert)(templateObject_1$N || (templateO
|
|
|
3191
3239
|
var backgroundColor = colors && colors[severity][100];
|
|
3192
3240
|
return "\n background-color: ".concat(backgroundColor, ";\n margin: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px 0;\n color: ").concat(defaultTheme.palette.text.primary, ";\n padding: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px\n ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px 9px;\n background-color: ").concat(alertColor, ";\n &.elevated {\n border-left: 5px solid;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.s, ";\n border-color: ").concat(borderColor, ";\n }\n .MuiAlert-icon {\n path {\n fill: ").concat(iconColor, ";\n }\n }\n ");
|
|
3193
3241
|
});
|
|
3194
|
-
var templateObject_1$
|
|
3242
|
+
var templateObject_1$P;
|
|
3195
3243
|
|
|
3196
3244
|
/**
|
|
3197
3245
|
* @see https://mui.com/material-ui/react-alert/
|
|
@@ -3204,6 +3252,7 @@ var noop = function () { };
|
|
|
3204
3252
|
var toKebabCase = function (str) {
|
|
3205
3253
|
return str.replace(/[\s_]+/g, "-").toLowerCase();
|
|
3206
3254
|
};
|
|
3255
|
+
var EMPTY_OBJECT = {};
|
|
3207
3256
|
|
|
3208
3257
|
var _a;
|
|
3209
3258
|
var SDSWarningTypes;
|
|
@@ -3265,23 +3314,23 @@ var showWarningIfFirstOccurence = function (warningType) {
|
|
|
3265
3314
|
var isOn = function (props) {
|
|
3266
3315
|
var sdsType = props.sdsType;
|
|
3267
3316
|
var colors = getColors(props);
|
|
3268
|
-
return react.css(templateObject_1$
|
|
3317
|
+
return react.css(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), sdsType !== "tertiary" &&
|
|
3269
3318
|
"\n color: ".concat(sdsType === "primary" ? colors === null || colors === void 0 ? void 0 : colors.primary[600] : colors === null || colors === void 0 ? void 0 : colors.primary[400], ";\n\n &:hover {\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.primary[600], ";\n }\n "));
|
|
3270
3319
|
};
|
|
3271
3320
|
var isDisabled$1 = function (props) {
|
|
3272
3321
|
var colors = getColors(props);
|
|
3273
|
-
return react.css(templateObject_2$
|
|
3322
|
+
return react.css(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), colors === null || colors === void 0 ? void 0 : colors.gray[300]);
|
|
3274
3323
|
};
|
|
3275
3324
|
var primary$2 = function (props) {
|
|
3276
3325
|
var colors = getColors(props);
|
|
3277
3326
|
var sdsSize = props.sdsSize;
|
|
3278
|
-
return react.css(templateObject_3$
|
|
3327
|
+
return react.css(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n color: ", ";\n\n &:hover {\n background: ", ";\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n "], ["\n color: ", ";\n\n &:hover {\n background: ", ";\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n "])), colors === null || colors === void 0 ? void 0 : colors.primary[400], colors === null || colors === void 0 ? void 0 : colors.gray[200], sdsSize === "small"
|
|
3279
3328
|
? colors === null || colors === void 0 ? void 0 : colors.primary[600]
|
|
3280
3329
|
: colors === null || colors === void 0 ? void 0 : colors.primary[400], colors === null || colors === void 0 ? void 0 : colors.primary[600]);
|
|
3281
3330
|
};
|
|
3282
3331
|
var secondary$2 = function (props) {
|
|
3283
3332
|
var colors = getColors(props);
|
|
3284
|
-
return react.css(templateObject_4$
|
|
3333
|
+
return react.css(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n color: ", ";\n\n &:hover,\n &:active {\n background: none;\n color: ", ";\n }\n "], ["\n color: ", ";\n\n &:hover,\n &:active {\n background: none;\n color: ", ";\n }\n "])), colors === null || colors === void 0 ? void 0 : colors.gray[500], colors === null || colors === void 0 ? void 0 : colors.primary[400]);
|
|
3285
3334
|
};
|
|
3286
3335
|
var tertiary = function (props) {
|
|
3287
3336
|
var colors = getColors(props);
|
|
@@ -3304,7 +3353,7 @@ var large = function (props) {
|
|
|
3304
3353
|
var iconSizes = getIconSizes(props);
|
|
3305
3354
|
return react.css(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "], ["\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "])), iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xl.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xl.height, sdsType === "primary" ? "margin: 5px;" : "");
|
|
3306
3355
|
};
|
|
3307
|
-
var doNotForwardProps$
|
|
3356
|
+
var doNotForwardProps$m = [
|
|
3308
3357
|
"on",
|
|
3309
3358
|
"sdsSize",
|
|
3310
3359
|
"sdsType",
|
|
@@ -3312,12 +3361,12 @@ var doNotForwardProps$k = [
|
|
|
3312
3361
|
"sdsIconProps",
|
|
3313
3362
|
];
|
|
3314
3363
|
var StyledButtonIcon$2 = styles.styled(material.IconButton, {
|
|
3315
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
3316
|
-
})(templateObject_10$1 || (templateObject_10$1 = __makeTemplateObject(["\n padding: 0;\n
|
|
3364
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
3365
|
+
})(templateObject_10$1 || (templateObject_10$1 = __makeTemplateObject(["\n padding: 0;\n ", "\n\n ", "\n"], ["\n padding: 0;\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
3317
3366
|
var on = props.on, disabled = props.disabled, sdsSize = props.sdsSize, sdsType = props.sdsType;
|
|
3318
3367
|
return react.css(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), sdsType === "primary" && primary$2(props), sdsType === "secondary" && secondary$2(props), sdsType === "tertiary" && tertiary(props), on && isOn(props), disabled && isDisabled$1(props), sdsSize === "small" && small$1(props), sdsSize === "medium" && medium$1(props), sdsSize === "large" && large(props));
|
|
3319
3368
|
});
|
|
3320
|
-
var templateObject_1$
|
|
3369
|
+
var templateObject_1$O, templateObject_2$w, templateObject_3$n, templateObject_4$i, templateObject_5$e, templateObject_6$b, templateObject_7$8, templateObject_8$6, templateObject_9$3, templateObject_10$1;
|
|
3321
3370
|
|
|
3322
3371
|
var ButtonIconSizeToSdsIconSize = {
|
|
3323
3372
|
large: "xl",
|
|
@@ -3337,17 +3386,17 @@ var sdsPropNames$4 = ["sdsStyle", "sdsStage", "intent", "handleSubmit"];
|
|
|
3337
3386
|
var rounded$3 = function (props) {
|
|
3338
3387
|
var corners = getCorners(props);
|
|
3339
3388
|
var borders = getBorders(props);
|
|
3340
|
-
return react.css(templateObject_1$
|
|
3389
|
+
return react.css(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n .", " .", " {\n border-radius: ", "px;\n border: ", ";\n }\n "], ["\n .", " .", " {\n border-radius: ", "px;\n border: ", ";\n }\n "])), material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, corners === null || corners === void 0 ? void 0 : corners.l, borders === null || borders === void 0 ? void 0 : borders.gray[400]);
|
|
3341
3390
|
};
|
|
3342
3391
|
var error$3 = function (props) {
|
|
3343
3392
|
var borders = getBorders(props);
|
|
3344
3393
|
var colors = getColors(props);
|
|
3345
|
-
return react.css(templateObject_2$
|
|
3394
|
+
return react.css(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "], ["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "])), material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, borders === null || borders === void 0 ? void 0 : borders.error[400], material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, borders === null || borders === void 0 ? void 0 : borders.error[400], material.outlinedInputClasses.root, material.outlinedInputClasses.focused, material.outlinedInputClasses.notchedOutline, borders === null || borders === void 0 ? void 0 : borders.error[400], material.inputAdornmentClasses.root, material.buttonBaseClasses.root, colors === null || colors === void 0 ? void 0 : colors.gray[500]);
|
|
3346
3395
|
};
|
|
3347
3396
|
var warning$3 = function (props) {
|
|
3348
3397
|
var borders = getBorders(props);
|
|
3349
3398
|
var colors = getColors(props);
|
|
3350
|
-
return react.css(templateObject_3$
|
|
3399
|
+
return react.css(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "], ["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "])), material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, borders === null || borders === void 0 ? void 0 : borders.warning[400], material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, borders === null || borders === void 0 ? void 0 : borders.warning[400], material.outlinedInputClasses.root, material.outlinedInputClasses.focused, material.outlinedInputClasses.notchedOutline, borders === null || borders === void 0 ? void 0 : borders.warning[400], material.inputAdornmentClasses.root, material.buttonBaseClasses.root, colors === null || colors === void 0 ? void 0 : colors.gray[500]);
|
|
3351
3400
|
};
|
|
3352
3401
|
var userInput$2 = function (props) {
|
|
3353
3402
|
var intent = props.intent;
|
|
@@ -3359,7 +3408,7 @@ var userInput$2 = function (props) {
|
|
|
3359
3408
|
? borders === null || borders === void 0 ? void 0 : borders.warning[400]
|
|
3360
3409
|
: borders === null || borders === void 0 ? void 0 : borders.primary[400];
|
|
3361
3410
|
var color = intent === "default" ? colors === null || colors === void 0 ? void 0 : colors.primary[400] : colors === null || colors === void 0 ? void 0 : colors.gray[500];
|
|
3362
|
-
return react.css(templateObject_4$
|
|
3411
|
+
return react.css(templateObject_4$h || (templateObject_4$h = __makeTemplateObject(["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", " svg {\n color: ", ";\n }\n "], ["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", " svg {\n color: ", ";\n }\n "])), material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, border, material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, border, material.inputAdornmentClasses.root, color);
|
|
3363
3412
|
};
|
|
3364
3413
|
var disabledStyled$2 = function (props) {
|
|
3365
3414
|
var borders = getBorders(props);
|
|
@@ -3383,10 +3432,10 @@ var StyledSearchBase = styles.styled(material.TextField, {
|
|
|
3383
3432
|
return react.css(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n margin-top: ", "px;\n margin-bottom: ", "px;\n margin-right: ", "px;\n min-width: 120px;\n display: block;\n\n [type=\"search\"]::-webkit-search-cancel-button {\n -webkit-appearance: none;\n appearance: none;\n }\n\n & .input-search-clear-icon {\n opacity: 0;\n margin-right: ", "px;\n }\n\n .", " {\n .", " {\n border: ", ";\n }\n\n &:hover .input-search-clear-icon,\n &:focus-within .input-search-clear-icon {\n opacity: ", ";\n }\n }\n\n .", " {\n padding: ", "px ", "px;\n height: 34px;\n box-sizing: border-box;\n background-color: #fff;\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n margin-top: ", "px;\n margin-bottom: ", "px;\n margin-right: ", "px;\n min-width: 120px;\n display: block;\n\n [type=\"search\"]::-webkit-search-cancel-button {\n -webkit-appearance: none;\n appearance: none;\n }\n\n & .input-search-clear-icon {\n opacity: 0;\n margin-right: ", "px;\n }\n\n .", " {\n .", " {\n border: ", ";\n }\n\n &:hover .input-search-clear-icon,\n &:focus-within .input-search-clear-icon {\n opacity: ", ";\n }\n }\n\n .", " {\n padding: ", "px ", "px;\n height: 34px;\n box-sizing: border-box;\n background-color: #fff;\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), spacings === null || spacings === void 0 ? void 0 : spacings.m, spacings === null || spacings === void 0 ? void 0 : spacings.m, spacings === null || spacings === void 0 ? void 0 : spacings.xl, spacings === null || spacings === void 0 ? void 0 : spacings.s, material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, borders === null || borders === void 0 ? void 0 : borders.gray[400], value ? 1 : 0, material.inputBaseClasses.inputSizeSmall, spacings === null || spacings === void 0 ? void 0 : spacings.xs, spacings === null || spacings === void 0 ? void 0 : spacings.l, material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, borders === null || borders === void 0 ? void 0 : borders.gray[500], material.outlinedInputClasses.root, material.outlinedInputClasses.focused, material.outlinedInputClasses.notchedOutline, borders === null || borders === void 0 ? void 0 : borders.primary[400], material.inputAdornmentClasses.root, material.buttonBaseClasses.root, colors === null || colors === void 0 ? void 0 : colors.primary[400], sdsStyle === "rounded" && rounded$3(props), intent === "error" && error$3(props), intent === "warning" && warning$3(props), disabled && disabledStyled$2(props), sdsStage === "userInput" && userInput$2(props));
|
|
3384
3433
|
});
|
|
3385
3434
|
var StyledInputAdornment = styles.styled(material.InputAdornment)(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
|
|
3386
|
-
var templateObject_1$
|
|
3435
|
+
var templateObject_1$N, templateObject_2$v, templateObject_3$m, templateObject_4$h, templateObject_5$d, templateObject_6$a, templateObject_7$7, templateObject_8$5, templateObject_9$2;
|
|
3387
3436
|
|
|
3388
3437
|
var fontBodyXs$4 = fontBody("xs");
|
|
3389
|
-
var StyledMenuItem$1 = styles.styled(material.MenuItem)(templateObject_1$
|
|
3438
|
+
var StyledMenuItem$1 = styles.styled(material.MenuItem)(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3390
3439
|
var selected = props.selected;
|
|
3391
3440
|
var colors = getColors(props);
|
|
3392
3441
|
var fontWeights = getFontWeights(props);
|
|
@@ -3394,7 +3443,7 @@ var StyledMenuItem$1 = styles.styled(material.MenuItem)(templateObject_1$K || (t
|
|
|
3394
3443
|
var primary = colors === null || colors === void 0 ? void 0 : colors.primary[400];
|
|
3395
3444
|
return "\n padding: ".concat(spacings === null || spacings === void 0 ? void 0 : spacings.xs, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.s, "px !important;\n min-height: unset;\n opacity: 1;\n\n &.MuiAutocomplete-option {\n min-height: unset;\n }\n \n .primary-text {\n font-weight: ").concat(selected ? fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold : fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.regular, ";\n }\n\n &.MuiButtonBase-root {\n background-color: transparent;\n opacity: 1;\n\n &:hover, &.").concat(material.menuItemClasses.focusVisible, " {\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[100], ";\n\n &[aria-selected=\"true\"] {\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[100], ";\n }\n }\n }\n\n &.MuiMenuItem-root .MuiSvgIcon-root {\n align-self: flex-start;\n }\n\n &.MuiMenuItem-root .Mui-disabled {\n opacity: 1 !important;\n }\n\n &.MuiAutocomplete-option[aria-selected=\"true\"] {\n &:hover {\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[100], " !important;\n }\n\n svg.check-icon {\n color: ").concat(selected ? primary : colors === null || colors === void 0 ? void 0 : colors.gray[500], ";\n }\n }\n\n &.MuiAutocomplete-option[aria-disabled=\"true\"] {\n opacity: 1;\n }\n\n &:hover {\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[100], ";\n svg.check-icon {\n color: ").concat(selected ? primary : colors === null || colors === void 0 ? void 0 : colors.gray[500], ";\n }\n }\n\n &.Mui-selected.MuiListItem-root.MuiListItem-button {\n background-color: white;\n &:hover {\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[100], ";\n }\n .primary-text {\n font-weight: ").concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n }\n }\n\n &:active {\n svg.check-icon {\n color: ").concat(primary, ";\n }\n\n &:active {\n svg.check-icon {\n color: ").concat(primary, ";\n }\n\n .primary-text {\n font-weight: ").concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n }\n }\n }\n ");
|
|
3396
3445
|
});
|
|
3397
|
-
var ContentWrapper = styles.styled("span")(templateObject_2$
|
|
3446
|
+
var ContentWrapper = styles.styled("span")(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n width: 100%;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n width: 100%;\n"])));
|
|
3398
3447
|
var disabledStyles = function (props) {
|
|
3399
3448
|
var disabled = props.disabled;
|
|
3400
3449
|
if (!disabled)
|
|
@@ -3402,12 +3451,12 @@ var disabledStyles = function (props) {
|
|
|
3402
3451
|
var colors = getColors(props);
|
|
3403
3452
|
return "\n color: ".concat(colors === null || colors === void 0 ? void 0 : colors.gray[300], ";\n cursor: default;\n ");
|
|
3404
3453
|
};
|
|
3405
|
-
var TextWrapper = styles.styled("span")(templateObject_3$
|
|
3454
|
+
var TextWrapper = styles.styled("span")(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$4, function (props) {
|
|
3406
3455
|
var _a;
|
|
3407
3456
|
var palette = getPalette(props);
|
|
3408
3457
|
return "\n color: ".concat((_a = palette === null || palette === void 0 ? void 0 : palette.text) === null || _a === void 0 ? void 0 : _a.primary, ";\n display: flex;\n white-space: pre-wrap;\n ");
|
|
3409
3458
|
}, disabledStyles);
|
|
3410
|
-
var StyledMenuItemIcon = styles.styled("span")(templateObject_4$
|
|
3459
|
+
var StyledMenuItemIcon = styles.styled("span")(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3411
3460
|
var disabled = props.disabled;
|
|
3412
3461
|
var spacings = getSpaces(props);
|
|
3413
3462
|
var iconSizes = getIconSizes(props);
|
|
@@ -3439,7 +3488,7 @@ var StyledMinus = styles.styled(iconsMaterial.Remove, {
|
|
|
3439
3488
|
var selectedColor = disabled ? colors === null || colors === void 0 ? void 0 : colors.gray[300] : colors === null || colors === void 0 ? void 0 : colors.primary[400];
|
|
3440
3489
|
return "\n color: ".concat(selected ? selectedColor : "transparent", ";\n padding: 0;\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, "px;\n\n &.MuiCheckbox-colorPrimary.Mui-checked:hover {\n background-color: transparent;\n }\n ");
|
|
3441
3490
|
});
|
|
3442
|
-
var templateObject_1$
|
|
3491
|
+
var templateObject_1$M, templateObject_2$u, templateObject_3$l, templateObject_4$g, templateObject_5$c, templateObject_6$9, templateObject_7$6, templateObject_8$4, templateObject_9$1;
|
|
3443
3492
|
|
|
3444
3493
|
/**
|
|
3445
3494
|
* @see https://mui.com/material-ui/react-menu/
|
|
@@ -3518,74 +3567,98 @@ var InputSearch = React.forwardRef(function InputSearch(props, ref) {
|
|
|
3518
3567
|
* (masoudmanson): This prevents the browser's default auto completion
|
|
3519
3568
|
* menu from being displayed for the InputSearch.
|
|
3520
3569
|
*/
|
|
3521
|
-
autoComplete: "
|
|
3570
|
+
autoComplete: "one-time-code" }, rest))] }));
|
|
3522
3571
|
});
|
|
3523
3572
|
|
|
3524
|
-
var doNotForwardProps$
|
|
3573
|
+
var doNotForwardProps$l = [
|
|
3525
3574
|
"count",
|
|
3526
3575
|
"keepSearchOnSelect",
|
|
3527
3576
|
"search",
|
|
3528
3577
|
"InputBaseProps",
|
|
3578
|
+
"PopperBaseProps",
|
|
3579
|
+
"onClickAway",
|
|
3529
3580
|
];
|
|
3530
|
-
var
|
|
3531
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
3532
|
-
})(templateObject_1$
|
|
3581
|
+
var StyledAutocompleteBase = styles.styled(material.Autocomplete, {
|
|
3582
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$l.includes(prop); },
|
|
3583
|
+
})(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n + .", "\n > .", "\n .", " {\n ", "\n }\n\n ", "\n"], ["\n + .", "\n > .", "\n .", " {\n ", "\n }\n\n ", "\n"])), material.autocompleteClasses.popper, material.autocompleteClasses.paper, material.autocompleteClasses.groupLabel, fontCapsXxxs, function (props) {
|
|
3533
3584
|
var search = props.search;
|
|
3534
3585
|
var spacings = getSpaces(props);
|
|
3535
3586
|
var colors = getColors(props);
|
|
3536
3587
|
var borders = getBorders(props);
|
|
3537
|
-
return "\n ".concat(!search && "height: 0", ";\n\n .MuiOutlinedInput-root.MuiInputBase-formControl.MuiInputBase-adornedEnd {\n padding: 0 ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px 0 0;\n\n .MuiAutocomplete-input {\n padding: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xs, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px;\n }\n }\n\n & + .
|
|
3588
|
+
return "\n ".concat(!search && "height: 0", ";\n\n .MuiOutlinedInput-root.MuiInputBase-formControl.MuiInputBase-adornedEnd {\n padding: 0 ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px 0 0;\n\n .MuiAutocomplete-input {\n padding: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xs, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px;\n }\n }\n\n & + .").concat(material.autocompleteClasses.popper, " > .").concat(material.autocompleteClasses.paper, " {\n .").concat(material.autocompleteClasses.listbox, " {\n max-height: 40vh;\n padding: 0 ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px 0 0;\n\n .").concat(material.autocompleteClasses.option, " {\n min-height: unset;\n\n &.").concat(material.autocompleteClasses.focused, " {\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[100], ";\n }\n\n &[aria-selected=\"true\"] {\n background-color: white;\n }\n\n &[aria-disabled=\"true\"] {\n opacity: 1;\n }\n\n &[aria-selected=\"true\"].").concat(material.autocompleteClasses.focused, " {\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[100], ";\n }\n }\n\n & > li:last-child .").concat(material.autocompleteClasses.groupUl, " {\n border-bottom: none;\n margin-bottom: 0;\n padding-bottom: 0;\n }\n }\n\n .").concat(material.autocompleteClasses.groupLabel, " {\n top: 0;\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[500], ";\n padding: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xxs, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.s, "px;\n }\n\n .").concat(material.autocompleteClasses.groupUl, " {\n position: relative;\n margin: 0 0 ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px;\n border-bottom: ").concat(borders === null || borders === void 0 ? void 0 : borders.gray[200], ";\n padding-bottom: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xxs, "px;\n\n & li:last-of-type {\n position: relative;\n }\n }\n\n .").concat(material.autocompleteClasses.noOptions, " {\n padding: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xs, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.s, "px;\n margin-right: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px;\n }\n\n .").concat(material.autocompleteClasses.loading, " {\n padding: 0 ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px 0 0;\n }\n }\n ");
|
|
3538
3589
|
});
|
|
3539
3590
|
var InputBaseWrapper$1 = styles.styled("div", {
|
|
3540
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
3541
|
-
})(templateObject_2$
|
|
3591
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$l.includes(prop); },
|
|
3592
|
+
})(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3542
3593
|
var search = props.search;
|
|
3543
3594
|
if (!search) {
|
|
3544
3595
|
// (thuang): We cannot use `display: none;` here, since
|
|
3545
3596
|
// the component needs to be in the DOM to handle backdrop
|
|
3546
3597
|
// click to close the menu
|
|
3547
|
-
return "\n border: 0;\n padding: 0;\n
|
|
3598
|
+
return "\n border: 0;\n padding: 0;\n white-space: nowrap;\n clip-path: inset(100%);\n clip: rect(0 0 0 0);\n overflow: hidden;\n margin: 0;\n ";
|
|
3548
3599
|
}
|
|
3549
3600
|
});
|
|
3550
3601
|
var StyledMenuInputSearch$1 = styles.styled(InputSearch, {
|
|
3551
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
3552
|
-
})(templateObject_3$
|
|
3602
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$l.includes(prop); },
|
|
3603
|
+
})(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n margin: 0;\n .MuiInputBase-root {\n width: 100%;\n }\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n"], ["\n margin: 0;\n .MuiInputBase-root {\n width: 100%;\n }\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n"])), function (_a) {
|
|
3553
3604
|
var search = _a.search;
|
|
3554
3605
|
return (search ? "auto" : "transparent");
|
|
3555
3606
|
});
|
|
3556
|
-
var StyledPaper$
|
|
3607
|
+
var StyledPaper$3 = styles.styled(material.Paper)(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3557
3608
|
var spacings = getSpaces(props);
|
|
3558
3609
|
var borders = getBorders(props);
|
|
3559
3610
|
var corners = getCorners(props);
|
|
3560
3611
|
var shadows = getShadows(props);
|
|
3561
|
-
return "\n padding: ".concat(spacings === null || spacings === void 0 ? void 0 : spacings.
|
|
3612
|
+
return "\n padding: ".concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xxs, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ;\n background-color: white;\n border: ").concat(borders === null || borders === void 0 ? void 0 : borders.gray[100], ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.m, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n box-sizing: border-box;\n ");
|
|
3562
3613
|
});
|
|
3563
3614
|
var StyledMenuItemDetails = styles.styled("div")(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
3564
3615
|
var colors = getColors(props);
|
|
3565
3616
|
return "\n color: ".concat(colors === null || colors === void 0 ? void 0 : colors.gray[500], ";\n white-space: pre-wrap;\n ");
|
|
3566
3617
|
});
|
|
3567
3618
|
var StyledMenuItemText = styles.styled("div")(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
3568
|
-
var templateObject_1$
|
|
3619
|
+
var templateObject_1$L, templateObject_2$t, templateObject_3$k, templateObject_4$f, templateObject_5$b, templateObject_6$8;
|
|
3569
3620
|
|
|
3570
|
-
var
|
|
3571
|
-
var
|
|
3572
|
-
var
|
|
3621
|
+
var AutocompleteBase = function (props) {
|
|
3622
|
+
var multiple = props.multiple, _a = props.disableCloseOnSelect, disableCloseOnSelect = _a === void 0 ? multiple : _a, _b = props.getOptionLabel, getOptionLabel = _b === void 0 ? defaultGetOptionLabel : _b, _c = props.InputBaseProps, InputBaseProps = _c === void 0 ? EMPTY_OBJECT : _c, _d = props.isOptionEqualToValue, isOptionEqualToValue = _d === void 0 ? defaultIsOptionEqualToValue : _d, _e = props.keepSearchOnSelect, keepSearchOnSelect = _e === void 0 ? false : _e, _f = props.label, label = _f === void 0 ? "Label" : _f, _g = props.loading, loading = _g === void 0 ? false : _g, _h = props.loadingText, loadingText = _h === void 0 ? "" : _h, _j = props.noOptionsText, noOptionsText = _j === void 0 ? "No options" : _j, _k = props.onInputChange, onInputChange = _k === void 0 ? noop : _k, _l = props.renderOption, renderOption = _l === void 0 ? defaultRenderOption : _l, _m = props.renderTags, renderTags = _m === void 0 ? defaultRenderTags : _m, _o = props.search, search = _o === void 0 ? false : _o, _p = props.clearOnBlur, clearOnBlur = _p === void 0 ? false : _p, _q = props.blurOnSelect, blurOnSelect = _q === void 0 ? !multiple : _q;
|
|
3623
|
+
var theme = styles.useTheme();
|
|
3624
|
+
var _r = React.useState(""), inputValue = _r[0], setInputValue = _r[1];
|
|
3625
|
+
return (jsxRuntime.jsx(StyledAutocompleteBase, __assign({ clearOnBlur: clearOnBlur, disableCloseOnSelect: disableCloseOnSelect, disablePortal: true, renderTags: renderTags, loading: loading, loadingText: loadingText, noOptionsText: noOptionsText, PaperComponent: StyledPaper$3, PopperComponent: useDefaultPopperComponent(), renderOption: renderOption, getOptionLabel: getOptionLabel, isOptionEqualToValue: isOptionEqualToValue, inputValue: inputValue, renderInput: defaultRenderInput, multiple: multiple }, props, {
|
|
3626
|
+
// (masoudmanson): For multiple options (multiple = true), setting blurOnSelect to false
|
|
3627
|
+
// keeps the dropdown open after selecting an option. This feature enhances user experience
|
|
3628
|
+
// by preventing the dropdown from closing, enabling users to select multiple options
|
|
3629
|
+
// without having to reopen the menu repeatedly.
|
|
3630
|
+
blurOnSelect: multiple ? false : blurOnSelect,
|
|
3631
|
+
// (masoudmanson): Given the necessity of maintaining consistent onBlur functionality,
|
|
3632
|
+
// and clearing the input value on blur, it's crucial to include the onBlur handler
|
|
3633
|
+
// after spreading other props. Furthermore, within the defaultOnBlur function, the
|
|
3634
|
+
// actual onBlur function is invoked for completeness.
|
|
3635
|
+
onBlur: defaultOnBlur,
|
|
3636
|
+
// (masoudmanson): To ensure component-level actions (changing the input field value)
|
|
3637
|
+
// trigger upon input changes, it's crucial to position the onInputChange handler after
|
|
3638
|
+
// spreading the other props. Furthermore, within the defaultOnInputChange function,
|
|
3639
|
+
// the provided onInputChange from props is called at the end to emit the input changes
|
|
3640
|
+
// to the user.
|
|
3641
|
+
onInputChange: defaultOnInputChange })));
|
|
3573
3642
|
/**
|
|
3574
3643
|
* (masoudmanson): Using a custom Popper or Paper with the Autocomplete
|
|
3575
|
-
* without a
|
|
3644
|
+
* without a useCallback results in scroll jumps while selecting an option!
|
|
3576
3645
|
*/
|
|
3577
|
-
|
|
3578
|
-
return
|
|
3579
|
-
|
|
3580
|
-
|
|
3581
|
-
|
|
3582
|
-
|
|
3583
|
-
|
|
3646
|
+
function useDefaultPopperComponent() {
|
|
3647
|
+
return React.useCallback(function (popperProps) {
|
|
3648
|
+
var _a;
|
|
3649
|
+
return (jsxRuntime.jsx(material.Popper, __assign({ modifiers: [
|
|
3650
|
+
{
|
|
3651
|
+
enabled: true,
|
|
3652
|
+
name: "offset",
|
|
3653
|
+
options: {
|
|
3654
|
+
offset: [0, (_a = theme.app) === null || _a === void 0 ? void 0 : _a.spacing.s],
|
|
3655
|
+
},
|
|
3584
3656
|
},
|
|
3585
|
-
},
|
|
3586
|
-
|
|
3587
|
-
}
|
|
3588
|
-
|
|
3657
|
+
] }, popperProps)));
|
|
3658
|
+
}, []);
|
|
3659
|
+
}
|
|
3660
|
+
function defaultRenderInput(params) {
|
|
3661
|
+
return (jsxRuntime.jsx(InputBaseWrapper$1, { search: search, children: jsxRuntime.jsx(StyledMenuInputSearch$1, __assign({ id: "location-search", label: label, placeholder: label, ref: params.InputProps.ref, search: search,
|
|
3589
3662
|
// (masoudmanson): This prevents Backspace from deselecting selected dropdown options.
|
|
3590
3663
|
onKeyDown: function (event) {
|
|
3591
3664
|
if (event.key === "Backspace") {
|
|
@@ -3600,31 +3673,35 @@ var Autocomplete = function (props) {
|
|
|
3600
3673
|
sdsType: "iconButton",
|
|
3601
3674
|
}, sdsIcon: "xMark" })), jsxRuntime.jsx(ButtonIcon, { "aria-label": "search-button", sdsType: "secondary", sdsSize: "small", sdsIconProps: {
|
|
3602
3675
|
sdsType: "interactive",
|
|
3603
|
-
}, sdsIcon: "search" })] })), inputProps: params.inputProps }) }, InputBaseProps)) }));
|
|
3604
|
-
|
|
3676
|
+
}, sdsIcon: "search" })] })), inputProps: params.inputProps }) }, InputBaseProps)) }));
|
|
3677
|
+
}
|
|
3678
|
+
function defaultOnBlur(event) {
|
|
3679
|
+
var _a;
|
|
3680
|
+
if (clearOnBlur)
|
|
3605
3681
|
setInputValue("");
|
|
3606
|
-
|
|
3607
|
-
|
|
3608
|
-
|
|
3609
|
-
|
|
3610
|
-
|
|
3611
|
-
|
|
3612
|
-
else {
|
|
3613
|
-
setInputValue("");
|
|
3614
|
-
}
|
|
3682
|
+
(_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, event);
|
|
3683
|
+
}
|
|
3684
|
+
function defaultOnInputChange(event, value, reason) {
|
|
3685
|
+
if (!multiple) {
|
|
3686
|
+
if (reason === "input") {
|
|
3687
|
+
setInputValue(value);
|
|
3615
3688
|
}
|
|
3616
3689
|
else {
|
|
3617
|
-
|
|
3618
|
-
setInputValue("");
|
|
3619
|
-
}
|
|
3620
|
-
else if (reason === "input" ||
|
|
3621
|
-
(reason === "reset" && !keepSearchOnSelect)) {
|
|
3622
|
-
setInputValue(value);
|
|
3623
|
-
}
|
|
3690
|
+
setInputValue("");
|
|
3624
3691
|
}
|
|
3625
|
-
|
|
3626
|
-
|
|
3627
|
-
|
|
3692
|
+
}
|
|
3693
|
+
else {
|
|
3694
|
+
if (reason === "clear") {
|
|
3695
|
+
setInputValue("");
|
|
3696
|
+
}
|
|
3697
|
+
else if (reason === "input" ||
|
|
3698
|
+
(reason === "reset" && !keepSearchOnSelect)) {
|
|
3699
|
+
setInputValue(value);
|
|
3700
|
+
}
|
|
3701
|
+
}
|
|
3702
|
+
if (onInputChange)
|
|
3703
|
+
onInputChange(event, value, reason);
|
|
3704
|
+
}
|
|
3628
3705
|
function clearInput() {
|
|
3629
3706
|
setInputValue("");
|
|
3630
3707
|
/**
|
|
@@ -3660,6 +3737,206 @@ var Autocomplete = function (props) {
|
|
|
3660
3737
|
}
|
|
3661
3738
|
};
|
|
3662
3739
|
|
|
3740
|
+
var StyledColumn = styles.styled("div")(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3741
|
+
var _a = props.width, width = _a === void 0 ? 280 : _a;
|
|
3742
|
+
var colors = getColors(props);
|
|
3743
|
+
var spacings = getSpaces(props);
|
|
3744
|
+
return "\n position: relative;\n width: ".concat(width, "px;\n\n &:not(:last-child) {\n border-right: solid 1px ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[200], ";\n margin-right: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px;\n }\n\n // (masoudmanson): This code hides the relation icon of the last column\n &:last-of-type {\n .SdsAutocompleteMultiColumn-column-relation-icon {\n display: none;\n }\n }\n ");
|
|
3745
|
+
});
|
|
3746
|
+
var StyledColumnTitle = styles.styled("p")(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontCapsXxxs, function (props) {
|
|
3747
|
+
var spacings = getSpaces(props);
|
|
3748
|
+
var colors = getColors(props);
|
|
3749
|
+
var typography = getTypography(props);
|
|
3750
|
+
return "\n font-family: ".concat(typography === null || typography === void 0 ? void 0 : typography.fontFamily, ";\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[500], ";\n padding: 0 ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.s, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xxs, "px;\n margin: 0;\n ");
|
|
3751
|
+
});
|
|
3752
|
+
var StyledColumnIcon = styles.styled("span")(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3753
|
+
var spacings = getSpaces(props);
|
|
3754
|
+
var colors = getColors(props);
|
|
3755
|
+
var iconSizes = getIconSizes(props);
|
|
3756
|
+
return "\n background-color: white;\n position: absolute;\n right: -".concat(spacings === null || spacings === void 0 ? void 0 : spacings.xs, "px;\n top: -2px;\n padding-bottom: 2px;\n\n svg {\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[500], ";\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width, "px;\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.height, "px;\n }\n ");
|
|
3757
|
+
});
|
|
3758
|
+
var templateObject_1$K, templateObject_2$s, templateObject_3$j;
|
|
3759
|
+
|
|
3760
|
+
var AutocompleteGroup = function (props) {
|
|
3761
|
+
var autocompleteProps = props.autocompleteProps, onValueChange = props.onValueChange, propValue = props.value, multiple = props.multiple, label = props.label, InputBaseProps = props.InputBaseProps, popperOpen = props.popperOpen, inputValue = props.inputValue, PaperComponent = props.PaperComponent, rest = __rest(props, ["autocompleteProps", "onValueChange", "value", "multiple", "label", "InputBaseProps", "popperOpen", "inputValue", "PaperComponent"]);
|
|
3762
|
+
var name = autocompleteProps.name, width = autocompleteProps.width, icon = autocompleteProps.icon, propProps = autocompleteProps.props;
|
|
3763
|
+
var _a = React.useState(getInitialValue(multiple, propValue)), value = _a[0], setValue = _a[1];
|
|
3764
|
+
var _b = React.useState(getInitialValue(multiple, propValue)), pendingValue = _b[0], setPendingValue = _b[1];
|
|
3765
|
+
React.useEffect(function () {
|
|
3766
|
+
if (propValue !== undefined) {
|
|
3767
|
+
setValue(propValue);
|
|
3768
|
+
}
|
|
3769
|
+
}, [propValue]);
|
|
3770
|
+
var handleChange = React.useCallback(function (event, newValue, reason, details) {
|
|
3771
|
+
var _a;
|
|
3772
|
+
(_a = propProps === null || propProps === void 0 ? void 0 : propProps.onChange) === null || _a === void 0 ? void 0 : _a.call(propProps, event, newValue, reason, details);
|
|
3773
|
+
onValueChange(name, event, newValue, reason, details);
|
|
3774
|
+
if (multiple) {
|
|
3775
|
+
setPendingValue(newValue);
|
|
3776
|
+
}
|
|
3777
|
+
else {
|
|
3778
|
+
if (newValue &&
|
|
3779
|
+
!Array.isArray(newValue) &&
|
|
3780
|
+
Object.prototype.hasOwnProperty.call(newValue, "name")) {
|
|
3781
|
+
setValue(newValue);
|
|
3782
|
+
}
|
|
3783
|
+
}
|
|
3784
|
+
}, [name, multiple, onValueChange, propProps]);
|
|
3785
|
+
return (jsxRuntime.jsxs(StyledColumn, { width: width, className: "SdsAutocompleteMultiColumn-column-root", children: [icon && (jsxRuntime.jsx(StyledColumnIcon, { className: "SdsAutocompleteMultiColumn-column-relation-icon", children: icon })), jsxRuntime.jsx(StyledColumnTitle, { className: "SdsAutocompleteMultiColumn-column-title", children: name }), jsxRuntime.jsx(AutocompleteBase, __assign({ label: label, InputBaseProps: InputBaseProps, open: popperOpen, multiple: multiple, inputValue: inputValue, options: autocompleteProps.options, onChange: handleChange, value: multiple ? pendingValue : value, search: false, PaperComponent: PaperComponent }, rest, autocompleteProps.props, {
|
|
3786
|
+
// (masoudmanson): groupBy option is disabled on MultiColumn dropdowns
|
|
3787
|
+
groupBy: undefined }))] }));
|
|
3788
|
+
function getInitialValue(isMultiple, customValue) {
|
|
3789
|
+
if (customValue !== undefined) {
|
|
3790
|
+
return customValue;
|
|
3791
|
+
}
|
|
3792
|
+
return isMultiple
|
|
3793
|
+
? []
|
|
3794
|
+
: null;
|
|
3795
|
+
}
|
|
3796
|
+
};
|
|
3797
|
+
|
|
3798
|
+
var doNotForwardProps$k = [
|
|
3799
|
+
"anchorEl",
|
|
3800
|
+
"count",
|
|
3801
|
+
"keepSearchOnSelect",
|
|
3802
|
+
"search",
|
|
3803
|
+
"InputBaseProps",
|
|
3804
|
+
"title",
|
|
3805
|
+
"PopperBaseProps",
|
|
3806
|
+
"onClickAway",
|
|
3807
|
+
"ClickAwayListenerProps",
|
|
3808
|
+
];
|
|
3809
|
+
var StyledPopper$2 = styles.styled(material.Popper, {
|
|
3810
|
+
shouldForwardProp: function (prop) {
|
|
3811
|
+
return !doNotForwardProps$k.includes(prop) || prop === "anchorEl";
|
|
3812
|
+
},
|
|
3813
|
+
})(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3814
|
+
var borders = getBorders(props);
|
|
3815
|
+
var corners = getCorners(props);
|
|
3816
|
+
var shadows = getShadows(props);
|
|
3817
|
+
var spacings = getSpaces(props);
|
|
3818
|
+
return "\n background-color: white;\n border: ".concat(borders === null || borders === void 0 ? void 0 : borders.gray[100], ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.m, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n padding: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xxs, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px;\n box-sizing: border-box;\n z-index: 1400;\n\n .").concat(material.autocompleteClasses.popper, ".").concat(material.autocompleteClasses.popperDisablePortal, " {\n position: relative !important;\n transform: none !important;\n \n .MuiPaper-root .").concat(material.autocompleteClasses.listbox, " {\n padding: 0 ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px 0 0;\n }\n }\n ");
|
|
3819
|
+
});
|
|
3820
|
+
var StyledPaper$2 = styles.styled(material.Paper, {
|
|
3821
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
3822
|
+
})(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n box-shadow: none;\n margin: 0;\n border-radius: 0;\n padding-top: 0;\n padding-bottom: 0;\n"], ["\n box-shadow: none;\n margin: 0;\n border-radius: 0;\n padding-top: 0;\n padding-bottom: 0;\n"])));
|
|
3823
|
+
var StyledAutocompleteGroupWrapper = styles.styled("div")(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
3824
|
+
var StyledAutocompleteInput = styles.styled(InputSearch, {
|
|
3825
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
3826
|
+
})(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n ", "\n\n margin: 0;\n .MuiInputBase-root {\n width: 100%;\n }\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n"], ["\n ", "\n\n margin: 0;\n .MuiInputBase-root {\n width: 100%;\n }\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n"])), function (_a) {
|
|
3827
|
+
var search = _a.search;
|
|
3828
|
+
return !search && "height: 0; display: none;";
|
|
3829
|
+
}, function (_a) {
|
|
3830
|
+
var search = _a.search;
|
|
3831
|
+
return (search ? "auto" : "transparent");
|
|
3832
|
+
});
|
|
3833
|
+
var templateObject_1$J, templateObject_2$r, templateObject_3$i, templateObject_4$e;
|
|
3834
|
+
|
|
3835
|
+
var AutocompleteMultiColumn = function (props) {
|
|
3836
|
+
var _a;
|
|
3837
|
+
var InputBaseProps = props.InputBaseProps, _b = props.open, open = _b === void 0 ? false : _b, _c = props.PopperPlacement, PopperPlacement = _c === void 0 ? "bottom-start" : _c, PopperBaseProps = props.PopperBaseProps, _d = props.search, search = _d === void 0 ? false : _d, _e = props.label, label = _e === void 0 ? "Search" : _e, _f = props.onClickAway, onClickAway = _f === void 0 ? defaultOnClickAway : _f, ClickAwayListenerProps = props.ClickAwayListenerProps, options = props.options, onInputChange = props.onInputChange, onBlur = props.onBlur, multiple = props.multiple, parentInitialValue = props.value, onChange = props.onChange, _g = props.PopperComponent, PopperComponent = _g === void 0 ? StyledPopper$2 : _g, rest = __rest(props, ["InputBaseProps", "open", "PopperPlacement", "PopperBaseProps", "search", "label", "onClickAway", "ClickAwayListenerProps", "options", "onInputChange", "onBlur", "multiple", "value", "onChange", "PopperComponent"]);
|
|
3838
|
+
var theme = styles.useTheme();
|
|
3839
|
+
var _h = React.useState(""), inputValue = _h[0], setInputValue = _h[1];
|
|
3840
|
+
var _j = React.useState(open), popperOpen = _j[0], setPopperOpen = _j[1];
|
|
3841
|
+
var anchorRef = React.useRef(null);
|
|
3842
|
+
var _k = React.useState(null), anchorEl = _k[0], setAnchorEl = _k[1];
|
|
3843
|
+
React.useEffect(function () {
|
|
3844
|
+
setAnchorEl(anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current);
|
|
3845
|
+
}, [anchorRef]);
|
|
3846
|
+
var _l = React.useState({}), autocompleteMultiColumnValue = _l[0], setAutocompleteMultiColumnValue = _l[1];
|
|
3847
|
+
React.useEffect(function () {
|
|
3848
|
+
if (parentInitialValue !== undefined) {
|
|
3849
|
+
setAutocompleteMultiColumnValue(parentInitialValue);
|
|
3850
|
+
}
|
|
3851
|
+
}, [options, parentInitialValue]);
|
|
3852
|
+
var defaultOnValueChange = function (column, event, val, reason, details) {
|
|
3853
|
+
var _a;
|
|
3854
|
+
setAutocompleteMultiColumnValue(function (prev) {
|
|
3855
|
+
var _a;
|
|
3856
|
+
return __assign(__assign({}, prev), (_a = {}, _a[column] = val, _a));
|
|
3857
|
+
});
|
|
3858
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(event, __assign(__assign({}, autocompleteMultiColumnValue), (_a = {}, _a[column] = val, _a)), reason, details);
|
|
3859
|
+
};
|
|
3860
|
+
return (jsxRuntime.jsx(material.ClickAwayListener, __assign({ onClickAway: onClickAway }, ClickAwayListenerProps, { children: jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(StyledAutocompleteInput, __assign({ id: "location-search", label: label, placeholder: label, value: inputValue, onChange: handleInputChange, onClick: handleInputClick, onBlur: handleInputBlur, ref: anchorRef, search: search, onKeyDown: handleInputKeyDown, InputProps: __assign(__assign({}, InputBaseProps === null || InputBaseProps === void 0 ? void 0 : InputBaseProps.ref), { endAdornment: (jsxRuntime.jsxs(StyledInputAdornment, { position: "end", children: [inputValue && (jsxRuntime.jsx(ButtonIcon, { "aria-label": "clear-button", className: "input-search-clear-icon", sdsType: "primary", sdsSize: "small", sdsIconProps: {
|
|
3861
|
+
sdsType: "iconButton",
|
|
3862
|
+
}, sdsIcon: "xMark", onClick: clearInput })), jsxRuntime.jsx(ButtonIcon, { "aria-label": "search-button", sdsType: "secondary", sdsSize: "small", sdsIconProps: {
|
|
3863
|
+
sdsType: "interactive",
|
|
3864
|
+
}, sdsIcon: "search" })] })),
|
|
3865
|
+
/**
|
|
3866
|
+
* (thuang): Works with css caret-color: "transparent" to hide
|
|
3867
|
+
* mobile keyboard
|
|
3868
|
+
*/
|
|
3869
|
+
inputMode: "text" }) }, InputBaseProps)), anchorEl && (jsxRuntime.jsx(PopperComponent, __assign({ modifiers: [
|
|
3870
|
+
{
|
|
3871
|
+
name: "offset",
|
|
3872
|
+
options: {
|
|
3873
|
+
offset: [0, (_a = theme.app) === null || _a === void 0 ? void 0 : _a.spacing.s],
|
|
3874
|
+
},
|
|
3875
|
+
},
|
|
3876
|
+
], open: popperOpen, anchorEl: anchorEl, placement: PopperPlacement, disablePortal: true }, PopperBaseProps, { children: jsxRuntime.jsx(StyledAutocompleteGroupWrapper, { className: "SdsAutocompleteMultiColumn-wrapper", children: options.map(function (autocompleteOptions) { return (jsxRuntime.jsx(AutocompleteGroup, __assign({ autocompleteProps: autocompleteOptions, onValueChange: defaultOnValueChange, value: autocompleteMultiColumnValue
|
|
3877
|
+
? autocompleteMultiColumnValue[autocompleteOptions.name]
|
|
3878
|
+
: undefined, multiple: multiple, label: label, InputBaseProps: InputBaseProps, popperOpen: popperOpen, inputValue: inputValue, PaperComponent: StyledPaper$2 }, rest), autocompleteOptions.name)); }) }) })))] }) })));
|
|
3879
|
+
function clearInput() {
|
|
3880
|
+
setInputValue("");
|
|
3881
|
+
/**
|
|
3882
|
+
* (masoudmanson): Because we are manually firing this event,
|
|
3883
|
+
* we must build a onChange event to transmit the updated value to onChange listeners.
|
|
3884
|
+
*/
|
|
3885
|
+
onInputChange === null || onInputChange === void 0 ? void 0 : onInputChange({ target: { value: "" } }, "", "clear");
|
|
3886
|
+
}
|
|
3887
|
+
function handleInputClick(_) {
|
|
3888
|
+
if (popperOpen) {
|
|
3889
|
+
setPopperOpen(false);
|
|
3890
|
+
}
|
|
3891
|
+
else {
|
|
3892
|
+
setPopperOpen(true);
|
|
3893
|
+
}
|
|
3894
|
+
}
|
|
3895
|
+
function handleInputChange(event) {
|
|
3896
|
+
setInputValue(event.target.value);
|
|
3897
|
+
if (onInputChange) {
|
|
3898
|
+
if (event.target.value === "") {
|
|
3899
|
+
onInputChange(event, "", "clear");
|
|
3900
|
+
}
|
|
3901
|
+
else {
|
|
3902
|
+
onInputChange(event, event.target.value, "input");
|
|
3903
|
+
}
|
|
3904
|
+
}
|
|
3905
|
+
}
|
|
3906
|
+
function handleInputBlur(event) {
|
|
3907
|
+
if (props.clearOnBlur)
|
|
3908
|
+
setInputValue("");
|
|
3909
|
+
onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
|
|
3910
|
+
}
|
|
3911
|
+
function defaultOnClickAway() {
|
|
3912
|
+
setPopperOpen(false);
|
|
3913
|
+
}
|
|
3914
|
+
function handleInputKeyDown(event) {
|
|
3915
|
+
// (masoudmanson): This prevents Backspace from deselecting selected dropdown options.
|
|
3916
|
+
if (event.key === "Backspace") {
|
|
3917
|
+
event.stopPropagation();
|
|
3918
|
+
}
|
|
3919
|
+
}
|
|
3920
|
+
};
|
|
3921
|
+
|
|
3922
|
+
var Autocomplete = function (props) {
|
|
3923
|
+
var options = props.options, value = props.value, onChange = props.onChange, rest = __rest(props, ["options", "value", "onChange"]);
|
|
3924
|
+
// Multi-column options
|
|
3925
|
+
if (options && !!options[0] && "options" in options[0]) {
|
|
3926
|
+
if (options.length > 1) {
|
|
3927
|
+
return (jsxRuntime.jsx(AutocompleteMultiColumn, __assign({ options: options, value: value, onChange: onChange }, rest, {
|
|
3928
|
+
// (masoudmanson): groupBy option is disabled on MultiColumn dropdowns
|
|
3929
|
+
groupBy: undefined, open: true })));
|
|
3930
|
+
}
|
|
3931
|
+
else {
|
|
3932
|
+
return (jsxRuntime.jsx(AutocompleteBase, __assign({ options: options[0].options, value: value, onChange: onChange }, rest)));
|
|
3933
|
+
}
|
|
3934
|
+
}
|
|
3935
|
+
else {
|
|
3936
|
+
return (jsxRuntime.jsx(AutocompleteBase, __assign({ options: options, onChange: onChange, value: value }, rest)));
|
|
3937
|
+
}
|
|
3938
|
+
};
|
|
3939
|
+
|
|
3663
3940
|
var Centered = styles.styled("div")(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n flex: 1 1 auto;\n display: flex;\n justify-content: center;\n align-items: center;\n"], ["\n flex: 1 1 auto;\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
|
|
3664
3941
|
var IconWrapper$1 = styles.styled("div")(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
3665
3942
|
var iconSizes = getIconSizes(props);
|
|
@@ -3693,9 +3970,9 @@ var secondary$1 = function (props) {
|
|
|
3693
3970
|
var colors = getColors(props);
|
|
3694
3971
|
return "\n background-color: ".concat(colors === null || colors === void 0 ? void 0 : colors.info[100], ";\n color: black;\n ");
|
|
3695
3972
|
};
|
|
3696
|
-
var doNotForwardProps$
|
|
3973
|
+
var doNotForwardProps$j = ["sdsType", "textChild"];
|
|
3697
3974
|
var StyledBanner = styles.styled("div", {
|
|
3698
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
3975
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$j.includes(prop); },
|
|
3699
3976
|
})(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n display: flex;\n align-items: center;\n height: 40px;\n width: 100%;\n\n ", "\n\n ", "\n"], ["\n display: flex;\n align-items: center;\n height: 40px;\n width: 100%;\n\n ", "\n\n ", "\n"])), fontBodyS$2, function (props) {
|
|
3700
3977
|
var sdsType = props.sdsType;
|
|
3701
3978
|
var typography = getTypography(props);
|
|
@@ -3722,7 +3999,7 @@ var Banner = React.forwardRef(function Banner(props, ref) {
|
|
|
3722
3999
|
var sdsPropNames$3 = ["isAllCaps", "isRounded", "sdsStyle", "sdsType"];
|
|
3723
4000
|
var ButtonBase = styles.styled(material.Button, {
|
|
3724
4001
|
shouldForwardProp: function (prop) { return !sdsPropNames$3.includes(prop); },
|
|
3725
|
-
})(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n box-shadow: none;\n ", "\n"], ["\n box-shadow: none;\n ", "\n"])), function (props) {
|
|
4002
|
+
})(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n box-shadow: none;\n ", "\n ", "\n"], ["\n box-shadow: none;\n ", "\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
3726
4003
|
var variant = props.variant;
|
|
3727
4004
|
var colors = getColors(props);
|
|
3728
4005
|
var spacings = getSpaces(props);
|
|
@@ -3731,7 +4008,7 @@ var ButtonBase = styles.styled(material.Button, {
|
|
|
3731
4008
|
var outlinedPadding = "".concat(((spacings === null || spacings === void 0 ? void 0 : spacings.xs) || 0) - 1, "px ").concat(((spacings === null || spacings === void 0 ? void 0 : spacings.l) || 0) - 1, "px");
|
|
3732
4009
|
var padding = variant === "outlined" ? outlinedPadding : containedPadding;
|
|
3733
4010
|
var outlineBorder = variant === "outlined" ? "border-color: ".concat(colors === null || colors === void 0 ? void 0 : colors.primary[400], ";") : "";
|
|
3734
|
-
return "\n ".concat(outlineBorder, "\n padding: ").concat(padding, ";\n min-width: 120px;\n height: 34px;\n &:hover {\n color: white;\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.primary[500], ";\n box-shadow: none;\n }\n &:
|
|
4011
|
+
return "\n ".concat(outlineBorder, "\n padding: ").concat(padding, ";\n min-width: 120px;\n height: 34px;\n &:hover {\n color: white;\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.primary[500], ";\n box-shadow: none;\n }\n &:active {\n color: white;\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.primary[600], ";\n box-shadow: none;\n }\n &:disabled {\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[400], ";\n background-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[300], ";\n border-color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[300], ";\n }\n .MuiButton-startIcon {\n margin-right: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px;\n }\n .MuiButton-endIcon {\n margin-left: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px;\n }\n ");
|
|
3735
4012
|
});
|
|
3736
4013
|
var RoundedButton = styles.styled(ButtonBase, {
|
|
3737
4014
|
shouldForwardProp: function (prop) { return !sdsPropNames$3.includes(prop); },
|
|
@@ -3742,7 +4019,7 @@ var RoundedButton = styles.styled(ButtonBase, {
|
|
|
3742
4019
|
var SquareButton = ButtonBase;
|
|
3743
4020
|
var MinimalButton = styles.styled(material.Button, {
|
|
3744
4021
|
shouldForwardProp: function (prop) { return !sdsPropNames$3.includes(prop); },
|
|
3745
|
-
})(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n ", "\n\n ", "\n &:hover, &:focus-visible {\n background-color: transparent;\n }\n
|
|
4022
|
+
})(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n &:hover, &:focus-visible {\n background-color: transparent;\n }\n"], ["\n ", "\n\n ", "\n\n ", "\n &:hover, &:focus-visible {\n background-color: transparent;\n }\n"])), focusVisibleA11yStyle, function (props) {
|
|
3746
4023
|
var spacings = getSpaces(props);
|
|
3747
4024
|
return "\n padding: ".concat(spacings === null || spacings === void 0 ? void 0 : spacings.xxs, "px 0;\n ");
|
|
3748
4025
|
}, function (props) {
|
|
@@ -3760,7 +4037,7 @@ var PrimaryMinimalButton = styles.styled(MinimalButton)(templateObject_4$c || (t
|
|
|
3760
4037
|
var SecondaryMinimalButton = styles.styled(MinimalButton)(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n ", "\n color: #000;\n"], ["\n ", "\n color: #000;\n"])), minimal$2);
|
|
3761
4038
|
var StyledButton$1 = styles.styled(material.Button, {
|
|
3762
4039
|
shouldForwardProp: function (prop) { return !sdsPropNames$3.includes(prop); },
|
|
3763
|
-
})(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n
|
|
4040
|
+
})(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
3764
4041
|
if (!props.isRounded)
|
|
3765
4042
|
return "";
|
|
3766
4043
|
var corners = getCorners(props);
|
|
@@ -3814,9 +4091,9 @@ var ButtonDropdown = React.forwardRef(function (props, ref) {
|
|
|
3814
4091
|
});
|
|
3815
4092
|
|
|
3816
4093
|
var fontBodyXs$3 = fontBody("xs");
|
|
3817
|
-
var doNotForwardProps$
|
|
4094
|
+
var doNotForwardProps$i = ["calloutTitle", "collapsed"];
|
|
3818
4095
|
var StyledCallout = styles.styled(material.Alert, {
|
|
3819
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4096
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
3820
4097
|
})(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXs$3, function (props) {
|
|
3821
4098
|
var colors = getColors(props);
|
|
3822
4099
|
var spacings = getSpaces(props);
|
|
@@ -3994,7 +4271,7 @@ function mergeClass$1(_a) {
|
|
|
3994
4271
|
return propClassName ? "".concat(propClassName, " ").concat(className) : className;
|
|
3995
4272
|
}
|
|
3996
4273
|
|
|
3997
|
-
var doNotForwardProps$
|
|
4274
|
+
var doNotForwardProps$h = [
|
|
3998
4275
|
"icon",
|
|
3999
4276
|
"iconVerticalAlign",
|
|
4000
4277
|
"horizontalAlign",
|
|
@@ -4020,7 +4297,7 @@ var verticalAlignToFlexMap = {
|
|
|
4020
4297
|
top: "flex-start",
|
|
4021
4298
|
};
|
|
4022
4299
|
var StyledTableData = styles.styled("td", {
|
|
4023
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4300
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$h.includes(prop); },
|
|
4024
4301
|
})(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4025
4302
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
4026
4303
|
var spacings = getSpaces(props);
|
|
@@ -4036,14 +4313,14 @@ var ShouldTruncate = function () {
|
|
|
4036
4313
|
var StyledCellContent = styles.styled("div")(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
4037
4314
|
var StyledCellContentWrapper = styles.styled("div")(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
4038
4315
|
var StyledCellIconWrapper = styles.styled("div", {
|
|
4039
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4316
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$h.includes(prop); },
|
|
4040
4317
|
})(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4041
4318
|
var _a = props.iconVerticalAlign, iconVerticalAlign = _a === void 0 ? "top" : _a;
|
|
4042
4319
|
var spacings = getSpaces(props);
|
|
4043
4320
|
return "\n padding-right: ".concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px;\n display: flex;\n flex-direction: column;\n justify-content: ").concat(verticalAlignToFlexMap[iconVerticalAlign], ";\n ");
|
|
4044
4321
|
});
|
|
4045
4322
|
var PrimaryText = styles.styled("span", {
|
|
4046
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4323
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$h.includes(prop); },
|
|
4047
4324
|
})(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$2, function (props) {
|
|
4048
4325
|
var _a = props.primaryTextWrapLineCount, primaryTextWrapLineCount = _a === void 0 ? 3 : _a;
|
|
4049
4326
|
return "\n display: block;\n line-height: 20px;\n ".concat(props.shouldTextWrap
|
|
@@ -4051,7 +4328,7 @@ var PrimaryText = styles.styled("span", {
|
|
|
4051
4328
|
: ShouldTruncate(), "\n ");
|
|
4052
4329
|
});
|
|
4053
4330
|
var SecondaryText = styles.styled("span", {
|
|
4054
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4331
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$h.includes(prop); },
|
|
4055
4332
|
})(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
4056
4333
|
var _a = props.secondaryTextWrapLineCount, secondaryTextWrapLineCount = _a === void 0 ? 1 : _a;
|
|
4057
4334
|
var colors = getColors(props);
|
|
@@ -4061,7 +4338,7 @@ var SecondaryText = styles.styled("span", {
|
|
|
4061
4338
|
: ShouldTruncate(), "\n ");
|
|
4062
4339
|
});
|
|
4063
4340
|
var TertiaryText = styles.styled("span", {
|
|
4064
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4341
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$h.includes(prop); },
|
|
4065
4342
|
})(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
4066
4343
|
var _a = props.tertiaryTextWrapLineCount, tertiaryTextWrapLineCount = _a === void 0 ? 1 : _a;
|
|
4067
4344
|
var colors = getColors(props);
|
|
@@ -4084,9 +4361,9 @@ var CellBasic = React.forwardRef(function (props, ref) {
|
|
|
4084
4361
|
return (jsxRuntime.jsx(StyledTableData, __assign({ ref: ref }, props, { children: jsxRuntime.jsx(CellBasicContent, __assign({}, props)) })));
|
|
4085
4362
|
});
|
|
4086
4363
|
|
|
4087
|
-
var doNotForwardProps$
|
|
4364
|
+
var doNotForwardProps$g = ["horizontalAlign", "verticalAlign"];
|
|
4088
4365
|
var StyledCellComponentData = styles.styled("td", {
|
|
4089
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4366
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
4090
4367
|
})(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$2, function (props) {
|
|
4091
4368
|
var spacings = getSpaces(props);
|
|
4092
4369
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
@@ -4094,13 +4371,13 @@ var StyledCellComponentData = styles.styled("td", {
|
|
|
4094
4371
|
return "\n font-family: ".concat(typography === null || typography === void 0 ? void 0 : typography.fontFamily, ";\n align-items: center;\n text-align: ").concat(horizontalAlign, ";\n vertical-align: ").concat(verticalAlign, ";\n overflow: hidden;\n padding: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.s, "px;\n ");
|
|
4095
4372
|
});
|
|
4096
4373
|
styles.styled("span", {
|
|
4097
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4374
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
4098
4375
|
})(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderS, function (props) {
|
|
4099
4376
|
var typography = getTypography(props);
|
|
4100
4377
|
return "\n line-height: 24px;\n font-family: ".concat(typography === null || typography === void 0 ? void 0 : typography.fontFamily, ";\n display: block;\n \n ");
|
|
4101
4378
|
});
|
|
4102
4379
|
styles.styled("span", {
|
|
4103
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4380
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
4104
4381
|
})(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
4105
4382
|
var typography = getTypography(props);
|
|
4106
4383
|
var colors = getColors(props);
|
|
@@ -4118,7 +4395,7 @@ var contentPositionMapping = {
|
|
|
4118
4395
|
left: "flex-start",
|
|
4119
4396
|
right: "flex-end",
|
|
4120
4397
|
};
|
|
4121
|
-
var doNotForwardProps$
|
|
4398
|
+
var doNotForwardProps$f = [
|
|
4122
4399
|
"active",
|
|
4123
4400
|
"horizontalAlign",
|
|
4124
4401
|
"shouldShowTooltipOnHover",
|
|
@@ -4127,7 +4404,7 @@ var doNotForwardProps$e = [
|
|
|
4127
4404
|
"hideSortIcon",
|
|
4128
4405
|
];
|
|
4129
4406
|
var StyledSortingIcon = styles.styled(ButtonIcon, {
|
|
4130
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4407
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
4131
4408
|
})(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4132
4409
|
var _a = props.active, active = _a === void 0 ? false : _a;
|
|
4133
4410
|
var spacings = getSpaces(props);
|
|
@@ -4135,7 +4412,7 @@ var StyledSortingIcon = styles.styled(ButtonIcon, {
|
|
|
4135
4412
|
return "\n margin-left: ".concat(spacings === null || spacings === void 0 ? void 0 : spacings.s, "px;\n margin-bottom: 2px;\n color: ").concat(active ? colors === null || colors === void 0 ? void 0 : colors.primary[400] : colors === null || colors === void 0 ? void 0 : colors.gray[400], ";\n opacity: ").concat(active ? 1 : 0, ";\n outline: none !important;\n ");
|
|
4136
4413
|
});
|
|
4137
4414
|
var StyledTableHeader$1 = styles.styled("th", {
|
|
4138
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4415
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
4139
4416
|
})(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderS, function (props) {
|
|
4140
4417
|
var _a = props.active, active = _a === void 0 ? false : _a, _b = props.horizontalAlign, horizontalAlign = _b === void 0 ? "left" : _b;
|
|
4141
4418
|
var spacings = getSpaces(props);
|
|
@@ -4144,7 +4421,7 @@ var StyledTableHeader$1 = styles.styled("th", {
|
|
|
4144
4421
|
return "\n color: ".concat(active ? colors === null || colors === void 0 ? void 0 : colors.primary[400] : colors === null || colors === void 0 ? void 0 : colors.gray[600], ";\n font-family: ").concat(typography === null || typography === void 0 ? void 0 : typography.fontFamily, ";\n padding: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.s, "px;\n text-align: ").concat(horizontalAlign, ";\n min-width: 96px;\n width: 96px;\n cursor: pointer;\n vertical-align: bottom;\n\n & .MuiButtonBase-root {\n outline: none;\n }\n\n &:hover {\n color: ").concat(active ? colors === null || colors === void 0 ? void 0 : colors.primary[500] : "black", ";\n\n & .MuiButtonBase-root {\n color: ").concat(active ? colors === null || colors === void 0 ? void 0 : colors.primary[500] : colors === null || colors === void 0 ? void 0 : colors.gray[500], ";\n opacity: 1;\n }\n }\n ");
|
|
4145
4422
|
});
|
|
4146
4423
|
var StyledCellHeaderContainer = styles.styled("div", {
|
|
4147
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4424
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
4148
4425
|
})(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4149
4426
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a;
|
|
4150
4427
|
return "\n align-items: flex-end;\n width: 100%;\n display: flex;\n justify-content: ".concat(horizontalAlign ? contentPositionMapping[horizontalAlign] : "flex-start", ";\n ");
|
|
@@ -4243,9 +4520,9 @@ var statusToCss = {
|
|
|
4243
4520
|
success: success,
|
|
4244
4521
|
warning: warning$2,
|
|
4245
4522
|
};
|
|
4246
|
-
var doNotForwardProps$
|
|
4523
|
+
var doNotForwardProps$e = ["isRounded"];
|
|
4247
4524
|
var StyledChip = styles.styled(material.Chip, {
|
|
4248
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4525
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$e.includes(prop); },
|
|
4249
4526
|
})(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
4250
4527
|
var size = props.size, status = props.status, isRounded = props.isRounded;
|
|
4251
4528
|
return react.css(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), isRounded && rounded$2(props), !isRounded && square$2(props), size === "small" && small(props), size === "medium" && medium(props), status && statusToCss[status](props));
|
|
@@ -4264,7 +4541,7 @@ var Chip = function (props) {
|
|
|
4264
4541
|
return jsxRuntime.jsx(StyledChip, __assign({}, props));
|
|
4265
4542
|
};
|
|
4266
4543
|
|
|
4267
|
-
var doNotForwardProps$
|
|
4544
|
+
var doNotForwardProps$d = [
|
|
4268
4545
|
"anchorEl",
|
|
4269
4546
|
"count",
|
|
4270
4547
|
"keepSearchOnSelect",
|
|
@@ -4274,63 +4551,70 @@ var doNotForwardProps$c = [
|
|
|
4274
4551
|
"PopperBaseProps",
|
|
4275
4552
|
"onClickAway",
|
|
4276
4553
|
"ClickAwayListenerProps",
|
|
4554
|
+
"forceOpen",
|
|
4555
|
+
"isMultiColumn",
|
|
4277
4556
|
];
|
|
4278
|
-
// export const StyledAutocomplete = styled(Autocomplete, {
|
|
4279
|
-
// shouldForwardProp: (prop: string) => !doNotForwardProps.includes(prop),
|
|
4280
|
-
// })`
|
|
4281
|
-
// ${(props: StyleProps) => {
|
|
4282
|
-
// const spacings = getSpaces(props);
|
|
4283
|
-
// return `
|
|
4284
|
-
// `;
|
|
4285
|
-
// }}
|
|
4286
|
-
// ` as typeof Autocomplete;
|
|
4287
4557
|
var StyledHeaderTitle = styles.styled("div", {
|
|
4288
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4558
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
4289
4559
|
})(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderXs, function (props) {
|
|
4290
4560
|
var search = props.search;
|
|
4291
4561
|
var typography = getTypography(props);
|
|
4292
4562
|
var spacings = getSpaces(props);
|
|
4293
|
-
return "\n font-family: ".concat(typography === null || typography === void 0 ? void 0 : typography.fontFamily, ";\n
|
|
4563
|
+
return "\n font-family: ".concat(typography === null || typography === void 0 ? void 0 : typography.fontFamily, ";\n padding-right: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px;\n margin-bottom: ").concat(search ? spacings === null || spacings === void 0 ? void 0 : spacings.s : spacings === null || spacings === void 0 ? void 0 : spacings.m, "px;\n ");
|
|
4294
4564
|
});
|
|
4565
|
+
var StyledDropdownMenuAutocompleteWrapper = styles.styled("div")(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n & .", ", & .MuiPopper-root {\n position: relative !important;\n transform: none !important;\n width: 100% !important;\n box-shadow: none;\n padding: 0;\n border: none;\n\n .", ", .MuiPaper-root {\n box-shadow: none !important;\n border: none !important;\n border-radius: 0;\n margin: 0;\n padding: 0;\n }\n }\n"], ["\n & .", ", & .MuiPopper-root {\n position: relative !important;\n transform: none !important;\n width: 100% !important;\n box-shadow: none;\n padding: 0;\n border: none;\n\n .", ", .MuiPaper-root {\n box-shadow: none !important;\n border: none !important;\n border-radius: 0;\n margin: 0;\n padding: 0;\n }\n }\n"])), material.autocompleteClasses.popper, material.autocompleteClasses.paper);
|
|
4295
4566
|
var StyledPopper = styles.styled(material.Popper, {
|
|
4296
4567
|
shouldForwardProp: function (prop) {
|
|
4297
|
-
return !doNotForwardProps$
|
|
4568
|
+
return !doNotForwardProps$d.includes(prop) || prop === "anchorEl";
|
|
4298
4569
|
},
|
|
4299
|
-
})(
|
|
4570
|
+
})(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4300
4571
|
var borders = getBorders(props);
|
|
4301
4572
|
var corners = getCorners(props);
|
|
4302
4573
|
var shadows = getShadows(props);
|
|
4303
|
-
|
|
4304
|
-
return "\n background-color: white;\n border: ".concat(borders === null || borders === void 0 ? void 0 : borders.gray[100], ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.m, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n padding: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xs, "px;\n box-sizing: border-box;\n z-index: 1400;\n ");
|
|
4574
|
+
return "\n background-color: white;\n border: ".concat(borders === null || borders === void 0 ? void 0 : borders.gray[100], ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.m, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n box-sizing: border-box;\n z-index: 1400;\n ");
|
|
4305
4575
|
});
|
|
4306
4576
|
var StyledPaper$1 = styles.styled(material.Paper, {
|
|
4307
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4308
|
-
})(
|
|
4309
|
-
var title = props.title;
|
|
4577
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
4578
|
+
})(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4310
4579
|
var spacings = getSpaces(props);
|
|
4311
|
-
return "\n box-shadow: none;\n
|
|
4580
|
+
return "\n box-shadow: none !important;\n border: none !important;\n border-radius: 0;\n margin: 0;\n padding: ".concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xxs, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px;\n\n .MuiFormControl-root.MuiTextField-root {\n margin-bottom: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px;\n margin-right: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px;\n }\n ");
|
|
4312
4581
|
});
|
|
4313
|
-
var StyledAutocompletePopper = styles.styled(material.Popper)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n position: relative !important;\n transform: none !important;\n width: 100% !important;\n box-shadow: none;\n padding: 0;\n border: none;\n"], ["\n position: relative !important;\n transform: none !important;\n width: 100% !important;\n box-shadow: none;\n padding: 0;\n border: none;\n"])));
|
|
4314
4582
|
var templateObject_1$z, templateObject_2$j, templateObject_3$a, templateObject_4$8;
|
|
4315
4583
|
|
|
4584
|
+
// (masoudmanson): Represents the minimum width defined by design specifications
|
|
4585
|
+
// for the dropdownMenu's popper component
|
|
4586
|
+
var MINIMUM_DROPDOWN_MENU_POPPER_WIDTH = 160;
|
|
4587
|
+
var DEFAULT_POPPER_BASE_PROPS = {
|
|
4588
|
+
disablePortal: true,
|
|
4589
|
+
};
|
|
4316
4590
|
var DropdownMenu = function (props) {
|
|
4317
|
-
var
|
|
4318
|
-
|
|
4319
|
-
|
|
4320
|
-
|
|
4321
|
-
|
|
4322
|
-
|
|
4323
|
-
|
|
4324
|
-
|
|
4325
|
-
|
|
4591
|
+
var _a;
|
|
4592
|
+
var theme = styles.useTheme();
|
|
4593
|
+
var anchorEl = props.anchorEl, id = props.id, InputBaseProps = props.InputBaseProps, _b = props.open, open = _b === void 0 ? false : _b, _c = props.PopperComponent, PopperComponent = _c === void 0 ? StyledPopper : _c, _d = props.PaperComponent, PaperComponent = _d === void 0 ? StyledPaper$1 : _d, _e = props.PopperPlacement, PopperPlacement = _e === void 0 ? "bottom-start" : _e, _f = props.PopperBaseProps, PopperBaseProps = _f === void 0 ? {} : _f, _g = props.search, search = _g === void 0 ? false : _g, title = props.title, _h = props.label, label = _h === void 0 ? "Search" : _h, children = props.children, options = props.options, _j = props.onClickAway, onClickAway = _j === void 0 ? noop : _j, ClickAwayListenerProps = props.ClickAwayListenerProps, _k = props.width, width = _k === void 0 ? MINIMUM_DROPDOWN_MENU_POPPER_WIDTH : _k, rest = __rest(props, ["anchorEl", "id", "InputBaseProps", "open", "PopperComponent", "PaperComponent", "PopperPlacement", "PopperBaseProps", "search", "title", "label", "children", "options", "onClickAway", "ClickAwayListenerProps", "width"]);
|
|
4594
|
+
var isMultiColumn = "options" in ((options === null || options === void 0 ? void 0 : options[0]) || EMPTY_OBJECT);
|
|
4595
|
+
// (masoudmanson): The DropdownMenu's Popper component should have a minimum
|
|
4596
|
+
// width of MINIMUM_DROPDOWN_MENU_POPPER_WIDTH pixels if the DropdownMenu is
|
|
4597
|
+
// a single column dropdown.However, for larger multi-column autocompletes,
|
|
4598
|
+
// the width should be set to 'auto' to accommodate the expanded layout.
|
|
4599
|
+
var dropdownMenuPopperSx = React.useMemo(function () {
|
|
4600
|
+
return __assign(__assign({}, PopperBaseProps === null || PopperBaseProps === void 0 ? void 0 : PopperBaseProps.sx), { width: isMultiColumn || width < MINIMUM_DROPDOWN_MENU_POPPER_WIDTH
|
|
4601
|
+
? "auto"
|
|
4602
|
+
: width });
|
|
4603
|
+
}, [PopperBaseProps === null || PopperBaseProps === void 0 ? void 0 : PopperBaseProps.sx, isMultiColumn, width]);
|
|
4604
|
+
var DefaultInputBaseProps = React.useMemo(function () {
|
|
4605
|
+
return __assign(__assign({}, InputBaseProps), { onClick: noop });
|
|
4606
|
+
}, [InputBaseProps]);
|
|
4326
4607
|
return (jsxRuntime.jsx(PopperComponent, __assign({ id: id, modifiers: [
|
|
4327
4608
|
{
|
|
4328
4609
|
name: "offset",
|
|
4329
4610
|
options: {
|
|
4330
|
-
offset: [0,
|
|
4611
|
+
offset: [0, (_a = theme.app) === null || _a === void 0 ? void 0 : _a.spacing.s],
|
|
4331
4612
|
},
|
|
4332
4613
|
},
|
|
4333
|
-
], open: open, anchorEl: anchorEl
|
|
4614
|
+
], open: open, anchorEl: anchorEl, placement: PopperPlacement }, PopperBaseProps, {
|
|
4615
|
+
// (masoudmanson): To override the width of the Popper,
|
|
4616
|
+
// the sx prop's value must be set after spreading the PopperBaseProps.
|
|
4617
|
+
sx: dropdownMenuPopperSx, children: jsxRuntime.jsx(PaperComponent, { children: jsxRuntime.jsx(material.ClickAwayListener, __assign({ onClickAway: onClickAway }, ClickAwayListenerProps, { children: jsxRuntime.jsxs(StyledDropdownMenuAutocompleteWrapper, { children: [title && (jsxRuntime.jsx(StyledHeaderTitle, { search: search, children: title })), anchorEl && (jsxRuntime.jsx(Autocomplete, __assign({ label: label, search: search, title: title, open: open, options: options, PopperBaseProps: DEFAULT_POPPER_BASE_PROPS, disablePortal: true, onClickAway: noop }, rest, { InputBaseProps: DefaultInputBaseProps }))), children] }) })) }) })));
|
|
4334
4618
|
};
|
|
4335
4619
|
|
|
4336
4620
|
var labelFontBodyS = fontBody("s");
|
|
@@ -4348,7 +4632,7 @@ var minimal$1 = function (props) {
|
|
|
4348
4632
|
var colors = getColors(props);
|
|
4349
4633
|
var spacings = getSpaces(props);
|
|
4350
4634
|
var palette = getPalette(props);
|
|
4351
|
-
return react.css(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n ", "\n\n /* this is needed to left align the label text */\n align-items: flex-start;\n border: none;\n flex-direction: column;\n padding: ", "px ", "px;\n\n /* Nesting to increase CSS specificity for style override */\n &.MuiButton-text {\n .styled-label {\n margin: 0;\n }\n }\n\n span {\n color: ", ";\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: ", ";\n border: none;\n color: ", ";\n\n path {\n fill: black;\n }\n\n .styled-label {\n color: #000;\n }\n }\n\n &:active {\n background-color: ", ";\n border: none;\n }\n\n &:focus {\n outline: none;\n }\n\n
|
|
4635
|
+
return react.css(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n ", "\n ", "\n\n /* this is needed to left align the label text */\n align-items: flex-start;\n border: none;\n flex-direction: column;\n padding: ", "px ", "px;\n\n /* Nesting to increase CSS specificity for style override */\n &.MuiButton-text {\n .styled-label {\n margin: 0;\n }\n }\n\n span {\n color: ", ";\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: ", ";\n border: none;\n color: ", ";\n\n path {\n fill: black;\n }\n\n .styled-label {\n color: #000;\n }\n }\n\n &:active {\n background-color: ", ";\n border: none;\n }\n\n &:focus {\n outline: none;\n }\n\n &.MuiButton-root.MuiButton-text > span {\n ", "\n margin-left: 0;\n }\n\n &.MuiButton-root.MuiButton-text svg {\n margin-left: ", "px;\n margin-right: 0;\n }\n "], ["\n ", "\n ", "\n\n /* this is needed to left align the label text */\n align-items: flex-start;\n border: none;\n flex-direction: column;\n padding: ", "px ", "px;\n\n /* Nesting to increase CSS specificity for style override */\n &.MuiButton-text {\n .styled-label {\n margin: 0;\n }\n }\n\n span {\n color: ", ";\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: ", ";\n border: none;\n color: ", ";\n\n path {\n fill: black;\n }\n\n .styled-label {\n color: #000;\n }\n }\n\n &:active {\n background-color: ", ";\n border: none;\n }\n\n &:focus {\n outline: none;\n }\n\n &.MuiButton-root.MuiButton-text > span {\n ", "\n margin-left: 0;\n }\n\n &.MuiButton-root.MuiButton-text svg {\n margin-left: ", "px;\n margin-right: 0;\n }\n "])), labelStyle(props), focusVisibleA11yStyle(), spacings === null || spacings === void 0 ? void 0 : spacings.xs, spacings === null || spacings === void 0 ? void 0 : spacings.s, colors === null || colors === void 0 ? void 0 : colors.gray[500], colors === null || colors === void 0 ? void 0 : colors.gray[500], colors === null || colors === void 0 ? void 0 : colors.gray[100], (_a = palette === null || palette === void 0 ? void 0 : palette.text) === null || _a === void 0 ? void 0 : _a.primary, colors === null || colors === void 0 ? void 0 : colors.gray[100], labelFontBodyS(props), spacings === null || spacings === void 0 ? void 0 : spacings.xs);
|
|
4352
4636
|
};
|
|
4353
4637
|
var square$1 = function (props) {
|
|
4354
4638
|
var corners = getCorners(props);
|
|
@@ -4386,7 +4670,7 @@ var isDisabled = function (props) {
|
|
|
4386
4670
|
var gray = colors === null || colors === void 0 ? void 0 : colors.gray[300];
|
|
4387
4671
|
return react.css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n cursor: default;\n border-color: ", ";\n\n span {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n path {\n fill: ", ";\n }\n "], ["\n cursor: default;\n border-color: ", ";\n\n span {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n path {\n fill: ", ";\n }\n "])), gray, colors === null || colors === void 0 ? void 0 : colors.gray[300], colors === null || colors === void 0 ? void 0 : colors.gray[300], colors === null || colors === void 0 ? void 0 : colors.gray[300]);
|
|
4388
4672
|
};
|
|
4389
|
-
var doNotForwardProps$
|
|
4673
|
+
var doNotForwardProps$c = [
|
|
4390
4674
|
"intent",
|
|
4391
4675
|
"state",
|
|
4392
4676
|
"sdsStage",
|
|
@@ -4396,20 +4680,20 @@ var doNotForwardProps$b = [
|
|
|
4396
4680
|
"shouldPutAColonAfterLabel",
|
|
4397
4681
|
];
|
|
4398
4682
|
var StyledInputDropdown = styles.styled(Button, {
|
|
4399
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4683
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
4400
4684
|
})(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n ", "\n\n /* (thuang): in Minimal it's a different value */\n align-items: center;\n /* (thuang): in Minimal it's a different value */\n flex-direction: row;\n\n justify-content: space-between;\n\n ", "\n"], ["\n ", "\n\n /* (thuang): in Minimal it's a different value */\n align-items: center;\n /* (thuang): in Minimal it's a different value */\n flex-direction: row;\n\n justify-content: space-between;\n\n ", "\n"])), labelFontBodyXs, function (props) {
|
|
4401
4685
|
var disabled = props.disabled, intent = props.intent, state = props.state, sdsStage = props.sdsStage, sdsStyle = props.sdsStyle;
|
|
4402
4686
|
return react.css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), inputDropdownStyles(props), sdsStyle === "minimal" && minimal$1(props), sdsStyle === "square" && square$1(props), sdsStyle === "rounded" && rounded$1(props), state === "open" && isOpen(props), sdsStage === "userInput" && userInput$1(props), intent === "warning" && warning$1(props), intent === "error" && error$1(props), disabled && isDisabled(props));
|
|
4403
4687
|
});
|
|
4404
4688
|
var StyledDetail = styles.styled("span", {
|
|
4405
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4689
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
4406
4690
|
})(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4407
4691
|
var colors = getColors(props);
|
|
4408
4692
|
var spaces = getSpaces(props);
|
|
4409
4693
|
return "\n color: ".concat(colors === null || colors === void 0 ? void 0 : colors.gray[500], ";\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n ");
|
|
4410
4694
|
});
|
|
4411
4695
|
var StyledLabel$1 = styles.styled("span", {
|
|
4412
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4696
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
4413
4697
|
})(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4414
4698
|
var _a;
|
|
4415
4699
|
var details = props.details, counter = props.counter, sdsType = props.sdsType;
|
|
@@ -4422,7 +4706,7 @@ var StyledLabel$1 = styles.styled("span", {
|
|
|
4422
4706
|
return "\n color: ".concat(labelColor, ";\n\n font-weight: ").concat(sdsType === "label" ? fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold : fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.regular, ";\n ");
|
|
4423
4707
|
});
|
|
4424
4708
|
var StyledCounter = styles.styled("span", {
|
|
4425
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4709
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
4426
4710
|
})(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4427
4711
|
var colors = getColors(props);
|
|
4428
4712
|
var corners = getCorners(props);
|
|
@@ -4430,7 +4714,7 @@ var StyledCounter = styles.styled("span", {
|
|
|
4430
4714
|
return "\n background-color: ".concat(colors === null || colors === void 0 ? void 0 : colors.gray[200], ";\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.primary[400], ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.l, "px;\n padding: 0 ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xs, "px;\n margin-left: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.xs, "px;\n ");
|
|
4431
4715
|
});
|
|
4432
4716
|
var MinimalDetails = styles.styled("div", {
|
|
4433
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4717
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
4434
4718
|
})(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n ", "\n text-align: left;\n width: 100%;\n\n ", "\n"], ["\n ", "\n text-align: left;\n width: 100%;\n\n ", "\n"])), labelFontBodyS, function (_a) {
|
|
4435
4719
|
var shouldTruncateMinimalDetails = _a.shouldTruncateMinimalDetails;
|
|
4436
4720
|
if (shouldTruncateMinimalDetails) {
|
|
@@ -4438,13 +4722,13 @@ var MinimalDetails = styles.styled("div", {
|
|
|
4438
4722
|
}
|
|
4439
4723
|
});
|
|
4440
4724
|
var LabelWrapper = styles.styled("span", {
|
|
4441
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4725
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
4442
4726
|
})(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
4443
4727
|
var isMinimal = _a.isMinimal;
|
|
4444
4728
|
return "\n align-items: ".concat(isMinimal ? "center" : undefined, ";\n display: ").concat(isMinimal ? "inline-flex" : "contents", ";\n justify-content: ").concat(isMinimal ? "space-between" : undefined, ";\n width: 100%;\n ");
|
|
4445
4729
|
});
|
|
4446
4730
|
var IconWrapper = styles.styled("span", {
|
|
4447
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4731
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
4448
4732
|
})(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n margin-left: auto;\n display: flex;\n align-items: center;\n"], ["\n margin-left: auto;\n display: flex;\n align-items: center;\n"])));
|
|
4449
4733
|
function labelStyle(props) {
|
|
4450
4734
|
var _a;
|
|
@@ -4585,9 +4869,9 @@ var typeToCss = {
|
|
|
4585
4869
|
primary: primary,
|
|
4586
4870
|
secondary: secondary,
|
|
4587
4871
|
};
|
|
4588
|
-
var doNotForwardProps$
|
|
4872
|
+
var doNotForwardProps$b = ["sdsType", "sdsStyle", "tagColor", "hover"];
|
|
4589
4873
|
var StyledTag$1 = styles.styled(material.Chip, {
|
|
4590
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4874
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$b.includes(prop); },
|
|
4591
4875
|
})(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
4592
4876
|
var _a = props.hover, hover = _a === void 0 ? true : _a, sdsType = props.sdsType, sdsStyle = props.sdsStyle, icon = props.icon;
|
|
4593
4877
|
var isRounded = sdsStyle === "rounded";
|
|
@@ -4644,30 +4928,22 @@ var templateObject_1$v, templateObject_2$f;
|
|
|
4644
4928
|
|
|
4645
4929
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
4646
4930
|
var ComplexFilter = function (_a) {
|
|
4647
|
-
var options = _a.options, _b = _a.label, label = _b === void 0 ? "" : _b, _c = _a.multiple, multiple = _c === void 0 ? false : _c, _d = _a.search, search = _d === void 0 ? false : _d, onChange = _a.onChange, _e = _a.DropdownMenuProps, DropdownMenuProps = _e === void 0 ? {} : _e, _f = _a.InputDropdownProps, InputDropdownProps = _f === void 0 ? { sdsStyle: "minimal" } : _f, propValue = _a.value, PopperComponent = _a.PopperComponent, _g = _a.InputDropdownComponent, InputDropdownComponent = _g === void 0 ? InputDropdown : _g,
|
|
4931
|
+
var options = _a.options, _b = _a.label, label = _b === void 0 ? "" : _b, _c = _a.multiple, multiple = _c === void 0 ? false : _c, _d = _a.search, search = _d === void 0 ? false : _d, onChange = _a.onChange, _e = _a.DropdownMenuProps, DropdownMenuProps = _e === void 0 ? {} : _e, _f = _a.InputDropdownProps, InputDropdownProps = _f === void 0 ? { sdsStyle: "minimal" } : _f, propValue = _a.value, PopperComponent = _a.PopperComponent, _g = _a.InputDropdownComponent, InputDropdownComponent = _g === void 0 ? InputDropdown : _g, rest = __rest(_a, ["options", "label", "multiple", "search", "onChange", "DropdownMenuProps", "InputDropdownProps", "value", "PopperComponent", "InputDropdownComponent"]);
|
|
4648
4932
|
var isControlled = propValue !== undefined;
|
|
4649
|
-
var
|
|
4650
|
-
var
|
|
4651
|
-
var
|
|
4652
|
-
var _m = React.useState(getInitialValue()), pendingValue = _m[0], setPendingValue = _m[1];
|
|
4653
|
-
React.useEffect(function () {
|
|
4654
|
-
onChange(value);
|
|
4655
|
-
setPendingValue(value);
|
|
4656
|
-
}, [value]);
|
|
4933
|
+
var _h = React.useState(false), open = _h[0], setOpen = _h[1];
|
|
4934
|
+
var _j = React.useState(null), anchorEl = _j[0], setAnchorEl = _j[1];
|
|
4935
|
+
var _k = React.useState((multiple ? [] : null)), value = _k[0], setValue = _k[1];
|
|
4657
4936
|
React.useEffect(function () {
|
|
4658
4937
|
if (isControlled) {
|
|
4659
4938
|
setValue(propValue);
|
|
4660
4939
|
}
|
|
4661
|
-
}, [propValue]);
|
|
4940
|
+
}, [isControlled, propValue]);
|
|
4662
4941
|
// * (mlila): likely, this portion on ComplexFilter will need to be replaced with Dropdown (or a
|
|
4663
4942
|
// * new DropdownFilter) component. As ComplexFilter evolves, there will be more types added,
|
|
4664
4943
|
// * such as sliders for ranges, inline multi selects, etc.
|
|
4665
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Wrapper$1, __assign({}, rest, { children: [jsxRuntime.jsx(InputDropdownComponent, __assign({ label: label, onClick: handleClick, sdsStage: open ? "userInput" : "default" }, InputDropdownProps)), jsxRuntime.jsx(StyledChipsWrapper, { children: jsxRuntime.jsx(Chips, { value: value, multiple: multiple, onDelete: handleDelete }) })] })), jsxRuntime.jsx(DropdownMenu, __assign({ anchorEl: anchorEl, open: open, onClose: handleMenuSelectClose, search: search, multiple: multiple, value:
|
|
4944
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Wrapper$1, __assign({}, rest, { children: [jsxRuntime.jsx(InputDropdownComponent, __assign({ label: label, onClick: handleClick, sdsStage: open ? "userInput" : "default" }, InputDropdownProps)), jsxRuntime.jsx(StyledChipsWrapper, { children: jsxRuntime.jsx(Chips, { value: value, multiple: multiple, onDelete: handleDelete }) })] })), jsxRuntime.jsx(DropdownMenu, __assign({ anchorEl: anchorEl, open: open, onClose: handleMenuSelectClose, search: search, multiple: multiple, value: value, onChange: handleChange, disableCloseOnSelect: multiple, options: options, PopperComponent: PopperComponent, PopperBaseProps: { sx: { minWidth: 250 } }, onClickAway: handleClose }, DropdownMenuProps, rest))] }));
|
|
4666
4945
|
function handleClick(event) {
|
|
4667
4946
|
if (open) {
|
|
4668
|
-
if (multiple) {
|
|
4669
|
-
setValue(pendingValue);
|
|
4670
|
-
}
|
|
4671
4947
|
setOpen(false);
|
|
4672
4948
|
if (anchorEl) {
|
|
4673
4949
|
anchorEl.focus();
|
|
@@ -4675,9 +4951,6 @@ var ComplexFilter = function (_a) {
|
|
|
4675
4951
|
setAnchorEl(null);
|
|
4676
4952
|
}
|
|
4677
4953
|
else {
|
|
4678
|
-
if (multiple) {
|
|
4679
|
-
setPendingValue(value);
|
|
4680
|
-
}
|
|
4681
4954
|
setAnchorEl(event.currentTarget);
|
|
4682
4955
|
setOpen(true);
|
|
4683
4956
|
}
|
|
@@ -4685,9 +4958,6 @@ var ComplexFilter = function (_a) {
|
|
|
4685
4958
|
function handleClose() {
|
|
4686
4959
|
if (open) {
|
|
4687
4960
|
setOpen(false);
|
|
4688
|
-
if (multiple) {
|
|
4689
|
-
setValue(pendingValue);
|
|
4690
|
-
}
|
|
4691
4961
|
}
|
|
4692
4962
|
}
|
|
4693
4963
|
function handleMenuSelectClose(event, reason) {
|
|
@@ -4696,16 +4966,12 @@ var ComplexFilter = function (_a) {
|
|
|
4696
4966
|
handleClose();
|
|
4697
4967
|
}
|
|
4698
4968
|
}
|
|
4699
|
-
function handleChange(
|
|
4700
|
-
if (multiple) {
|
|
4701
|
-
if (isTriggerChangeOnOptionClick) {
|
|
4702
|
-
setPendingValue(newValue);
|
|
4703
|
-
return setValue(newValue);
|
|
4704
|
-
}
|
|
4705
|
-
return setPendingValue(newValue);
|
|
4706
|
-
}
|
|
4969
|
+
function handleChange(event, newValue) {
|
|
4707
4970
|
setValue(newValue);
|
|
4708
|
-
|
|
4971
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
|
|
4972
|
+
if (!multiple) {
|
|
4973
|
+
setOpen(false);
|
|
4974
|
+
}
|
|
4709
4975
|
}
|
|
4710
4976
|
function handleDelete(option) {
|
|
4711
4977
|
if (!multiple) {
|
|
@@ -4714,14 +4980,6 @@ var ComplexFilter = function (_a) {
|
|
|
4714
4980
|
var newValue = (value === null || value === void 0 ? void 0 : value.filter(function (item) { return item !== option; })) || null;
|
|
4715
4981
|
setValue(newValue);
|
|
4716
4982
|
}
|
|
4717
|
-
function getInitialValue() {
|
|
4718
|
-
if (isControlled) {
|
|
4719
|
-
return propValue;
|
|
4720
|
-
}
|
|
4721
|
-
return multiple
|
|
4722
|
-
? []
|
|
4723
|
-
: null;
|
|
4724
|
-
}
|
|
4725
4983
|
};
|
|
4726
4984
|
|
|
4727
4985
|
var DialogContext = React.createContext({ sdsSize: "m" });
|
|
@@ -4734,9 +4992,9 @@ var BoxShadows;
|
|
|
4734
4992
|
})(BoxShadows || (BoxShadows = {}));
|
|
4735
4993
|
|
|
4736
4994
|
// (thuang): Please keep this in sync with the props used in `ExtraProps`
|
|
4737
|
-
var doNotForwardProps$
|
|
4995
|
+
var doNotForwardProps$a = ["sdsSize"];
|
|
4738
4996
|
var StyledPaper = styles.styled(material.Paper, {
|
|
4739
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4997
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
4740
4998
|
})(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n & {\n box-shadow: ", ";\n\n ", "\n\n ", "\n }\n"], ["\n & {\n box-shadow: ", ";\n\n ", "\n\n ", "\n }\n"])), BoxShadows.L, paperDimensions, function (props) {
|
|
4741
4999
|
var spaces = getSpaces(props);
|
|
4742
5000
|
var corners = getCorners(props);
|
|
@@ -4794,9 +5052,9 @@ var Dialog = React.forwardRef(function Dialog(props, ref) {
|
|
|
4794
5052
|
});
|
|
4795
5053
|
|
|
4796
5054
|
// (thuang): Please keep this in sync with the props used in `DialogActionsExtraProps`
|
|
4797
|
-
var doNotForwardProps$
|
|
5055
|
+
var doNotForwardProps$9 = ["buttonPosition"];
|
|
4798
5056
|
var StyledDialogActions = styles.styled(material.DialogActions, {
|
|
4799
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5057
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
4800
5058
|
})(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n padding: 0;\n\n ", "\n"], ["\n padding: 0;\n\n ", "\n"])), function (props) {
|
|
4801
5059
|
var spaces = getSpaces(props);
|
|
4802
5060
|
var _a = props.buttonPosition, buttonPosition = _a === void 0 ? "right" : _a;
|
|
@@ -4861,44 +5119,70 @@ var DialogTitle = React.forwardRef(function DialogTitle(props, ref) {
|
|
|
4861
5119
|
return (jsxRuntime.jsx(StyledDialogTitle, __assign({ ref: ref }, rest, { children: children || (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [onClose && jsxRuntime.jsx(CloseButton, { sdsIcon: "xMark", onClick: onClose }), jsxRuntime.jsx(Title, { children: title }), jsxRuntime.jsx(Subtitle, { children: subtitle })] })) })));
|
|
4862
5120
|
});
|
|
4863
5121
|
|
|
4864
|
-
|
|
4865
|
-
var
|
|
5122
|
+
var doNotForwardProps$8 = ["buttonPosition"];
|
|
5123
|
+
var StyledButtonsWrapper = styles.styled("div", {
|
|
5124
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$8.includes(prop); },
|
|
5125
|
+
})(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5126
|
+
var buttonPosition = props.buttonPosition;
|
|
5127
|
+
return "\n display: flex;\n justify-content: ".concat(buttonPosition === "left" ? "start" : "end", ";\n ");
|
|
5128
|
+
});
|
|
5129
|
+
var StyledButton = styles.styled(Button, {
|
|
5130
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$8.includes(prop); },
|
|
5131
|
+
})(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4866
5132
|
var spacings = getSpaces(props);
|
|
4867
|
-
return "\n margin-top: ".concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px;\n margin-
|
|
5133
|
+
return "\n margin-top: ".concat(spacings === null || spacings === void 0 ? void 0 : spacings.l, "px;\n margin-right: ").concat(spacings === null || spacings === void 0 ? void 0 : spacings.m, "px;\n ");
|
|
4868
5134
|
});
|
|
4869
5135
|
var templateObject_1$p, templateObject_2$d;
|
|
4870
5136
|
|
|
4871
5137
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
4872
|
-
var Dropdown = function (
|
|
4873
|
-
var options =
|
|
5138
|
+
var Dropdown = function (props) {
|
|
5139
|
+
var options = props.options, _a = props.label, label = _a === void 0 ? "" : _a, _b = props.multiple, multiple = _b === void 0 ? false : _b, _c = props.search, search = _c === void 0 ? false : _c, _d = props.buttonPosition, buttonPosition = _d === void 0 ? "right" : _d, _e = props.buttons, buttons = _e === void 0 ? false : _e,
|
|
4874
5140
|
// By default, most dropdowns will close when the user clicks outside the dropdown.
|
|
4875
5141
|
// The exception is the multiple select variant with Apply/Cancel buttons,
|
|
4876
5142
|
// which by default will not close on blur. If closeOnBlur is enabled, clicking out
|
|
4877
5143
|
// is equivalent to clicking the Cancel button, closing the dropdown and losing
|
|
4878
5144
|
// unapplied changes.
|
|
4879
|
-
|
|
5145
|
+
_f = props.closeOnBlur,
|
|
4880
5146
|
// By default, most dropdowns will close when the user clicks outside the dropdown.
|
|
4881
5147
|
// The exception is the multiple select variant with Apply/Cancel buttons,
|
|
4882
5148
|
// which by default will not close on blur. If closeOnBlur is enabled, clicking out
|
|
4883
5149
|
// is equivalent to clicking the Cancel button, closing the dropdown and losing
|
|
4884
5150
|
// unapplied changes.
|
|
4885
|
-
closeOnBlur =
|
|
5151
|
+
closeOnBlur = _f === void 0 ? !buttons : _f, onClose = props.onClose, onChange = props.onChange, _g = props.DropdownMenuProps, DropdownMenuProps = _g === void 0 ? {} : _g, _h = props.InputDropdownProps, InputDropdownProps = _h === void 0 ? { sdsStyle: "minimal" } : _h, _j = props.InputDropdownComponent, InputDropdownComponent = _j === void 0 ? InputDropdown : _j, _k = props.isTriggerChangeOnOptionClick, isTriggerChangeOnOptionClick = _k === void 0 ? false : _k, _l = props.disabled, disabled = _l === void 0 ? false : _l, propValue = props.value, rest = __rest(props, ["options", "label", "multiple", "search", "buttonPosition", "buttons", "closeOnBlur", "onClose", "onChange", "DropdownMenuProps", "InputDropdownProps", "InputDropdownComponent", "isTriggerChangeOnOptionClick", "disabled", "value"]);
|
|
4886
5152
|
if (buttons && !multiple) {
|
|
4887
5153
|
// eslint-disable-next-line no-console
|
|
4888
5154
|
console.warn("Warning: buttons are only supported for multiple select dropdowns.");
|
|
4889
5155
|
}
|
|
5156
|
+
var isMultiColumn = "options" in ((options === null || options === void 0 ? void 0 : options[0]) || EMPTY_OBJECT);
|
|
4890
5157
|
var isControlled = propValue !== undefined;
|
|
4891
|
-
var
|
|
4892
|
-
var
|
|
4893
|
-
var
|
|
5158
|
+
var _m = React.useState(null), anchorEl = _m[0], setAnchorEl = _m[1];
|
|
5159
|
+
var _o = React.useState(false), open = _o[0], setOpen = _o[1];
|
|
5160
|
+
var _p = React.useState(getInitialValue()), value = _p[0], setValue = _p[1];
|
|
5161
|
+
var _q = React.useState(getInitialValue()), pendingValue = _q[0], setPendingValue = _q[1];
|
|
5162
|
+
var shouldShowButtons = buttons && !isTriggerChangeOnOptionClick && multiple;
|
|
4894
5163
|
React.useEffect(function () {
|
|
4895
5164
|
if (isControlled) {
|
|
4896
5165
|
setValue(propValue);
|
|
4897
5166
|
}
|
|
4898
5167
|
}, [isControlled, propValue]);
|
|
4899
|
-
|
|
4900
|
-
|
|
4901
|
-
|
|
5168
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(InputDropdownComponent, __assign({ disabled: disabled, label: label, onClick: handleClick, sdsStage: open ? "userInput" : "default" }, InputDropdownProps, { "data-testid": "dropdown" })), jsxRuntime.jsx(DropdownMenu, __assign({ anchorEl: anchorEl, open: open, search: search, onClose: handleClose, multiple: multiple, disableCloseOnSelect: multiple, options: options, onClickAway: handleClickAway, width: 250, onChange: handleChange, value: isMultiColumn ? value : multiple ? pendingValue : value }, DropdownMenuProps, rest, { children: shouldShowButtons ? (jsxRuntime.jsx(StyledButtonsWrapper, { buttonPosition: buttonPosition, children: buttonPosition === "left" ? (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(StyledButton, { onClick: handleClose, sdsStyle: "square", sdsType: "primary", children: "Apply" }), jsxRuntime.jsx(StyledButton, { onClick: handleCancel, sdsStyle: "square", sdsType: "secondary", children: "Cancel" })] })) : (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(StyledButton, { onClick: handleCancel, sdsStyle: "square", sdsType: "secondary", children: "Cancel" }), jsxRuntime.jsx(StyledButton, { onClick: handleClose, sdsStyle: "square", sdsType: "primary", children: "Apply" })] })) })) : null }))] }));
|
|
5169
|
+
function getInitialValue() {
|
|
5170
|
+
return multiple
|
|
5171
|
+
? []
|
|
5172
|
+
: null;
|
|
5173
|
+
}
|
|
5174
|
+
function handleChange(event, newValue, reason, details) {
|
|
5175
|
+
if (multiple) {
|
|
5176
|
+
if (isTriggerChangeOnOptionClick) {
|
|
5177
|
+
setPendingValue(newValue);
|
|
5178
|
+
return setValueAndCallOnChange(event, newValue, reason, details);
|
|
5179
|
+
}
|
|
5180
|
+
return setPendingValue(newValue);
|
|
5181
|
+
}
|
|
5182
|
+
setValueAndCallOnChange(event, newValue, reason, details);
|
|
5183
|
+
if (!isMultiColumn)
|
|
5184
|
+
setOpen(false);
|
|
5185
|
+
}
|
|
4902
5186
|
function handleClickAway() {
|
|
4903
5187
|
if (open) {
|
|
4904
5188
|
// (masoudmanson): We want to keep the dropdown menu open in two scenarios:
|
|
@@ -4909,18 +5193,20 @@ var Dropdown = function (_a) {
|
|
|
4909
5193
|
setOpen(false);
|
|
4910
5194
|
}
|
|
4911
5195
|
if (multiple) {
|
|
4912
|
-
|
|
5196
|
+
setValue(pendingValue);
|
|
4913
5197
|
}
|
|
4914
5198
|
}
|
|
4915
5199
|
}
|
|
4916
5200
|
function handleClick(event) {
|
|
4917
5201
|
if (open) {
|
|
4918
|
-
if (
|
|
4919
|
-
|
|
4920
|
-
|
|
4921
|
-
|
|
4922
|
-
|
|
4923
|
-
anchorEl
|
|
5202
|
+
if (!shouldShowButtons) {
|
|
5203
|
+
if (multiple) {
|
|
5204
|
+
setValue(pendingValue);
|
|
5205
|
+
}
|
|
5206
|
+
setOpen(false);
|
|
5207
|
+
if (anchorEl) {
|
|
5208
|
+
anchorEl.focus();
|
|
5209
|
+
}
|
|
4924
5210
|
}
|
|
4925
5211
|
}
|
|
4926
5212
|
else {
|
|
@@ -4931,7 +5217,7 @@ var Dropdown = function (_a) {
|
|
|
4931
5217
|
setOpen(true);
|
|
4932
5218
|
}
|
|
4933
5219
|
}
|
|
4934
|
-
function handleClose(
|
|
5220
|
+
function handleClose(event, reason) {
|
|
4935
5221
|
// (thuang): We don't want to close the menu when the input is clicked
|
|
4936
5222
|
if (reason === "toggleInput") {
|
|
4937
5223
|
return;
|
|
@@ -4942,29 +5228,18 @@ var Dropdown = function (_a) {
|
|
|
4942
5228
|
return;
|
|
4943
5229
|
}
|
|
4944
5230
|
if (multiple) {
|
|
4945
|
-
|
|
5231
|
+
setValue(pendingValue);
|
|
4946
5232
|
}
|
|
4947
5233
|
if (anchorEl) {
|
|
4948
5234
|
anchorEl.focus();
|
|
4949
5235
|
}
|
|
4950
5236
|
if (closeOnBlur)
|
|
4951
|
-
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
5237
|
+
onClose === null || onClose === void 0 ? void 0 : onClose(event, reason);
|
|
4952
5238
|
if (shouldShowButtons) {
|
|
4953
|
-
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
5239
|
+
onClose === null || onClose === void 0 ? void 0 : onClose(event, reason);
|
|
4954
5240
|
setOpen(false);
|
|
4955
5241
|
}
|
|
4956
5242
|
}
|
|
4957
|
-
function handleChange(_, newValue) {
|
|
4958
|
-
if (multiple) {
|
|
4959
|
-
if (isTriggerChangeOnOptionClick) {
|
|
4960
|
-
setPendingValue(newValue);
|
|
4961
|
-
return setValueAndCallOnChange(newValue);
|
|
4962
|
-
}
|
|
4963
|
-
return setPendingValue(newValue);
|
|
4964
|
-
}
|
|
4965
|
-
setValueAndCallOnChange(newValue);
|
|
4966
|
-
setOpen(false);
|
|
4967
|
-
}
|
|
4968
5243
|
function handleCancel() {
|
|
4969
5244
|
if (multiple) {
|
|
4970
5245
|
// (masoudmanson): To undo the latest actions made on the selections,
|
|
@@ -4975,20 +5250,11 @@ var Dropdown = function (_a) {
|
|
|
4975
5250
|
if (anchorEl) {
|
|
4976
5251
|
anchorEl.focus();
|
|
4977
5252
|
}
|
|
4978
|
-
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
4979
5253
|
setOpen(false);
|
|
4980
5254
|
}
|
|
4981
|
-
function
|
|
4982
|
-
if (isControlled) {
|
|
4983
|
-
return propValue;
|
|
4984
|
-
}
|
|
4985
|
-
return multiple
|
|
4986
|
-
? []
|
|
4987
|
-
: null;
|
|
4988
|
-
}
|
|
4989
|
-
function setValueAndCallOnChange(newValue) {
|
|
5255
|
+
function setValueAndCallOnChange(event, newValue, reason, details) {
|
|
4990
5256
|
setValue(newValue);
|
|
4991
|
-
onChange(newValue);
|
|
5257
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(event, newValue, reason, details);
|
|
4992
5258
|
}
|
|
4993
5259
|
};
|
|
4994
5260
|
|
|
@@ -5056,8 +5322,10 @@ var StyledFormControlLabel$1 = styles.styled(material.FormControlLabel)(template
|
|
|
5056
5322
|
});
|
|
5057
5323
|
var StyledCheckbox = styles.styled(material.Checkbox)(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5058
5324
|
var colors = getColors(props);
|
|
5325
|
+
var corners = getCorners(props);
|
|
5059
5326
|
var iconSizes = getIconSizes(props);
|
|
5060
|
-
|
|
5327
|
+
var spaces = getSpaces(props);
|
|
5328
|
+
return "\n color: ".concat(colors === null || colors === void 0 ? void 0 : colors.gray[400], ";\n &:hover {\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[500], ";\n background-color: transparent;\n }\n &.Mui-disabled {\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.gray[300], ";\n }\n &.Mui-checked {\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.primary[400], ";\n &:hover {\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.primary[500], ";\n background-color: transparent;\n }\n &.Mui-disabled {\n color: ").concat(colors === null || colors === void 0 ? void 0 : colors.primary[300], "\n }\n }\n\n &.MuiCheckbox-root {\n ").concat(focusVisibleA11yStyle(), "\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.s, "px; \n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n margin: 3px;\n }\n\n .MuiSvgIcon-root {\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.input.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.input.width, "px;\n }\n ");
|
|
5061
5329
|
});
|
|
5062
5330
|
var templateObject_1$o, templateObject_2$c;
|
|
5063
5331
|
|
|
@@ -5208,8 +5476,6 @@ var disabledStyled$1 = function (props) {
|
|
|
5208
5476
|
};
|
|
5209
5477
|
var textArea = function (props) {
|
|
5210
5478
|
var spacings = getSpaces(props);
|
|
5211
|
-
console.log(material.outlinedInputClasses.multiline);
|
|
5212
|
-
console.log(material.outlinedInputClasses.inputMultiline);
|
|
5213
5479
|
return react.css(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n .", " {\n padding: ", "px;\n\n > .", " {\n padding: ", "px ", "px ", "px;\n resize: both;\n }\n }\n "], ["\n .", " {\n padding: ", "px;\n\n > .", " {\n padding: ", "px ", "px ", "px;\n resize: both;\n }\n }\n "])), material.outlinedInputClasses.multiline, spacings === null || spacings === void 0 ? void 0 : spacings.xxs, material.outlinedInputClasses.inputMultiline, spacings === null || spacings === void 0 ? void 0 : spacings.xxs, spacings === null || spacings === void 0 ? void 0 : spacings.m, spacings === null || spacings === void 0 ? void 0 : spacings.m);
|
|
5214
5480
|
};
|
|
5215
5481
|
var userInput = function (props) {
|
|
@@ -5469,8 +5735,8 @@ var StyledLoadingIndicator = styles.styled("div", {
|
|
|
5469
5735
|
var templateObject_1$f, templateObject_2$7, templateObject_3$4, templateObject_4$3, templateObject_5$2, templateObject_6;
|
|
5470
5736
|
|
|
5471
5737
|
var LoadingIndicator = function (_a) {
|
|
5472
|
-
var sdsStyle = _a.sdsStyle;
|
|
5473
|
-
return (jsxRuntime.jsxs(StyledLoadingIndicator, { sdsStyle: sdsStyle, children: [jsxRuntime.jsx(Icon, { sdsIcon: "loading", sdsSize: "l", sdsType: "static" }), jsxRuntime.jsx(StyledText, { children: "Loading" })] }));
|
|
5738
|
+
var ariaLabel = _a["aria-label"], sdsStyle = _a.sdsStyle;
|
|
5739
|
+
return (jsxRuntime.jsxs(StyledLoadingIndicator, { sdsStyle: sdsStyle, children: [jsxRuntime.jsx(Icon, { sdsIcon: "loading", sdsSize: "l", sdsType: "static" }), jsxRuntime.jsx(StyledText, { "aria-label": ariaLabel, "aria-live": "polite", role: "status", children: "Loading" })] }));
|
|
5474
5740
|
};
|
|
5475
5741
|
|
|
5476
5742
|
var StyledMenu = styles.styled(material.Menu)(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n & {\n .MuiMenu-paper {\n ", "\n }\n\n .MuiList-padding {\n padding: 0;\n }\n }\n"], ["\n & {\n .MuiMenu-paper {\n ", "\n }\n\n .MuiList-padding {\n padding: 0;\n }\n }\n"])), function (props) {
|
|
@@ -6125,7 +6391,7 @@ var StyledTabs = styles.styled(TempTabs, {
|
|
|
6125
6391
|
var TAB_DO_NOT_FORWARD_PROPS = ["sdsSize"];
|
|
6126
6392
|
var StyledTab = styles.styled(material.Tab, {
|
|
6127
6393
|
shouldForwardProp: function (prop) { return !TAB_DO_NOT_FORWARD_PROPS.includes(String(prop)); },
|
|
6128
|
-
})(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n min-height: unset;\n padding: 0;\n min-width: 32px;\n opacity: 1 !important;\n\n ", "\n\n ", "\n"], ["\n min-height: unset;\n padding: 0;\n min-width: 32px;\n opacity: 1 !important;\n\n ", "\n\n ", "\n"])), tabFontMixin, function (props) {
|
|
6394
|
+
})(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n min-height: unset;\n padding: 0;\n min-width: 32px;\n opacity: 1 !important;\n\n ", "\n ", "\n\n ", "\n"], ["\n min-height: unset;\n padding: 0;\n min-width: 32px;\n opacity: 1 !important;\n\n ", "\n ", "\n\n ", "\n"])), tabFontMixin, focusVisibleA11yStyle, function (props) {
|
|
6129
6395
|
var colors = getColors(props);
|
|
6130
6396
|
var spaces = getSpaces(props);
|
|
6131
6397
|
var fontWeights = getFontWeights(props);
|
|
@@ -6261,6 +6527,8 @@ exports.AccordionDetails = AccordionDetails;
|
|
|
6261
6527
|
exports.AccordionHeader = AccordionHeader;
|
|
6262
6528
|
exports.Alert = Alert$1;
|
|
6263
6529
|
exports.Autocomplete = Autocomplete;
|
|
6530
|
+
exports.AutocompleteMultiColumnStyledPopper = StyledPopper$2;
|
|
6531
|
+
exports.AutocompleteSingleColumnStyledPaper = StyledPaper$3;
|
|
6264
6532
|
exports.Banner = Banner;
|
|
6265
6533
|
exports.Button = Button;
|
|
6266
6534
|
exports.ButtonDropdown = ButtonDropdown;
|
|
@@ -6301,6 +6569,7 @@ exports.ListItem = ListItem;
|
|
|
6301
6569
|
exports.ListItemLabel = ListItemLabel;
|
|
6302
6570
|
exports.ListSubheader = ListSubheader;
|
|
6303
6571
|
exports.LoadingIndicator = LoadingIndicator;
|
|
6572
|
+
exports.MINIMUM_DROPDOWN_MENU_POPPER_WIDTH = MINIMUM_DROPDOWN_MENU_POPPER_WIDTH;
|
|
6304
6573
|
exports.Menu = Menu;
|
|
6305
6574
|
exports.MenuItem = MenuItem;
|
|
6306
6575
|
exports.MenuSelect = MenuSelect;
|
|
@@ -6320,6 +6589,7 @@ exports.TooltipCondensed = TooltipCondensed;
|
|
|
6320
6589
|
exports.TooltipTable = TooltipTableContent;
|
|
6321
6590
|
exports.defaultAppTheme = defaultAppTheme;
|
|
6322
6591
|
exports.defaultTheme = defaultTheme;
|
|
6592
|
+
exports.focusVisibleA11yStyle = focusVisibleA11yStyle;
|
|
6323
6593
|
exports.fontBody = fontBody;
|
|
6324
6594
|
exports.fontBodyL = fontBodyL$1;
|
|
6325
6595
|
exports.fontBodyM = fontBodyM$1;
|