@cube-dev/ui-kit 0.12.2 → 0.12.5

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -34,7 +34,7 @@ class CubeFormInstance {
         this.isSubmitting = false;
         this.onValuesChange = () => { };
         this.onSubmit = () => { };
-        this.setFieldsValue = (newData, touched, skipRender, createFields = false) => {
+        this.setFieldsValue = (newData, touched, skipRender, createFields = false, inputOnly = false) => {
             let flag = false;
             Object.keys(newData).forEach((name) => {
                 let field = this.fields[name];
@@ -49,7 +49,10 @@ class CubeFormInstance {
                     return;
                 }
                 flag = true;
-                field.value = newData[name];
+                if (!inputOnly) {
+                    field.value = newData[name];
+                }
+                field.inputValue = newData[name];
                 if (touched === true) {
                     field.touched = touched;
                 }
@@ -60,7 +63,7 @@ class CubeFormInstance {
             });
             if (flag && !skipRender) {
                 this.forceReRender();
-                if (touched) {
+                if (touched && !inputOnly) {
                     this.onValuesChange && this.onValuesChange(this.getFormData());
                 }
             }
@@ -108,12 +111,15 @@ class CubeFormInstance {
             return map;
         }, {});
     }
-    setFieldValue(name, value, touched = false, skipRender = false) {
+    setFieldValue(name, value, touched = false, skipRender = false, inputOnly = false) {
         const field = this.fields[name];
         if (!field || isEqual(value, field.value)) {
             return;
         }
-        field.value = value;
+        if (!inputOnly) {
+            field.value = value;
+        }
+        field.inputValue = value;
         if (touched) {
             field.touched = touched;
         }
@@ -121,7 +127,7 @@ class CubeFormInstance {
             field.errors = [];
             this.forceReRender();
         }
-        if (touched) {
+        if (touched && !inputOnly) {
             this.onValuesChange && this.onValuesChange(this.getFormData());
         }
     }
@@ -238,13 +244,18 @@ class CubeFormInstance {
         this.forceReRender();
     }
     _createField(name, data) {
-        return {
+        let obj = {
             name,
             validating: false,
             touched: false,
             errors: [],
             ...data,
         };
+        if (obj) {
+            // condition is here to avoid typing issues
+            obj.inputValue = obj.value;
+        }
+        return obj;
     }
 }
 exports.CubeFormInstance = CubeFormInstance;

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 

package/cjs/components/forms/Input/Input.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 

package/cjs/components/forms/Label.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -30,7 +30,6 @@ exports.INLINE_LABEL_STYLES = {
     color: {
         '': '#dark.85',
         invalid: '#danger-text',
-        disabled: '#dark.30',
     },
     whiteSpace: 'nowrap',
 };
@@ -41,7 +40,6 @@ exports.LABEL_STYLES = {
     color: {
         '': '#dark',
         invalid: '#danger-text',
-        disabled: '#dark.30',
     },
     whiteSpace: 'nowrap',
     width: {
@@ -66,12 +64,12 @@ function Label(props, ref) {
     let icon = ((0, jsx_runtime_1.jsx)("span", { "aria-label": includeNecessityIndicatorInAccessibilityName
             ? formatMessage('(required)')
             : undefined, children: REQUIRED_ICON }, void 0));
-    return ((0, jsx_runtime_1.jsx)(LabelElement, { ...(0, tasty_1.filterBaseProps)(otherProps), onClick: onClick, ref: domRef, styles: styles, htmlFor: labelFor || htmlFor, mods: {
+    return ((0, jsx_runtime_1.jsx)(LabelElement, { ...(0, tasty_1.filterBaseProps)(otherProps), ref: domRef, styles: styles, htmlFor: labelFor || htmlFor, mods: {
             side: labelPosition === 'side',
             disabled: isDisabled,
             invalid: validationState === 'invalid',
             valid: validationState === 'valid',
-        }, children: typeof children !== 'string' ? (children) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [children, (necessityIndicator === 'label' ||
+        }, onClick: onClick, children: typeof children !== 'string' ? (children) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [children, (necessityIndicator === 'label' ||
                     (necessityIndicator === 'icon' && isRequired)) &&
                     ' \u200b', necessityIndicator === 'label' && ((0, jsx_runtime_1.jsx)("span", { "aria-hidden": !includeNecessityIndicatorInAccessibilityName
                         ? isRequired

package/cjs/components/forms/NumberInput/NumberInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -10,15 +10,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.NumberInput = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const Form_1 = require("../Form");
-const provider_1 = require("../../../provider");
 const i18n_1 = require("@react-aria/i18n");
-const TextInputBase_1 = require("../TextInput/TextInputBase");
 const numberfield_1 = require("@react-stately/numberfield");
 const numberfield_2 = require("@react-aria/numberfield");
-const StepButton_1 = require("./StepButton");
+const Form_1 = require("../Form");
+const provider_1 = require("../../../provider");
+const TextInputBase_1 = require("../TextInput/TextInputBase");
 const tasty_1 = require("../../../tasty");
 const nullableValue_1 = require("../../../utils/react/nullableValue");
+const StepButton_1 = require("./StepButton");
 const StepperContainer = (0, tasty_1.tasty)({
     styles: {
         display: 'grid',
@@ -38,7 +38,7 @@ function NumberInput(props, ref) {
     let state = (0, numberfield_1.useNumberFieldState)({ ...props, locale });
     let inputRef = (0, react_1.useRef)(null);
     let { groupProps, labelProps, inputProps, incrementButtonProps, decrementButtonProps, } = (0, numberfield_2.useNumberField)(props, state, inputRef);
-    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.TextInputBase, { ...otherProps, labelProps: labelProps, inputProps: inputProps, ref: ref, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: "after", suffix: showStepper ? ((0, jsx_runtime_1.jsxs)(StepperContainer, { children: [(0, jsx_runtime_1.jsx)(StepButton_1.StepButton, { direction: "up", ...incrementButtonProps }, void 0), (0, jsx_runtime_1.jsx)(StepButton_1.StepButton, { direction: "down", ...decrementButtonProps }, void 0)] }, void 0)) : null }, void 0));
+    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.TextInputBase, { ...otherProps, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: "after", suffix: showStepper ? ((0, jsx_runtime_1.jsxs)(StepperContainer, { children: [(0, jsx_runtime_1.jsx)(StepButton_1.StepButton, { direction: "up", ...incrementButtonProps }, void 0), (0, jsx_runtime_1.jsx)(StepButton_1.StepButton, { direction: "down", ...decrementButtonProps }, void 0)] }, void 0)) : null }, void 0));
 }
 /**
  * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -9,10 +9,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StepButton = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const actions_1 = require("../../actions");
 const icons_1 = require("@ant-design/icons");
+const actions_1 = require("../../actions");
 const STEP_BUTTON_STYLES = {
-    padding: '0 .5x',
+    width: '4x',
     radius: {
         '': '0 (1r - 1bw) 0 0',
         down: '0 0 (1r - 1bw) 0',
@@ -25,7 +25,7 @@ const STEP_BUTTON_STYLES = {
  * Buttons for NumberField.
  */
 function StepButton(props) {
-    return ((0, jsx_runtime_1.jsx)(actions_1.Button, { type: "neutral", styles: STEP_BUTTON_STYLES, preventDefault: true, icon: props.direction === 'up' ? (0, jsx_runtime_1.jsx)(icons_1.CaretUpOutlined, {}, void 0) : (0, jsx_runtime_1.jsx)(icons_1.CaretDownOutlined, {}, void 0), mods: {
+    return ((0, jsx_runtime_1.jsx)(actions_1.Button, { preventDefault: true, type: "neutral", styles: STEP_BUTTON_STYLES, icon: props.direction === 'up' ? (0, jsx_runtime_1.jsx)(icons_1.CaretUpOutlined, {}, void 0) : (0, jsx_runtime_1.jsx)(icons_1.CaretDownOutlined, {}, void 0), mods: {
             up: props.direction === 'up',
             down: props.direction === 'down',
         }, label: `Step ${props.direction}`, ...props }, void 0));

package/cjs/components/forms/PasswordInput/PasswordInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -10,11 +10,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.PasswordInput = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
+const textfield_1 = require("@react-aria/textfield");
+const icons_1 = require("@ant-design/icons");
 const TextInputBase_1 = require("../TextInput/TextInputBase");
 const provider_1 = require("../../../provider");
-const textfield_1 = require("@react-aria/textfield");
 const actions_1 = require("../../actions");
-const icons_1 = require("@ant-design/icons");
 const nullableValue_1 = require("../../../utils/react/nullableValue");
 function PasswordInput(props, ref) {
     props = (0, nullableValue_1.castNullableStringValue)(props);
@@ -28,8 +28,8 @@ function PasswordInput(props, ref) {
     const toggleType = (0, react_1.useCallback)((e) => {
         setType((type) => (type === 'password' ? 'text' : 'password'));
     }, []);
-    const wrappedSuffix = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [suffix, (0, jsx_runtime_1.jsx)(actions_1.Button, { type: "neutral", htmlType: "button", onPress: toggleType, placeSelf: "stretch", height: "auto", radius: "right (1r - 1bw)", padding: ".5x 1x", width: "auto", label: "Toggle masking", excludeFromTabOrder: true, icon: type === 'password' ? (0, jsx_runtime_1.jsx)(icons_1.EyeInvisibleOutlined, {}, void 0) : (0, jsx_runtime_1.jsx)(icons_1.EyeOutlined, {}, void 0) }, void 0)] }, void 0));
-    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.TextInputBase, { labelProps: labelProps, inputProps: inputProps, ref: ref, inputRef: inputRef, inputStyles: { paddingRight: '4x' }, type: type, suffixPosition: "after", suffix: wrappedSuffix, multiLine: multiLine, ...otherProps }, void 0));
+    const wrappedSuffix = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [suffix, (0, jsx_runtime_1.jsx)(actions_1.Button, { excludeFromTabOrder: true, type: "neutral", htmlType: "button", placeSelf: "stretch", height: "auto", radius: "right", width: "4x", label: "Toggle masking", icon: type === 'password' ? (0, jsx_runtime_1.jsx)(icons_1.EyeInvisibleOutlined, {}, void 0) : (0, jsx_runtime_1.jsx)(icons_1.EyeOutlined, {}, void 0), onPress: toggleType }, void 0)] }, void 0));
+    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.TextInputBase, { ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, inputStyles: { paddingRight: '4x' }, type: type, suffixPosition: "after", suffix: wrappedSuffix, multiLine: multiLine, ...otherProps }, void 0));
 }
 /**
  * PasswordInputs are password inputs that allow users to input passwords or code entries

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -13,15 +13,15 @@ const utils_1 = require("@react-spectrum/utils");
 const react_1 = require("react");
 const interactions_1 = require("@react-aria/interactions");
 const radio_1 = require("@react-aria/radio");
-const context_1 = require("./context");
 const tasty_1 = require("../../../tasty");
 const interactions_2 = require("../../../utils/react/interactions");
 const react_2 = require("../../../utils/react");
 const provider_1 = require("../../../provider");
 const Label_1 = require("../Label");
 const HiddenInput_1 = require("../../HiddenInput");
-const RadioGroup_1 = require("./RadioGroup");
 const Form_1 = require("../Form");
+const RadioGroup_1 = require("./RadioGroup");
+const context_1 = require("./context");
 const RadioWrapperElement = (0, tasty_1.tasty)({
     as: 'label',
     qa: 'RadioWrapper',
@@ -145,7 +145,7 @@ function Radio(props, ref) {
             invalid: validationState === 'invalid',
             hovered: isHovered,
             button: isButton,
-        }, children: [(0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { "data-qa": qa || 'Radio', "aria-label": ariaLabel, ...(0, react_2.mergeProps)(inputProps, focusProps), isButton: isButton, ref: inputRef }, void 0), (0, jsx_runtime_1.jsx)(RadioElement, { mods: {
+        }, children: [(0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { "data-qa": qa || 'Radio', "aria-label": ariaLabel, ...(0, react_2.mergeProps)(inputProps, focusProps), ref: inputRef, isButton: isButton }, void 0), (0, jsx_runtime_1.jsx)(RadioElement, { mods: {
                     checked: inputProps.checked,
                     invalid: validationState === 'invalid',
                     valid: validationState === 'valid',
@@ -160,7 +160,7 @@ function Radio(props, ref) {
 }
 function RadioButton(props, ref) {
     const Radio = _Radio;
-    return (0, jsx_runtime_1.jsx)(Radio, { ...props, type: "button", ref: ref }, void 0);
+    return (0, jsx_runtime_1.jsx)(Radio, { ...props, ref: ref, type: "button" }, void 0);
 }
 /**
  * Radio buttons allow users to select a single option from a list of mutually exclusive options.

package/cjs/components/forms/RadioGroup/RadioGroup.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -11,14 +11,14 @@ exports.RadioGroup = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const utils_1 = require("@react-spectrum/utils");
-const provider_1 = require("../../../provider");
 const radio_1 = require("@react-aria/radio");
 const radio_2 = require("@react-stately/radio");
+const provider_1 = require("../../../provider");
 const Form_1 = require("../Form");
-const context_1 = require("./context");
 const tasty_1 = require("../../../tasty");
 const FieldWrapper_1 = require("../FieldWrapper");
 const nullableValue_1 = require("../../../utils/react/nullableValue");
+const context_1 = require("./context");
 const RadioGroupElement = (0, tasty_1.tasty)({
     qa: 'RadioGroup',
     styles: {

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 

package/cjs/components/forms/SearchInput/SearchInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -19,10 +19,20 @@ const provider_1 = require("../../../provider");
 const actions_1 = require("../../actions");
 const mapProps_1 = require("../../../utils/react/mapProps");
 const nullableValue_1 = require("../../../utils/react/nullableValue");
-exports.SearchInput = (0, react_1.forwardRef)((props, ref) => {
+const tasty_1 = require("../../../tasty");
+const ClearButton = (0, tasty_1.tasty)(actions_1.Button, {
+    icon: (0, jsx_runtime_1.jsx)(icons_1.CloseOutlined, {}, void 0),
+    styles: {
+        radius: 'right (1r - 1bw)',
+        width: '4x',
+        height: 'auto',
+        placeSelf: 'stretch',
+    },
+});
+exports.SearchInput = (0, react_1.forwardRef)(function SearchInput(props, ref) {
     props = (0, nullableValue_1.castNullableStringValue)(props);
     props = (0, provider_1.useProviderProps)(props);
-    let { isClearable, value } = props;
+    let { isClearable, value, validationState } = props;
     const localRef = (0, react_1.useRef)(null);
     const combinedRef = (0, react_2.useCombinedRefs)(ref, localRef);
     let inputRef = (0, react_1.useRef)(null);
@@ -34,12 +44,9 @@ exports.SearchInput = (0, react_1.forwardRef)((props, ref) => {
     }, [combinedRef, value]);
     let state = (0, searchfield_1.useSearchFieldState)(props);
     let { inputProps, clearButtonProps } = (0, searchfield_2.useSearchField)(props, state, inputRef);
-    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.TextInputBase, { inputProps: inputProps, ref: ref, inputRef: inputRef, type: "search", prefix: (0, jsx_runtime_1.jsx)(icons_1.SearchOutlined, {}, void 0), suffixPosition: "after", suffix: isClearable &&
+    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.TextInputBase, { ref: ref, inputProps: inputProps, inputRef: inputRef, type: "search", icon: (0, jsx_runtime_1.jsx)(icons_1.SearchOutlined, {}, void 0), suffixPosition: "after", suffix: isClearable &&
             state.value !== '' &&
-            !props.isReadOnly && ((0, jsx_runtime_1.jsx)(actions_1.Button, { type: "clear", ...(0, mapProps_1.ariaToCubeButtonProps)(clearButtonProps), color: {
-                '': '#dark.50',
-                'hovered | pressed': '#purple-text',
-            }, radius: "right (1r - 1bw)", padding: ".5x 1x", placeSelf: "stretch", icon: (0, jsx_runtime_1.jsx)(icons_1.CloseOutlined, {}, void 0) }, void 0)), ...props }, void 0));
+            !props.isReadOnly && ((0, jsx_runtime_1.jsx)(ClearButton, { type: validationState === 'invalid' ? 'clear' : 'neutral', theme: validationState === 'invalid' ? 'danger' : undefined, ...(0, mapProps_1.ariaToCubeButtonProps)(clearButtonProps) }, void 0)), ...props }, void 0));
 });
 
         

package/cjs/components/forms/Switch/Switch.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -14,13 +14,13 @@ const react_1 = require("react");
 const switch_1 = require("@react-aria/switch");
 const interactions_1 = require("@react-aria/interactions");
 const toggle_1 = require("@react-stately/toggle");
+const icons_1 = require("@ant-design/icons");
 const provider_1 = require("../../../provider");
 const tasty_1 = require("../../../tasty");
 const interactions_2 = require("../../../utils/react/interactions");
 const react_2 = require("../../../utils/react");
 const HiddenInput_1 = require("../../HiddenInput");
 const Label_1 = require("../Label");
-const icons_1 = require("@ant-design/icons");
 const Form_1 = require("../Form/Form");
 const FieldWrapper_1 = require("../FieldWrapper");
 const nullableValue_1 = require("../../../utils/react/nullableValue");

package/cjs/components/forms/TextArea/TextArea.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -10,10 +10,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextArea = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const TextInputBase_1 = require("../TextInput/TextInputBase");
 const utils_1 = require("@react-stately/utils");
-const provider_1 = require("../../../provider");
 const textfield_1 = require("@react-aria/textfield");
+const TextInputBase_1 = require("../TextInput/TextInputBase");
+const provider_1 = require("../../../provider");
 const nullableValue_1 = require("../../../utils/react/nullableValue");
 const react_2 = require("../../../utils/react");
 function TextArea(props, ref) {
@@ -49,7 +49,7 @@ function TextArea(props, ref) {
         onChange: (0, react_2.chain)(onChange, setInputValue),
         inputElementType: 'textarea',
     }, inputRef);
-    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.TextInputBase, { ...otherProps, ref: ref, inputRef: inputRef, labelProps: labelProps, inputProps: inputProps, multiLine: true, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, rows: rows }, void 0));
+    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.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

package/cjs/components/forms/TextInput/TextInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.2
+ * @cube-dev/ui-kit v0.12.5
  * Released under the MIT license.
  */
 
@@ -10,16 +10,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextInput = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const TextInputBase_1 = require("./TextInputBase");
-const provider_1 = require("../../../provider");
 const textfield_1 = require("@react-aria/textfield");
+const provider_1 = require("../../../provider");
 const nullableValue_1 = require("../../../utils/react/nullableValue");
+const TextInputBase_1 = require("./TextInputBase");
 exports.TextInput = (0, react_1.forwardRef)(function TextInput(props, ref) {
     (0, nullableValue_1.castNullableStringValue)(props);
     props = (0, provider_1.useProviderProps)(props);
     let inputRef = (0, react_1.useRef)(null);
     let { labelProps, inputProps } = (0, textfield_1.useTextField)(props, inputRef);
-    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.TextInputBase, { ...props, labelProps: labelProps, inputProps: inputProps, ref: ref, inputRef: inputRef }, void 0));
+    return ((0, jsx_runtime_1.jsx)(TextInputBase_1.TextInputBase, { ...props, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef }, void 0));
 });
 /**
  * TextInputs are text inputs that allow users to input custom text entries