@cube-dev/ui-kit 0.0.0-canary-d37d372 → 0.0.0-canary-5b7252a

package/cjs/components/forms/{FieldWrapper.js → FieldWrapper/FieldWrapper.js}

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */
 
@@ -11,14 +11,14 @@ exports.FieldWrapper = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const icons_1 = require("@ant-design/icons");
-const Paragraph_1 = require("../content/Paragraph");
-const tasty_1 = require("../../tasty");
-const TooltipProvider_1 = require("../overlays/Tooltip/TooltipProvider");
-const Text_1 = require("../content/Text");
-const react_2 = require("../../utils/react");
-const Space_1 = require("../layout/Space");
-const Flex_1 = require("../layout/Flex");
-const Label_1 = require("./Label");
+const Paragraph_1 = require("../../content/Paragraph");
+const tasty_1 = require("../../../tasty");
+const TooltipProvider_1 = require("../../overlays/Tooltip/TooltipProvider");
+const Text_1 = require("../../content/Text");
+const react_2 = require("../../../utils/react");
+const Space_1 = require("../../layout/Space");
+const Flex_1 = require("../../layout/Flex");
+const Label_1 = require("../Label");
 const FieldElement = (0, tasty_1.tasty)({
     qa: 'Field',
     styles: {
@@ -53,6 +53,9 @@ const FieldElement = (0, tasty_1.tasty)({
         },
     },
 });
+if (process.env.NODE_ENV === 'development') {
+    FieldElement.displayName = 'FieldWrapperElement';
+}
 const MessageElement = (0, tasty_1.tasty)({
     qa: 'Field_Message',
     styles: {
@@ -68,7 +71,11 @@ const MessageElement = (0, tasty_1.tasty)({
         userSelect: 'none',
     },
 });
-function FieldWrapper(props, ref) {
+/**
+ * A wrapper for form fields to provide additional decoration for inputs.
+ * @internal Do not use this component directly.
+ */
+exports.FieldWrapper = (0, react_1.forwardRef)(function FieldWrapper(props, ref) {
     const { as, labelPosition = 'top', label, extra, styles, isRequired, isDisabled, labelStyles, necessityIndicator, labelProps, fieldProps, message, messageStyles, description, Component, validationState, requiredMark = true, tooltip, isHidden, labelSuffix, } = props;
     const labelComponent = label ? ((0, jsx_runtime_1.jsx)(Label_1.Label, { as: as === 'label' ? 'div' : 'label', styles: labelStyles, labelPosition: labelPosition, isRequired: requiredMark ? isRequired : false, isDisabled: isDisabled, necessityIndicator: necessityIndicator, validationState: validationState, "aria-label": label, ...labelProps, children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { placeContent: "baseline space-between", width: "100%", children: [(0, jsx_runtime_1.jsxs)(Space_1.Space, { placeItems: "center", gap: "0.25x", children: [(0, jsx_runtime_1.jsx)("div", { children: label }, void 0), tooltip ? ((0, jsx_runtime_1.jsx)(TooltipProvider_1.TooltipProvider, { activeWrap: true, title: tooltip, width: "initial max-content 40x", children: (0, jsx_runtime_1.jsx)(icons_1.InfoCircleOutlined, { style: { color: 'var(--primary-color)', margin: '0 4px' } }, void 0) }, void 0)) : null, (0, jsx_runtime_1.jsx)("div", { children: labelSuffix }, void 0)] }, void 0), extra && (0, jsx_runtime_1.jsx)(Text_1.Text, { preset: "t3", children: extra }, void 0)] }, void 0) }, void 0)) : null;
     let descriptionComponent = description ? ((0, jsx_runtime_1.jsx)("div", { "data-element": "Description", children: (0, react_2.wrapNodeIfPlain)(description, () => ((0, jsx_runtime_1.jsx)(Paragraph_1.Paragraph, { children: description }, void 0))) }, void 0)) : null;
@@ -78,12 +85,7 @@ function FieldWrapper(props, ref) {
         invalid: validationState === 'invalid',
         valid: validationState === 'valid',
     };
-    return ((0, jsx_runtime_1.jsxs)(FieldElement, { ref: ref, as: as || 'div', mods: mods, isHidden: isHidden, styles: styles, ...fieldProps, children: [labelComponent || descriptionComponent ? ((0, jsx_runtime_1.jsxs)("div", { "data-element": "LabelArea", children: [labelComponent, descriptionComponent] }, void 0)) : null, (0, jsx_runtime_1.jsxs)("div", { "data-element": "InputArea", children: [Component, message && !isDisabled && ((0, jsx_runtime_1.jsx)(MessageElement, { mods: mods, styles: messageStyles, role: validationState === 'invalid' ? 'alert' : undefined, children: message }, void 0))] }, void 0)] }, void 0));
-}
-/**
- * A wrapper for form fields to provide additional decoration for inputs.
- */
-const _FieldWrapper = (0, react_1.forwardRef)(FieldWrapper);
-exports.FieldWrapper = _FieldWrapper;
+    return ((0, jsx_runtime_1.jsxs)(FieldElement, { ref: ref, as: as ?? 'div', mods: mods, isHidden: isHidden, styles: styles, ...fieldProps, children: [labelComponent || descriptionComponent ? ((0, jsx_runtime_1.jsxs)("div", { "data-element": "LabelArea", children: [labelComponent, descriptionComponent] }, void 0)) : null, (0, jsx_runtime_1.jsxs)("div", { "data-element": "InputArea", children: [Component, message && !isDisabled && ((0, jsx_runtime_1.jsx)(MessageElement, { mods: mods, styles: messageStyles, role: validationState === 'invalid' ? 'alert' : undefined, children: message }, void 0))] }, void 0)] }, void 0));
+});
 
         

package/cjs/components/forms/FieldWrapper/extract-field-wrapper-props.js

@@ -0,0 +1,50 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
+ * Released under the MIT license.
+ */
+
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.extractFieldWrapperProps = void 0;
+const createFieldWrapperPropsKeys = (arr) => new Set(arr);
+const fieldWrapperPropsKeys = createFieldWrapperPropsKeys([
+    'as',
+    'validationState',
+    'styles',
+    'isRequired',
+    'isDisabled',
+    'fieldProps',
+    'isHidden',
+    'label',
+    'labelPosition',
+    'labelSuffix',
+    'labelStyles',
+    'labelProps',
+    'description',
+    'requiredMark',
+    'tooltip',
+    'extra',
+    'necessityLabel',
+    'necessityIndicator',
+    'message',
+    'messageStyles',
+    'Component',
+]);
+function extractFieldWrapperProps(props) {
+    const fieldWrapperProps = {};
+    const rest = {};
+    for (const [key, prop] of Object.entries(props)) {
+        if (fieldWrapperPropsKeys.has(key)) {
+            fieldWrapperProps[key] = prop;
+        }
+        else {
+            rest[key] = prop;
+        }
+    }
+    return { fieldWrapperProps, rest };
+}
+exports.extractFieldWrapperProps = extractFieldWrapperProps;
+
+        

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

@@ -0,0 +1,24 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
+ * Released under the MIT license.
+ */
+
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./FieldWrapper"), exports);
+__exportStar(require("./extract-field-wrapper-props"), exports);
+__exportStar(require("./types"), exports);
+
+        

package/cjs/components/{pickers/RangeSlider/Header.js → forms/FieldWrapper/types.js}

@@ -1,16 +1,11 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */
 
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Header = void 0;
-function Header() {
-    return null;
-}
-exports.Header = Header;
 
         

package/cjs/components/forms/FileInput/FileInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */
 
@@ -12,10 +12,10 @@ 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 Action_1 = require("../../actions/Action");
+const actions_1 = require("../../actions");
 const tasty_1 = require("../../../tasty");
 const FieldWrapper_1 = require("../FieldWrapper");
-const FileInputElement = (0, tasty_1.tasty)(Action_1.Action, {
+const FileInputElement = (0, tasty_1.tasty)(actions_1.Action, {
     styles: {
         display: 'inline-flex',
         position: 'relative',

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

@@ -0,0 +1,137 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
+ * Released under the MIT license.
+ */
+
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Field = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const Form_1 = require("../Form");
+const _internal_1 = require("../../../../_internal");
+const FieldContext_1 = require("./FieldContext");
+const ID_MAP = {};
+function createId(name) {
+    if (!name)
+        return;
+    if (!ID_MAP[name]) {
+        ID_MAP[name] = [];
+    }
+    let i = 0;
+    let id;
+    do {
+        id = i ? `${name}_${i}` : name;
+        i++;
+    } while (ID_MAP[name].includes(id));
+    ID_MAP[name].push(id);
+    return id;
+}
+function removeId(name, id) {
+    if (!ID_MAP[name])
+        return;
+    ID_MAP[name] = ID_MAP[name].filter((_id) => _id !== id);
+}
+function Field(props) {
+    props = (0, Form_1.useFormProps)(props);
+    let { defaultValue, id, idPrefix, children, name, form, rules, validateTrigger, validationState, shouldUpdate, } = props;
+    const nonInput = !name;
+    const fieldName = name != null ? (Array.isArray(name) ? name.join('.') : name) : '';
+    const [fieldId, setFieldId] = (0, react_1.useState)(id ?? (idPrefix ? `${idPrefix}_${fieldName}` : fieldName));
+    let field = form?.getFieldInstance(fieldName);
+    if (!field) {
+        field = form?.createField(fieldName, true);
+    }
+    (0, _internal_1.useWarn)(!form, 'Form Field requires declared form instance if field name is specified');
+    (0, react_1.useEffect)(() => {
+        let newId;
+        if (!id && !nonInput) {
+            newId = createId(fieldId);
+            setFieldId(newId);
+        }
+        return () => {
+            if (!id) {
+                removeId(idPrefix ? `${idPrefix}_${fieldName}` : fieldName, newId);
+            }
+            if (fieldName && form) {
+                form.removeField(fieldName);
+            }
+        };
+    }, []);
+    if (field) {
+        field.rules = rules;
+        if (defaultValue !== null && !field.touched) {
+            form?.setFieldValue(fieldName, defaultValue, false, true);
+        }
+    }
+    let isRequired = rules && !!rules.find((rule) => rule.required);
+    (0, react_1.useEffect)(() => {
+        if (!form)
+            return;
+        if (field) {
+            form.forceReRender();
+        }
+        else {
+            form.createField(fieldName);
+        }
+    }, [field]);
+    const onBlurHandler = (0, _internal_1.useEvent)(() => {
+        if (validateTrigger === 'onBlur') {
+            // We need a timeout so the change event can be done.
+            setTimeout(() => {
+                form?.validateField(fieldName).catch(() => { }); // do nothing on fail
+            });
+        }
+    });
+    const onChangeHandler = (0, _internal_1.useEvent)((value, dontTouch) => {
+        const field = form?.getFieldInstance(fieldName);
+        if (shouldUpdate) {
+            const fieldsValue = form?.getFieldsValue();
+            // check if we should update the value of the field
+            const shouldNotBeUpdated = typeof shouldUpdate === 'boolean'
+                ? !shouldUpdate
+                : !shouldUpdate(fieldsValue, {
+                    ...fieldsValue,
+                    [fieldName]: value,
+                });
+            if (shouldNotBeUpdated) {
+                return;
+            }
+        }
+        form?.setFieldValue(fieldName, value, !dontTouch, false, dontTouch);
+        if (!dontTouch &&
+            (validateTrigger === 'onChange' || field?.errors?.length)) {
+            form?.validateField(fieldName).catch(() => { }); // do nothing on fail
+        }
+    });
+    const contextValue = (0, react_1.useMemo)(() => ({
+        id: fieldId,
+        name: fieldName,
+        value: field?.inputValue,
+        validateTrigger,
+        validationState: validationState ?? (field?.errors?.length ? 'invalid' : undefined),
+        ...(isRequired && { isRequired }),
+        ...(field?.errors?.length && { message: field.errors[0] }),
+        onBlur: onBlurHandler,
+        onChange: onChangeHandler,
+    }), [
+        field?.errors,
+        field?.inputValue,
+        fieldId,
+        fieldName,
+        isRequired,
+        onBlurHandler,
+        onChangeHandler,
+        validateTrigger,
+        validationState,
+    ]);
+    if (!form || !children) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)(FieldContext_1.FieldProvider, { value: contextValue, children: typeof children === 'function' ? children(form) : children }, void 0));
+}
+exports.Field = Field;
+
+        

package/cjs/components/forms/Form/Field/FieldContext.js

@@ -0,0 +1,68 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
+ * Released under the MIT license.
+ */
+
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFieldProps = exports.FieldProvider = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const _internal_1 = require("../../../../_internal");
+const Form_1 = require("../Form");
+const FieldContext = React.createContext(null);
+function FieldProvider(props) {
+    const { children, value } = props;
+    return ((0, jsx_runtime_1.jsx)(FieldContext.Provider, { value: value, children: children }, void 0));
+}
+exports.FieldProvider = FieldProvider;
+function useFieldProps(props, params = {}) {
+    const { valuePropsMapper, defaultValidationTrigger = 'onBlur' } = params;
+    props = (0, Form_1.useFormProps)(props);
+    const fieldContext = React.useContext(FieldContext);
+    const onBlurChained = (0, _internal_1.useChainedCallback)(fieldContext?.onBlur, props.onBlur);
+    const onChangeEvent = (0, _internal_1.useEvent)((value, dontTouch) => {
+        return fieldContext?.onChange?.(value, dontTouch, fieldContext?.validateTrigger ?? defaultValidationTrigger);
+    });
+    if (fieldContext === null) {
+        return props;
+    }
+    const { validateTrigger = defaultValidationTrigger, value, onChange, ...rest } = fieldContext;
+    return {
+        ...props,
+        ...(valuePropsMapper?.({
+            value: fieldContext.value,
+            onChange: onChangeEvent,
+        }) ?? {
+            value: fieldContext.value,
+            onChange: onChangeEvent,
+        }),
+        ...rest,
+        validateTrigger,
+        onBlur: onBlurChained,
+    };
+}
+exports.useFieldProps = useFieldProps;
+
+        

package/cjs/components/forms/Form/Field/index.js

@@ -0,0 +1,24 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
+ * Released under the MIT license.
+ */
+
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Field"), exports);
+__exportStar(require("./FieldContext"), exports);
+__exportStar(require("./types"), exports);
+
+        

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

@@ -0,0 +1,11 @@
+/**
+ * @license MIT
+ * author: Cube Dev Team
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
+ * Released under the MIT license.
+ */
+
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+
+        

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */
 
@@ -82,7 +82,7 @@ function Form(props, ref) {
             // onSubmit(Object.fromEntries(new FormData(e.target).entries()));
         };
     }
-    [form] = (0, useForm_1.useForm)(form, ref && ref.current, {
+    [form] = (0, useForm_1.useForm)(form, ref?.current, {
         onSubmit: onSubmitCallback,
         onValuesChange,
     });

package/cjs/components/forms/Form/{Field.js → LegacyField.js}

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

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

@@ -1,11 +1,21 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */
 
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FormContext = exports.useForm = exports.Field = exports.Form = exports.useFormProps = void 0;
 const Field_1 = require("./Field");
@@ -17,5 +27,6 @@ Object.defineProperty(exports, "useFormProps", { enumerable: true, get: function
 Object.defineProperty(exports, "FormContext", { enumerable: true, get: function () { return Form_1.FormContext; } });
 const Form = Object.assign(Form_1.Form, { Item: Field_1.Field, useForm: useForm_1.useForm });
 exports.Form = Form;
+__exportStar(require("./Field"), exports);
 
         

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * 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.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */
 
@@ -215,6 +215,7 @@ class CubeFormInstance {
         if (!skipRender) {
             this.forceReRender();
         }
+        return this.fields[name];
     }
     removeField(name, skipRender) {
         if (this.fields[name]) {

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * 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.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * 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.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * 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.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */
 

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */
 
@@ -32,13 +32,13 @@ function NumberInput(props, ref) {
     props = (0, nullableValue_1.castNullableNumberValue)(props);
     props = (0, provider_1.useProviderProps)(props);
     props = (0, Form_1.useFormProps)(props);
-    let { hideStepper, suffix, suffixPosition = 'after', value, defaultValue, onChange, ...otherProps } = props;
+    let { hideStepper, value, defaultValue, onChange, ...otherProps } = props;
     let showStepper = !hideStepper;
     let { locale } = (0, i18n_1.useLocale)();
     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, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: suffixPosition, 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)) : (suffix) }, 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.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */
 

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

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

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

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

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

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

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * 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.0.0-canary-d37d372
+ * @cube-dev/ui-kit v0.0.0-canary-5b7252a
  * Released under the MIT license.
  */