@cube-dev/ui-kit 0.0.0-canary-9418eaf → 0.0.0-canary-1edc843

package/cjs/components/Base.js

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

package/cjs/components/Block.js

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

package/cjs/components/GlobalStyles.js

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

package/cjs/components/GridProvider.js

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

package/cjs/components/HiddenInput.js

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

package/cjs/components/OpenTrasition.js

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

package/cjs/components/Root.js

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

package/cjs/components/actions/Action.js

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

package/cjs/components/actions/Button/Button.js

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

package/cjs/components/actions/Button/Submit.js

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

package/cjs/components/actions/Button/index.js

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

package/cjs/components/actions/ButtonGroup/ButtonGroup.js

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

package/cjs/components/actions/index.js

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

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

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

package/cjs/components/content/Text.js

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

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * Released under the MIT license.
  */
 
@@ -73,7 +73,7 @@ function Checkbox(props, ref) {
     let originalProps = props;
     props = (0, provider_1.useProviderProps)(props);
     props = (0, Form_1.useFormProps)(props);
-    let { qa, isIndeterminate = false, isDisabled = false, insideForm, isRequired, autoFocus, children, label, extra, validationState, labelProps, labelStyles, labelPosition, necessityLabel, necessityIndicator, message, description, requiredMark = true, tooltip, isHidden, ...otherProps } = props;
+    let { qa, isIndeterminate = false, isDisabled = false, insideForm, isRequired, autoFocus, children, label, validationState, labelProps, labelStyles, labelPosition, necessityLabel, necessityIndicator, message, description, requiredMark = true, tooltip, isHidden, ...otherProps } = props;
     label = label || children;
     // Swap hooks depending on whether this checkbox is inside a CheckboxGroup.
     // This is a bit unorthodox. Typically, hooks cannot be called in a conditional,
@@ -142,7 +142,6 @@ function Checkbox(props, ref) {
                 as: 'label',
                 labelPosition,
                 label,
-                extra,
                 styles,
                 isRequired,
                 labelStyles,

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * Released under the MIT license.
  */
 
@@ -53,7 +53,7 @@ function CheckboxGroup(props, ref) {
     props = (0, nullableValue_1.castNullableArrayValue)(props);
     props = (0, provider_1.useProviderProps)(props);
     props = (0, Form_1.useFormProps)(props);
-    let { isDisabled, isRequired, necessityIndicator, necessityLabel, label, extra, labelPosition = 'top', validationState, children, orientation = 'vertical', message, description, labelStyles, requiredMark = true, tooltip, ...otherProps } = props;
+    let { isDisabled, isRequired, necessityIndicator, necessityLabel, label, labelPosition = 'top', validationState, children, orientation = 'vertical', message, description, labelStyles, requiredMark = true, tooltip, ...otherProps } = props;
     let domRef = (0, utils_1.useDOMRef)(ref);
     let wrapperContextStyles = (0, StylesProvider_1.useContextStyles)('CheckboxGroup_Wrapper', props);
     let groupContextStyles = (0, StylesProvider_1.useContextStyles)('CheckboxGroup', props);
@@ -82,7 +82,6 @@ function CheckboxGroup(props, ref) {
     return ((0, jsx_runtime_1.jsx)(FieldWrapper_1.FieldWrapper, { ...{
             labelPosition,
             label,
-            extra,
             styles,
             isRequired,
             labelStyles,

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * 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.0.0-canary-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * Released under the MIT license.
  */
 
@@ -10,66 +10,54 @@ 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 Base_1 = require("../Base");
 const Label_1 = require("./Label");
-const Grid_1 = require("../layout/Grid");
 const Paragraph_1 = require("../content/Paragraph");
 const TooltipProvider_1 = require("../overlays/Tooltip/TooltipProvider");
 const icons_1 = require("@ant-design/icons");
 const react_2 = require("../../utils/react");
-const styled_1 = require("../../styled");
-const RawField = (0, styled_1.styled)({
-    props: {
-        qa: 'Field',
+const FIELD_STYLES = {
+    display: 'grid',
+    gridColumns: {
+        '': '1fr',
+        'has-sider': '@(label-width, auto) 1fr',
     },
-    styles: {
-        display: 'grid',
-        gridColumns: {
-            '': '1fr',
-            'has-sider': '@(label-width, auto) 1fr',
-        },
-        gap: {
-            '': '1x',
-            'has-sider': '@(column-gap, 1x)',
-        },
-        placeItems: 'baseline stretch',
-        LabelArea: {
-            display: 'block',
-            width: {
-                '': 'initial',
-                'has-sider': '@label-width',
-            },
-        },
-        InputArea: {
-            display: 'block',
-            flow: 'column',
-            gridColumn: {
-                '': 'initial',
-                'has-sider': 2,
-            },
-        },
+    gap: {
+        '': '1x',
+        'has-sider': '@(column-gap, 1x)',
     },
-});
-const RawMessage = (0, styled_1.styled)({
-    props: {
-        qa: 'Field_Message',
+    placeItems: 'baseline stretch',
+    LabelArea: {
+        display: 'block',
+        width: {
+            '': 'initial',
+            'has-sider': '@label-width',
+        },
     },
-    styles: {
-        preset: 'default',
-        color: {
-            '': '#dark.75',
-            invalid: '#danger-text',
-            valid: '#success-text',
-            disabled: '#dark.40',
+    InputArea: {
+        display: 'block',
+        flow: 'column',
+        gridColumn: {
+            '': 'initial',
+            'has-sider': 2,
         },
-        fontWeight: 400,
-        textAlign: 'left',
-        userSelect: 'none',
     },
-});
+};
+const MESSAGE_STYLES = {
+    preset: 'default',
+    color: {
+        '': '#dark.75',
+        invalid: '#danger-text',
+        valid: '#success-text',
+        disabled: '#dark.40',
+    },
+    fontWeight: 400,
+    textAlign: 'left',
+    userSelect: 'none',
+};
 function FieldWrapper(props, ref) {
-    const { as, labelPosition, label, extra, styles, isRequired, isDisabled, labelStyles, necessityIndicator, labelProps, fieldProps, message, messageStyles, description, Component, validationState, requiredMark = true, tooltip, isHidden, } = props;
-    const labelComponent = label ? ((0, jsx_runtime_1.jsxs)(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: [extra ? ((0, jsx_runtime_1.jsxs)(Grid_1.Grid, { placeContent: "baseline space-between", flow: "column", children: [(0, jsx_runtime_1.jsx)("div", { children: label }, void 0), (0, jsx_runtime_1.jsx)(Text_1.Text, { preset: "t3", children: extra }, void 0)] }, void 0)) : (label), tooltip ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["\u00A0", (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)] }, void 0)) : null] }, void 0)) : null;
+    const { as, labelPosition, label, styles, isRequired, isDisabled, labelStyles, necessityIndicator, labelProps, fieldProps, message, messageStyles, description, Component, validationState, requiredMark = true, tooltip, isHidden, } = props;
+    const labelComponent = label ? ((0, jsx_runtime_1.jsxs)(Label_1.Label, { as: as === 'label' ? 'div' : 'label', styles: labelStyles, labelPosition: labelPosition, isRequired: requiredMark ? isRequired : false, isDisabled: isDisabled, necessityIndicator: necessityIndicator, validationState: validationState, ...labelProps, children: [label, tooltip ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["\u00A0", (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)] }, void 0)) : null] }, 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',
@@ -77,7 +65,13 @@ function FieldWrapper(props, ref) {
         invalid: validationState === 'invalid',
         valid: validationState === 'valid',
     };
-    return ((0, jsx_runtime_1.jsxs)(RawField, { 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)(RawMessage, { mods: mods, styles: messageStyles, role: validationState === 'invalid' ? 'alert' : undefined, children: message }, void 0))] }, void 0)] }, void 0));
+    return ((0, jsx_runtime_1.jsxs)(Base_1.Base, { as: as || 'div', qa: "Field", ref: ref, mods: mods, isHidden: isHidden, styles: {
+            ...FIELD_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)(Base_1.Base, { qa: "Field_Message", mods: mods, styles: {
+                            ...MESSAGE_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.0.0-canary-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * Released under the MIT license.
  */
 
@@ -73,7 +73,7 @@ function extractContents(element, callback) {
     }
 }
 function FileInput(props, ref) {
-    let { id, name, qa, qaVal, onChange, placeholder, inputRef, label, extra, labelPosition, isRequired, necessityIndicator, necessityLabel, labelStyles, labelProps, isDisabled, validationState, message, description, requiredMark, tooltip, isHidden, inputStyles, type = 'file', ...otherProps } = (0, provider_1.useProviderProps)(props);
+    let { id, name, qa, qaVal, onChange, placeholder, inputRef, label, labelPosition, isRequired, necessityIndicator, necessityLabel, labelStyles, labelProps, isDisabled, validationState, message, description, requiredMark, tooltip, isHidden, inputStyles, type = 'file', ...otherProps } = (0, provider_1.useProviderProps)(props);
     const [value, setValue] = (0, react_1.useState)();
     const [dragHover, setDragHover] = (0, react_1.useState)(false);
     let domRef = (0, react_1.useRef)(null);
@@ -125,7 +125,6 @@ function FileInput(props, ref) {
     return ((0, jsx_runtime_1.jsx)(FieldWrapper_1.FieldWrapper, { ...{
             labelPosition,
             label,
-            extra,
             styles,
             isRequired,
             labelStyles,

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * Released under the MIT license.
  */
 
@@ -86,7 +86,7 @@ function getValueProps(type, value, onChange) {
 }
 function Field(allProps) {
     const props = (0, Form_1.useFormProps)(allProps);
-    let { defaultValue, type: inputType, id, idPrefix, children, name, form, rules, label, extra, validateTrigger, validationState, necessityLabel, necessityIndicator, shouldUpdate, message, description, tooltip, isHidden, } = props;
+    let { defaultValue, type: inputType, id, idPrefix, children, name, form, rules, label, validateTrigger, validationState, necessityLabel, necessityIndicator, shouldUpdate, message, description, tooltip, isHidden, } = props;
     const nonInput = !name;
     const fieldName = name != null ? (Array.isArray(name) ? name.join('.') : name) : '';
     let firstRunRef = (0, react_1.useRef)(true);
@@ -126,7 +126,7 @@ function Field(allProps) {
         return null;
     let child = react_1.Children.only(children);
     if (nonInput) {
-        return ((0, jsx_runtime_1.jsx)(FieldWrapper_1.FieldWrapper, { isHidden: isHidden, validationState: validationState, necessityIndicator: necessityIndicator, necessityLabel: necessityLabel, isRequired: isRequired, label: label, extra: extra, tooltip: tooltip, message: message, description: description, Component: child }, void 0));
+        return ((0, jsx_runtime_1.jsx)(FieldWrapper_1.FieldWrapper, { isHidden: isHidden, validationState: validationState, necessityIndicator: necessityIndicator, necessityLabel: necessityLabel, isRequired: isRequired, label: label, tooltip: tooltip, message: message, description: description, Component: child }, void 0));
     }
     if (!fieldName) {
         console.error('invalid form name:', fieldName);
@@ -136,8 +136,8 @@ function Field(allProps) {
         console.error('form field requires declared form instance');
         return null;
     }
-    inputType =
-        inputType || child.type.cubeInputType || 'Text';
+    // @ts-ignore
+    inputType = inputType || child.type.cubeInputType || 'Text';
     const defaultValidateTrigger = getDefaultValidateTrigger(inputType);
     if (firstRunRef.current && defaultValue != null) {
         if (!field) {
@@ -175,8 +175,8 @@ function Field(allProps) {
             }
         }
         form.setFieldValue(fieldName, val, true);
-        if (validateTrigger === 'onChange' ||
-            (field && field.errors && field.errors.length)) {
+        if (validateTrigger === 'onChange'
+            || (field && field.errors && field.errors.length)) {
             form.validateField(fieldName).catch(() => { }); // do nothing on fail
         }
     }
@@ -207,9 +207,6 @@ function Field(allProps) {
     if (label) {
         newProps.label = label;
     }
-    if (extra) {
-        newProps.extra = extra;
-    }
     if (tooltip) {
         newProps.tooltip = tooltip;
     }

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-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * 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.0.0-canary-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * 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-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * 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.0.0-canary-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * 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-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * 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-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * Released under the MIT license.
  */
 

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-9418eaf
+ * @cube-dev/ui-kit v0.0.0-canary-1edc843
  * Released under the MIT license.
  */