@cube-dev/ui-kit 0.0.0-canary-532466c → 0.0.0-canary-a6ebdac

package/es/components/forms/Form/index.js

@@ -1,14 +1,16 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
+import { Submit } from './Submit';
 import { Field } from './Field';
 import { useForm } from './useForm';
 import { useFormProps, FormContext, Form as _Form } from './Form';
-const Form = Object.assign(_Form, { Item: Field, useForm });
-export { useFormProps, Form, Field, useForm, FormContext };
+const Form = Object.assign(_Form, { Item: Field, useForm, Submit });
+export { useFormProps, Form, Field, useForm, FormContext, Submit };
+export * from './Field';
 
         

package/es/components/forms/Form/types.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/forms/Form/useForm.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
@@ -212,6 +212,7 @@ export class CubeFormInstance {
         if (!skipRender) {
             this.forceReRender();
         }
+        return this.fields[name];
     }
     removeField(name, skipRender) {
         if (this.fields[name]) {

package/es/components/forms/Form/validation.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/forms/Input/Input.js

@@ -1,20 +1,16 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import { TextInput } from '../TextInput/TextInput';
+import { TextInput } from '../TextInput';
 import { PasswordInput } from '../PasswordInput/PasswordInput';
 import { NumberInput } from '../NumberInput/NumberInput';
 import { FileInput } from '../FileInput/FileInput';
 import { TextArea } from '../TextArea/TextArea';
-export const Input = Object.assign(forwardRef(function Input(props, ref) {
-    return _jsx(TextInput, { ref: ref, ...props }, void 0);
-}), {
+export const Input = Object.assign(TextInput, {
     Text: TextInput,
     Password: PasswordInput,
     Number: NumberInput,

package/es/components/forms/Input/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/forms/Label.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/forms/NumberInput/NumberInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
@@ -10,9 +10,9 @@ import { forwardRef, useRef } from 'react';
 import { useLocale } from '@react-aria/i18n';
 import { useNumberFieldState } from '@react-stately/numberfield';
 import { useNumberField } from '@react-aria/numberfield';
-import { useFormProps } from '../Form';
+import { useFieldProps } from '../Form';
 import { useProviderProps } from '../../../provider';
-import { TextInputBase, } from '../TextInput/TextInputBase';
+import { TextInputBase } from '../TextInput';
 import { tasty } from '../../../tasty';
 import { castNullableNumberValue, } from '../../../utils/react/nullableValue';
 import { StepButton } from './StepButton';
@@ -25,23 +25,25 @@ const StepperContainer = tasty({
         placeSelf: 'stretch',
     },
 });
-function NumberInput(props, ref) {
+/**
+ * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.
+ */
+export const NumberInput = forwardRef(function NumberInput(props, ref) {
     props = castNullableNumberValue(props);
     props = useProviderProps(props);
-    props = useFormProps(props);
-    let { hideStepper, suffix, suffixPosition = 'after', value, defaultValue, onChange, ...otherProps } = props;
+    props = useFieldProps(props, {
+        valuePropsMapper: ({ value, onChange }) => ({
+            value: value ?? null,
+            onChange,
+        }),
+    });
+    let { hideStepper, value, defaultValue, onChange, ...otherProps } = props;
     let showStepper = !hideStepper;
     let { locale } = useLocale();
     let state = useNumberFieldState({ ...props, locale });
     let inputRef = useRef(null);
     let { groupProps, labelProps, inputProps, incrementButtonProps, decrementButtonProps, } = useNumberField(props, state, inputRef);
-    return (_jsx(TextInputBase, { ...otherProps, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: suffixPosition, suffix: showStepper ? (_jsxs(StepperContainer, { children: [_jsx(StepButton, { isDisabled: props.isDisabled, direction: "up", ...incrementButtonProps, size: otherProps.size }, void 0), _jsx(StepButton, { isDisabled: props.isDisabled, direction: "down", ...decrementButtonProps, size: otherProps.size }, void 0)] }, void 0)) : (suffix) }, void 0));
-}
-/**
- * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.
- */
-const _NumberInput = forwardRef(NumberInput);
-_NumberInput.cubeInputType = 'Number';
-export { _NumberInput as NumberInput };
+    return (_jsx(TextInputBase, { ...otherProps, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: "after", suffix: showStepper ? (_jsxs(StepperContainer, { children: [_jsx(StepButton, { isDisabled: props.isDisabled, direction: "up", ...incrementButtonProps, size: otherProps.size }, void 0), _jsx(StepButton, { isDisabled: props.isDisabled, direction: "down", ...decrementButtonProps, size: otherProps.size }, void 0)] }, void 0)) : null }, void 0));
+});
 
         

package/es/components/forms/NumberInput/StepButton.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/forms/PasswordInput/PasswordInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
@@ -9,13 +9,22 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { forwardRef, useCallback, useRef, useState } from 'react';
 import { useTextField } from '@react-aria/textfield';
 import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
-import { TextInputBase, } from '../TextInput/TextInputBase';
+import { TextInputBase } from '../TextInput';
 import { useProviderProps } from '../../../provider';
 import { Button } from '../../actions';
 import { castNullableStringValue, } from '../../../utils/react/nullableValue';
+import { useFieldProps } from '../Form';
 function PasswordInput(props, ref) {
     props = castNullableStringValue(props);
-    let { suffix, multiLine, ...otherProps } = useProviderProps({ ...props });
+    props = useProviderProps(props);
+    props = useFieldProps(props, {
+        defaultValidationTrigger: 'onBlur',
+        valuePropsMapper: ({ value, onChange }) => ({
+            value: value?.toString() ?? '',
+            onChange,
+        }),
+    });
+    const { suffix, multiLine, ...otherProps } = props;
     let [type, setType] = useState('password');
     let inputRef = useRef(null);
     let { labelProps, inputProps } = useTextField({
@@ -34,7 +43,6 @@ function PasswordInput(props, ref) {
  * communicate the entry requirements.
  */
 const _PasswordInput = forwardRef(PasswordInput);
-_PasswordInput.cubeInputType = 'Text';
 export { _PasswordInput as PasswordInput };
 
         

package/es/components/forms/RadioGroup/Radio.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
@@ -16,7 +16,7 @@ import { mergeProps } from '../../../utils/react';
 import { useProviderProps } from '../../../provider';
 import { INLINE_LABEL_STYLES } from '../Label';
 import { HiddenInput } from '../../HiddenInput';
-import { useFormProps } from '../Form';
+import { useFieldProps } from '../Form';
 import { RadioGroup } from './RadioGroup';
 import { useRadioProvider } from './context';
 const RadioWrapperElement = tasty({
@@ -114,7 +114,7 @@ const RadioLabelElement = tasty({
 });
 function Radio(props, ref) {
     props = useProviderProps(props);
-    props = useFormProps(props);
+    props = useFieldProps(props, { defaultValidationTrigger: 'onChange' });
     let { qa, isDisabled, validationState, children, label, autoFocus, labelStyles, labelProps, inputStyles, type, 'aria-label': ariaLabel, ...otherProps } = props;
     let isButton = type === 'button';
     label = label || children;

package/es/components/forms/RadioGroup/RadioGroup.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
@@ -11,7 +11,7 @@ import { useDOMRef } from '@react-spectrum/utils';
 import { useRadioGroup } from '@react-aria/radio';
 import { useRadioGroupState } from '@react-stately/radio';
 import { useProviderProps } from '../../../provider';
-import { FormContext, useFormProps } from '../Form';
+import { FormContext, useFieldProps } from '../Form';
 import { BLOCK_STYLES, extractStyles, OUTER_STYLES, tasty, } from '../../../tasty';
 import { FieldWrapper } from '../FieldWrapper';
 import { castNullableStringValue, } from '../../../utils/react/nullableValue';
@@ -39,7 +39,7 @@ const RadioGroupElement = tasty({
 function RadioGroup(props, ref) {
     props = castNullableStringValue(props);
     props = useProviderProps(props);
-    props = useFormProps(props);
+    props = useFieldProps(props, { defaultValidationTrigger: 'onChange' });
     let { isDisabled, isRequired, necessityIndicator, label, extra, labelPosition = 'top', validationState, children, orientation = 'vertical', message, description, labelStyles, requiredMark = true, tooltip, isHidden, styles, groupStyles, insideForm, labelSuffix, ...otherProps } = props;
     let domRef = useDOMRef(ref);
     styles = extractStyles(otherProps, OUTER_STYLES, styles);
@@ -82,7 +82,6 @@ function RadioGroup(props, ref) {
  * All possible options are exposed up front for users to compare.
  */
 const _RadioGroup = forwardRef(RadioGroup);
-_RadioGroup.cubeInputType = 'RadioGroup';
 export { _RadioGroup as RadioGroup };
 
         

package/es/components/forms/RadioGroup/context.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/forms/SearchInput/SearchInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/forms/Switch/Switch.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
@@ -18,9 +18,9 @@ import { useFocus } from '../../../utils/react/interactions';
 import { mergeProps } from '../../../utils/react';
 import { HiddenInput } from '../../HiddenInput';
 import { INLINE_LABEL_STYLES, LABEL_STYLES } from '../Label';
-import { useFormProps } from '../Form/Form';
 import { FieldWrapper } from '../FieldWrapper';
 import { castNullableIsSelected, } from '../../../utils/react/nullableValue';
+import { useFieldProps } from '../Form';
 const SwitchWrapperElement = tasty({
     qa: 'SwitchWrapper',
     styles: {
@@ -90,10 +90,20 @@ const SwitchElement = tasty({
         },
     },
 });
-function Switch(props, ref) {
+/**
+ * Switches allow users to turn an individual option on or off.
+ * They are usually used to activate or deactivate a specific setting.
+ */
+export const Switch = forwardRef(function Switch(props, ref) {
     props = castNullableIsSelected(props);
     props = useProviderProps(props);
-    props = useFormProps(props);
+    props = useFieldProps(props, {
+        valuePropsMapper: ({ value, onChange }) => ({
+            isSelected: value != null ? value : false,
+            isIndeterminate: false,
+            onChange: onChange,
+        }),
+    });
     let { qa, isDisabled = false, autoFocus, children, label, extra, labelProps, labelStyles, isLoading, insideForm, validationState, message, description, labelPosition, inputStyles, requiredMark = true, tooltip, labelSuffix, ...otherProps } = props;
     label = label || children;
     let styles = extractStyles(props, OUTER_STYLES);
@@ -140,13 +150,6 @@ function Switch(props, ref) {
     return (_jsxs(SwitchLabelElement, { styles: styles, mods: mods, ...hoverProps, ...filterBaseProps(otherProps), ref: domRef, children: [switchField, label && (_jsxs(Element, { styles: labelStyles, mods: {
                     disabled: isDisabled,
                 }, ...filterBaseProps(labelProps), children: [label, isLoading ? (_jsxs(_Fragment, { children: [label ? _jsx(_Fragment, { children: "\u00A0" }, void 0) : null, _jsx(LoadingOutlined, {}, void 0)] }, void 0)) : null] }, void 0))] }, void 0));
-}
-/**
- * Switches allow users to turn an individual option on or off.
- * They are usually used to activate or deactivate a specific setting.
- */
-let _Switch = forwardRef(Switch);
-_Switch.cubeInputType = 'Checkbox';
-export { _Switch as Switch };
+});
 
         

package/es/components/forms/TextArea/TextArea.js

@@ -1,30 +1,43 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useCallback, useRef } from 'react';
+import { forwardRef, useRef } from 'react';
 import { useControlledState } from '@react-stately/utils';
 import { useTextField } from '@react-aria/textfield';
-import { TextInputBase, } from '../TextInput/TextInputBase';
+import { TextInputBase } from '../TextInput';
 import { useProviderProps } from '../../../provider';
 import { castNullableStringValue, } from '../../../utils/react/nullableValue';
 import { chain, useLayoutEffect } from '../../../utils/react';
-function TextArea(props, ref) {
+import { useFieldProps } from '../Form';
+import { useEvent } from '../../../_internal';
+/**
+ * TextInputs are text inputs that allow users to input custom text entries
+ * with a keyboard. Various decorations can be displayed around the field to
+ * communicate the entry requirements.
+ */
+export const TextArea = forwardRef(function TextArea(props, ref) {
     props = castNullableStringValue(props);
     props = useProviderProps(props);
-    let { autoSize = false, isDisabled = false, isReadOnly = false, isRequired = false, onChange, rows, ...otherProps } = props;
-    rows = rows || 3;
-    let [inputValue, setInputValue] = useControlledState(props.value, props.defaultValue, () => { });
-    let inputRef = useRef(null);
-    let onHeightChange = useCallback(() => {
+    props = useFieldProps(props, {
+        defaultValidationTrigger: 'onBlur',
+        valuePropsMapper: ({ value, onChange }) => ({
+            onChange,
+            value: value?.toString() ?? '',
+        }),
+    });
+    const { autoSize = false, isDisabled = false, isReadOnly = false, isRequired = false, onChange, rows = 3, ...otherProps } = props;
+    const [inputValue, setInputValue] = useControlledState(props.value, props.defaultValue, () => { });
+    const inputRef = useRef(null);
+    const onHeightChange = useEvent(() => {
         if (autoSize && inputRef.current) {
-            let input = inputRef.current;
-            let prevAlignment = input.style.alignSelf;
-            let computedStyle = getComputedStyle(input);
+            const input = inputRef.current;
+            const prevAlignment = input.style.alignSelf;
+            const computedStyle = getComputedStyle(input);
             input.style.alignSelf = 'start';
             input.style.height = 'auto';
             input.style.height = input.scrollHeight
@@ -35,26 +48,16 @@ function TextArea(props, ref) {
                     2}px`;
             input.style.alignSelf = prevAlignment;
         }
-    }, [inputRef]);
+    });
     useLayoutEffect(() => {
-        if (inputRef.current) {
-            onHeightChange();
-        }
-    }, [onHeightChange, inputValue, inputRef]);
-    let { labelProps, inputProps } = useTextField({
+        onHeightChange();
+    }, [onHeightChange, inputValue]);
+    const { labelProps, inputProps } = useTextField({
         ...props,
         onChange: chain(onChange, setInputValue),
         inputElementType: 'textarea',
     }, inputRef);
     return (_jsx(TextInputBase, { ...otherProps, ref: ref, multiLine: true, inputRef: inputRef, labelProps: labelProps, inputProps: inputProps, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, rows: rows }, void 0));
-}
-/**
- * TextInputs are text inputs that allow users to input custom text entries
- * with a keyboard. Various decorations can be displayed around the field to
- * communicate the entry requirements.
- */
-const _TextArea = forwardRef(TextArea);
-_TextArea.cubeInputType = 'Text';
-export { _TextArea as TextArea };
+});
 
         

package/es/components/forms/TextInput/TextInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
@@ -10,19 +10,26 @@ import { forwardRef, useRef } from 'react';
 import { useTextField } from '@react-aria/textfield';
 import { useProviderProps } from '../../../provider';
 import { castNullableStringValue, } from '../../../utils/react/nullableValue';
+import { useFieldProps } from '../Form';
 import { TextInputBase } from './TextInputBase';
-export const TextInput = forwardRef(function TextInput(props, ref) {
-    castNullableStringValue(props);
-    props = useProviderProps(props);
-    let inputRef = useRef(null);
-    let { labelProps, inputProps } = useTextField(props, inputRef);
-    return (_jsx(TextInputBase, { ...props, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef }, void 0));
-});
 /**
  * TextInputs are text inputs that allow users to input custom text entries
  * with a keyboard. Various decorations can be displayed around the field to
  * communicate the entry requirements.
  */
-TextInput.cubeInputType = 'Text';
+export const TextInput = forwardRef(function TextInput(props, ref) {
+    props = castNullableStringValue(props);
+    props = useProviderProps(props);
+    props = useFieldProps(props, {
+        defaultValidationTrigger: 'onBlur',
+        valuePropsMapper: ({ value, onChange }) => ({
+            onChange,
+            value: value?.toString() ?? '',
+        }),
+    });
+    const inputRef = useRef(null);
+    const { labelProps, inputProps } = useTextField(props, inputRef);
+    return (_jsx(TextInputBase, { ...props, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef }, void 0));
+});
 
         

package/es/components/forms/TextInput/TextInputBase.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 
@@ -10,11 +10,9 @@ import { CheckOutlined, LoadingOutlined, WarningOutlined, } from '@ant-design/ic
 import { createFocusableRef } from '@react-spectrum/utils';
 import { cloneElement, forwardRef, useImperativeHandle, useMemo, useRef, } from 'react';
 import { useHover } from '@react-aria/interactions';
-import { useFormProps } from '../Form';
-import { useProviderProps } from '../../../provider';
 import { BLOCK_STYLES, DIMENSION_STYLES, extractStyles, POSITION_STYLES, tasty, } from '../../../tasty';
 import { useFocus } from '../../../utils/react/interactions';
-import { FieldWrapper } from '../FieldWrapper';
+import { extractFieldWrapperProps, FieldWrapper } from '../FieldWrapper';
 import { mergeProps } from '../../../utils/react';
 const ADD_STYLES = {
     display: 'grid',
@@ -135,12 +133,10 @@ export const DEFAULT_INPUT_STYLES = {
     },
 };
 const InputElement = tasty({ qa: 'Input', styles: DEFAULT_INPUT_STYLES });
-function TextInputBase(props, ref) {
-    props = useProviderProps(props);
-    props = useFormProps(props);
-    let { qa, label, extra, mods, labelPosition = 'top', labelStyles, isRequired, necessityIndicator, necessityLabel, validationState, message, description, prefix, isDisabled, multiLine, autoFocus, labelProps, inputProps, wrapperProps, inputRef, isLoading, loadingIndicator, value, inputStyles = {}, wrapperStyles = {}, suffix, suffixPosition = 'before', wrapperRef, requiredMark = true, tooltip, isHidden, rows = 1, size, icon, labelSuffix, ...otherProps } = props;
-    let styles = extractStyles(otherProps, STYLE_LIST);
-    let type = otherProps.type;
+export const TextInputBase = forwardRef(function TextInputBase(props, ref) {
+    let { qa, mods, prefix, isDisabled, multiLine, autoFocus, inputProps, wrapperProps, inputRef, isLoading, loadingIndicator, value, inputStyles = {}, wrapperStyles = {}, suffix, suffixPosition = 'before', wrapperRef, rows = 1, size, validationState, icon, type, ...otherProps } = props;
+    const { fieldWrapperProps, rest } = extractFieldWrapperProps(props);
+    const styles = extractStyles(rest, STYLE_LIST);
     inputStyles = extractStyles(otherProps, INPUT_STYLE_PROPS_LIST, inputStyles);
     let ElementType = multiLine ? 'textarea' : 'input';
     let { isFocused, focusProps } = useFocus({ isDisabled });
@@ -152,9 +148,7 @@ function TextInputBase(props, ref) {
     useImperativeHandle(ref, () => ({
         ...createFocusableRef(domRef, inputRef),
         select() {
-            if (inputRef?.current) {
-                inputRef.current.select();
-            }
+            inputRef?.current?.select();
         },
         getInputElement() {
             return inputRef?.current;
@@ -205,29 +199,7 @@ function TextInputBase(props, ref) {
     let textField = (_jsxs(InputWrapperElement, { ref: wrapperRef, qa: qa || 'TextInput', mods: modifiers, "data-size": size, styles: wrapperStyles, ...wrapperProps, children: [_jsx(InputElement, { as: ElementType, ...mergeProps(inputProps, focusProps, hoverProps), ref: inputRef, rows: multiLine ? rows : undefined, mods: modifiers, style: {
                     WebkitTextSecurity: multiLine && type === 'password' ? 'disc' : 'initial',
                 }, autoFocus: autoFocus, "data-size": size, styles: inputStyles, isDisabled: isDisabled }, void 0), prefix ? _jsx("div", { "data-element": "Prefix", children: prefix }, void 0) : null, _jsxs("div", { "data-element": "Suffix", children: [suffixPosition === 'before' ? suffix : null, (validationState && !isLoading) || isLoading ? (_jsxs("div", { "data-element": "State", children: [validationState && !isLoading ? validation : null, isLoading && _jsx(LoadingOutlined, { "data-element": "InputIcon" }, void 0)] }, void 0)) : null, suffixPosition === 'after' ? suffix : null] }, void 0)] }, void 0));
-    return (_jsx(FieldWrapper, { ...{
-            labelPosition,
-            label,
-            extra,
-            styles,
-            isRequired,
-            labelStyles,
-            necessityIndicator,
-            necessityLabel,
-            labelProps,
-            isDisabled,
-            validationState,
-            message,
-            description,
-            requiredMark,
-            tooltip,
-            isHidden,
-            labelSuffix,
-            Component: textField,
-            ref: domRef,
-        } }, void 0));
-}
-const _TextInputBase = forwardRef(TextInputBase);
-export { _TextInputBase as TextInputBase };
+    return (_jsx(FieldWrapper, { ...fieldWrapperProps, ref: domRef, styles: styles, isDisabled: isDisabled, Component: textField }, void 0));
+});
 
         

package/es/components/forms/TextInput/index.js

@@ -0,0 +1,11 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
+ * Released under the MIT license.
+ */
+
+export * from './TextInput';
+export * from './TextInputBase';
+
+        

package/es/components/forms/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/layout/Flex.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/layout/Flow.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/layout/Grid.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/layout/Prefix.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/layout/Space.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */
 

package/es/components/layout/Suffix.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-532466c
+ * @cube-dev/ui-kit v0.0.0-canary-a6ebdac
  * Released under the MIT license.
  */