react-ui-basics 0.0.247 → 0.0.248

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-ui-basics",
-  "version": "0.0.247",
+  "version": "0.0.248",
   "description": "",
   "module": "index.js",
   "_main": "index.cjs.js",

package/src/AutocompleteSelect.js

@@ -170,6 +170,7 @@ class AutocompleteSelect extends PureComponent {
         selectCustomOnClickOutside: true,
         withReset: false,
         scrollToValue: false,
+        disabled: false,
         mode: MODE_DEFAULT,
         selectedMode: 'full',
         listPortalPosition: 'left',
@@ -204,6 +205,7 @@ class AutocompleteSelect extends PureComponent {
             className,
             scrollToValue,
             scroll,
+            disabled,
             required,
             allowCustom,
             inlineSelected,
@@ -227,17 +229,21 @@ class AutocompleteSelect extends PureComponent {
         const selectedIds = Object.values(selected);
         const hasSelected = __length(selectedIds) !== 0;
         const setActive = (e) => {
-            stopPropagation(e);
-            this.setState({isActive: true}, () => {
-                scrollToValue && __length(selectedIds) > 0 && data.includes(selectedIds[0]) && this.list.selected(selectedIds[0]);
-            });
+            if (!disabled) {
+                stopPropagation(e);
+                this.setState({isActive: true}, () => {
+                    scrollToValue && __length(selectedIds) > 0 && data.includes(selectedIds[0]) && this.list.selected(selectedIds[0]);
+                });
+            }
         };
         const toggle = (e) => {
-            if (!__state(this).isActive) {
-                setActive(e);
-            } else {
-                stopPropagation(e);
-                this.setState({isActive: false});
+            if (!disabled) {
+                if (!__state(this).isActive) {
+                    setActive(e);
+                } else {
+                    stopPropagation(e);
+                    this.setState({isActive: false});
+                }
             }
         };
 
@@ -278,6 +284,7 @@ class AutocompleteSelect extends PureComponent {
                      errored && 'errored',
                      inlineSelected && 'inlineSelected',
                      hasSelected && 'hasSelected',
+                     disabled && 'disabled',
                  )}
                  ref={ref('el', this)}>
                 {label && <label className={classNames(`label`, (hasSelected || filterValue) && 'active', hasSelected && 'hasSelected')}
@@ -297,6 +304,7 @@ class AutocompleteSelect extends PureComponent {
                     <div
                         className={classNames('selected',
                             !label && 'nolabel',
+                            disabled && 'disabled',
                             (mode === MODE_MULTIPLE_MINI || mode === MODE_MINI || mode === MODE_MULTIPLE_MINI_INLINE) && 'clickable',
                             selectedMode)}
                         onClick={toggle}>
@@ -305,8 +313,10 @@ class AutocompleteSelect extends PureComponent {
                             <div className="value" key={id}>
                                 {React.createElement(selectedComponent, {...childProps, id, label: getLabel(labels, id), [ReactConstants[6]]: setActive})}
                                 <div className="button remove" onClick={e => {
-                                    stopPropagation(e);
-                                    this.remove(id);
+                                    if (!disabled) {
+                                        stopPropagation(e);
+                                        this.remove(id);
+                                    }
                                 }}>
                                     {removeIcon}
                                 </div>
@@ -319,7 +329,7 @@ class AutocompleteSelect extends PureComponent {
                             </React.Fragment>
                         )}
                         {!label && withArrow && <span className="arrow"/>}
-                        {withReset && <Button className="reset" raised={false} onClick={this.clean}>
+                        {withReset && <Button className="reset" disabled={disabled} raised={false} onClick={this.clean}>
                             {removeIcon}
                         </Button>}
                     </div>
@@ -330,8 +340,10 @@ class AutocompleteSelect extends PureComponent {
                         <div className="value" key={id}>
                             {React.createElement(selectedComponent, {...childProps, id, label: getLabel(labels, id), [ReactConstants[6]]: setActive})}
                             <div className="button remove" onClick={e => {
-                                stopPropagation(e);
-                                this.remove(id);
+                                if (!disabled) {
+                                    stopPropagation(e);
+                                    this.remove(id);
+                                }
                             }}>
                                 {removeIcon}
                             </div>
@@ -352,6 +364,7 @@ class AutocompleteSelect extends PureComponent {
                                                   focused={isActive}
                                                   value={filterValue}
                                                   label={inputLabel}
+                                                  disabled={disabled}
                                                   onChange={this[ReactConstants[7]]}
                                                   onFocus={e => this.setState({isActive: true})}
                                                   check={__props(this).filterCheck}

package/src/ReactConstants.ts

@@ -13,21 +13,16 @@ export const stateFieldSetter = (that, key, cb?: () => void) => (value, cb2?) =>
 };
 
 export type Callback = () => void;
-export function createStateGetterSetter<C extends React.Component, K extends keyof C["state"]>(that: C, key: K, cb?: Callback): {
+export const createStateGetterSetter = <C extends React.Component, K extends keyof C["state"]>(that: C, key: K, cb?: Callback): {
     (): C["state"][K];
     (value: C["state"][K], cb2?: Callback): void;
-} {
-    return ((value?: C["state"][K], cb2?: Callback): C["state"][K] => {
-        if (arguments.length === 0) {
-            // getter
-            // @ts-ignore
-            return that.state[key];
-        } else {
-            // setter
-            that.setState({[key]: value} as any, cb2 ?? cb);
-        }
-    }) as any;
-}
+} => (function (value?: C["state"][K], cb2?: Callback): C["state"][K] {
+    return arguments.length === 0 ?
+        // @ts-ignore
+        state(that)[key]
+        :
+        setState(that, {[key]: value} as any, cb2 ?? cb)
+});
 
 type GetterSetter<T> = (v?: T, cb?: () => void) => T;
 export const stateGS: (<T>(that: React.Component) => GetterSetter<T>) = (that) => {