@luscii-healthtech/web-ui 2.63.5 → 2.64.0

package/dist/components/Select/SelectDropdownIndicator.d.ts

@@ -0,0 +1,2 @@
+import { DropdownIndicatorProps } from "react-select";
+export declare const SelectDropdownIndicator: (props: DropdownIndicatorProps) => JSX.Element;

package/dist/components/Select/SelectLoadingIndicator.d.ts

@@ -0,0 +1,2 @@
+import { LoadingIndicatorProps } from "react-select";
+export declare const SelectLoadingIndicator: (props: LoadingIndicatorProps) => JSX.Element;

package/dist/web-ui.cjs.development.js

@@ -5208,10 +5208,24 @@ var PaginationMenuSmall = function PaginationMenuSmall(props) {
   }));
 };
 
-var css_248z$f = ".customized-select [class*=IndicatorsContainer] {\n  background: url(\"data:image/svg+xml,%3Csvg width%3D%228%22 height%3D%2214%22 viewBox%3D%220 0 8 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M4 0C4.26522 5.96046e-08 4.51957 0.105357 4.70711 0.292893L7.70711 3.29289C8.09763 3.68342 8.09763 4.31658 7.70711 4.70711C7.31658 5.09763 6.68342 5.09763 6.29289 4.70711L4 2.41421L1.70711 4.70711C1.31658 5.09763 0.683417 5.09763 0.292893 4.70711C-0.0976311 4.31658 -0.097631 3.68342 0.292893 3.29289L3.29289 0.292893C3.48043 0.105357 3.73478 0 4 0ZM0.292893 9.29289C0.683417 8.90237 1.31658 8.90237 1.70711 9.29289L4 11.5858L6.29289 9.29289C6.68342 8.90237 7.31658 8.90237 7.70711 9.29289C8.09763 9.68342 8.09763 10.3166 7.70711 10.7071L4.70711 13.7071C4.31658 14.0976 3.68342 14.0976 3.29289 13.7071L0.292893 10.7071C-0.0976311 10.3166 -0.0976311 9.68342 0.292893 9.29289Z%22 fill%3D%22%239CA3AF%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n  opacity: 0.5;\n  transition: opacity 0.3s ease-in-out;\n  margin-right: 0.75rem;\n}\n\n.customized-select [class*=IndicatorsContainer] svg {\n  display: none;\n}\n\n.customized-select [class*=MenuList] [class*=option]::after {\n  position: absolute;\n  content: \"\";\n  background: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2216%22 height%3D%2216%22 viewBox%3D%220 0 16 16%22%3E    %3Cg transform%3D%22translate(1.5%2C 0.5)%22%3E        %3Cpath fill%3D%22none%22 fill-rule%3D%22evenodd%22 stroke%3D%22%230074DD%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22 stroke-width%3D%222%22 d%3D%22M12.643 3.357L6.03 9.97l-2.674 2.674L0 9.286%22%2F%3E    %3C%2Fg%3E%3C%2Fsvg%3E\") no-repeat center;\n  right: 12px;\n  height: 1rem;\n  width: 1rem;\n}";
+var css_248z$f = ".customized-select [class*=MenuList] [class*=option]::after {\n  position: absolute;\n  content: \"\";\n  background: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2216%22 height%3D%2216%22 viewBox%3D%220 0 16 16%22%3E    %3Cg transform%3D%22translate(1.5%2C 0.5)%22%3E        %3Cpath fill%3D%22none%22 fill-rule%3D%22evenodd%22 stroke%3D%22%230074DD%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22 stroke-width%3D%222%22 d%3D%22M12.643 3.357L6.03 9.97l-2.674 2.674L0 9.286%22%2F%3E    %3C%2Fg%3E%3C%2Fsvg%3E\") no-repeat center;\n  right: 12px;\n  height: 1rem;\n  width: 1rem;\n}";
 styleInject(css_248z$f);
 
-var _excluded$l = ["isError", "styles", "options", "onChange", "value", "width", "isMulti", "className"];
+var SelectDropdownIndicator = function SelectDropdownIndicator(props) {
+  return /*#__PURE__*/React__default.createElement(ReactSelect.components.DropdownIndicator, _extends({}, props), /*#__PURE__*/React__default.createElement(ChevronDownIcon, null));
+};
+
+var SelectLoadingIndicator = function SelectLoadingIndicator(props) {
+  return /*#__PURE__*/React__default.createElement(LoadingIndicator, _extends({
+    asSpinner: true,
+    spinnerColor: "gray"
+  }, props.innerProps, {
+    style: props.getStyles("loadingIndicator", props)
+  }));
+};
+
+var _excluded$l = ["isError", "styles", "options", "onChange", "value", "width", "isMulti", "className"],
+    _excluded2$1 = ["children"];
 
 function generateCustomStyles(hasError, isIE11) {
   return {
@@ -5373,10 +5387,13 @@ var Select = /*#__PURE__*/React__default.forwardRef(function (_ref, innerRef) {
     return dataProps;
   };
 
-  var CustomContainer = function CustomContainer(commonProps) {
+  var CustomContainer = function CustomContainer(_ref2) {
+    var children = _ref2.children,
+        commonProps = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
+
     return /*#__PURE__*/React__default.createElement(ReactSelect.components.SelectContainer, _extends({}, commonProps, {
       innerProps: Object.assign({}, commonProps.innerProps, _extends({}, getDataAttributes()))
-    }));
+    }), children);
   };
 
   return /*#__PURE__*/React__default.createElement(ReactSelect__default, _extends({}, otherProps, {
@@ -5394,7 +5411,9 @@ var Select = /*#__PURE__*/React__default.forwardRef(function (_ref, innerRef) {
       "flex-grow": width === "full"
     }),
     components: {
-      SelectContainer: CustomContainer
+      SelectContainer: CustomContainer,
+      DropdownIndicator: SelectDropdownIndicator,
+      LoadingIndicator: SelectLoadingIndicator
     }
   }));
 });