@webiny/ui 5.40.0-beta.2 → 5.40.0-beta.3

package/AutoComplete/AutoComplete.js

@@ -9,9 +9,8 @@ var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/obje
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _downshift = _interopRequireDefault(require("downshift"));
@@ -27,11 +26,12 @@ var _reactSpinnerMaterial = _interopRequireDefault(require("react-spinner-materi
 var _emotion = require("emotion");
 var _excluded = ["className", "options", "onChange", "value", "onInput", "validation", "placement"],
   _excluded2 = ["getInputProps", "openMenu"];
-var menuStyles = /*#__PURE__*/(0, _emotion.css)({
+var _AutoComplete;
+var menuStyles = (0, _emotion.css)({
   top: "unset !important",
   bottom: 75
-}, "label:menuStyles;");
-var listStyles = /*#__PURE__*/(0, _emotion.css)({
+});
+var listStyles = (0, _emotion.css)({
   "&.autocomplete__options-list": {
     listStyle: "none",
     paddingLeft: 0,
@@ -39,13 +39,12 @@ var listStyles = /*#__PURE__*/(0, _emotion.css)({
       margin: 0
     }
   }
-}, "label:listStyles;");
-var Placement = /*#__PURE__*/function (Placement) {
+});
+var Placement = exports.Placement = /*#__PURE__*/function (Placement) {
   Placement["top"] = "top";
   Placement["bottom"] = "bottom";
   return Placement;
 }({});
-exports.Placement = Placement;
 var Spinner = function Spinner() {
   return /*#__PURE__*/_react.default.createElement(_reactSpinnerMaterial.default, {
     size: 24,
@@ -65,26 +64,25 @@ var OptionsList = function OptionsList(_ref) {
     className: (0, _classnames.default)("autocomplete__options-list", listStyles)
   }, getMenuProps()), children));
 };
-var AutoComplete = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(AutoComplete, _React$Component);
-  var _super = (0, _createSuper2.default)(AutoComplete);
+var AutoComplete = exports.AutoComplete = /*#__PURE__*/function (_React$Component) {
   function AutoComplete() {
     var _this;
     (0, _classCallCheck2.default)(this, AutoComplete);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+    _this = (0, _callSuper2.default)(this, AutoComplete, [].concat(args));
+    (0, _defineProperty2.default)(_this, "state", {
       inputValue: ""
     });
     /**
      * Helps us trigger some of the downshift's methods (eg. clearSelection) and helps us to avoid adding state.
      */
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "downshift", /*#__PURE__*/_react.default.createRef());
+    (0, _defineProperty2.default)(_this, "downshift", /*#__PURE__*/_react.default.createRef());
     return _this;
   }
-  (0, _createClass2.default)(AutoComplete, [{
+  (0, _inherits2.default)(AutoComplete, _React$Component);
+  return (0, _createClass2.default)(AutoComplete, [{
     key: "componentDidUpdate",
     value: function componentDidUpdate(previousProps) {
       var _this2 = this;
@@ -159,11 +157,10 @@ var AutoComplete = /*#__PURE__*/function (_React$Component) {
         placement: placement,
         getMenuProps: getMenuProps
       }, filtered.map(function (item, index) {
-        var _itemClassNames;
         var itemValue = (0, _utils.getOptionValue)(item, _this3.props);
 
         // Base classes.
-        var itemClassNames = (_itemClassNames = {}, (0, _defineProperty2.default)(_itemClassNames, _styles.suggestionList, true), (0, _defineProperty2.default)(_itemClassNames, "highlighted", highlightedIndex === index), (0, _defineProperty2.default)(_itemClassNames, "selected", false), _itemClassNames);
+        var itemClassNames = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _styles.suggestionList, true), "highlighted", highlightedIndex === index), "selected", false);
 
         // Add "selected" class if the item is selected.
         if (selectedItem && (0, _utils.getOptionValue)(selectedItem, _this3.props) === itemValue) {
@@ -283,9 +280,8 @@ var AutoComplete = /*#__PURE__*/function (_React$Component) {
       }));
     }
   }]);
-  return AutoComplete;
 }(_react.default.Component);
-exports.AutoComplete = AutoComplete;
+_AutoComplete = AutoComplete;
 (0, _defineProperty2.default)(AutoComplete, "defaultProps", {
   valueProp: "id",
   textProp: "name",

package/AutoComplete/AutoComplete.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_downshift","_Input","_classnames","_Elevation","_Typography","_keycode","_styles","_utils","_isEqual","_reactSpinnerMaterial","_emotion","_excluded","_excluded2","menuStyles","css","top","bottom","listStyles","listStyle","paddingLeft","margin","Placement","exports","Spinner","default","createElement","size","spinnerColor","spinnerWidth","visible","OptionsList","_ref","placement","getMenuProps","children","Elevation","z","className","classNames","_defineProperty2","Object","assign","AutoComplete","_React$Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_assertThisInitialized2","inputValue","React","createRef","_createClass2","key","value","componentDidUpdate","previousProps","_this2","_this$props","props","options","previousValue","isEqual","item","find","option","getOptionValue","downshift","current","selectItem","renderOptions","_ref2","_this3","isOpen","highlightedIndex","selectedItem","getItemProps","state","Typography","use","renderItem","filtered","filter","aliases","findInAliases","getOptionText","toLowerCase","includes","noResultFound","map","index","_itemClassNames","itemValue","itemClassNames","suggestionList","selected","render","_this4","_this$props2","onChange","onInput","_this$props2$validati","validation","isValid","message","otherInputProps","_objectWithoutProperties2","downshiftProps","autoCompleteStyle","itemToString","defaultSelectedItem","selection","setState","_objectSpread2","ref","_ref3","getInputProps","openMenu","rest","Input","trailingIcon","loading","rawOnChange","ev","onBlur","onFocus","onKeyDown","keyCode","keycode","setTimeout","onKeyUp","target","currentTarget","disabled","readOnly","Component","valueProp","textProp"],"sources":["AutoComplete.tsx"],"sourcesContent":["import React from \"react\";\nimport Downshift, { ControllerStateAndHelpers, PropGetters } from \"downshift\";\nimport { Input } from \"~/Input\";\nimport classNames from \"classnames\";\nimport { Elevation } from \"~/Elevation\";\nimport { Typography } from \"~/Typography\";\nimport keycode from \"keycode\";\nimport { autoCompleteStyle, suggestionList } from \"./styles\";\nimport { AutoCompleteBaseProps } from \"./types\";\nimport { getOptionValue, getOptionText, findInAliases } from \"./utils\";\nimport isEqual from \"lodash/isEqual\";\nimport MaterialSpinner from \"react-spinner-material\";\nimport { css } from \"emotion\";\n\nconst menuStyles = css({\n    top: \"unset !important\",\n    bottom: 75\n});\n\nconst listStyles = css({\n    \"&.autocomplete__options-list\": {\n        listStyle: \"none\",\n        paddingLeft: 0,\n        \"& li\": {\n            margin: 0\n        }\n    }\n});\n\nexport enum Placement {\n    top = \"top\",\n    bottom = \"bottom\"\n}\n\nexport interface AutoCompleteProps extends Omit<AutoCompleteBaseProps, \"onChange\"> {\n    /* Placement position of dropdown menu, can be either `top` or `bottom`. */\n    placement?: Placement;\n\n    /* A callback that is executed each time a value is changed. */\n    onChange?: (value: any, selection?: any) => void;\n\n    /* If true, will show a loading spinner on the right side of the input. */\n    loading?: boolean;\n\n    /* A component that renders supporting UI in case of no result found. */\n    noResultFound?: React.ReactNode;\n\n    // Size - small, medium or large\n    size?: \"small\" | \"medium\" | \"large\";\n}\n\ninterface State {\n    inputValue: string;\n}\n\nconst Spinner = () => {\n    return (\n        <MaterialSpinner\n            size={24}\n            spinnerColor={\"var(--mdc-theme-primary)\"}\n            spinnerWidth={2}\n            visible\n        />\n    );\n};\n\ninterface RenderOptionsParams\n    extends Omit<ControllerStateAndHelpers<any>, \"getInputProps\" | \"openMenu\"> {\n    options: AutoCompleteProps[\"options\"];\n    placement?: Placement;\n}\n\ninterface OptionsListProps {\n    placement?: Placement;\n    getMenuProps: PropGetters<Record<string, any>>[\"getMenuProps\"];\n    children: React.ReactNode;\n}\n\nconst OptionsList = ({ placement, getMenuProps, children }: OptionsListProps) => {\n    return (\n        <Elevation\n            z={1}\n            className={classNames({\n                [menuStyles]: placement === Placement.top\n            })}\n        >\n            <ul\n                className={classNames(\"autocomplete__options-list\", listStyles)}\n                {...getMenuProps()}\n            >\n                {children}\n            </ul>\n        </Elevation>\n    );\n};\n\nclass AutoComplete extends React.Component<AutoCompleteProps, State> {\n    static defaultProps: Partial<AutoCompleteProps> = {\n        valueProp: \"id\",\n        textProp: \"name\",\n        options: [],\n        placement: Placement.bottom,\n        /**\n         * We cast this as AutoComplete because renderItem() is executed via .call() where AutoComplete instance is assigned as this.\n         */\n        renderItem(item: any) {\n            return (\n                <Typography use={\"body2\"}>\n                    {getOptionText(item, (this as unknown as AutoComplete).props)}\n                </Typography>\n            );\n        }\n    };\n\n    public override state: State = {\n        inputValue: \"\"\n    };\n\n    /**\n     * Helps us trigger some of the downshift's methods (eg. clearSelection) and helps us to avoid adding state.\n     */\n    downshift: any = React.createRef();\n\n    public override componentDidUpdate(previousProps: AutoCompleteProps) {\n        const { value, options } = this.props;\n        const { value: previousValue } = previousProps;\n\n        if (!isEqual(value, previousValue)) {\n            let item = null;\n\n            if (value) {\n                if (typeof value === \"object\") {\n                    item = value;\n                } else {\n                    item =\n                        options.find(option => {\n                            return value === getOptionValue(option, this.props);\n                        }) || null;\n                }\n            }\n\n            const { current: downshift } = this.downshift;\n            downshift && downshift.selectItem(item);\n        }\n    }\n\n    /**\n     * Renders options - based on user's input. It will try to match input text with available options.\n     */\n    private renderOptions({\n        options,\n        isOpen,\n        highlightedIndex,\n        selectedItem,\n        getMenuProps,\n        getItemProps,\n        placement\n    }: RenderOptionsParams) {\n        if (!isOpen) {\n            return null;\n        }\n        /**\n         * Suggest user to start typing when there are no options available to choose from.\n         */\n        if (!this.state.inputValue && !options.length) {\n            return (\n                <OptionsList placement={placement} getMenuProps={getMenuProps}>\n                    <li>\n                        <Typography use={\"body2\"}>Start typing to find entry</Typography>\n                    </li>\n                </OptionsList>\n            );\n        }\n\n        const { renderItem } = this.props;\n\n        const filtered = options.filter(item => {\n            // 2) At the end, we want to show only options that are matched by typed text.\n            if (!this.state.inputValue) {\n                return true;\n            }\n\n            if (item.aliases) {\n                return findInAliases(item, this.state.inputValue);\n            }\n\n            return getOptionText(item, this.props)\n                .toLowerCase()\n                .includes(this.state.inputValue.toLowerCase());\n        });\n\n        if (!filtered.length) {\n            return (\n                <OptionsList placement={placement} getMenuProps={getMenuProps}>\n                    <li>\n                        <Typography use={\"body2\"}>No results.</Typography>\n                        {this.props.noResultFound}\n                    </li>\n                </OptionsList>\n            );\n        }\n\n        return (\n            <OptionsList placement={placement} getMenuProps={getMenuProps}>\n                {filtered.map((item, index) => {\n                    const itemValue = getOptionValue(item, this.props);\n\n                    // Base classes.\n                    const itemClassNames = {\n                        [suggestionList]: true,\n                        highlighted: highlightedIndex === index,\n                        selected: false\n                    };\n\n                    // Add \"selected\" class if the item is selected.\n                    if (selectedItem && getOptionValue(selectedItem, this.props) === itemValue) {\n                        itemClassNames.selected = true;\n                    }\n\n                    // Render the item.\n                    return (\n                        <li\n                            key={itemValue}\n                            {...getItemProps({\n                                index,\n                                item,\n                                className: classNames(itemClassNames)\n                            })}\n                        >\n                            {renderItem.call(this, item, index)}\n                        </li>\n                    );\n                })}\n            </OptionsList>\n        );\n    }\n\n    public override render() {\n        const {\n            className,\n            options,\n            onChange,\n            value,\n            // valueProp,\n            // textProp,\n            onInput,\n            validation = {\n                isValid: null,\n                message: null\n            },\n            placement,\n            ...otherInputProps\n        } = this.props;\n\n        // Downshift related props.\n        const downshiftProps = {\n            className: autoCompleteStyle,\n            itemToString: (item: any) => getOptionText(item, this.props),\n            defaultSelectedItem: value,\n            onChange: (selection: string) => {\n                if (!selection || !onChange) {\n                    return;\n                }\n                onChange(getOptionValue(selection, this.props), selection);\n                this.setState(state => ({\n                    ...state,\n                    inputValue: \"\"\n                }));\n            }\n        };\n\n        return (\n            <div\n                className={classNames(\n                    autoCompleteStyle,\n                    this.props.size ? `webiny-ui-autocomplete--size-${this.props.size}` : null,\n                    className\n                )}\n            >\n                <Downshift {...downshiftProps} ref={this.downshift}>\n                    {({ getInputProps, openMenu, ...rest }) => (\n                        <div>\n                            <Input\n                                {...getInputProps({\n                                    // This prop is above `otherInputProps` since it can be overridden by the user.\n                                    trailingIcon: this.props.loading && <Spinner />,\n                                    ...otherInputProps,\n                                    // @ts-expect-error\n                                    size: this.props.size,\n                                    validation,\n                                    rawOnChange: true,\n                                    onChange: ev => ev,\n                                    onBlur: ev => ev,\n                                    onFocus: ev => {\n                                        openMenu();\n                                        otherInputProps.onFocus && otherInputProps.onFocus(ev);\n                                    },\n                                    onKeyDown: (ev: React.KeyboardEvent<HTMLInputElement>) => {\n                                        const keyCode: string = keycode(ev as unknown as Event);\n\n                                        if (keyCode === \"backspace\") {\n                                            setTimeout(() => {\n                                                if (onChange) {\n                                                    onChange(null);\n                                                    openMenu();\n                                                }\n                                            }, 50);\n                                        }\n                                    },\n                                    onKeyUp: (ev: React.KeyboardEvent<HTMLInputElement>) => {\n                                        const keyCode: string = keycode(ev as unknown as Event);\n\n                                        const target = ev.currentTarget;\n                                        const inputValue = target.value || \"\";\n\n                                        // If user pressed 'esc', 'enter' or similar...\n                                        if (\n                                            keyCode &&\n                                            keyCode.length > 1 &&\n                                            keyCode !== \"backspace\"\n                                        ) {\n                                            return;\n                                        }\n\n                                        // If values are the same, exit, do not update current search term.\n                                        if (inputValue === this.state.inputValue) {\n                                            return;\n                                        }\n\n                                        this.setState(\n                                            state => ({\n                                                ...state,\n                                                inputValue\n                                            }),\n                                            () => {\n                                                onInput && onInput(inputValue);\n                                            }\n                                        );\n                                    }\n                                })}\n                            />\n                            {!otherInputProps.disabled &&\n                                !otherInputProps.readOnly &&\n                                this.renderOptions({\n                                    ...rest,\n                                    options,\n                                    placement\n                                })}\n                        </div>\n                    )}\n                </Downshift>\n            </div>\n        );\n    }\n}\n\nexport { AutoComplete };\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_downshift","_Input","_classnames","_Elevation","_Typography","_keycode","_styles","_utils","_isEqual","_reactSpinnerMaterial","_emotion","_excluded","_excluded2","_AutoComplete","menuStyles","css","top","bottom","listStyles","listStyle","paddingLeft","margin","Placement","exports","Spinner","default","createElement","size","spinnerColor","spinnerWidth","visible","OptionsList","_ref","placement","getMenuProps","children","Elevation","z","className","classNames","_defineProperty2","Object","assign","AutoComplete","_React$Component","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","_callSuper2","concat","inputValue","React","createRef","_inherits2","_createClass2","key","value","componentDidUpdate","previousProps","_this2","_this$props","props","options","previousValue","isEqual","item","find","option","getOptionValue","downshift","current","selectItem","renderOptions","_ref2","_this3","isOpen","highlightedIndex","selectedItem","getItemProps","state","Typography","use","renderItem","filtered","filter","aliases","findInAliases","getOptionText","toLowerCase","includes","noResultFound","map","index","itemValue","itemClassNames","suggestionList","selected","call","render","_this4","_this$props2","onChange","onInput","_this$props2$validati","validation","isValid","message","otherInputProps","_objectWithoutProperties2","downshiftProps","autoCompleteStyle","itemToString","defaultSelectedItem","selection","setState","_objectSpread2","ref","_ref3","getInputProps","openMenu","rest","Input","trailingIcon","loading","rawOnChange","ev","onBlur","onFocus","onKeyDown","keyCode","keycode","setTimeout","onKeyUp","target","currentTarget","disabled","readOnly","Component","valueProp","textProp"],"sources":["AutoComplete.tsx"],"sourcesContent":["import React from \"react\";\nimport Downshift, { ControllerStateAndHelpers, PropGetters } from \"downshift\";\nimport { Input } from \"~/Input\";\nimport classNames from \"classnames\";\nimport { Elevation } from \"~/Elevation\";\nimport { Typography } from \"~/Typography\";\nimport keycode from \"keycode\";\nimport { autoCompleteStyle, suggestionList } from \"./styles\";\nimport { AutoCompleteBaseProps } from \"./types\";\nimport { getOptionValue, getOptionText, findInAliases } from \"./utils\";\nimport isEqual from \"lodash/isEqual\";\nimport MaterialSpinner from \"react-spinner-material\";\nimport { css } from \"emotion\";\n\nconst menuStyles = css({\n    top: \"unset !important\",\n    bottom: 75\n});\n\nconst listStyles = css({\n    \"&.autocomplete__options-list\": {\n        listStyle: \"none\",\n        paddingLeft: 0,\n        \"& li\": {\n            margin: 0\n        }\n    }\n});\n\nexport enum Placement {\n    top = \"top\",\n    bottom = \"bottom\"\n}\n\nexport interface AutoCompleteProps extends Omit<AutoCompleteBaseProps, \"onChange\"> {\n    /* Placement position of dropdown menu, can be either `top` or `bottom`. */\n    placement?: Placement;\n\n    /* A callback that is executed each time a value is changed. */\n    onChange?: (value: any, selection?: any) => void;\n\n    /* If true, will show a loading spinner on the right side of the input. */\n    loading?: boolean;\n\n    /* A component that renders supporting UI in case of no result found. */\n    noResultFound?: React.ReactNode;\n\n    // Size - small, medium or large\n    size?: \"small\" | \"medium\" | \"large\";\n}\n\ninterface State {\n    inputValue: string;\n}\n\nconst Spinner = () => {\n    return (\n        <MaterialSpinner\n            size={24}\n            spinnerColor={\"var(--mdc-theme-primary)\"}\n            spinnerWidth={2}\n            visible\n        />\n    );\n};\n\ninterface RenderOptionsParams\n    extends Omit<ControllerStateAndHelpers<any>, \"getInputProps\" | \"openMenu\"> {\n    options: AutoCompleteProps[\"options\"];\n    placement?: Placement;\n}\n\ninterface OptionsListProps {\n    placement?: Placement;\n    getMenuProps: PropGetters<Record<string, any>>[\"getMenuProps\"];\n    children: React.ReactNode;\n}\n\nconst OptionsList = ({ placement, getMenuProps, children }: OptionsListProps) => {\n    return (\n        <Elevation\n            z={1}\n            className={classNames({\n                [menuStyles]: placement === Placement.top\n            })}\n        >\n            <ul\n                className={classNames(\"autocomplete__options-list\", listStyles)}\n                {...getMenuProps()}\n            >\n                {children}\n            </ul>\n        </Elevation>\n    );\n};\n\nclass AutoComplete extends React.Component<AutoCompleteProps, State> {\n    static defaultProps: Partial<AutoCompleteProps> = {\n        valueProp: \"id\",\n        textProp: \"name\",\n        options: [],\n        placement: Placement.bottom,\n        /**\n         * We cast this as AutoComplete because renderItem() is executed via .call() where AutoComplete instance is assigned as this.\n         */\n        renderItem(item: any) {\n            return (\n                <Typography use={\"body2\"}>\n                    {getOptionText(item, (this as unknown as AutoComplete).props)}\n                </Typography>\n            );\n        }\n    };\n\n    public override state: State = {\n        inputValue: \"\"\n    };\n\n    /**\n     * Helps us trigger some of the downshift's methods (eg. clearSelection) and helps us to avoid adding state.\n     */\n    downshift: any = React.createRef();\n\n    public override componentDidUpdate(previousProps: AutoCompleteProps) {\n        const { value, options } = this.props;\n        const { value: previousValue } = previousProps;\n\n        if (!isEqual(value, previousValue)) {\n            let item = null;\n\n            if (value) {\n                if (typeof value === \"object\") {\n                    item = value;\n                } else {\n                    item =\n                        options.find(option => {\n                            return value === getOptionValue(option, this.props);\n                        }) || null;\n                }\n            }\n\n            const { current: downshift } = this.downshift;\n            downshift && downshift.selectItem(item);\n        }\n    }\n\n    /**\n     * Renders options - based on user's input. It will try to match input text with available options.\n     */\n    private renderOptions({\n        options,\n        isOpen,\n        highlightedIndex,\n        selectedItem,\n        getMenuProps,\n        getItemProps,\n        placement\n    }: RenderOptionsParams) {\n        if (!isOpen) {\n            return null;\n        }\n        /**\n         * Suggest user to start typing when there are no options available to choose from.\n         */\n        if (!this.state.inputValue && !options.length) {\n            return (\n                <OptionsList placement={placement} getMenuProps={getMenuProps}>\n                    <li>\n                        <Typography use={\"body2\"}>Start typing to find entry</Typography>\n                    </li>\n                </OptionsList>\n            );\n        }\n\n        const { renderItem } = this.props;\n\n        const filtered = options.filter(item => {\n            // 2) At the end, we want to show only options that are matched by typed text.\n            if (!this.state.inputValue) {\n                return true;\n            }\n\n            if (item.aliases) {\n                return findInAliases(item, this.state.inputValue);\n            }\n\n            return getOptionText(item, this.props)\n                .toLowerCase()\n                .includes(this.state.inputValue.toLowerCase());\n        });\n\n        if (!filtered.length) {\n            return (\n                <OptionsList placement={placement} getMenuProps={getMenuProps}>\n                    <li>\n                        <Typography use={\"body2\"}>No results.</Typography>\n                        {this.props.noResultFound}\n                    </li>\n                </OptionsList>\n            );\n        }\n\n        return (\n            <OptionsList placement={placement} getMenuProps={getMenuProps}>\n                {filtered.map((item, index) => {\n                    const itemValue = getOptionValue(item, this.props);\n\n                    // Base classes.\n                    const itemClassNames = {\n                        [suggestionList]: true,\n                        highlighted: highlightedIndex === index,\n                        selected: false\n                    };\n\n                    // Add \"selected\" class if the item is selected.\n                    if (selectedItem && getOptionValue(selectedItem, this.props) === itemValue) {\n                        itemClassNames.selected = true;\n                    }\n\n                    // Render the item.\n                    return (\n                        <li\n                            key={itemValue}\n                            {...getItemProps({\n                                index,\n                                item,\n                                className: classNames(itemClassNames)\n                            })}\n                        >\n                            {renderItem.call(this, item, index)}\n                        </li>\n                    );\n                })}\n            </OptionsList>\n        );\n    }\n\n    public override render() {\n        const {\n            className,\n            options,\n            onChange,\n            value,\n            // valueProp,\n            // textProp,\n            onInput,\n            validation = {\n                isValid: null,\n                message: null\n            },\n            placement,\n            ...otherInputProps\n        } = this.props;\n\n        // Downshift related props.\n        const downshiftProps = {\n            className: autoCompleteStyle,\n            itemToString: (item: any) => getOptionText(item, this.props),\n            defaultSelectedItem: value,\n            onChange: (selection: string) => {\n                if (!selection || !onChange) {\n                    return;\n                }\n                onChange(getOptionValue(selection, this.props), selection);\n                this.setState(state => ({\n                    ...state,\n                    inputValue: \"\"\n                }));\n            }\n        };\n\n        return (\n            <div\n                className={classNames(\n                    autoCompleteStyle,\n                    this.props.size ? `webiny-ui-autocomplete--size-${this.props.size}` : null,\n                    className\n                )}\n            >\n                <Downshift {...downshiftProps} ref={this.downshift}>\n                    {({ getInputProps, openMenu, ...rest }) => (\n                        <div>\n                            <Input\n                                {...getInputProps({\n                                    // This prop is above `otherInputProps` since it can be overridden by the user.\n                                    trailingIcon: this.props.loading && <Spinner />,\n                                    ...otherInputProps,\n                                    // @ts-expect-error\n                                    size: this.props.size,\n                                    validation,\n                                    rawOnChange: true,\n                                    onChange: ev => ev,\n                                    onBlur: ev => ev,\n                                    onFocus: ev => {\n                                        openMenu();\n                                        otherInputProps.onFocus && otherInputProps.onFocus(ev);\n                                    },\n                                    onKeyDown: (ev: React.KeyboardEvent<HTMLInputElement>) => {\n                                        const keyCode: string = keycode(ev as unknown as Event);\n\n                                        if (keyCode === \"backspace\") {\n                                            setTimeout(() => {\n                                                if (onChange) {\n                                                    onChange(null);\n                                                    openMenu();\n                                                }\n                                            }, 50);\n                                        }\n                                    },\n                                    onKeyUp: (ev: React.KeyboardEvent<HTMLInputElement>) => {\n                                        const keyCode: string = keycode(ev as unknown as Event);\n\n                                        const target = ev.currentTarget;\n                                        const inputValue = target.value || \"\";\n\n                                        // If user pressed 'esc', 'enter' or similar...\n                                        if (\n                                            keyCode &&\n                                            keyCode.length > 1 &&\n                                            keyCode !== \"backspace\"\n                                        ) {\n                                            return;\n                                        }\n\n                                        // If values are the same, exit, do not update current search term.\n                                        if (inputValue === this.state.inputValue) {\n                                            return;\n                                        }\n\n                                        this.setState(\n                                            state => ({\n                                                ...state,\n                                                inputValue\n                                            }),\n                                            () => {\n                                                onInput && onInput(inputValue);\n                                            }\n                                        );\n                                    }\n                                })}\n                            />\n                            {!otherInputProps.disabled &&\n                                !otherInputProps.readOnly &&\n                                this.renderOptions({\n                                    ...rest,\n                                    options,\n                                    placement\n                                })}\n                        </div>\n                    )}\n                </Downshift>\n            </div>\n        );\n    }\n}\n\nexport { AutoComplete };\n"],"mappings":"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","ignoreList":[]}

package/AutoComplete/MultiAutoComplete.d.ts

@@ -82,7 +82,7 @@ export declare class MultiAutoComplete extends React.Component<MultiAutoComplete
      * Once added, items can also be removed by clicking on the ✕ icon. This is the method that is responsible for
      * rendering selected items (we are using already existing "Chips" component).
      */
-    renderMultipleSelection(): React.ReactNode;
-    render(): JSX.Element;
+    renderMultipleSelection(): string | number | boolean | Iterable<React.ReactNode> | React.JSX.Element | null | undefined;
+    render(): React.JSX.Element;
 }
 export {};

package/AutoComplete/MultiAutoComplete.js

@@ -10,9 +10,8 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _downshift = _interopRequireDefault(require("downshift"));
@@ -36,41 +35,42 @@ var _reorder_black_24dp = require("./icons/reorder_black_24dp.svg");
 var _emotion = require("emotion");
 var _excluded = ["unique", "value", "onChange", "onInput", "validation", "useMultipleSelectionList", "description"],
   _excluded2 = ["getInputProps", "openMenu"];
-var listItemMetaClassName = /*#__PURE__*/(0, _emotion.css)({
+var _MultiAutoComplete;
+var listItemMetaClassName = (0, _emotion.css)({
   display: "table"
-}, "label:listItemMetaClassName;");
-var iconButtonClassName = /*#__PURE__*/(0, _emotion.css)({
+});
+var iconButtonClassName = (0, _emotion.css)({
   display: "table-cell !important"
-}, "label:iconButtonClassName;");
+});
 var style = {
   pagination: {
-    bar: /*#__PURE__*/(0, _emotion.css)({
+    bar: (0, _emotion.css)({
       display: "flex",
       justifyContent: "space-between",
       alignItems: "center",
       borderBottom: "2px solid #fa5723",
       padding: "6px 0"
-    }, "label:bar;"),
-    pages: /*#__PURE__*/(0, _emotion.css)({
+    }),
+    pages: (0, _emotion.css)({
       display: "flex",
       justifyContent: "space-between",
       alignItems: "center"
-    }, "label:pages;"),
-    searchInput: /*#__PURE__*/(0, _emotion.css)({
+    }),
+    searchInput: (0, _emotion.css)({
       height: "42px !important"
-    }, "label:searchInput;"),
-    list: /*#__PURE__*/(0, _emotion.css)({
+    }),
+    list: (0, _emotion.css)({
       padding: "0 0 5px 0 !important",
-      ".mdc-list-item": {
+      ".mdc-deprecated-list-item": {
         borderBottom: "1px solid var(--mdc-theme-on-background)"
       }
-    }, "label:list;"),
-    secondaryText: /*#__PURE__*/(0, _emotion.css)({
+    }),
+    secondaryText: (0, _emotion.css)({
       color: "var(--mdc-theme-text-secondary-on-background)"
-    }, "label:secondaryText;")
+    })
   }
 };
-var listStyles = /*#__PURE__*/(0, _emotion.css)({
+var listStyles = (0, _emotion.css)({
   "&.multi-autocomplete__options-list": {
     listStyle: "none",
     paddingLeft: 0,
@@ -78,7 +78,7 @@ var listStyles = /*#__PURE__*/(0, _emotion.css)({
       margin: 0
     }
   }
-}, "label:listStyles;");
+});
 var Spinner = function Spinner() {
   return /*#__PURE__*/_react.default.createElement(_reactSpinnerMaterial.default, {
     size: 24,
@@ -96,17 +96,15 @@ var OptionsList = function OptionsList(_ref) {
     className: (0, _classnames.default)("multi-autocomplete__options-list", listStyles)
   }, getMenuProps()), children));
 };
-var MultiAutoComplete = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(MultiAutoComplete, _React$Component);
-  var _super = (0, _createSuper2.default)(MultiAutoComplete);
+var MultiAutoComplete = exports.MultiAutoComplete = /*#__PURE__*/function (_React$Component) {
   function MultiAutoComplete() {
     var _this;
     (0, _classCallCheck2.default)(this, MultiAutoComplete);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+    _this = (0, _callSuper2.default)(this, MultiAutoComplete, [].concat(args));
+    (0, _defineProperty2.default)(_this, "state", {
       inputValue: "",
       multipleSelectionPage: 0,
       multipleSelectionSearch: "",
@@ -116,24 +114,25 @@ var MultiAutoComplete = /*#__PURE__*/function (_React$Component) {
     /**
      * Helps us trigger some of the downshift's methods (eg. clearSelection) and helps us to avoid adding state.
      */
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "downshift", /*#__PURE__*/_react.default.createRef());
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "assignedValueAfterClearing", {
+    (0, _defineProperty2.default)(_this, "downshift", /*#__PURE__*/_react.default.createRef());
+    (0, _defineProperty2.default)(_this, "assignedValueAfterClearing", {
       set: false,
       selection: null
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setMultipleSelectionPage", function (multipleSelectionPage) {
+    (0, _defineProperty2.default)(_this, "setMultipleSelectionPage", function (multipleSelectionPage) {
       _this.setState({
         multipleSelectionPage: multipleSelectionPage
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setMultipleSelectionSearch", function (multipleSelectionSearch) {
+    (0, _defineProperty2.default)(_this, "setMultipleSelectionSearch", function (multipleSelectionSearch) {
       _this.setState({
         multipleSelectionSearch: multipleSelectionSearch
       });
     });
     return _this;
   }
-  (0, _createClass2.default)(MultiAutoComplete, [{
+  (0, _inherits2.default)(MultiAutoComplete, _React$Component);
+  return (0, _createClass2.default)(MultiAutoComplete, [{
     key: "getOptions",
     value: function getOptions() {
       var _this2 = this;
@@ -227,11 +226,10 @@ var MultiAutoComplete = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/_react.default.createElement("ul", Object.assign({
         className: (0, _classnames.default)("multi-autocomplete__options-list", listStyles)
       }, getMenuProps()), options.map(function (item, index) {
-        var _itemClassNames;
         var itemValue = (0, _utils.getOptionValue)(item, _this3.props);
 
         // Base classes.
-        var itemClassNames = (_itemClassNames = {}, (0, _defineProperty2.default)(_itemClassNames, _styles.suggestionList, true), (0, _defineProperty2.default)(_itemClassNames, "highlighted", highlightedIndex === index), (0, _defineProperty2.default)(_itemClassNames, "selected", false), _itemClassNames);
+        var itemClassNames = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _styles.suggestionList, true), "highlighted", highlightedIndex === index), "selected", false);
 
         // Render the item.
         return /*#__PURE__*/_react.default.createElement("li", Object.assign({
@@ -545,9 +543,8 @@ var MultiAutoComplete = /*#__PURE__*/function (_React$Component) {
       }));
     }
   }]);
-  return MultiAutoComplete;
 }(_react.default.Component);
-exports.MultiAutoComplete = MultiAutoComplete;
+_MultiAutoComplete = MultiAutoComplete;
 (0, _defineProperty2.default)(MultiAutoComplete, "defaultProps", {
   valueProp: "id",
   textProp: "name",