@xqmsg/ui-core 0.24.6 → 0.24.8

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.24.6",
+  "version": "0.24.8",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/input/StackedMultiSelect/index.tsx

@@ -74,7 +74,10 @@ const StackedMultiSelect = React.forwardRef<
       }
     }, [boundingClientRect]);
 
-    useOnClickOutside(dropdownRef, () => setIsFocussed(false));
+    useOnClickOutside(dropdownRef, () => {
+      setSearchValue('');
+      setIsFocussed(false);
+    });
 
     // gets latest watched form value (common delimited) from RHF state and creates a list
     useEffect(() => {
@@ -336,7 +339,6 @@ const StackedMultiSelect = React.forwardRef<
             width="0"
             autoComplete="off"
             type="text"
-            ref={inputRef}
             tabIndex={-1}
             _focus={{ boxShadow: 'none !important' }}
           />
@@ -354,6 +356,7 @@ const StackedMultiSelect = React.forwardRef<
             loading={loadingOptions}
           >
             <Input
+              ref={inputRef}
               value={searchValue}
               onChange={handleInput}
               disabled={loadingOptions}

package/src/components/input/StackedPilledInput/index.tsx

@@ -308,7 +308,7 @@ const StackedPilledInput = React.forwardRef<
               },
             }}
             ref={scrollRef}
-            zIndex={100}
+            zIndex={99}
             onKeyDown={onHandleKeyDown}
           >
             {lastestFormValueToArray.length

package/src/components/input/StackedSelect/index.tsx

@@ -219,6 +219,7 @@ const StackedSelect = React.forwardRef<HTMLInputElement, StackedSelectProps>(
             autoComplete="off"
             onChange={handleInput}
             onKeyDown={handleOnKeyDown}
+            disabled={disabled}
           />
           <InputRightElement
             cursor={disabled ? 'not-allowed' : 'pointer'}

package/src/components/input/index.tsx

@@ -93,6 +93,10 @@ export function Input<T extends FieldValues>({
     ref: RefCallBack,
     value: string
   ) {
+    if (inputType === 'text') {
+      console.log(errorText);
+      console.log(isInvalid);
+    }
     switch (inputType) {
       case 'text':
         return (
@@ -115,6 +119,8 @@ export function Input<T extends FieldValues>({
             value={value}
             variant={variant}
             label={label as string}
+            setError={setError as UseFormSetError<FieldValues>}
+            clearErrors={clearErrors as UseFormClearErrors<FieldValues>}
           />
         );
       case 'radio':
@@ -145,6 +151,8 @@ export function Input<T extends FieldValues>({
             onBlur={onBlur}
             setValue={setValue as UseFormSetValue<FieldValues>}
             control={control as Control<FieldValues, any>}
+            setError={setError as UseFormSetError<FieldValues>}
+            clearErrors={clearErrors as UseFormClearErrors<FieldValues>}
             ref={ref}
             disabled={disabled}
             value={value}
@@ -296,6 +304,7 @@ export function Input<T extends FieldValues>({
           )}
           {isInvalid && <FormErrorMessage>{errorText}</FormErrorMessage>}
           {helperText && <FormHelperText>{helperText}</FormHelperText>}
+          {errorText} {isInvalid?.toString()}
         </FormControl>
       )}
     />