@devtron-labs/devtron-fe-common-lib 0.0.26-beta-3 → 0.0.26-beta-4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Common/Types.d.ts +1 -0
- package/dist/Common/index.d.ts +0 -2
- package/dist/index.js +110 -201
- package/package.json +1 -1
- package/src/Common/Types.ts +1 -0
- package/src/Common/index.ts +1 -3
- package/dist/Common/DebouncedSearch/DebouncedSearch.d.ts +0 -15
- package/dist/Common/DebouncedSearch/Types.d.ts +0 -13
- package/dist/Common/DebouncedSearch/Utils.d.ts +0 -1
- package/dist/Common/Grid/Grid.d.ts +0 -3
- package/dist/Common/Grid/types.d.ts +0 -10
- package/src/Assets/Icon/ic-error-cross.svg +0 -8
- package/src/Common/DebouncedSearch/DebouncedSearch.tsx +0 -75
- package/src/Common/DebouncedSearch/Types.ts +0 -12
- package/src/Common/DebouncedSearch/Utils.ts +0 -19
- package/src/Common/DebouncedSearch/__tests__/DebouncedSearch.test.tsx +0 -61
- package/src/Common/Grid/Grid.tsx +0 -39
- package/src/Common/Grid/types.ts +0 -9
package/dist/Common/Types.d.ts
CHANGED
package/dist/Common/index.d.ts
CHANGED
|
@@ -35,5 +35,3 @@ export { default as DeleteComponent } from './DeleteComponentModal/DeleteCompone
|
|
|
35
35
|
export * from './ImageTags';
|
|
36
36
|
export * from './ImageTags.Types';
|
|
37
37
|
export * from './ResizableTextarea';
|
|
38
|
-
export { default as DebouncedSearch } from './DebouncedSearch/DebouncedSearch';
|
|
39
|
-
export { default as Grid } from './Grid/Grid';
|
package/dist/index.js
CHANGED
|
@@ -685,15 +685,15 @@ function styleInject(css, ref) {
|
|
|
685
685
|
var css_248z$6 = ".empty-state {\n height: 100%;\n}\n.empty-state img {\n height: 40%;\n max-height: 200px;\n width: auto;\n max-width: 250px;\n}\n.empty-state svg {\n height: 40%;\n max-height: 200px;\n width: auto;\n}\n.empty-state h1,\n.empty-state h2,\n.empty-state h3,\n.empty-state h4,\n.empty-state h5,\n.empty-state h6 {\n color: var(--N900);\n}\n.empty-state .subtitle {\n font-size: 13px;\n width: 300px;\n font-weight: 400;\n text-align: center;\n line-height: 1.5;\n margin-bottom: 20px;\n}\n.empty-state .cta {\n height: 36px;\n}\n.empty-state p {\n width: 300px;\n text-align: center;\n font-size: 13px;\n color: var(--N700);\n}\n.empty-state strong {\n font-size: 16px;\n margin-bottom: 4px;\n color: var(--N900);\n font-weight: normal;\n}\n.empty-state .select-popup {\n height: min-content;\n max-height: 250px;\n overflow: auto;\n padding: 8px 0;\n}\n.empty-state .empty-state__loader {\n width: 34px;\n height: 34px;\n margin-bottom: 16px;\n}\n.empty-state .empty-state__loading-text {\n font-size: 12px;\n width: 200px;\n font-weight: normal;\n font-stretch: normal;\n font-style: normal;\n line-height: 1.5;\n letter-spacing: normal;\n text-align: center;\n color: var(--N900);\n}\n.empty-state .button__icon {\n width: 16px;\n height: 16px;\n margin-left: 8px;\n}";
|
|
686
686
|
styleInject(css_248z$6);
|
|
687
687
|
|
|
688
|
-
var _g$
|
|
689
|
-
function _extends$
|
|
688
|
+
var _g$5;
|
|
689
|
+
function _extends$i() { _extends$i = 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$i.apply(this, arguments); }
|
|
690
690
|
var SvgIcProgressing = function SvgIcProgressing(props) {
|
|
691
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
691
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$i({
|
|
692
692
|
xmlns: "http://www.w3.org/2000/svg",
|
|
693
693
|
viewBox: "0 0 24 24",
|
|
694
694
|
width: "1em",
|
|
695
695
|
height: "1em"
|
|
696
|
-
}, props), _g$
|
|
696
|
+
}, props), _g$5 || (_g$5 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
697
697
|
fill: "none"
|
|
698
698
|
}, /*#__PURE__*/React__namespace.createElement("animateTransform", {
|
|
699
699
|
attributeName: "transform",
|
|
@@ -740,8 +740,8 @@ EmptyState.Loading = Loading;
|
|
|
740
740
|
|
|
741
741
|
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);else for(t in e)e[t]&&(n&&(n+=" "),n+=t);return n}function clsx(){for(var e,t,f=0,n="";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
|
|
742
742
|
|
|
743
|
-
function _extends$
|
|
744
|
-
_extends$
|
|
743
|
+
function _extends$h() {
|
|
744
|
+
_extends$h = Object.assign || function (target) {
|
|
745
745
|
for (var i = 1; i < arguments.length; i++) {
|
|
746
746
|
var source = arguments[i];
|
|
747
747
|
|
|
@@ -755,7 +755,7 @@ function _extends$i() {
|
|
|
755
755
|
return target;
|
|
756
756
|
};
|
|
757
757
|
|
|
758
|
-
return _extends$
|
|
758
|
+
return _extends$h.apply(this, arguments);
|
|
759
759
|
}
|
|
760
760
|
|
|
761
761
|
function _objectWithoutPropertiesLoose$2(source, excluded) {
|
|
@@ -1481,7 +1481,7 @@ function ProgressBar(_ref) {
|
|
|
1481
1481
|
isIn = _ref.isIn,
|
|
1482
1482
|
theme = _ref.theme;
|
|
1483
1483
|
|
|
1484
|
-
var style = _extends$
|
|
1484
|
+
var style = _extends$h({}, userStyle, {
|
|
1485
1485
|
animationDuration: delay + "ms",
|
|
1486
1486
|
animationPlayState: isRunning ? 'running' : 'paused',
|
|
1487
1487
|
opacity: hide ? 0 : 1
|
|
@@ -1758,9 +1758,9 @@ var ToastContainer = function ToastContainer(props) {
|
|
|
1758
1758
|
,
|
|
1759
1759
|
id: containerId
|
|
1760
1760
|
}, getToastToRender(function (position, toastList) {
|
|
1761
|
-
var containerStyle = !toastList.length ? _extends$
|
|
1761
|
+
var containerStyle = !toastList.length ? _extends$h({}, style, {
|
|
1762
1762
|
pointerEvents: 'none'
|
|
1763
|
-
}) : _extends$
|
|
1763
|
+
}) : _extends$h({}, style);
|
|
1764
1764
|
return React.createElement("div", {
|
|
1765
1765
|
className: getClassName(position),
|
|
1766
1766
|
style: containerStyle,
|
|
@@ -1867,7 +1867,7 @@ function dispatchToast(content, options) {
|
|
|
1867
1867
|
|
|
1868
1868
|
|
|
1869
1869
|
function mergeOptions(type, options) {
|
|
1870
|
-
return _extends$
|
|
1870
|
+
return _extends$h({}, options, {
|
|
1871
1871
|
type: options && options.type || type,
|
|
1872
1872
|
toastId: getToastId(options)
|
|
1873
1873
|
});
|
|
@@ -1884,7 +1884,7 @@ function toast(content, options) {
|
|
|
1884
1884
|
}
|
|
1885
1885
|
|
|
1886
1886
|
toast.loading = function (content, options) {
|
|
1887
|
-
return dispatchToast(content, mergeOptions(TYPE.DEFAULT, _extends$
|
|
1887
|
+
return dispatchToast(content, mergeOptions(TYPE.DEFAULT, _extends$h({
|
|
1888
1888
|
isLoading: true,
|
|
1889
1889
|
autoClose: false,
|
|
1890
1890
|
closeOnClick: false,
|
|
@@ -1900,7 +1900,7 @@ function handlePromise(promise, _ref2, options) {
|
|
|
1900
1900
|
var id;
|
|
1901
1901
|
|
|
1902
1902
|
if (pending) {
|
|
1903
|
-
id = isStr(pending) ? toast.loading(pending, options) : toast.loading(pending.render, _extends$
|
|
1903
|
+
id = isStr(pending) ? toast.loading(pending, options) : toast.loading(pending.render, _extends$h({}, options, pending));
|
|
1904
1904
|
}
|
|
1905
1905
|
|
|
1906
1906
|
var resetParams = {
|
|
@@ -1919,7 +1919,7 @@ function handlePromise(promise, _ref2, options) {
|
|
|
1919
1919
|
return;
|
|
1920
1920
|
}
|
|
1921
1921
|
|
|
1922
|
-
var baseParams = _extends$
|
|
1922
|
+
var baseParams = _extends$h({
|
|
1923
1923
|
type: type
|
|
1924
1924
|
}, resetParams, options, {
|
|
1925
1925
|
data: result
|
|
@@ -1930,10 +1930,10 @@ function handlePromise(promise, _ref2, options) {
|
|
|
1930
1930
|
} : input; // if the id is set we know that it's an update
|
|
1931
1931
|
|
|
1932
1932
|
if (id) {
|
|
1933
|
-
toast.update(id, _extends$
|
|
1933
|
+
toast.update(id, _extends$h({}, baseParams, params));
|
|
1934
1934
|
} else {
|
|
1935
1935
|
// using toast.promise without loading
|
|
1936
|
-
toast(params.render, _extends$
|
|
1936
|
+
toast(params.render, _extends$h({}, baseParams, params));
|
|
1937
1937
|
}
|
|
1938
1938
|
|
|
1939
1939
|
return result;
|
|
@@ -1957,7 +1957,7 @@ toast.warning = /*#__PURE__*/createToastByType(TYPE.WARNING);
|
|
|
1957
1957
|
toast.warn = toast.warning;
|
|
1958
1958
|
|
|
1959
1959
|
toast.dark = function (content, options) {
|
|
1960
|
-
return dispatchToast(content, mergeOptions(TYPE.DEFAULT, _extends$
|
|
1960
|
+
return dispatchToast(content, mergeOptions(TYPE.DEFAULT, _extends$h({
|
|
1961
1961
|
theme: 'dark'
|
|
1962
1962
|
}, options)));
|
|
1963
1963
|
};
|
|
@@ -2014,7 +2014,7 @@ toast.update = function (toastId, options) {
|
|
|
2014
2014
|
var oldOptions = toast.props,
|
|
2015
2015
|
oldContent = toast.content;
|
|
2016
2016
|
|
|
2017
|
-
var nextOptions = _extends$
|
|
2017
|
+
var nextOptions = _extends$h({}, oldOptions, options, {
|
|
2018
2018
|
toastId: options.toastId || toastId,
|
|
2019
2019
|
updateId: generateToastId()
|
|
2020
2020
|
});
|
|
@@ -4109,15 +4109,15 @@ function captureException(exception, captureContext) {
|
|
|
4109
4109
|
return getCurrentHub().captureException(exception, { captureContext });
|
|
4110
4110
|
}
|
|
4111
4111
|
|
|
4112
|
-
var _g$
|
|
4113
|
-
function _extends$
|
|
4112
|
+
var _g$4;
|
|
4113
|
+
function _extends$g() { _extends$g = 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$g.apply(this, arguments); }
|
|
4114
4114
|
var SvgIcWarning = function SvgIcWarning(props) {
|
|
4115
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
4115
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$g({
|
|
4116
4116
|
xmlns: "http://www.w3.org/2000/svg",
|
|
4117
4117
|
width: "1em",
|
|
4118
4118
|
height: "1em",
|
|
4119
4119
|
viewBox: "0 0 32 32"
|
|
4120
|
-
}, props), _g$
|
|
4120
|
+
}, props), _g$4 || (_g$4 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
4121
4121
|
fill: "none",
|
|
4122
4122
|
fillRule: "evenodd"
|
|
4123
4123
|
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -10232,9 +10232,9 @@ var Modal = function (_a) {
|
|
|
10232
10232
|
};
|
|
10233
10233
|
|
|
10234
10234
|
var _path$a;
|
|
10235
|
-
function _extends$
|
|
10235
|
+
function _extends$f() { _extends$f = 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$f.apply(this, arguments); }
|
|
10236
10236
|
var SvgIcCross = function SvgIcCross(props) {
|
|
10237
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
10237
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$f({
|
|
10238
10238
|
width: "1em",
|
|
10239
10239
|
height: "1em",
|
|
10240
10240
|
viewBox: "0 0 24 24",
|
|
@@ -14540,9 +14540,9 @@ var index = /*#__PURE__*/forwardRef( /*#__PURE__*/TippyGenerator(tippy));
|
|
|
14540
14540
|
var Tippy = index;
|
|
14541
14541
|
|
|
14542
14542
|
var _path$9;
|
|
14543
|
-
function _extends$
|
|
14543
|
+
function _extends$e() { _extends$e = 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$e.apply(this, arguments); }
|
|
14544
14544
|
var SvgIcHelp = function SvgIcHelp(props) {
|
|
14545
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
14545
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$e({
|
|
14546
14546
|
xmlns: "http://www.w3.org/2000/svg",
|
|
14547
14547
|
width: "1em",
|
|
14548
14548
|
height: "1em",
|
|
@@ -14555,9 +14555,9 @@ var SvgIcHelp = function SvgIcHelp(props) {
|
|
|
14555
14555
|
};
|
|
14556
14556
|
|
|
14557
14557
|
var _path$8;
|
|
14558
|
-
function _extends$
|
|
14558
|
+
function _extends$d() { _extends$d = 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$d.apply(this, arguments); }
|
|
14559
14559
|
var SvgIcHelpOutline = function SvgIcHelpOutline(props) {
|
|
14560
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
14560
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$d({
|
|
14561
14561
|
xmlns: "http://www.w3.org/2000/svg",
|
|
14562
14562
|
viewBox: "0 0 17 16",
|
|
14563
14563
|
width: "1em",
|
|
@@ -14615,9 +14615,9 @@ function TippyCustomized(props) {
|
|
|
14615
14615
|
}
|
|
14616
14616
|
|
|
14617
14617
|
var _path$7, _circle, _path2$1;
|
|
14618
|
-
function _extends$
|
|
14618
|
+
function _extends$c() { _extends$c = 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$c.apply(this, arguments); }
|
|
14619
14619
|
var SvgInjectTag = function SvgInjectTag(props) {
|
|
14620
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
14620
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$c({
|
|
14621
14621
|
width: "1em",
|
|
14622
14622
|
height: "1em",
|
|
14623
14623
|
viewBox: "0 0 20 20",
|
|
@@ -14652,9 +14652,9 @@ function PropagateTagInfo(_a) {
|
|
|
14652
14652
|
}
|
|
14653
14653
|
|
|
14654
14654
|
var _path$6;
|
|
14655
|
-
function _extends$
|
|
14655
|
+
function _extends$b() { _extends$b = 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$b.apply(this, arguments); }
|
|
14656
14656
|
var SvgIcInfoOutlined = function SvgIcInfoOutlined(props) {
|
|
14657
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
14657
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$b({
|
|
14658
14658
|
xmlns: "http://www.w3.org/2000/svg",
|
|
14659
14659
|
width: "1em",
|
|
14660
14660
|
height: "1em",
|
|
@@ -14888,9 +14888,9 @@ var TagDetails = function (_a) {
|
|
|
14888
14888
|
};
|
|
14889
14889
|
|
|
14890
14890
|
var _path$5;
|
|
14891
|
-
function _extends$
|
|
14891
|
+
function _extends$a() { _extends$a = 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$a.apply(this, arguments); }
|
|
14892
14892
|
var SvgIcAdd = function SvgIcAdd(props) {
|
|
14893
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
14893
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$a({
|
|
14894
14894
|
xmlns: "http://www.w3.org/2000/svg",
|
|
14895
14895
|
width: "1em",
|
|
14896
14896
|
height: "1em",
|
|
@@ -15013,8 +15013,8 @@ function ForceDeleteDialog(_a) {
|
|
|
15013
15013
|
return (jsxRuntime.jsx("div", { children: jsxRuntime.jsx(DeleteDialog, __assign({ title: forceDeleteDialogTitle, delete: onClickDelete, closeDelete: closeDeleteModal, deletePrefix: "Force " }, { children: jsxRuntime.jsxs(DeleteDialog.Description, { children: [jsxRuntime.jsxs("p", __assign({ className: "mt-12 mb-12 p-8 dc__break-word dc__window-bg" }, { children: ["Error: ", forceDeleteDialogMessage] })), jsxRuntime.jsx("p", { children: "Do you want to force delete?" })] }) })) }));
|
|
15014
15014
|
}
|
|
15015
15015
|
|
|
15016
|
-
function _extends$
|
|
15017
|
-
_extends$
|
|
15016
|
+
function _extends$9() {
|
|
15017
|
+
_extends$9 = Object.assign ? Object.assign.bind() : function (target) {
|
|
15018
15018
|
for (var i = 1; i < arguments.length; i++) {
|
|
15019
15019
|
var source = arguments[i];
|
|
15020
15020
|
for (var key in source) {
|
|
@@ -15025,7 +15025,7 @@ function _extends$a() {
|
|
|
15025
15025
|
}
|
|
15026
15026
|
return target;
|
|
15027
15027
|
};
|
|
15028
|
-
return _extends$
|
|
15028
|
+
return _extends$9.apply(this, arguments);
|
|
15029
15029
|
}
|
|
15030
15030
|
|
|
15031
15031
|
/*
|
|
@@ -18566,7 +18566,7 @@ var Menu = function Menu(props) {
|
|
|
18566
18566
|
getStyles = props.getStyles,
|
|
18567
18567
|
innerRef = props.innerRef,
|
|
18568
18568
|
innerProps = props.innerProps;
|
|
18569
|
-
return jsx("div", _extends$
|
|
18569
|
+
return jsx("div", _extends$9({
|
|
18570
18570
|
css: getStyles('menu', props),
|
|
18571
18571
|
className: cx({
|
|
18572
18572
|
menu: true
|
|
@@ -18598,7 +18598,7 @@ var MenuList = function MenuList(props) {
|
|
|
18598
18598
|
innerProps = props.innerProps,
|
|
18599
18599
|
innerRef = props.innerRef,
|
|
18600
18600
|
isMulti = props.isMulti;
|
|
18601
|
-
return jsx("div", _extends$
|
|
18601
|
+
return jsx("div", _extends$9({
|
|
18602
18602
|
css: getStyles('menuList', props),
|
|
18603
18603
|
className: cx({
|
|
18604
18604
|
'menu-list': true,
|
|
@@ -18629,7 +18629,7 @@ var NoOptionsMessage = function NoOptionsMessage(props) {
|
|
|
18629
18629
|
cx = props.cx,
|
|
18630
18630
|
getStyles = props.getStyles,
|
|
18631
18631
|
innerProps = props.innerProps;
|
|
18632
|
-
return jsx("div", _extends$
|
|
18632
|
+
return jsx("div", _extends$9({
|
|
18633
18633
|
css: getStyles('noOptionsMessage', props),
|
|
18634
18634
|
className: cx({
|
|
18635
18635
|
'menu-notice': true,
|
|
@@ -18646,7 +18646,7 @@ var LoadingMessage = function LoadingMessage(props) {
|
|
|
18646
18646
|
cx = props.cx,
|
|
18647
18647
|
getStyles = props.getStyles,
|
|
18648
18648
|
innerProps = props.innerProps;
|
|
18649
|
-
return jsx("div", _extends$
|
|
18649
|
+
return jsx("div", _extends$9({
|
|
18650
18650
|
css: getStyles('loadingMessage', props),
|
|
18651
18651
|
className: cx({
|
|
18652
18652
|
'menu-notice': true,
|
|
@@ -18734,7 +18734,7 @@ var MenuPortal = /*#__PURE__*/function (_Component2) {
|
|
|
18734
18734
|
rect: rect
|
|
18735
18735
|
}; // same wrapper element whether fixed or portalled
|
|
18736
18736
|
|
|
18737
|
-
var menuWrapper = jsx("div", _extends$
|
|
18737
|
+
var menuWrapper = jsx("div", _extends$9({
|
|
18738
18738
|
css: getStyles('menuPortal', state),
|
|
18739
18739
|
className: cx({
|
|
18740
18740
|
'menu-portal': true
|
|
@@ -18770,7 +18770,7 @@ var SelectContainer = function SelectContainer(props) {
|
|
|
18770
18770
|
innerProps = props.innerProps,
|
|
18771
18771
|
isDisabled = props.isDisabled,
|
|
18772
18772
|
isRtl = props.isRtl;
|
|
18773
|
-
return jsx("div", _extends$
|
|
18773
|
+
return jsx("div", _extends$9({
|
|
18774
18774
|
css: getStyles('container', props),
|
|
18775
18775
|
className: cx({
|
|
18776
18776
|
'--is-disabled': isDisabled,
|
|
@@ -18805,7 +18805,7 @@ var ValueContainer = function ValueContainer(props) {
|
|
|
18805
18805
|
isMulti = props.isMulti,
|
|
18806
18806
|
getStyles = props.getStyles,
|
|
18807
18807
|
hasValue = props.hasValue;
|
|
18808
|
-
return jsx("div", _extends$
|
|
18808
|
+
return jsx("div", _extends$9({
|
|
18809
18809
|
css: getStyles('valueContainer', props),
|
|
18810
18810
|
className: cx({
|
|
18811
18811
|
'value-container': true,
|
|
@@ -18831,7 +18831,7 @@ var IndicatorsContainer = function IndicatorsContainer(props) {
|
|
|
18831
18831
|
cx = props.cx,
|
|
18832
18832
|
innerProps = props.innerProps,
|
|
18833
18833
|
getStyles = props.getStyles;
|
|
18834
|
-
return jsx("div", _extends$
|
|
18834
|
+
return jsx("div", _extends$9({
|
|
18835
18835
|
css: getStyles('indicatorsContainer', props),
|
|
18836
18836
|
className: cx({
|
|
18837
18837
|
indicators: true
|
|
@@ -18862,7 +18862,7 @@ var Svg = function Svg(_ref) {
|
|
|
18862
18862
|
var size = _ref.size,
|
|
18863
18863
|
props = _objectWithoutProperties(_ref, _excluded$2);
|
|
18864
18864
|
|
|
18865
|
-
return jsx("svg", _extends$
|
|
18865
|
+
return jsx("svg", _extends$9({
|
|
18866
18866
|
height: size,
|
|
18867
18867
|
width: size,
|
|
18868
18868
|
viewBox: "0 0 20 20",
|
|
@@ -18873,14 +18873,14 @@ var Svg = function Svg(_ref) {
|
|
|
18873
18873
|
};
|
|
18874
18874
|
|
|
18875
18875
|
var CrossIcon = function CrossIcon(props) {
|
|
18876
|
-
return jsx(Svg, _extends$
|
|
18876
|
+
return jsx(Svg, _extends$9({
|
|
18877
18877
|
size: 20
|
|
18878
18878
|
}, props), jsx("path", {
|
|
18879
18879
|
d: "M14.348 14.849c-0.469 0.469-1.229 0.469-1.697 0l-2.651-3.030-2.651 3.029c-0.469 0.469-1.229 0.469-1.697 0-0.469-0.469-0.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-0.469-0.469-0.469-1.228 0-1.697s1.228-0.469 1.697 0l2.652 3.031 2.651-3.031c0.469-0.469 1.228-0.469 1.697 0s0.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c0.469 0.469 0.469 1.229 0 1.698z"
|
|
18880
18880
|
}));
|
|
18881
18881
|
};
|
|
18882
18882
|
var DownChevron = function DownChevron(props) {
|
|
18883
|
-
return jsx(Svg, _extends$
|
|
18883
|
+
return jsx(Svg, _extends$9({
|
|
18884
18884
|
size: 20
|
|
18885
18885
|
}, props), jsx("path", {
|
|
18886
18886
|
d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
|
|
@@ -18913,7 +18913,7 @@ var DropdownIndicator = function DropdownIndicator(props) {
|
|
|
18913
18913
|
cx = props.cx,
|
|
18914
18914
|
getStyles = props.getStyles,
|
|
18915
18915
|
innerProps = props.innerProps;
|
|
18916
|
-
return jsx("div", _extends$
|
|
18916
|
+
return jsx("div", _extends$9({
|
|
18917
18917
|
css: getStyles('dropdownIndicator', props),
|
|
18918
18918
|
className: cx({
|
|
18919
18919
|
indicator: true,
|
|
@@ -18928,7 +18928,7 @@ var ClearIndicator$1 = function ClearIndicator(props) {
|
|
|
18928
18928
|
cx = props.cx,
|
|
18929
18929
|
getStyles = props.getStyles,
|
|
18930
18930
|
innerProps = props.innerProps;
|
|
18931
|
-
return jsx("div", _extends$
|
|
18931
|
+
return jsx("div", _extends$9({
|
|
18932
18932
|
css: getStyles('clearIndicator', props),
|
|
18933
18933
|
className: cx({
|
|
18934
18934
|
indicator: true,
|
|
@@ -18958,7 +18958,7 @@ var IndicatorSeparator = function IndicatorSeparator(props) {
|
|
|
18958
18958
|
cx = props.cx,
|
|
18959
18959
|
getStyles = props.getStyles,
|
|
18960
18960
|
innerProps = props.innerProps;
|
|
18961
|
-
return jsx("span", _extends$
|
|
18961
|
+
return jsx("span", _extends$9({}, innerProps, {
|
|
18962
18962
|
css: getStyles('indicatorSeparator', props),
|
|
18963
18963
|
className: cx({
|
|
18964
18964
|
'indicator-separator': true
|
|
@@ -19013,7 +19013,7 @@ var LoadingIndicator = function LoadingIndicator(props) {
|
|
|
19013
19013
|
getStyles = props.getStyles,
|
|
19014
19014
|
innerProps = props.innerProps,
|
|
19015
19015
|
isRtl = props.isRtl;
|
|
19016
|
-
return jsx("div", _extends$
|
|
19016
|
+
return jsx("div", _extends$9({
|
|
19017
19017
|
css: getStyles('loadingIndicator', props),
|
|
19018
19018
|
className: cx({
|
|
19019
19019
|
indicator: true,
|
|
@@ -19074,7 +19074,7 @@ var Control = function Control(props) {
|
|
|
19074
19074
|
innerRef = props.innerRef,
|
|
19075
19075
|
innerProps = props.innerProps,
|
|
19076
19076
|
menuIsOpen = props.menuIsOpen;
|
|
19077
|
-
return jsx("div", _extends$
|
|
19077
|
+
return jsx("div", _extends$9({
|
|
19078
19078
|
ref: innerRef,
|
|
19079
19079
|
css: getStyles('control', props),
|
|
19080
19080
|
className: cx({
|
|
@@ -19106,12 +19106,12 @@ var Group = function Group(props) {
|
|
|
19106
19106
|
label = props.label,
|
|
19107
19107
|
theme = props.theme,
|
|
19108
19108
|
selectProps = props.selectProps;
|
|
19109
|
-
return jsx("div", _extends$
|
|
19109
|
+
return jsx("div", _extends$9({
|
|
19110
19110
|
css: getStyles('group', props),
|
|
19111
19111
|
className: cx({
|
|
19112
19112
|
group: true
|
|
19113
19113
|
}, className)
|
|
19114
|
-
}, innerProps), jsx(Heading, _extends$
|
|
19114
|
+
}, innerProps), jsx(Heading, _extends$9({}, headingProps, {
|
|
19115
19115
|
selectProps: selectProps,
|
|
19116
19116
|
theme: theme,
|
|
19117
19117
|
getStyles: getStyles,
|
|
@@ -19143,7 +19143,7 @@ var GroupHeading = function GroupHeading(props) {
|
|
|
19143
19143
|
_cleanCommonProps.data;
|
|
19144
19144
|
var innerProps = _objectWithoutProperties(_cleanCommonProps, _excluded$1$1);
|
|
19145
19145
|
|
|
19146
|
-
return jsx("div", _extends$
|
|
19146
|
+
return jsx("div", _extends$9({
|
|
19147
19147
|
css: getStyles('groupHeading', props),
|
|
19148
19148
|
className: cx({
|
|
19149
19149
|
'group-heading': true
|
|
@@ -19219,7 +19219,7 @@ var Input = function Input(props) {
|
|
|
19219
19219
|
}, className),
|
|
19220
19220
|
css: getStyles('input', props),
|
|
19221
19221
|
"data-value": value || ''
|
|
19222
|
-
}, jsx("input", _extends$
|
|
19222
|
+
}, jsx("input", _extends$9({
|
|
19223
19223
|
className: cx({
|
|
19224
19224
|
input: true
|
|
19225
19225
|
}, inputClassName),
|
|
@@ -19289,7 +19289,7 @@ var MultiValueLabel = MultiValueGeneric;
|
|
|
19289
19289
|
function MultiValueRemove$1(_ref5) {
|
|
19290
19290
|
var children = _ref5.children,
|
|
19291
19291
|
innerProps = _ref5.innerProps;
|
|
19292
|
-
return jsx("div", _extends$
|
|
19292
|
+
return jsx("div", _extends$9({
|
|
19293
19293
|
role: "button"
|
|
19294
19294
|
}, innerProps), children || jsx(CrossIcon, {
|
|
19295
19295
|
size: 14
|
|
@@ -19378,7 +19378,7 @@ var Option$1 = function Option(props) {
|
|
|
19378
19378
|
isSelected = props.isSelected,
|
|
19379
19379
|
innerRef = props.innerRef,
|
|
19380
19380
|
innerProps = props.innerProps;
|
|
19381
|
-
return jsx("div", _extends$
|
|
19381
|
+
return jsx("div", _extends$9({
|
|
19382
19382
|
css: getStyles('option', props),
|
|
19383
19383
|
className: cx({
|
|
19384
19384
|
option: true,
|
|
@@ -19410,7 +19410,7 @@ var Placeholder = function Placeholder(props) {
|
|
|
19410
19410
|
cx = props.cx,
|
|
19411
19411
|
getStyles = props.getStyles,
|
|
19412
19412
|
innerProps = props.innerProps;
|
|
19413
|
-
return jsx("div", _extends$
|
|
19413
|
+
return jsx("div", _extends$9({
|
|
19414
19414
|
css: getStyles('placeholder', props),
|
|
19415
19415
|
className: cx({
|
|
19416
19416
|
placeholder: true
|
|
@@ -19443,7 +19443,7 @@ var SingleValue = function SingleValue(props) {
|
|
|
19443
19443
|
getStyles = props.getStyles,
|
|
19444
19444
|
isDisabled = props.isDisabled,
|
|
19445
19445
|
innerProps = props.innerProps;
|
|
19446
|
-
return jsx("div", _extends$
|
|
19446
|
+
return jsx("div", _extends$9({
|
|
19447
19447
|
css: getStyles('singleValue', props),
|
|
19448
19448
|
className: cx({
|
|
19449
19449
|
'single-value': true,
|
|
@@ -19691,7 +19691,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
|
|
|
19691
19691
|
};
|
|
19692
19692
|
|
|
19693
19693
|
var A11yText = function A11yText(props) {
|
|
19694
|
-
return jsx("span", _extends$
|
|
19694
|
+
return jsx("span", _extends$9({
|
|
19695
19695
|
css: _ref
|
|
19696
19696
|
}, props));
|
|
19697
19697
|
};
|
|
@@ -20227,7 +20227,7 @@ function DummyInput(_ref) {
|
|
|
20227
20227
|
var innerRef = _ref.innerRef,
|
|
20228
20228
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
20229
20229
|
|
|
20230
|
-
return jsx("input", _extends$
|
|
20230
|
+
return jsx("input", _extends$9({
|
|
20231
20231
|
ref: innerRef
|
|
20232
20232
|
}, props, {
|
|
20233
20233
|
css: /*#__PURE__*/css$2({
|
|
@@ -21862,7 +21862,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
21862
21862
|
|
|
21863
21863
|
if (!isSearchable) {
|
|
21864
21864
|
// use a dummy input to maintain focus/blur functionality
|
|
21865
|
-
return /*#__PURE__*/React__namespace.createElement(DummyInput, _extends$
|
|
21865
|
+
return /*#__PURE__*/React__namespace.createElement(DummyInput, _extends$9({
|
|
21866
21866
|
id: id,
|
|
21867
21867
|
innerRef: this.getInputRef,
|
|
21868
21868
|
onBlur: this.onInputBlur,
|
|
@@ -21876,7 +21876,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
21876
21876
|
}, ariaAttributes));
|
|
21877
21877
|
}
|
|
21878
21878
|
|
|
21879
|
-
return /*#__PURE__*/React__namespace.createElement(Input, _extends$
|
|
21879
|
+
return /*#__PURE__*/React__namespace.createElement(Input, _extends$9({}, commonProps, {
|
|
21880
21880
|
autoCapitalize: "none",
|
|
21881
21881
|
autoComplete: "off",
|
|
21882
21882
|
autoCorrect: "off",
|
|
@@ -21920,7 +21920,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
21920
21920
|
isFocused = _this$state5.isFocused;
|
|
21921
21921
|
|
|
21922
21922
|
if (!this.hasValue() || !controlShouldRenderValue) {
|
|
21923
|
-
return inputValue ? null : /*#__PURE__*/React__namespace.createElement(Placeholder, _extends$
|
|
21923
|
+
return inputValue ? null : /*#__PURE__*/React__namespace.createElement(Placeholder, _extends$9({}, commonProps, {
|
|
21924
21924
|
key: "placeholder",
|
|
21925
21925
|
isDisabled: isDisabled,
|
|
21926
21926
|
isFocused: isFocused,
|
|
@@ -21934,7 +21934,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
21934
21934
|
return selectValue.map(function (opt, index) {
|
|
21935
21935
|
var isOptionFocused = opt === focusedValue;
|
|
21936
21936
|
var key = "".concat(_this3.getOptionLabel(opt), "-").concat(_this3.getOptionValue(opt));
|
|
21937
|
-
return /*#__PURE__*/React__namespace.createElement(MultiValue, _extends$
|
|
21937
|
+
return /*#__PURE__*/React__namespace.createElement(MultiValue, _extends$9({}, commonProps, {
|
|
21938
21938
|
components: {
|
|
21939
21939
|
Container: MultiValueContainer,
|
|
21940
21940
|
Label: MultiValueLabel,
|
|
@@ -21966,7 +21966,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
21966
21966
|
}
|
|
21967
21967
|
|
|
21968
21968
|
var singleValue = selectValue[0];
|
|
21969
|
-
return /*#__PURE__*/React__namespace.createElement(SingleValue, _extends$
|
|
21969
|
+
return /*#__PURE__*/React__namespace.createElement(SingleValue, _extends$9({}, commonProps, {
|
|
21970
21970
|
data: singleValue,
|
|
21971
21971
|
isDisabled: isDisabled
|
|
21972
21972
|
}), this.formatOptionLabel(singleValue, 'value'));
|
|
@@ -21992,7 +21992,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
21992
21992
|
onTouchEnd: this.onClearIndicatorTouchEnd,
|
|
21993
21993
|
'aria-hidden': 'true'
|
|
21994
21994
|
};
|
|
21995
|
-
return /*#__PURE__*/React__namespace.createElement(ClearIndicator, _extends$
|
|
21995
|
+
return /*#__PURE__*/React__namespace.createElement(ClearIndicator, _extends$9({}, commonProps, {
|
|
21996
21996
|
innerProps: innerProps,
|
|
21997
21997
|
isFocused: isFocused
|
|
21998
21998
|
}));
|
|
@@ -22012,7 +22012,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22012
22012
|
var innerProps = {
|
|
22013
22013
|
'aria-hidden': 'true'
|
|
22014
22014
|
};
|
|
22015
|
-
return /*#__PURE__*/React__namespace.createElement(LoadingIndicator, _extends$
|
|
22015
|
+
return /*#__PURE__*/React__namespace.createElement(LoadingIndicator, _extends$9({}, commonProps, {
|
|
22016
22016
|
innerProps: innerProps,
|
|
22017
22017
|
isDisabled: isDisabled,
|
|
22018
22018
|
isFocused: isFocused
|
|
@@ -22030,7 +22030,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22030
22030
|
var commonProps = this.commonProps;
|
|
22031
22031
|
var isDisabled = this.props.isDisabled;
|
|
22032
22032
|
var isFocused = this.state.isFocused;
|
|
22033
|
-
return /*#__PURE__*/React__namespace.createElement(IndicatorSeparator, _extends$
|
|
22033
|
+
return /*#__PURE__*/React__namespace.createElement(IndicatorSeparator, _extends$9({}, commonProps, {
|
|
22034
22034
|
isDisabled: isDisabled,
|
|
22035
22035
|
isFocused: isFocused
|
|
22036
22036
|
}));
|
|
@@ -22050,7 +22050,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22050
22050
|
onTouchEnd: this.onDropdownIndicatorTouchEnd,
|
|
22051
22051
|
'aria-hidden': 'true'
|
|
22052
22052
|
};
|
|
22053
|
-
return /*#__PURE__*/React__namespace.createElement(DropdownIndicator, _extends$
|
|
22053
|
+
return /*#__PURE__*/React__namespace.createElement(DropdownIndicator, _extends$9({}, commonProps, {
|
|
22054
22054
|
innerProps: innerProps,
|
|
22055
22055
|
isDisabled: isDisabled,
|
|
22056
22056
|
isFocused: isFocused
|
|
@@ -22113,7 +22113,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22113
22113
|
onMouseOver: onHover,
|
|
22114
22114
|
tabIndex: -1
|
|
22115
22115
|
};
|
|
22116
|
-
return /*#__PURE__*/React__namespace.createElement(Option, _extends$
|
|
22116
|
+
return /*#__PURE__*/React__namespace.createElement(Option, _extends$9({}, commonProps, {
|
|
22117
22117
|
innerProps: innerProps,
|
|
22118
22118
|
data: data,
|
|
22119
22119
|
isDisabled: isDisabled,
|
|
@@ -22137,7 +22137,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22137
22137
|
groupIndex = item.index;
|
|
22138
22138
|
var groupId = "".concat(_this4.getElementId('group'), "-").concat(groupIndex);
|
|
22139
22139
|
var headingId = "".concat(groupId, "-heading");
|
|
22140
|
-
return /*#__PURE__*/React__namespace.createElement(Group, _extends$
|
|
22140
|
+
return /*#__PURE__*/React__namespace.createElement(Group, _extends$9({}, commonProps, {
|
|
22141
22141
|
key: groupId,
|
|
22142
22142
|
data: _data,
|
|
22143
22143
|
options: options,
|
|
@@ -22176,12 +22176,12 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22176
22176
|
menuPosition: menuPosition,
|
|
22177
22177
|
menuShouldScrollIntoView: menuShouldScrollIntoView
|
|
22178
22178
|
};
|
|
22179
|
-
var menuElement = /*#__PURE__*/React__namespace.createElement(MenuPlacer, _extends$
|
|
22179
|
+
var menuElement = /*#__PURE__*/React__namespace.createElement(MenuPlacer, _extends$9({}, commonProps, menuPlacementProps), function (_ref4) {
|
|
22180
22180
|
var ref = _ref4.ref,
|
|
22181
22181
|
_ref4$placerProps = _ref4.placerProps,
|
|
22182
22182
|
placement = _ref4$placerProps.placement,
|
|
22183
22183
|
maxHeight = _ref4$placerProps.maxHeight;
|
|
22184
|
-
return /*#__PURE__*/React__namespace.createElement(Menu, _extends$
|
|
22184
|
+
return /*#__PURE__*/React__namespace.createElement(Menu, _extends$9({}, commonProps, menuPlacementProps, {
|
|
22185
22185
|
innerRef: ref,
|
|
22186
22186
|
innerProps: {
|
|
22187
22187
|
onMouseDown: _this4.onMenuMouseDown,
|
|
@@ -22196,7 +22196,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22196
22196
|
onBottomArrive: onMenuScrollToBottom,
|
|
22197
22197
|
lockEnabled: menuShouldBlockScroll
|
|
22198
22198
|
}, function (scrollTargetRef) {
|
|
22199
|
-
return /*#__PURE__*/React__namespace.createElement(MenuList, _extends$
|
|
22199
|
+
return /*#__PURE__*/React__namespace.createElement(MenuList, _extends$9({}, commonProps, {
|
|
22200
22200
|
innerRef: function innerRef(instance) {
|
|
22201
22201
|
_this4.getMenuListRef(instance);
|
|
22202
22202
|
|
|
@@ -22211,7 +22211,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22211
22211
|
// so we use the same component. the actual portalling logic is forked
|
|
22212
22212
|
// within the component based on `menuPosition`
|
|
22213
22213
|
|
|
22214
|
-
return menuPortalTarget || menuPosition === 'fixed' ? /*#__PURE__*/React__namespace.createElement(MenuPortal, _extends$
|
|
22214
|
+
return menuPortalTarget || menuPosition === 'fixed' ? /*#__PURE__*/React__namespace.createElement(MenuPortal, _extends$9({}, commonProps, {
|
|
22215
22215
|
appendTo: menuPortalTarget,
|
|
22216
22216
|
controlElement: this.controlRef,
|
|
22217
22217
|
menuPlacement: menuPlacement,
|
|
@@ -22276,7 +22276,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22276
22276
|
isFocused = _this$state6.isFocused,
|
|
22277
22277
|
selectValue = _this$state6.selectValue;
|
|
22278
22278
|
var focusableOptions = this.getFocusableOptions();
|
|
22279
|
-
return /*#__PURE__*/React__namespace.createElement(LiveRegion, _extends$
|
|
22279
|
+
return /*#__PURE__*/React__namespace.createElement(LiveRegion, _extends$9({}, commonProps, {
|
|
22280
22280
|
id: this.getElementId('live-region'),
|
|
22281
22281
|
ariaSelection: ariaSelection,
|
|
22282
22282
|
focusedOption: focusedOption,
|
|
@@ -22302,7 +22302,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22302
22302
|
menuIsOpen = _this$props14.menuIsOpen;
|
|
22303
22303
|
var isFocused = this.state.isFocused;
|
|
22304
22304
|
var commonProps = this.commonProps = this.getCommonProps();
|
|
22305
|
-
return /*#__PURE__*/React__namespace.createElement(SelectContainer, _extends$
|
|
22305
|
+
return /*#__PURE__*/React__namespace.createElement(SelectContainer, _extends$9({}, commonProps, {
|
|
22306
22306
|
className: className,
|
|
22307
22307
|
innerProps: {
|
|
22308
22308
|
id: id,
|
|
@@ -22310,7 +22310,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22310
22310
|
},
|
|
22311
22311
|
isDisabled: isDisabled,
|
|
22312
22312
|
isFocused: isFocused
|
|
22313
|
-
}), this.renderLiveRegion(), /*#__PURE__*/React__namespace.createElement(Control, _extends$
|
|
22313
|
+
}), this.renderLiveRegion(), /*#__PURE__*/React__namespace.createElement(Control, _extends$9({}, commonProps, {
|
|
22314
22314
|
innerRef: this.getControlRef,
|
|
22315
22315
|
innerProps: {
|
|
22316
22316
|
onMouseDown: this.onControlMouseDown,
|
|
@@ -22319,9 +22319,9 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
22319
22319
|
isDisabled: isDisabled,
|
|
22320
22320
|
isFocused: isFocused,
|
|
22321
22321
|
menuIsOpen: menuIsOpen
|
|
22322
|
-
}), /*#__PURE__*/React__namespace.createElement(ValueContainer, _extends$
|
|
22322
|
+
}), /*#__PURE__*/React__namespace.createElement(ValueContainer, _extends$9({}, commonProps, {
|
|
22323
22323
|
isDisabled: isDisabled
|
|
22324
|
-
}), this.renderPlaceholderOrValue(), this.renderInput()), /*#__PURE__*/React__namespace.createElement(IndicatorsContainer, _extends$
|
|
22324
|
+
}), this.renderPlaceholderOrValue(), this.renderInput()), /*#__PURE__*/React__namespace.createElement(IndicatorsContainer, _extends$9({}, commonProps, {
|
|
22325
22325
|
isDisabled: isDisabled
|
|
22326
22326
|
}), this.renderClearIndicator(), this.renderLoadingIndicator(), this.renderIndicatorSeparator(), this.renderDropdownIndicator())), this.renderMenu(), this.renderFormField());
|
|
22327
22327
|
}
|
|
@@ -22394,22 +22394,22 @@ Select$1.defaultProps = defaultProps;
|
|
|
22394
22394
|
|
|
22395
22395
|
var StateManagedSelect = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
22396
22396
|
var baseSelectProps = useStateManager(props);
|
|
22397
|
-
return /*#__PURE__*/React__namespace.createElement(Select$1, _extends$
|
|
22397
|
+
return /*#__PURE__*/React__namespace.createElement(Select$1, _extends$9({
|
|
22398
22398
|
ref: ref
|
|
22399
22399
|
}, baseSelectProps));
|
|
22400
22400
|
});
|
|
22401
22401
|
|
|
22402
22402
|
var Select = StateManagedSelect;
|
|
22403
22403
|
|
|
22404
|
-
var _g$
|
|
22405
|
-
function _extends$
|
|
22404
|
+
var _g$3;
|
|
22405
|
+
function _extends$8() { _extends$8 = 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$8.apply(this, arguments); }
|
|
22406
22406
|
var SvgIcAppstatusCancelled = function SvgIcAppstatusCancelled(props) {
|
|
22407
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
22407
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$8({
|
|
22408
22408
|
xmlns: "http://www.w3.org/2000/svg",
|
|
22409
22409
|
viewBox: "0 0 28 28",
|
|
22410
22410
|
width: "1em",
|
|
22411
22411
|
height: "1em"
|
|
22412
|
-
}, props), _g$
|
|
22412
|
+
}, props), _g$3 || (_g$3 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
22413
22413
|
fill: "none",
|
|
22414
22414
|
fillRule: "evenodd",
|
|
22415
22415
|
transform: "translate(2 2)"
|
|
@@ -22426,9 +22426,9 @@ var SvgIcAppstatusCancelled = function SvgIcAppstatusCancelled(props) {
|
|
|
22426
22426
|
};
|
|
22427
22427
|
|
|
22428
22428
|
var _path$4;
|
|
22429
|
-
function _extends$
|
|
22429
|
+
function _extends$7() { _extends$7 = 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$7.apply(this, arguments); }
|
|
22430
22430
|
var SvgIcCheck = function SvgIcCheck(props) {
|
|
22431
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
22431
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$7({
|
|
22432
22432
|
xmlns: "http://www.w3.org/2000/svg",
|
|
22433
22433
|
width: "1em",
|
|
22434
22434
|
height: "1em",
|
|
@@ -22444,15 +22444,15 @@ var SvgIcCheck = function SvgIcCheck(props) {
|
|
|
22444
22444
|
})));
|
|
22445
22445
|
};
|
|
22446
22446
|
|
|
22447
|
-
var _g$
|
|
22448
|
-
function _extends$
|
|
22447
|
+
var _g$2;
|
|
22448
|
+
function _extends$6() { _extends$6 = 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$6.apply(this, arguments); }
|
|
22449
22449
|
var SvgIcErrorMedium = function SvgIcErrorMedium(props) {
|
|
22450
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
22450
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$6({
|
|
22451
22451
|
xmlns: "http://www.w3.org/2000/svg",
|
|
22452
22452
|
width: "1em",
|
|
22453
22453
|
height: "1em",
|
|
22454
22454
|
viewBox: "0 0 20 21"
|
|
22455
|
-
}, props), _g$
|
|
22455
|
+
}, props), _g$2 || (_g$2 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
22456
22456
|
fill: "none",
|
|
22457
22457
|
fillRule: "evenodd"
|
|
22458
22458
|
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -22821,15 +22821,15 @@ exports.ConsequenceAction = void 0;
|
|
|
22821
22821
|
ConsequenceAction["ALLOW_FOREVER"] = "ALLOW_FOREVER";
|
|
22822
22822
|
})(exports.ConsequenceAction || (exports.ConsequenceAction = {}));
|
|
22823
22823
|
|
|
22824
|
-
var _g$
|
|
22825
|
-
function _extends$
|
|
22824
|
+
var _g$1;
|
|
22825
|
+
function _extends$5() { _extends$5 = 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$5.apply(this, arguments); }
|
|
22826
22826
|
var SvgIcInfoFilled = function SvgIcInfoFilled(props) {
|
|
22827
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
22827
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$5({
|
|
22828
22828
|
xmlns: "http://www.w3.org/2000/svg",
|
|
22829
22829
|
width: "1em",
|
|
22830
22830
|
height: "1em",
|
|
22831
22831
|
viewBox: "0 0 32 32"
|
|
22832
|
-
}, props), _g$
|
|
22832
|
+
}, props), _g$1 || (_g$1 = /*#__PURE__*/React__namespace.createElement("g", {
|
|
22833
22833
|
fill: "none",
|
|
22834
22834
|
fillRule: "evenodd"
|
|
22835
22835
|
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -22904,9 +22904,9 @@ function DeleteComponent(_a) {
|
|
|
22904
22904
|
}
|
|
22905
22905
|
|
|
22906
22906
|
var _path$3;
|
|
22907
|
-
function _extends$
|
|
22907
|
+
function _extends$4() { _extends$4 = 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$4.apply(this, arguments); }
|
|
22908
22908
|
var SvgIcPencil = function SvgIcPencil(props) {
|
|
22909
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
22909
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$4({
|
|
22910
22910
|
width: "1em",
|
|
22911
22911
|
height: "1em",
|
|
22912
22912
|
viewBox: "0 0 20 20",
|
|
@@ -22922,9 +22922,9 @@ var SvgIcPencil = function SvgIcPencil(props) {
|
|
|
22922
22922
|
};
|
|
22923
22923
|
|
|
22924
22924
|
var _path$2, _path2, _path3;
|
|
22925
|
-
function _extends$
|
|
22925
|
+
function _extends$3() { _extends$3 = 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$3.apply(this, arguments); }
|
|
22926
22926
|
var SvgIcArrowCounterClockwise = function SvgIcArrowCounterClockwise(props) {
|
|
22927
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
22927
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$3({
|
|
22928
22928
|
width: "1em",
|
|
22929
22929
|
height: "1em",
|
|
22930
22930
|
viewBox: "0 0 12 12",
|
|
@@ -22949,9 +22949,9 @@ var SvgIcArrowCounterClockwise = function SvgIcArrowCounterClockwise(props) {
|
|
|
22949
22949
|
};
|
|
22950
22950
|
|
|
22951
22951
|
var _path$1;
|
|
22952
|
-
function _extends$
|
|
22952
|
+
function _extends$2() { _extends$2 = 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$2.apply(this, arguments); }
|
|
22953
22953
|
var SvgIcMinus = function SvgIcMinus(props) {
|
|
22954
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
22954
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$2({
|
|
22955
22955
|
xmlns: "http://www.w3.org/2000/svg",
|
|
22956
22956
|
width: "1em",
|
|
22957
22957
|
height: "1em",
|
|
@@ -22964,15 +22964,15 @@ var SvgIcMinus = function SvgIcMinus(props) {
|
|
|
22964
22964
|
})));
|
|
22965
22965
|
};
|
|
22966
22966
|
|
|
22967
|
-
var _g
|
|
22968
|
-
function _extends$
|
|
22967
|
+
var _g;
|
|
22968
|
+
function _extends$1() { _extends$1 = 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$1.apply(this, arguments); }
|
|
22969
22969
|
var SvgIcErrorExclamation = function SvgIcErrorExclamation(props) {
|
|
22970
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends$
|
|
22970
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
|
|
22971
22971
|
xmlns: "http://www.w3.org/2000/svg",
|
|
22972
22972
|
width: "1em",
|
|
22973
22973
|
height: "1em",
|
|
22974
22974
|
viewBox: "0 0 20 20"
|
|
22975
|
-
}, props), _g
|
|
22975
|
+
}, props), _g || (_g = /*#__PURE__*/React__namespace.createElement("g", {
|
|
22976
22976
|
fill: "none",
|
|
22977
22977
|
fillRule: "evenodd"
|
|
22978
22978
|
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
@@ -22985,9 +22985,9 @@ var SvgIcErrorExclamation = function SvgIcErrorExclamation(props) {
|
|
|
22985
22985
|
};
|
|
22986
22986
|
|
|
22987
22987
|
var _path;
|
|
22988
|
-
function _extends
|
|
22988
|
+
function _extends() { _extends = 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.apply(this, arguments); }
|
|
22989
22989
|
var SvgIcEnter = function SvgIcEnter(props) {
|
|
22990
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends
|
|
22990
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
22991
22991
|
width: "1em",
|
|
22992
22992
|
height: "1em",
|
|
22993
22993
|
viewBox: "0 0 16 16",
|
|
@@ -23353,95 +23353,6 @@ var ResizableTextarea = function (_a) {
|
|
|
23353
23353
|
return (jsxRuntime.jsx("textarea", __assign({ "data-testid": dataTestId, ref: function (el) { return (_textRef.current = el); }, value: text, placeholder: placeholder, className: "dc__resizable-textarea ".concat(className), onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, style: { lineHeight: "".concat(lineHeight, "px"), padding: "".concat(padding, "px") }, spellCheck: false, disabled: disabled }, props)));
|
|
23354
23354
|
};
|
|
23355
23355
|
|
|
23356
|
-
function useDebouncedEffect(callback, delay, deps) {
|
|
23357
|
-
if (deps === void 0) { deps = []; }
|
|
23358
|
-
// function will be executed only after the specified time once the user stops firing the event.
|
|
23359
|
-
var firstUpdate = React.useRef(true);
|
|
23360
|
-
React.useEffect(function () {
|
|
23361
|
-
if (firstUpdate.current) {
|
|
23362
|
-
firstUpdate.current = false;
|
|
23363
|
-
return;
|
|
23364
|
-
}
|
|
23365
|
-
var handler = setTimeout(function () {
|
|
23366
|
-
callback();
|
|
23367
|
-
}, delay);
|
|
23368
|
-
return function () {
|
|
23369
|
-
clearTimeout(handler);
|
|
23370
|
-
};
|
|
23371
|
-
}, __spreadArray([delay], __read(deps), false));
|
|
23372
|
-
}
|
|
23373
|
-
|
|
23374
|
-
var _g;
|
|
23375
|
-
function _extends() { _extends = 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.apply(this, arguments); }
|
|
23376
|
-
var SvgIcErrorCross = function SvgIcErrorCross(props) {
|
|
23377
|
-
return /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
23378
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
23379
|
-
width: "1em",
|
|
23380
|
-
height: "1em",
|
|
23381
|
-
viewBox: "0 0 32 32"
|
|
23382
|
-
}, props), _g || (_g = /*#__PURE__*/React__namespace.createElement("g", {
|
|
23383
|
-
transform: "translate(2.667 2.667)",
|
|
23384
|
-
fill: "none",
|
|
23385
|
-
fillRule: "evenodd"
|
|
23386
|
-
}, /*#__PURE__*/React__namespace.createElement("rect", {
|
|
23387
|
-
width: 26.667,
|
|
23388
|
-
height: 26.667,
|
|
23389
|
-
className: "ic-error-cross_svg__fill-color",
|
|
23390
|
-
fill: "#596168",
|
|
23391
|
-
rx: 13.333
|
|
23392
|
-
}), /*#__PURE__*/React__namespace.createElement("path", {
|
|
23393
|
-
fill: "#FFF",
|
|
23394
|
-
fillRule: "nonzero",
|
|
23395
|
-
d: "M8.62 8.62a1.332 1.332 0 0 1 1.885 0l2.828 2.827 2.829-2.828a1.334 1.334 0 0 1 1.777-.097l.108.097a1.333 1.333 0 0 1 0 1.886l-2.828 2.828 2.828 2.829c.486.486.519 1.254.098 1.777l-.098.108a1.332 1.332 0 0 1-1.885 0l-2.83-2.828-2.827 2.828a1.334 1.334 0 0 1-1.777.098l-.109-.098a1.333 1.333 0 0 1 0-1.885l2.828-2.83-2.828-2.827a1.334 1.334 0 0 1-.097-1.777z"
|
|
23396
|
-
}))));
|
|
23397
|
-
};
|
|
23398
|
-
|
|
23399
|
-
/**
|
|
23400
|
-
* @param onSearch - Callback function to be called on search
|
|
23401
|
-
* @param Icon - (Optional) Icon to be shown before the input
|
|
23402
|
-
* @param iconClass - (Optional) Class for the icon
|
|
23403
|
-
* @param children - (Optional) In case we want to add another button or any other element
|
|
23404
|
-
* @param placeholder - (Optional) Placeholder for the input
|
|
23405
|
-
* @param containerClass - (Optional) Class for the container
|
|
23406
|
-
* @param inputClass - (Optional) Class for the input field
|
|
23407
|
-
* @param debounceTimeout - (Optional) Timeout for the debounce with default value of 500ms
|
|
23408
|
-
* @param clearSearch - (Optional) To clear the search text
|
|
23409
|
-
* @param showClearIcon - (Optional) To show the clear icon default value is true
|
|
23410
|
-
*/
|
|
23411
|
-
function DebouncedSearch(_a) {
|
|
23412
|
-
var onSearch = _a.onSearch, Icon = _a.Icon, children = _a.children, placeholder = _a.placeholder, _b = _a.containerClass, containerClass = _b === void 0 ? '' : _b, _c = _a.iconClass, iconClass = _c === void 0 ? '' : _c, _d = _a.inputClass, inputClass = _d === void 0 ? '' : _d, _e = _a.debounceTimeout, debounceTimeout = _e === void 0 ? 500 : _e, clearSearch = _a.clearSearch, _f = _a.showClearIcon, showClearIcon = _f === void 0 ? true : _f;
|
|
23413
|
-
var _g = __read(React.useState(''), 2), searchText = _g[0], setSearchText = _g[1];
|
|
23414
|
-
React.useEffect(function () {
|
|
23415
|
-
setSearchText('');
|
|
23416
|
-
}, [clearSearch]);
|
|
23417
|
-
var handleSearchTextChange = function (e) {
|
|
23418
|
-
setSearchText(e.target.value);
|
|
23419
|
-
};
|
|
23420
|
-
var handleClearSearch = function () {
|
|
23421
|
-
setSearchText('');
|
|
23422
|
-
};
|
|
23423
|
-
useDebouncedEffect(function () { return onSearch(searchText); }, debounceTimeout, [searchText, onSearch]);
|
|
23424
|
-
return (jsxRuntime.jsxs("div", __assign({ className: containerClass }, { children: [Icon && jsxRuntime.jsx(Icon, { className: iconClass }), jsxRuntime.jsx("input", { type: "text", className: inputClass, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : 'Search', value: searchText, onChange: handleSearchTextChange, autoFocus: true, "data-testid": "debounced-search" }), showClearIcon && !!searchText && (jsxRuntime.jsx("button", __assign({ type: "button", className: "dc__outline-none-imp dc__no-border p-0 bc-n50 flex", onClick: handleClearSearch, "data-testid": "clear-search" }, { children: jsxRuntime.jsx(SvgIcErrorCross, { className: "icon-dim-20 icon-n6" }) }))), children] })));
|
|
23425
|
-
}
|
|
23426
|
-
|
|
23427
|
-
// This is meant to be a reusable component that will provide a grid like dynamic layout where xs is the number of columns out of 12 that the item will take up
|
|
23428
|
-
function Grid(_a) {
|
|
23429
|
-
var container = _a.container, _b = _a.spacing, spacing = _b === void 0 ? 0 : _b, item = _a.item, xs = _a.xs, _c = _a.containerClass, containerClass = _c === void 0 ? '' : _c, _d = _a.itemClass, itemClass = _d === void 0 ? '' : _d, children = _a.children;
|
|
23430
|
-
var containerStyles = container ? { gap: spacing + 'px' } : {};
|
|
23431
|
-
if (item) {
|
|
23432
|
-
var getColumnWidth = function () {
|
|
23433
|
-
var percentageWidth = (xs / 12) * 100;
|
|
23434
|
-
// DONT CHANGE IT FROM CALC SINCE CALC CONVERTS TO PX which is needed to handle text overflow
|
|
23435
|
-
return "calc(".concat(percentageWidth, "%)");
|
|
23436
|
-
};
|
|
23437
|
-
var itemStyles = {
|
|
23438
|
-
flex: "1 1 ".concat(getColumnWidth()),
|
|
23439
|
-
};
|
|
23440
|
-
return (jsxRuntime.jsx("div", __assign({ className: "p-0 ".concat(itemClass), style: itemStyles }, { children: children })));
|
|
23441
|
-
}
|
|
23442
|
-
return (jsxRuntime.jsx("div", __assign({ className: "flex-wrap flexbox ".concat(container ? containerClass : ''), style: containerStyles }, { children: children })));
|
|
23443
|
-
}
|
|
23444
|
-
|
|
23445
23356
|
exports.BreadCrumb = BreadCrumb;
|
|
23446
23357
|
exports.BreadcrumbStore = Store;
|
|
23447
23358
|
exports.BuildStageVariable = BuildStageVariable;
|
|
@@ -23455,7 +23366,6 @@ exports.CustomSelect = CustomSelect;
|
|
|
23455
23366
|
exports.DEFAULT_TAG_DATA = DEFAULT_TAG_DATA;
|
|
23456
23367
|
exports.DOCUMENTATION = DOCUMENTATION;
|
|
23457
23368
|
exports.DOCUMENTATION_HOME_PAGE = DOCUMENTATION_HOME_PAGE;
|
|
23458
|
-
exports.DebouncedSearch = DebouncedSearch;
|
|
23459
23369
|
exports.DeleteComponent = DeleteComponent;
|
|
23460
23370
|
exports.DeleteDialog = DeleteDialog;
|
|
23461
23371
|
exports.DetailsProgressing = DetailsProgressing;
|
|
@@ -23468,7 +23378,6 @@ exports.ErrorScreenManager = ErrorScreenManager;
|
|
|
23468
23378
|
exports.ErrorScreenNotAuthorized = ErrorScreenNotAuthorized;
|
|
23469
23379
|
exports.ForceDeleteDialog = ForceDeleteDialog;
|
|
23470
23380
|
exports.GenericEmptyState = GenericEmptyState;
|
|
23471
|
-
exports.Grid = Grid;
|
|
23472
23381
|
exports.Host = Host;
|
|
23473
23382
|
exports.ImageTagButton = ImageTagButton;
|
|
23474
23383
|
exports.ImageTagsContainer = ImageTagsContainer;
|
package/package.json
CHANGED
package/src/Common/Types.ts
CHANGED
|
@@ -267,6 +267,7 @@ export interface CommonNodeAttr {
|
|
|
267
267
|
colorCode?: string
|
|
268
268
|
isExternalCI?: boolean
|
|
269
269
|
isLinkedCI?: boolean
|
|
270
|
+
isJobCI?: boolean // used for Job type CI in Devtron Apps
|
|
270
271
|
environmentName?: string //used for CDs
|
|
271
272
|
environmentId?: number
|
|
272
273
|
inputMaterialList?: any[]
|
package/src/Common/index.ts
CHANGED
|
@@ -34,6 +34,4 @@ export * from './Policy.Types'
|
|
|
34
34
|
export { default as DeleteComponent } from './DeleteComponentModal/DeleteComponent'
|
|
35
35
|
export * from './ImageTags'
|
|
36
36
|
export * from './ImageTags.Types'
|
|
37
|
-
export * from './ResizableTextarea'
|
|
38
|
-
export { default as DebouncedSearch } from './DebouncedSearch/DebouncedSearch'
|
|
39
|
-
export { default as Grid } from './Grid/Grid'
|
|
37
|
+
export * from './ResizableTextarea'
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { DebouncedSearchProps } from './Types';
|
|
3
|
-
/**
|
|
4
|
-
* @param onSearch - Callback function to be called on search
|
|
5
|
-
* @param Icon - (Optional) Icon to be shown before the input
|
|
6
|
-
* @param iconClass - (Optional) Class for the icon
|
|
7
|
-
* @param children - (Optional) In case we want to add another button or any other element
|
|
8
|
-
* @param placeholder - (Optional) Placeholder for the input
|
|
9
|
-
* @param containerClass - (Optional) Class for the container
|
|
10
|
-
* @param inputClass - (Optional) Class for the input field
|
|
11
|
-
* @param debounceTimeout - (Optional) Timeout for the debounce with default value of 500ms
|
|
12
|
-
* @param clearSearch - (Optional) To clear the search text
|
|
13
|
-
* @param showClearIcon - (Optional) To show the clear icon default value is true
|
|
14
|
-
*/
|
|
15
|
-
export default function DebouncedSearch({ onSearch, Icon, children, placeholder, containerClass, iconClass, inputClass, debounceTimeout, clearSearch, showClearIcon, }: DebouncedSearchProps): JSX.Element;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
export interface DebouncedSearchProps {
|
|
3
|
-
onSearch: (query: string) => void;
|
|
4
|
-
Icon?: React.FunctionComponent<React.SVGProps<SVGSVGElement>>;
|
|
5
|
-
placeholder?: string;
|
|
6
|
-
inputClass?: string;
|
|
7
|
-
containerClass?: string;
|
|
8
|
-
iconClass?: string;
|
|
9
|
-
children?: React.ReactNode;
|
|
10
|
-
debounceTimeout?: number;
|
|
11
|
-
clearSearch?: boolean;
|
|
12
|
-
showClearIcon?: boolean;
|
|
13
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function useDebouncedEffect(callback: any, delay: any, deps?: unknown[]): void;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
|
|
2
|
-
<g fill="none" fill-rule="evenodd">
|
|
3
|
-
<g transform="translate(2.667 2.667)">
|
|
4
|
-
<rect width="26.667" height="26.667" class="fill-color" fill="#596168" rx="13.333"/>
|
|
5
|
-
<path fill="#FFF" fill-rule="nonzero" d="M8.62 8.62c.52-.521 1.364-.521 1.885 0l2.828 2.827 2.829-2.828a1.334 1.334 0 0 1 1.777-.097l.108.097c.521.521.521 1.365 0 1.886l-2.828 2.828 2.828 2.829c.486.486.519 1.254.098 1.777l-.098.108c-.52.521-1.365.521-1.885 0l-2.83-2.828-2.827 2.828a1.334 1.334 0 0 1-1.777.098l-.109-.098a1.333 1.333 0 0 1 0-1.885l2.828-2.83-2.828-2.827a1.334 1.334 0 0 1-.097-1.777z"/>
|
|
6
|
-
</g>
|
|
7
|
-
</g>
|
|
8
|
-
</svg>
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import React, { useEffect, useState } from 'react'
|
|
2
|
-
import { useDebouncedEffect } from './Utils'
|
|
3
|
-
import { ReactComponent as ICClear } from '../../Assets/Icon/ic-error-cross.svg'
|
|
4
|
-
import { DebouncedSearchProps } from './Types'
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* @param onSearch - Callback function to be called on search
|
|
8
|
-
* @param Icon - (Optional) Icon to be shown before the input
|
|
9
|
-
* @param iconClass - (Optional) Class for the icon
|
|
10
|
-
* @param children - (Optional) In case we want to add another button or any other element
|
|
11
|
-
* @param placeholder - (Optional) Placeholder for the input
|
|
12
|
-
* @param containerClass - (Optional) Class for the container
|
|
13
|
-
* @param inputClass - (Optional) Class for the input field
|
|
14
|
-
* @param debounceTimeout - (Optional) Timeout for the debounce with default value of 500ms
|
|
15
|
-
* @param clearSearch - (Optional) To clear the search text
|
|
16
|
-
* @param showClearIcon - (Optional) To show the clear icon default value is true
|
|
17
|
-
*/
|
|
18
|
-
export default function DebouncedSearch({
|
|
19
|
-
onSearch,
|
|
20
|
-
Icon,
|
|
21
|
-
children,
|
|
22
|
-
placeholder,
|
|
23
|
-
containerClass = '',
|
|
24
|
-
iconClass = '',
|
|
25
|
-
inputClass = '',
|
|
26
|
-
debounceTimeout = 500,
|
|
27
|
-
clearSearch,
|
|
28
|
-
showClearIcon = true,
|
|
29
|
-
}: DebouncedSearchProps) {
|
|
30
|
-
const [searchText, setSearchText] = useState<string>('')
|
|
31
|
-
|
|
32
|
-
useEffect(() => {
|
|
33
|
-
setSearchText('')
|
|
34
|
-
}, [clearSearch])
|
|
35
|
-
|
|
36
|
-
const handleSearchTextChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
|
37
|
-
setSearchText(e.target.value)
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
const handleClearSearch = () => {
|
|
41
|
-
setSearchText('')
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
useDebouncedEffect(() => onSearch(searchText), debounceTimeout, [searchText, onSearch])
|
|
45
|
-
|
|
46
|
-
return (
|
|
47
|
-
<div className={containerClass}>
|
|
48
|
-
{Icon && <Icon className={iconClass} />}
|
|
49
|
-
|
|
50
|
-
<input
|
|
51
|
-
type="text"
|
|
52
|
-
className={inputClass}
|
|
53
|
-
placeholder={placeholder ?? 'Search'}
|
|
54
|
-
value={searchText}
|
|
55
|
-
onChange={handleSearchTextChange}
|
|
56
|
-
autoFocus
|
|
57
|
-
data-testid="debounced-search"
|
|
58
|
-
/>
|
|
59
|
-
|
|
60
|
-
{showClearIcon && !!searchText && (
|
|
61
|
-
<button
|
|
62
|
-
type="button"
|
|
63
|
-
className="dc__outline-none-imp dc__no-border p-0 bc-n50 flex"
|
|
64
|
-
onClick={handleClearSearch}
|
|
65
|
-
data-testid="clear-search"
|
|
66
|
-
>
|
|
67
|
-
<ICClear className="icon-dim-20 icon-n6" />
|
|
68
|
-
</button>
|
|
69
|
-
)}
|
|
70
|
-
|
|
71
|
-
{/* In case we want to add another button or something */}
|
|
72
|
-
{children}
|
|
73
|
-
</div>
|
|
74
|
-
)
|
|
75
|
-
}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
export interface DebouncedSearchProps {
|
|
2
|
-
onSearch: (query: string) => void
|
|
3
|
-
Icon?: React.FunctionComponent<React.SVGProps<SVGSVGElement>>
|
|
4
|
-
placeholder?: string
|
|
5
|
-
inputClass?: string
|
|
6
|
-
containerClass?: string
|
|
7
|
-
iconClass?: string
|
|
8
|
-
children?: React.ReactNode
|
|
9
|
-
debounceTimeout?: number
|
|
10
|
-
clearSearch?: boolean
|
|
11
|
-
showClearIcon?: boolean
|
|
12
|
-
}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { useEffect, useRef } from 'react'
|
|
2
|
-
|
|
3
|
-
export function useDebouncedEffect(callback, delay, deps: unknown[] = []) {
|
|
4
|
-
// function will be executed only after the specified time once the user stops firing the event.
|
|
5
|
-
const firstUpdate = useRef(true)
|
|
6
|
-
useEffect(() => {
|
|
7
|
-
if (firstUpdate.current) {
|
|
8
|
-
firstUpdate.current = false
|
|
9
|
-
return
|
|
10
|
-
}
|
|
11
|
-
const handler = setTimeout(() => {
|
|
12
|
-
callback()
|
|
13
|
-
}, delay)
|
|
14
|
-
|
|
15
|
-
return () => {
|
|
16
|
-
clearTimeout(handler)
|
|
17
|
-
}
|
|
18
|
-
}, [delay, ...deps])
|
|
19
|
-
}
|
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
import { render, screen, fireEvent } from '@testing-library/react'
|
|
3
|
-
import { ReactComponent as ICClear } from '../../../../assets/icons/ic-error.svg'
|
|
4
|
-
import DebouncedSearch from '../DebouncedSearch'
|
|
5
|
-
|
|
6
|
-
jest.mock('../../helpers/Helpers', () => ({
|
|
7
|
-
useDebouncedEffect: jest.fn().mockImplementation((fn) => fn()),
|
|
8
|
-
}))
|
|
9
|
-
|
|
10
|
-
describe('When DebouncedSearch mounts', () => {
|
|
11
|
-
it('should have a input field', () => {
|
|
12
|
-
render(<DebouncedSearch onSearch={jest.fn()} />)
|
|
13
|
-
expect(screen.getByRole('textbox')).toBeTruthy()
|
|
14
|
-
})
|
|
15
|
-
|
|
16
|
-
it('should have a clear icon when clearSearch is true and user has typed something', () => {
|
|
17
|
-
const { getByTestId } = render(<DebouncedSearch onSearch={jest.fn()} clearSearch debounceTimeout={0} />)
|
|
18
|
-
fireEvent.change(screen.getByRole('textbox'), { target: { value: 'test' } })
|
|
19
|
-
expect(getByTestId('clear-search')).toBeTruthy()
|
|
20
|
-
})
|
|
21
|
-
|
|
22
|
-
it('should call onSearch when input value changes', () => {
|
|
23
|
-
const onSearch = jest.fn()
|
|
24
|
-
render(<DebouncedSearch onSearch={onSearch} debounceTimeout={0} />)
|
|
25
|
-
fireEvent.change(screen.getByRole('textbox'), { target: { value: 'test' } })
|
|
26
|
-
expect(onSearch).toHaveBeenCalled()
|
|
27
|
-
})
|
|
28
|
-
|
|
29
|
-
it('should clear input value when clear icon is clicked', () => {
|
|
30
|
-
const { container } = render(<DebouncedSearch onSearch={jest.fn()} clearSearch debounceTimeout={0} />)
|
|
31
|
-
fireEvent.change(screen.getByRole('textbox'), { target: { value: 'test' } })
|
|
32
|
-
const inputBar = container.querySelector('input')
|
|
33
|
-
expect(inputBar.value).toBe('test')
|
|
34
|
-
fireEvent.click(screen.getByRole('button'))
|
|
35
|
-
expect(inputBar.value).toBe('')
|
|
36
|
-
})
|
|
37
|
-
|
|
38
|
-
it('should have a placeholder', () => {
|
|
39
|
-
render(<DebouncedSearch onSearch={jest.fn()} placeholder="test" />)
|
|
40
|
-
expect(screen.getByPlaceholderText('test')).toBeTruthy()
|
|
41
|
-
})
|
|
42
|
-
|
|
43
|
-
it('should not show clear icon when showClearIcon is false', () => {
|
|
44
|
-
render(<DebouncedSearch onSearch={jest.fn()} showClearIcon={false} />)
|
|
45
|
-
expect(screen.queryByRole('button')).toBeNull()
|
|
46
|
-
})
|
|
47
|
-
|
|
48
|
-
it('should have a custom Icon', () => {
|
|
49
|
-
const { container } = render(<DebouncedSearch onSearch={jest.fn()} Icon={ICClear} iconClass="icon-class" />)
|
|
50
|
-
expect(container.querySelector('.icon-class')).toBeTruthy()
|
|
51
|
-
})
|
|
52
|
-
|
|
53
|
-
it('should support children', () => {
|
|
54
|
-
render(
|
|
55
|
-
<DebouncedSearch onSearch={jest.fn()}>
|
|
56
|
-
<div>test</div>
|
|
57
|
-
</DebouncedSearch>,
|
|
58
|
-
)
|
|
59
|
-
expect(screen.getByText('test')).toBeTruthy()
|
|
60
|
-
})
|
|
61
|
-
})
|
package/src/Common/Grid/Grid.tsx
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
import { GridProps } from './types'
|
|
3
|
-
|
|
4
|
-
// This is meant to be a reusable component that will provide a grid like dynamic layout where xs is the number of columns out of 12 that the item will take up
|
|
5
|
-
export default function Grid({
|
|
6
|
-
container,
|
|
7
|
-
spacing = 0,
|
|
8
|
-
item,
|
|
9
|
-
xs,
|
|
10
|
-
containerClass = '',
|
|
11
|
-
itemClass = '',
|
|
12
|
-
children,
|
|
13
|
-
}: GridProps) {
|
|
14
|
-
const containerStyles = container ? { gap: spacing + 'px' } : {}
|
|
15
|
-
|
|
16
|
-
if (item) {
|
|
17
|
-
const getColumnWidth = () => {
|
|
18
|
-
const percentageWidth = (xs / 12) * 100
|
|
19
|
-
// DONT CHANGE IT FROM CALC SINCE CALC CONVERTS TO PX which is needed to handle text overflow
|
|
20
|
-
return `calc(${percentageWidth}%)`
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
const itemStyles = {
|
|
24
|
-
flex: `1 1 ${getColumnWidth()}`,
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
return (
|
|
28
|
-
<div className={`p-0 ${itemClass}`} style={itemStyles}>
|
|
29
|
-
{children}
|
|
30
|
-
</div>
|
|
31
|
-
)
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
return (
|
|
35
|
-
<div className={`flex-wrap flexbox ${container ? containerClass : ''}`} style={containerStyles}>
|
|
36
|
-
{children}
|
|
37
|
-
</div>
|
|
38
|
-
)
|
|
39
|
-
}
|