@via-profit/ui-kit 0.1.0-rc.50 → 0.1.0-rc.51

package/Autocomplete/AutocompleteContainer.d.ts

@@ -42,11 +42,39 @@ export interface AutocompleteProps<T, Multiple extends boolean | undefined = und
      * Field placeholder
      */
     readonly placeholder?: string;
+    /**
+     * If is true then the asterisk will be displayed in label\
+     * If is ReactNode then ReactNode will be displayed in label
+     */
+    readonly requiredAsterisk?: boolean | React.ReactNode;
+    /**
+     * If true then TextField will be filled in full width on horizontal
+     */
+    readonly fullWidth?: boolean;
+    /**
+     * Native <input> element reference
+     */
+    readonly inputRef?: React.MutableRefObject<HTMLInputElement | null> | React.RefCallback<HTMLInputElement>;
+    /**
+     * End icon component
+     */
+    readonly endIcon?: React.ReactElement;
+    /**
+     * Start icon component
+     */
+    readonly startIcon?: React.ReactElement;
     /**
      * Field label text or element
      */
     readonly label?: TextFieldProps['label'];
+    /**
+     * If true then `errorText` value will be displayed under the TextField element
+     */
     readonly error?: TextFieldProps['error'];
+    /**
+     * Text or ReactNode to show in error element\
+     * Will be displaed only if `error` property is tru
+     */
     readonly errorText?: TextFieldProps['errorText'];
     readonly filterItems?: FilterItems<T>;
     readonly onChange?: OnChange<T, Multiple>;

package/Autocomplete/AutocompleteContainer.js

@@ -34,9 +34,9 @@ const Spinner_1 = __importDefault(require("../LoadingIndicator/Spinner"));
 const IconClear_1 = __importDefault(require("./IconClear"));
 const context_1 = __importStar(require("./context"));
 const Autocomplete = react_1.default.forwardRef((props, ref) => {
-    const { items, value, multiple, isOpen = false, isLoading = false, clearIfNotSelected = true, anchorPos = 'auto-start-end', placeholder, label, error, errorText, filterItems, children, onChange, selectedItemToString, onInputChange, getOptionSelected, onRequestOpen = () => undefined, onRequestClose = () => undefined, } = props;
+    const { items, value, multiple, isOpen = false, isLoading = false, clearIfNotSelected = true, anchorPos = 'auto-start-end', requiredAsterisk, startIcon, fullWidth, placeholder, label, error, errorText, inputRef, filterItems, children, onChange, selectedItemToString, onInputChange, getOptionSelected, onRequestOpen = () => undefined, onRequestClose = () => undefined, } = props;
     const menuRef = react_1.default.useRef(null);
-    const inputRef = react_1.default.useRef(null);
+    const fieldInputRef = react_1.default.useRef(null);
     const isFocusedRef = react_1.default.useRef(false);
     const { state, dispatch } = (0, context_1.default)();
     const { currentOpen, filteredItems, inputValue, currentValue, anchorElement, currentLoading } = state;
@@ -51,7 +51,7 @@ const Autocomplete = react_1.default.forwardRef((props, ref) => {
         }));
         setTimeout(() => {
             var _a;
-            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            (_a = fieldInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
         }, 15);
     }, [dispatch, onChange, items, multiple]);
     /**
@@ -144,11 +144,19 @@ const Autocomplete = react_1.default.forwardRef((props, ref) => {
         dispatch((0, context_1.actionSetPartial)({ currentOpen: isOpen, currentLoading: isLoading, filteredItems: items }));
     }, [isOpen, isLoading, items, dispatch]);
     return (react_1.default.createElement("div", null,
-        react_1.default.useMemo(() => (react_1.default.createElement(TextField_1.default, { placeholder: placeholder, label: label, error: error, errorText: errorText, endIcon: react_1.default.createElement(Button_1.default, { iconOnly: true, type: "button", onClick: () => (currentLoading ? 'undefined' : clear()) }, currentLoading ? react_1.default.createElement(Spinner_1.default, null) : react_1.default.createElement(IconClear_1.default, null)), onKeyDown: inputKeydownEvent, ref: el => {
+        react_1.default.useMemo(() => (react_1.default.createElement(TextField_1.default, { placeholder: placeholder, label: label, error: error, requiredAsterisk: requiredAsterisk, errorText: errorText, fullWidth: fullWidth, startIcon: startIcon, endIcon: react_1.default.createElement(Button_1.default, { iconOnly: true, type: "button", onClick: () => (currentLoading ? 'undefined' : clear()) }, currentLoading ? react_1.default.createElement(Spinner_1.default, null) : react_1.default.createElement(IconClear_1.default, null)), onKeyDown: inputKeydownEvent, ref: el => {
                 if (anchorElement !== el) {
                     dispatch((0, context_1.actionSetPartial)({ anchorElement: el }));
                 }
-            }, inputRef: inputRef, value: inputValue, onBlur: () => {
+            }, inputRef: el => {
+                fieldInputRef.current = el;
+                if (typeof inputRef === 'function') {
+                    inputRef(el);
+                }
+                if (inputRef && typeof inputRef === 'object') {
+                    inputRef.current = el;
+                }
+            }, value: inputValue, onBlur: () => {
                 isFocusedRef.current = false;
                 if (clearIfNotSelected) {
                     dispatch((0, context_1.actionSetPartial)({
@@ -182,16 +190,20 @@ const Autocomplete = react_1.default.forwardRef((props, ref) => {
             } })), [
             placeholder,
             label,
-            multiple,
             error,
+            requiredAsterisk,
             errorText,
+            fullWidth,
+            startIcon,
             currentLoading,
             inputKeydownEvent,
             inputValue,
             clear,
             anchorElement,
             dispatch,
+            inputRef,
             clearIfNotSelected,
+            multiple,
             value,
             selectedItemToString,
             onRequestOpen,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@via-profit/ui-kit",
-  "version": "0.1.0-rc.50",
+  "version": "0.1.0-rc.51",
   "description": "UI Kit",
   "repository": {
     "type": "git",