@cube-dev/ui-kit 0.12.3 → 0.12.4

package/cjs/components/content/Footer.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -22,10 +22,10 @@ const FooterElement = (0, tasty_1.tasty)({
         flow: 'column',
     },
 });
-exports.Footer = (0, react_1.forwardRef)((props, ref) => {
+exports.Footer = (0, react_1.forwardRef)(function Footer(props, ref) {
     props = (0, react_2.useSlotProps)(props, 'footer');
     const styles = (0, tasty_1.extractStyles)(props, STYLE_LIST);
-    return ((0, jsx_runtime_1.jsx)(FooterElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+    return ((0, jsx_runtime_1.jsx)(FooterElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: styles }, void 0));
 });
 
         

package/cjs/components/content/Header.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -22,10 +22,10 @@ const HeaderElement = (0, tasty_1.tasty)({
         flow: 'column',
     },
 });
-exports.Header = (0, react_1.forwardRef)((props, ref) => {
+exports.Header = (0, react_1.forwardRef)(function Header(props, ref) {
     props = (0, react_2.useSlotProps)(props, 'header');
     const styles = (0, tasty_1.extractStyles)(props, STYLE_LIST);
-    return ((0, jsx_runtime_1.jsx)(HeaderElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+    return ((0, jsx_runtime_1.jsx)(HeaderElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: styles }, void 0));
 });
 
         

package/cjs/components/content/Paragraph.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -10,17 +10,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Paragraph = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const Text_1 = require("./Text");
 const tasty_1 = require("../../tasty");
+const Text_1 = require("./Text");
 const DEFAULT_STYLES = {
     preset: 'p3',
     color: '#dark.75',
     display: 'block',
 };
 const STYLE_PROPS = [...tasty_1.CONTAINER_STYLES, ...tasty_1.TEXT_STYLES];
-exports.Paragraph = (0, react_1.forwardRef)((props, ref) => {
+exports.Paragraph = (0, react_1.forwardRef)(function Paragraph(props, ref) {
     const styles = (0, tasty_1.extractStyles)(props, STYLE_PROPS, DEFAULT_STYLES);
-    return (0, jsx_runtime_1.jsx)(Text_1.Text, { as: "p", qa: "Paragraph", ...props, styles: styles, ref: ref }, void 0);
+    return (0, jsx_runtime_1.jsx)(Text_1.Text, { as: "p", qa: "Paragraph", ...props, ref: ref, styles: styles }, void 0);
 });
 
         

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -13,8 +13,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Placeholder = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const tasty_1 = require("../../../tasty");
 const styled_components_1 = __importDefault(require("styled-components"));
+const tasty_1 = require("../../../tasty");
 const PlaceholderElement = (0, tasty_1.tasty)({
     role: 'alert',
     'aria-live': 'polite',
@@ -53,15 +53,15 @@ const StyledPlaceholder = (0, styled_components_1.default)(PlaceholderElement) `
     }
   }
 `;
-exports.Placeholder = (0, react_1.forwardRef)((allProps, ref) => {
+exports.Placeholder = (0, react_1.forwardRef)(function Placeholder(allProps, ref) {
     let { size = '2x', circle, ...props } = allProps;
     let styles = (0, tasty_1.extractStyles)(props, tasty_1.CONTAINER_STYLES);
-    return ((0, jsx_runtime_1.jsx)(StyledPlaceholder, { role: "region", ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), styles: {
+    return ((0, jsx_runtime_1.jsx)(StyledPlaceholder, { role: "region", ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: {
             height: size,
             width: circle ? size : false,
             radius: circle ? '9999rem' : '1r',
             ...styles,
-        }, ref: ref }, void 0));
+        } }, void 0));
 });
 
         

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.12.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.12.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -13,11 +13,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Tag = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 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 Suffix_1 = require("../../layout/Suffix");
-const icons_1 = require("@ant-design/icons");
 const TagElement = (0, tasty_1.tasty)({
     qa: 'Tag',
     role: 'status',
@@ -81,13 +81,13 @@ const CloseAction = (0, tasty_1.tasty)(Action_1.Action, {
         padding: '0 .5x',
     },
 });
-const Tag = (allProps, ref) => {
+function Tag(allProps, ref) {
     let { type, 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 }), styles: styles, "data-type": type, mods: { closable: isClosable }, ref: ref, 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: {
+    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))',
                         } }, void 0) }, void 0) }, void 0)) : undefined] }, void 0));
-};
+}
 const _Tag = (0, react_1.forwardRef)(Tag);
 exports.Tag = _Tag;
 

package/cjs/components/content/Text.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -52,23 +52,23 @@ const _Text = (0, react_1.forwardRef)(function Text(allProps, ref) {
     return ((0, jsx_runtime_1.jsx)(TextElement, { as: as || 'span', qa: qa || 'Text', styleName: styleName, mods: {
             nowrap,
             ellipsis,
-        }, block: !!(block || ellipsis), ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), styles: styles, ref: ref }, void 0));
+        }, block: !!(block || ellipsis), ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: styles }, void 0));
 });
 const Text = Object.assign(_Text, {
     Minor: (0, react_1.forwardRef)(function MinorText(props, ref) {
         return (0, jsx_runtime_1.jsx)(_Text, { ref: ref, color: "#minor", ...props }, void 0);
     }),
     Danger: (0, react_1.forwardRef)(function DangerText(props, ref) {
-        return (0, jsx_runtime_1.jsx)(_Text, { role: "alert", ref: ref, color: "#danger-text", ...props }, void 0);
+        return (0, jsx_runtime_1.jsx)(_Text, { ref: ref, role: "alert", color: "#danger-text", ...props }, void 0);
     }),
     Success: (0, react_1.forwardRef)(function SuccessText(props, ref) {
         return (0, jsx_runtime_1.jsx)(_Text, { ref: ref, color: "#success-text", ...props }, void 0);
     }),
     Strong: (0, react_1.forwardRef)(function StrongText(props, ref) {
-        return ((0, jsx_runtime_1.jsx)(_Text, { as: "strong", preset: "strong", ref: ref, color: "#dark", ...props }, void 0));
+        return ((0, jsx_runtime_1.jsx)(_Text, { ref: ref, as: "strong", preset: "strong", color: "#dark", ...props }, void 0));
     }),
     Emphasis: (0, react_1.forwardRef)(function EmphasisText(props, ref) {
-        return (0, jsx_runtime_1.jsx)(_Text, { as: "em", preset: "em", ref: ref, ...props }, void 0);
+        return (0, jsx_runtime_1.jsx)(_Text, { ref: ref, as: "em", preset: "em", ...props }, void 0);
     }),
     Selection: (0, react_1.forwardRef)(function SelectionText(props, ref) {
         return (0, jsx_runtime_1.jsx)(_Text, { ref: ref, color: "#dark", fill: "#note.30", ...props }, void 0);

package/cjs/components/content/Title.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -10,9 +10,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Title = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const Text_1 = require("./Text");
 const tasty_1 = require("../../tasty");
 const react_2 = require("../../utils/react");
+const Text_1 = require("./Text");
 const STYLE_LIST = [...tasty_1.TEXT_STYLES, ...tasty_1.CONTAINER_STYLES];
 const TitleElement = (0, tasty_1.tasty)({
     qa: 'Title',
@@ -40,14 +40,14 @@ const TitleElement = (0, tasty_1.tasty)({
         width: 'max 100%',
     },
 });
-const _Title = (0, react_1.forwardRef)(({ qa, as, styleName, inline, nowrap, ellipsis, level, ...props }, ref) => {
+const _Title = (0, react_1.forwardRef)(function Title({ qa, as, styleName, inline, nowrap, ellipsis, level, ...props }, ref) {
     const propsWithSlots = (0, react_2.useSlotProps)(props, 'heading');
     const tag = `h${level || 1}`;
     const styles = (0, tasty_1.extractStyles)(propsWithSlots, STYLE_LIST, {}, Text_1.TEXT_PROP_MAP);
     return ((0, jsx_runtime_1.jsx)(TitleElement, { qa: qa || 'Title', as: as || tag, styleName: styleName, "data-level": level || 1, mods: {
             nowrap,
             ellipsis,
-        }, inline: inline, ...(0, tasty_1.filterBaseProps)(propsWithSlots, { eventProps: true }), styles: styles, ref: ref }, void 0));
+        }, inline: inline, ...(0, tasty_1.filterBaseProps)(propsWithSlots, { eventProps: true }), ref: ref, styles: styles }, void 0));
 });
 const Title = Object.assign(_Title, {
     Danger: (0, react_1.forwardRef)(function DangerTitle(props, ref) {

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -22,11 +22,15 @@ const Label_1 = require("../Label");
 const HiddenInput_1 = require("../../HiddenInput");
 const Form_1 = require("../Form");
 const FieldWrapper_1 = require("../FieldWrapper");
+const nullableValue_1 = require("../../../utils/react/nullableValue");
 const CheckboxGroup_1 = require("./CheckboxGroup");
 const context_1 = require("./context");
-const nullableValue_1 = require("../../../utils/react/nullableValue");
-const CheckOutlined = () => ((0, jsx_runtime_1.jsx)("svg", { width: "10", height: "8", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M3.417 7.604l-.017.018-3.4-3.4 1.433-1.433 1.985 1.985L8.192 0l1.432 1.433-6.189 6.189-.018-.018z", fill: "currentColor" }, void 0) }, void 0));
-const IndeterminateOutline = () => ((0, jsx_runtime_1.jsx)("svg", { width: "9", height: "3", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M0 .044v2.001l.026.025h8.063V.044H0z", fill: "#fff" }, void 0) }, void 0));
+function CheckOutlined() {
+    return ((0, jsx_runtime_1.jsx)("svg", { width: "10", height: "8", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M3.417 7.604l-.017.018-3.4-3.4 1.433-1.433 1.985 1.985L8.192 0l1.432 1.433-6.189 6.189-.018-.018z", fill: "currentColor" }, void 0) }, void 0));
+}
+function IndeterminateOutline() {
+    return ((0, jsx_runtime_1.jsx)("svg", { width: "9", height: "3", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M0 .044v2.001l.026.025h8.063V.044H0z", fill: "#fff" }, void 0) }, void 0));
+}
 const CheckboxWrapperElement = (0, tasty_1.tasty)({
     as: 'label',
     qa: 'CheckboxWrapper',

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -11,14 +11,14 @@ exports.CheckboxGroup = 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 checkbox_1 = require("@react-aria/checkbox");
 const checkbox_2 = require("@react-stately/checkbox");
+const provider_1 = require("../../../provider");
 const Form_1 = require("../Form/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 WRAPPER_STYLES = {
     display: 'grid',
     gridColumns: {

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -10,15 +10,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FieldWrapper = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const Text_1 = require("../content/Text");
-const Label_1 = require("./Label");
+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 icons_1 = require("@ant-design/icons");
+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: {
@@ -70,7 +70,7 @@ 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: "1x", children: [(0, jsx_runtime_1.jsx)("div", { children: label }, void 0), tooltip ? ((0, jsx_runtime_1.jsx)(TooltipProvider_1.TooltipProvider, { title: tooltip, activeWrap: true, width: "initial max-content 40x", children: (0, jsx_runtime_1.jsx)(icons_1.InfoCircleOutlined, { style: { color: 'var(--primary-color)' } }, 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',
@@ -78,7 +78,7 @@ function FieldWrapper(props, ref) {
         invalid: validationState === 'invalid',
         valid: validationState === 'valid',
     };
-    return ((0, jsx_runtime_1.jsxs)(FieldElement, { as: as || 'div', ref: ref, 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));
+    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.

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -10,10 +10,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FileInput = 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 Action_1 = require("../../actions/Action");
 const tasty_1 = require("../../../tasty");
-const utils_1 = require("@react-spectrum/utils");
 const FieldWrapper_1 = require("../FieldWrapper");
 const FileInputElement = (0, tasty_1.tasty)(Action_1.Action, {
     styles: {
@@ -110,7 +110,7 @@ function FileInput(props, ref) {
             return inputRef === null || inputRef === void 0 ? void 0 : inputRef.current;
         },
     }));
-    const fileInput = ((0, jsx_runtime_1.jsxs)(FileInputElement, { qa: qa || 'FileInput', styles: inputStyles, isDisabled: isDisabled, ref: domRef, mods: {
+    const fileInput = ((0, jsx_runtime_1.jsxs)(FileInputElement, { ref: domRef, qa: qa || 'FileInput', styles: inputStyles, isDisabled: isDisabled, mods: {
             selected: !!value,
             'drag-hover': dragHover,
         }, onKeyDown: (e) => {
@@ -118,7 +118,7 @@ function FileInput(props, ref) {
             if (e.key === 'Enter' || e.key === 'Space') {
                 (_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.click();
             }
-        }, children: [(0, jsx_runtime_1.jsx)("input", { id: id, name: name, ref: inputRef, onChange: onLocalChange, "data-element": "Input", type: "file", tabIndex: -1, onDragEnter: () => {
+        }, children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, id: id, name: name, "data-element": "Input", type: "file", tabIndex: -1, onChange: onLocalChange, onDragEnter: () => {
                     setDragHover(true);
                 }, onDragLeave: () => {
                     setDragHover(false);

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -10,10 +10,10 @@ 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 react_2 = require("../../../utils/react");
 const FieldWrapper_1 = require("../FieldWrapper");
 const warnings_1 = require("../../../utils/warnings");
+const Form_1 = require("./Form");
 const ID_MAP = {};
 function createId(name) {
     if (!name)

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -10,12 +10,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Form = exports.useFormProps = exports.FormContext = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const utils_1 = require("@react-spectrum/utils");
-const provider_1 = require("../../../provider");
 const react_1 = require("react");
+const provider_1 = require("../../../provider");
 const tasty_1 = require("../../../tasty");
-const useForm_1 = require("./useForm");
 const react_2 = require("../../../utils/react");
 const promise_1 = require("../../../utils/promise");
+const useForm_1 = require("./useForm");
 exports.FormContext = (0, react_1.createContext)({});
 const FormElement = (0, tasty_1.tasty)({
     as: 'form',
@@ -112,7 +112,7 @@ function Form(props, ref) {
             form === null || form === void 0 ? void 0 : form.setInitialFieldsValue(defaultValues);
         }
     }, [defaultValues]);
-    return ((0, jsx_runtime_1.jsx)(FormElement, { ...(0, tasty_1.filterBaseProps)(otherProps, { propNames: formPropNames }), onSubmit: onSubmitCallback, noValidate: true, styles: styles, ref: domRef, mods: { 'has-sider': labelPosition === 'side' }, children: (0, jsx_runtime_1.jsx)(exports.FormContext.Provider, { value: ctx, children: (0, jsx_runtime_1.jsx)(provider_1.Provider, { insideForm: true, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, validationState: validationState, children: children }, void 0) }, void 0) }, void 0));
+    return ((0, jsx_runtime_1.jsx)(FormElement, { ...(0, tasty_1.filterBaseProps)(otherProps, { propNames: formPropNames }), ref: domRef, noValidate: true, styles: styles, mods: { 'has-sider': labelPosition === 'side' }, onSubmit: onSubmitCallback, children: (0, jsx_runtime_1.jsx)(exports.FormContext.Provider, { value: ctx, children: (0, jsx_runtime_1.jsx)(provider_1.Provider, { insideForm: true, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, validationState: validationState, children: children }, void 0) }, void 0) }, void 0));
 }
 /**
  * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.12.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.12.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.12.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -64,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.3
+ * @cube-dev/ui-kit v0.12.4
  * 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.3
+ * @cube-dev/ui-kit v0.12.4
  * Released under the MIT license.
  */
 
@@ -9,8 +9,8 @@
 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 = {
     width: '4x',
     radius: {
@@ -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));