@fixefy/fixefy-ui-components 0.2.31 → 0.2.33

package/dist/FxAsyncDropdown/FxAsyncDropdown.js

@@ -120,7 +120,7 @@ const checkedIcon = /*#__PURE__*/ (0, _jsxruntime.jsx)(_iconsmaterial.CheckBox,
     fontSize: "small"
 });
 const FxAsyncDropdown = /*#__PURE__*/ _react.default.forwardRef((props)=>{
-    const { onAdd, onRemoveOne, onRemoveAll, fetcher, disabled, type = 'text', variables, search_path, modal_type, multiple, name, query, isInitialOpen, placeholder, title_path, rootStyle } = props;
+    const { onAdd, onRemoveOne, onRemoveAll, fetcher, disabled, type = 'text', variables, search_path, modal_type, multiple, name, query, isInitialOpen, placeholder, title_path, rootStylesOverride } = props;
     const ref = (0, _react.useRef)(null);
     const theme = (0, _material.useTheme)();
     const [displayed, setDisplayed] = (0, _react.useState)(multiple ? [] : '');
@@ -187,14 +187,10 @@ const FxAsyncDropdown = /*#__PURE__*/ _react.default.forwardRef((props)=>{
             if (newOptions == null || newOptions.length < pageSize) {
                 setIsLastPage(true);
             }
-            if (reason === 'searched' || reason === 'init') {
-                setOptions(newOptions);
-            } else if (reason === 'loaded more') {
-                setOptions((prevOptions)=>[
-                        ...prevOptions,
-                        ...newOptions
-                    ]);
-            }
+            reason !== 'loaded more' ? setOptions(newOptions) : setOptions((prevOptions)=>[
+                    ...prevOptions,
+                    ...newOptions
+                ]);
         }
     }, [
         data,
@@ -251,17 +247,20 @@ const FxAsyncDropdown = /*#__PURE__*/ _react.default.forwardRef((props)=>{
                     deleteOneItem(option);
                 } else {
                     onAdd && onAdd(option);
+                    setIOpen(false);
                     setDisplayed((prev)=>[
                             ...prev,
                             option
                         ]);
                     addToStoredDisplayed(option);
+                    setIOpen(false);
                 }
                 break;
             default:
                 setDisplayed(option);
                 onAdd && onAdd(option);
                 addToStoredDisplayed(option);
+                setIOpen(false);
         }
     };
     const deleteOneItem = (item)=>{
@@ -492,8 +491,6 @@ const FxAsyncDropdown = /*#__PURE__*/ _react.default.forwardRef((props)=>{
         return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
             direction: 'row',
             sx: {
-                maxWidth: 270,
-                minWidth: 270,
                 display: 'flex',
                 justifyContent: 'space-between'
             },
@@ -530,7 +527,7 @@ const FxAsyncDropdown = /*#__PURE__*/ _react.default.forwardRef((props)=>{
         });
     };
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_dropdownstyles.Root, {
-        style: rootStyle,
+        style: rootStylesOverride,
         children: [
             /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
                 children: [
@@ -546,11 +543,6 @@ const FxAsyncDropdown = /*#__PURE__*/ _react.default.forwardRef((props)=>{
                                 },
                                 onFocus: ()=>{
                                     !isInitialOpen && setIOpen(true);
-                                },
-                                onBlur: ()=>{
-                                    setTimeout(()=>{
-                                        !isInitialOpen && setIOpen(false);
-                                    }, 200);
                                 }
                             }),
                             loading && /*#__PURE__*/ (0, _jsxruntime.jsx)(_dropdownstyles.Loading, {

package/dist/FxAsyncDropdown/styles/dropdown.styles.d.ts

@@ -1,7 +1,4 @@
 export declare const Root: any;
-export declare const Label: any;
 export declare const Loading: any;
 export declare const InputWrapper: any;
-export declare const Listbox: any;
-export declare const StyledClose: any;
 export declare const StyledListBox: any;

package/dist/FxAsyncDropdown/styles/dropdown.styles.js

@@ -12,21 +12,12 @@ _export(exports, {
     InputWrapper: function() {
         return InputWrapper;
     },
-    Label: function() {
-        return Label;
-    },
-    Listbox: function() {
-        return Listbox;
-    },
     Loading: function() {
         return Loading;
     },
     Root: function() {
         return Root;
     },
-    StyledClose: function() {
-        return StyledClose;
-    },
     StyledListBox: function() {
         return StyledListBox;
     }
@@ -85,7 +76,7 @@ function _object_spread_props(target, source) {
     return target;
 }
 const Root = (0, _styles.styled)('div')(({ props })=>{
-    return _object_spread_props(_object_spread({}, props), {
+    return _object_spread({
         color: 'rgba(0,0,0,.85)',
         fontSize: 14,
         background: '#FFFFFF',
@@ -95,14 +86,11 @@ const Root = (0, _styles.styled)('div')(({ props })=>{
             ['& > div']: {
                 padding: 0
             }
-        }
-    });
+        },
+        maxWidth: 270,
+        minWidth: 270
+    }, props);
 });
-const Label = (0, _styles.styled)('label')(()=>({
-        padding: '0 0 4px',
-        lineHeight: '1.5',
-        display: 'block'
-    }));
 const Loading = (0, _styles.styled)('div')(()=>({
         width: 30,
         height: 30,
@@ -160,33 +148,8 @@ const InputWrapper = (0, _styles.styled)('div')(({ theme, hasValue, disabled })=
         })
     };
 });
-const Listbox = (0, _styles.styled)('ul')(({ theme })=>({
-        margin: 0,
-        padding: 0,
-        position: 'absolute',
-        listStyle: 'none',
-        backgroundColor: theme.palette.common.white,
-        overflow: 'auto',
-        maxHeight: 250,
-        minHeight: 250,
-        borderRadius: 4,
-        boxShadow: '0px 0px 10px rgba(86, 135, 147, 0.2)',
-        zIndex: 1,
-        maxWidth: 270,
-        minWidth: 270,
-        top: 48,
-        left: -42,
-        ['& div']: {
-            textOverflow: 'ellipsis',
-            whiteSpace: 'nowrap',
-            overflow: 'hidden'
-        }
-    }));
-const StyledClose = (0, _styles.styled)('div')(()=>({
-        position: 'absolute',
-        bottom: 0
-    }));
-const StyledListBox = (0, _styles.styled)('ul')(({ theme })=>({
+const StyledListBox = (0, _styles.styled)('ul')(({ theme })=>{
+    return {
         margin: 0,
         padding: 0,
         listStyle: 'none',
@@ -198,7 +161,6 @@ const StyledListBox = (0, _styles.styled)('ul')(({ theme })=>({
         overflowX: 'hidden',
         paddingTop: 8,
         paddingBottom: 8,
-        maxWidth: 270,
         minWidth: 270,
         '&::-webkit-scrollbar': {
             width: '8px',
@@ -228,7 +190,6 @@ const StyledListBox = (0, _styles.styled)('ul')(({ theme })=>({
             whiteSpace: 'nowrap',
             overflow: 'hidden',
             width: '100%',
-            maxWidth: 270,
             minWidth: 270
         },
         ['& li:hover']: {
@@ -245,4 +206,5 @@ const StyledListBox = (0, _styles.styled)('ul')(({ theme })=>({
                 color: 'currentColor'
             }
         }
-    }));
+    };
+});

package/dist/FxStaticDropdown/FxStaticDropdown.d.ts

@@ -18,6 +18,6 @@ export type StaticDropdownPropsType = {
     isInitialOpen?: boolean;
     placeholder?: string;
     data: string[];
-    rootStyle?: any;
+    rootStylesOverride?: any;
 };
 export declare const FxStaticDropdown: React.ForwardRefExoticComponent<StaticDropdownPropsType & React.RefAttributes<unknown>>;

package/dist/FxStaticDropdown/FxStaticDropdown.js

@@ -65,7 +65,7 @@ const checkedIcon = /*#__PURE__*/ (0, _jsxruntime.jsx)(_iconsmaterial.CheckBox,
     fontSize: "small"
 });
 const FxStaticDropdown = /*#__PURE__*/ _react.default.forwardRef((props)=>{
-    const { onAdd, onRemoveOne, onRemoveAll, type = 'text', modal_type, multiple, query, isInitialOpen, placeholder, data, rootStyle } = props;
+    const { onAdd, onRemoveOne, onRemoveAll, type = 'text', modal_type, multiple, query, isInitialOpen, placeholder, data, rootStylesOverride } = props;
     const ref = (0, _react.useRef)(null);
     const theme = (0, _material.useTheme)();
     const [displayed, setDisplayed] = (0, _react.useState)(multiple ? [] : '');
@@ -383,7 +383,7 @@ const FxStaticDropdown = /*#__PURE__*/ _react.default.forwardRef((props)=>{
         });
     };
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_dropdownstyles.Root, {
-        style: rootStyle,
+        style: rootStylesOverride,
         children: [
             /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
                 children: [

package/dist/FxStaticDropdown/styles/dropdown.styles.js

@@ -73,7 +73,7 @@ function _object_spread_props(target, source) {
     return target;
 }
 const Root = (0, _styles.styled)('div')(({ props })=>{
-    return _object_spread_props(_object_spread({}, props), {
+    return _object_spread({
         color: 'rgba(0,0,0,.85)',
         fontSize: 14,
         background: '#FFFFFF',
@@ -84,7 +84,7 @@ const Root = (0, _styles.styled)('div')(({ props })=>{
                 padding: 0
             }
         }
-    });
+    }, props);
 });
 const InputWrapper = (0, _styles.styled)('div')(({ theme, hasValue, disabled })=>{
     const disabledBorder = `1px solid ${theme.palette.greyscale[200]}`;
@@ -144,8 +144,6 @@ const StyledListBox = (0, _styles.styled)('ul')(({ theme })=>({
         overflowX: 'hidden',
         paddingTop: 8,
         paddingBottom: 8,
-        maxWidth: 270,
-        minWidth: 270,
         '&::-webkit-scrollbar': {
             width: '8px',
             backgroundColor: 'transparent'
@@ -173,9 +171,7 @@ const StyledListBox = (0, _styles.styled)('ul')(({ theme })=>({
             textOverflow: 'ellipsis',
             whiteSpace: 'nowrap',
             overflow: 'hidden',
-            width: '100%',
-            maxWidth: 270,
-            minWidth: 270
+            width: '100%'
         },
         ['& li:hover']: {
             backgroundColor: '#F6F9FA'

package/package.json

@@ -65,5 +65,5 @@
       "require": "./dist/index.js"
     }
   },
-  "version": "0.2.31"
+  "version": "0.2.33"
 }