@cube-dev/ui-kit 0.14.10 → 0.14.13

package/cjs/components/content/ActiveZone/ActiveZone.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.13
  * Released under the MIT license.
  */
 
@@ -17,7 +17,7 @@ const react_2 = require("../../../utils/react");
 const tasty_1 = require("../../../tasty");
 const interactions_2 = require("../../../utils/react/interactions");
 const DEFAULT_STYLES = {
-    display: 'inline-block',
+    display: 'inline-grid',
     position: 'relative',
     opacity: {
         '': 1,

package/cjs/components/content/Alert/Alert.js

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

package/cjs/components/content/Alert/index.js

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

package/cjs/components/content/Alert/types.js

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

package/cjs/components/content/Alert/use-alert.js

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

package/cjs/components/content/Avatar/Avatar.js

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

package/cjs/components/content/Badge/Badge.js

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

package/cjs/components/content/Card/Card.js

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

package/cjs/components/content/Content.js

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

package/cjs/components/content/CopySnippet/CopySnippet.js

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

package/cjs/components/content/CopySnippet/index.js

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

package/cjs/components/content/Divider.js

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

package/cjs/components/content/Footer.js

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

package/cjs/components/content/Header.js

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

package/cjs/components/content/Paragraph.js

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

package/cjs/components/content/Placeholder/Placeholder.js

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

package/cjs/components/content/PrismCode/PrismCode.js

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

package/cjs/components/content/Result/Result.js

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

package/cjs/components/content/Skeleton/Skeleton.js

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

package/cjs/components/content/Tag/Tag.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.13
  * Released under the MIT license.
  */
 
@@ -16,7 +16,7 @@ const react_1 = require("react");
 const icons_1 = require("@ant-design/icons");
 const themes_1 = __importDefault(require("../../../data/themes"));
 const tasty_1 = require("../../../tasty");
-const Action_1 = require("../../actions/Action");
+const actions_1 = require("../../actions");
 const Suffix_1 = require("../../layout/Suffix");
 const TagElement = (0, tasty_1.tasty)({
     qa: 'Tag',
@@ -24,6 +24,7 @@ const TagElement = (0, tasty_1.tasty)({
     styles: {
         position: 'relative',
         display: 'inline-flex',
+        gap: '1x',
         placeContent: 'center start',
         placeItems: 'center start',
         radius: '1r',
@@ -57,6 +58,9 @@ const TagElement = (0, tasty_1.tasty)({
                 return map;
             }, {}),
         },
+        Icon: {
+            fontSize: '@icon-size',
+        },
         Content: {
             display: 'block',
             width: 'max 100%',
@@ -66,7 +70,7 @@ const TagElement = (0, tasty_1.tasty)({
         },
     },
 });
-const CloseAction = (0, tasty_1.tasty)(Action_1.Action, {
+const CloseAction = (0, tasty_1.tasty)(actions_1.Action, {
     label: 'Close',
     styles: {
         display: 'grid',
@@ -82,10 +86,10 @@ const CloseAction = (0, tasty_1.tasty)(Action_1.Action, {
     },
 });
 function Tag(allProps, ref) {
-    let { type, isClosable, onClose, closeButtonStyles, children, ...props } = allProps;
+    let { type, icon, isClosable, onClose, closeButtonStyles, children, ...props } = allProps;
     const styles = (0, tasty_1.extractStyles)(props, tasty_1.CONTAINER_STYLES);
-    return ((0, jsx_runtime_1.jsxs)(TagElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: styles, "data-type": type, mods: { closable: isClosable }, children: [(0, jsx_runtime_1.jsx)("div", { "data-element": "Content", children: children }, void 0), isClosable ? ((0, jsx_runtime_1.jsx)(Suffix_1.Suffix, { outerGap: "0", children: (0, jsx_runtime_1.jsx)(CloseAction, { styles: closeButtonStyles, onPress: onClose, children: (0, jsx_runtime_1.jsx)(icons_1.CloseOutlined, { style: {
-                            fontSize: 'calc(var(--font-size) - (var(--border-width) * 2))',
+    return ((0, jsx_runtime_1.jsxs)(TagElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: styles, "data-type": type, mods: { closable: isClosable }, children: [icon ? (0, jsx_runtime_1.jsx)("div", { "data-element": "TagIcon", children: icon }, void 0) : null, (0, jsx_runtime_1.jsx)("div", { "data-element": "Content", children: children }, void 0), isClosable ? ((0, jsx_runtime_1.jsx)(Suffix_1.Suffix, { outerGap: "0", children: (0, jsx_runtime_1.jsx)(CloseAction, { styles: closeButtonStyles, onPress: onClose, children: (0, jsx_runtime_1.jsx)(icons_1.CloseOutlined, { style: {
+                            fontSize: 'var(--font-size, inherit)',
                         } }, void 0) }, void 0) }, void 0)) : undefined] }, void 0));
 }
 const _Tag = (0, react_1.forwardRef)(Tag);

package/cjs/components/content/Text.js

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

package/cjs/components/content/Title.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.13
  * Released under the MIT license.
  */
 
@@ -32,12 +32,21 @@ const TitleElement = (0, tasty_1.tasty)({
         },
         margin: '0',
         whiteSpace: {
-            '': 'initial',
+            '': 'inherit',
             'nowrap | ellipsis': 'nowrap',
         },
-        textOverflow: 'ellipsis',
-        overflow: 'hidden',
-        width: 'max 100%',
+        textOverflow: {
+            '': false,
+            ellipsis: 'ellipsis',
+        },
+        overflow: {
+            '': false,
+            ellipsis: 'hidden',
+        },
+        width: {
+            '': false,
+            ellipsis: 'max 100%',
+        },
     },
 });
 const _Title = (0, react_1.forwardRef)(function Title({ qa, as, styleName, inline, nowrap, ellipsis, level, ...props }, ref) {

package/cjs/components/forms/Checkbox/Checkbox.js

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

package/cjs/components/forms/Checkbox/CheckboxGroup.js

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

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

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

package/cjs/components/forms/FieldWrapper.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.13
  * Released under the MIT license.
  */
 
@@ -69,7 +69,10 @@ const MessageElement = (0, tasty_1.tasty)({
 });
 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;
+    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;
     const mods = {
         'has-sider': labelPosition === 'side',

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

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

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

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

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

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

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

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

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

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

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

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

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.13
  * 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.14.10
+ * @cube-dev/ui-kit v0.14.13
  * 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.14.10
+ * @cube-dev/ui-kit v0.14.13
  * 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.14.10
+ * @cube-dev/ui-kit v0.14.13
  * 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.14.10
+ * @cube-dev/ui-kit v0.14.13
  * Released under the MIT license.
  */
 
@@ -19,6 +19,11 @@ const TextInputBase_1 = require("../TextInput/TextInputBase");
 const tasty_1 = require("../../../tasty");
 const nullableValue_1 = require("../../../utils/react/nullableValue");
 const StepButton_1 = require("./StepButton");
+const StyledTextInputBase = (0, tasty_1.tasty)(TextInputBase_1.TextInputBase, {
+    wrapperStyles: {
+        width: '13x',
+    },
+});
 const StepperContainer = (0, tasty_1.tasty)({
     styles: {
         display: 'grid',
@@ -38,7 +43,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, 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, { isDisabled: props.isDisabled, direction: "up", ...incrementButtonProps, size: otherProps.size }, void 0), (0, jsx_runtime_1.jsx)(StepButton_1.StepButton, { isDisabled: props.isDisabled, direction: "down", ...decrementButtonProps, size: otherProps.size }, void 0)] }, void 0)) : (suffix) }, void 0));
+    return ((0, jsx_runtime_1.jsx)(StyledTextInputBase, { ...otherProps, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: "after", textAlign: "center", suffix: showStepper ? ((0, jsx_runtime_1.jsxs)(StepperContainer, { children: [(0, jsx_runtime_1.jsx)(StepButton_1.StepButton, { isDisabled: props.isDisabled, direction: "up", ...incrementButtonProps, size: otherProps.size }, void 0), (0, jsx_runtime_1.jsx)(StepButton_1.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.

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

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

package/cjs/components/forms/RangeSlider/Gradation.js

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

package/cjs/components/forms/RangeSlider/Header.js

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

package/cjs/components/forms/RangeSlider/RangeInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.13
  * Released under the MIT license.
  */
 
@@ -22,16 +22,16 @@ function calculateWidth(max, hasSuffix) {
     return `${value * charWidth}x`;
 }
 function RangeInput(props) {
-    const { state, index, suffix, min, max, ...otherProps } = props;
+    const { state, index, formatOptions, width, min, max, ...otherProps } = props;
+    const inputWidth = width || calculateWidth(max);
     const value = state.values[index];
-    const width = calculateWidth(max, !!suffix);
     const onChange = (0, react_1.useCallback)((value) => {
         state.setThumbValue(index, value);
     }, [index, state]);
     const maxLength = typeof max !== 'undefined' ? String(max).length : undefined;
     return ((0, jsx_runtime_1.jsx)(__1.NumberInput, { ...otherProps, hideStepper: true, size: "small", inputStyles: {
-            width,
-        }, suffix: suffix && (0, jsx_runtime_1.jsx)(__1.Flow, { padding: "1.5x right", children: suffix }, void 0), value: value, minValue: state.getThumbMinValue(index), maxValue: state.getThumbMaxValue(index), maxLength: maxLength, onChange: onChange }, void 0));
+            width: inputWidth,
+        }, formatOptions: formatOptions, value: value, minValue: state.getThumbMinValue(index), maxValue: state.getThumbMaxValue(index), maxLength: maxLength, onChange: onChange }, void 0));
 }
 exports.RangeInput = RangeInput;
 

package/cjs/components/forms/RangeSlider/RangeSlider.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.10
+ * @cube-dev/ui-kit v0.14.13
  * Released under the MIT license.
  */
 
@@ -21,7 +21,7 @@ const RangeInput_1 = require("./RangeInput");
 const styled_1 = require("./styled");
 const helpers_1 = require("./helpers");
 function RangeSlider(props, ref) {
-    let { labelPosition, label, extra, styles, isRequired, validationState, message, description, requiredMark, labelSuffix, labelStyles, necessityIndicator, defaultValue, value, gradation, step = 1, isDisabled, orientation = 'horizontal', showInput, inputStyles, inputSuffix, minValue, maxValue, onChange, onChangeEnd, ...otherProps } = props;
+    let { labelPosition, label, extra, styles, isRequired, validationState, message, description, requiredMark, labelSuffix, labelStyles, necessityIndicator, defaultValue, value, gradation, step = 1, isDisabled, orientation = 'horizontal', showInput, inputStyles, minValue, maxValue, inputWidth, formatOptions, onChange, onChangeEnd, ...otherProps } = props;
     const [min, max] = (0, helpers_1.getMinMaxValue)(minValue, maxValue, value || defaultValue);
     const ranges = (0, helpers_1.getRanges)(defaultValue || value || [0, 1]);
     const isSingle = ranges.length <= 1;
@@ -60,7 +60,6 @@ function RangeSlider(props, ref) {
         step,
         state,
         isDisabled,
-        suffix: inputSuffix,
         styles: inputStyles,
         min: baseProps.minValue,
         max: baseProps.maxValue,
@@ -68,7 +67,7 @@ function RangeSlider(props, ref) {
     const sliderField = ((0, jsx_runtime_1.jsxs)(styled_1.StyledSlider, { ...groupProps, mods: {
             sideLabel: labelPosition === 'side',
             inputs: showInput,
-        }, children: [!isSingle && showInput && (0, jsx_runtime_1.jsx)(RangeInput_1.RangeInput, { index: 0, ...inputProps }, void 0), (0, jsx_runtime_1.jsx)(styled_1.StyledContent, { children: (0, jsx_runtime_1.jsxs)(styled_1.StyledControls, { ...trackProps, ref: trackRef, children: [(0, jsx_runtime_1.jsx)(Slide_1.Slide, { state: state, ranges: ranges, isSingle: isSingle, isDisabled: isDisabled }, void 0), (0, jsx_runtime_1.jsx)(Gradation_1.Gradation, { state: state, ranges: ranges, values: gradation }, void 0), ranges.map((thumb) => ((0, jsx_runtime_1.jsx)(Thumb_1.Thumb, { index: thumb, state: state, inputRef: inputRef, trackRef: trackRef, isDisabled: isDisabled, defaultValue: baseProps.defaultValue && baseProps.defaultValue[thumb] }, thumb)))] }, void 0) }, void 0), showInput && (0, jsx_runtime_1.jsx)(RangeInput_1.RangeInput, { index: 1, ...inputProps }, void 0)] }, void 0));
+        }, children: [!isSingle && showInput && ((0, jsx_runtime_1.jsx)(RangeInput_1.RangeInput, { formatOptions: formatOptions, width: inputWidth, index: 0, ...inputProps }, void 0)), (0, jsx_runtime_1.jsx)(styled_1.StyledContent, { children: (0, jsx_runtime_1.jsxs)(styled_1.StyledControls, { ...trackProps, ref: trackRef, children: [(0, jsx_runtime_1.jsx)(Slide_1.Slide, { state: state, ranges: ranges, isSingle: isSingle, isDisabled: isDisabled }, void 0), (0, jsx_runtime_1.jsx)(Gradation_1.Gradation, { state: state, ranges: ranges, values: gradation }, void 0), ranges.map((thumb) => ((0, jsx_runtime_1.jsx)(Thumb_1.Thumb, { index: thumb, state: state, inputRef: inputRef, trackRef: trackRef, isDisabled: isDisabled, defaultValue: baseProps.defaultValue && baseProps.defaultValue[thumb] }, thumb)))] }, void 0) }, void 0), showInput && ((0, jsx_runtime_1.jsx)(RangeInput_1.RangeInput, { formatOptions: formatOptions, width: inputWidth, index: state.values.length > 1 ? 1 : 0, ...inputProps }, void 0))] }, void 0));
     styles = (0, tasty_1.extractStyles)(otherProps, tasty_1.OUTER_STYLES, styles);
     return ((0, jsx_runtime_1.jsx)(FieldWrapper_1.FieldWrapper, { ...{
             labelPosition,