@cube-dev/ui-kit 0.0.0-canary-bd61b85 → 0.0.0-canary-e2baff7

package/es/components/forms/Checkbox/Checkbox.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
@@ -17,7 +17,7 @@ import { useFocus } from '../../../utils/react/interactions';
 import { mergeProps } from '../../../utils/react';
 import { INLINE_LABEL_STYLES, LABEL_STYLES } from '../Label';
 import { HiddenInput } from '../../HiddenInput';
-import { useFieldProps } from '../Form';
+import { useFormProps } from '../Form';
 import { FieldWrapper } from '../FieldWrapper';
 import { castNullableIsSelected, } from '../../../utils/react/nullableValue';
 import { CheckboxGroup } from './CheckboxGroup';
@@ -77,24 +77,16 @@ const CheckboxElement = tasty({
     },
 });
 function Checkbox(props, ref) {
-    // Swap hooks depending on whether this checkbox is inside a CheckboxGroup.
-    // This is a bit unorthodox. Typically, hooks cannot be called in a conditional,
-    // but since the checkbox won't move in and out of a group, it should be safe.
-    const groupState = useContext(CheckboxGroupContext);
-    const originalProps = props;
     props = castNullableIsSelected(props);
+    let originalProps = props;
     props = useProviderProps(props);
-    props = useFieldProps(props, {
-        defaultValidationTrigger: 'onChange',
-        valuePropsMapper: ({ value, onChange }) => ({
-            isSelected: value ?? false,
-            isIndeterminate: false,
-            onChange: onChange,
-        }),
-        isDisabled: !!groupState,
-    });
+    props = 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, labelSuffix, ...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,
+    // but since the checkbox won't move in and out of a group, it should be safe.
+    let groupState = useContext(CheckboxGroupContext);
     let styles = extractStyles(props, OUTER_STYLES);
     let inputStyles = extractStyles(props, BLOCK_STYLES);
     labelStyles = {
@@ -178,6 +170,7 @@ function Checkbox(props, ref) {
  * or to mark one individual item as selected.
  */
 let _Checkbox = forwardRef(Checkbox);
+_Checkbox.cubeInputType = 'Checkbox';
 let __Checkbox = Object.assign(_Checkbox, { Group: CheckboxGroup });
 export { __Checkbox as Checkbox };
 

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

@@ -1,16 +1,17 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
+import { useDOMRef } from '@react-spectrum/utils';
 import { useCheckboxGroup } from '@react-aria/checkbox';
 import { useCheckboxGroupState } from '@react-stately/checkbox';
 import { useProviderProps } from '../../../provider';
-import { FormContext, useFieldProps } from '../Form';
+import { FormContext, useFormProps } from '../Form/Form';
 import { BLOCK_STYLES, extractStyles, OUTER_STYLES, tasty, } from '../../../tasty';
 import { FieldWrapper } from '../FieldWrapper';
 import { castNullableArrayValue, } from '../../../utils/react/nullableValue';
@@ -44,26 +45,22 @@ const CheckGroupElement = tasty({
         padding: '(1x - 1bw) 0',
     },
 });
-/**
- * Checkbox groups allow users to select a single option from a list of mutually exclusive options.
- * All possible options are exposed up front for users to compare.
- */
-export const CheckboxGroup = forwardRef(function CheckboxGroup(props, ref) {
+function CheckboxGroup(props, ref) {
     props = castNullableArrayValue(props);
     props = useProviderProps(props);
-    props = useFieldProps(props, {
-        defaultValidationTrigger: 'onChange',
-        valuePropsMapper: ({ value, onChange }) => ({
-            value: value != null ? value : [],
-            onChange: onChange,
-        }),
-    });
-    const { isDisabled, isRequired, necessityIndicator, necessityLabel, label, extra, labelPosition = 'top', validationState, children, orientation = 'vertical', message, description, labelStyles, requiredMark = true, tooltip, labelSuffix, ...otherProps } = props;
-    const styles = extractStyles(otherProps, OUTER_STYLES, WRAPPER_STYLES);
-    const groupStyles = extractStyles(otherProps, BLOCK_STYLES);
-    const state = useCheckboxGroupState(props);
-    const { groupProps, labelProps } = useCheckboxGroup(props, state);
-    const radioGroup = (_jsx(CheckGroupElement, { styles: groupStyles, mods: { horizontal: orientation === 'horizontal' }, children: _jsx(FormContext.Provider, { value: { isDisabled, validationState }, children: _jsx(CheckboxGroupContext.Provider, { value: state, children: children }, void 0) }, void 0) }, void 0));
+    props = useFormProps(props);
+    let { isDisabled, isRequired, necessityIndicator, necessityLabel, label, extra, labelPosition = 'top', validationState, children, orientation = 'vertical', message, description, labelStyles, requiredMark = true, tooltip, labelSuffix, ...otherProps } = props;
+    let domRef = useDOMRef(ref);
+    let styles = extractStyles(otherProps, OUTER_STYLES, WRAPPER_STYLES);
+    let groupStyles = extractStyles(otherProps, BLOCK_STYLES);
+    let state = useCheckboxGroupState(props);
+    let { groupProps, labelProps } = useCheckboxGroup(props, state);
+    let radioGroup = (_jsx(CheckGroupElement, { styles: groupStyles, mods: {
+            horizontal: orientation === 'horizontal',
+        }, children: _jsx(FormContext.Provider, { value: {
+                isDisabled,
+                validationState,
+            }, children: _jsx(CheckboxGroupContext.Provider, { value: state, children: children }, void 0) }, void 0) }, void 0));
     return (_jsx(FieldWrapper, { ...{
             labelPosition,
             label,
@@ -83,8 +80,15 @@ export const CheckboxGroup = forwardRef(function CheckboxGroup(props, ref) {
             tooltip,
             labelSuffix,
             Component: radioGroup,
-            ref,
+            ref: domRef,
         } }, void 0));
-});
+}
+/**
+ * Checkbox groups allow users to select a single option from a list of mutually exclusive options.
+ * All possible options are exposed up front for users to compare.
+ */
+const _CheckboxGroup = forwardRef(CheckboxGroup);
+_CheckboxGroup.cubeInputType = 'CheckboxGroup';
+export { _CheckboxGroup as CheckboxGroup };
 
         

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

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

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

@@ -1,21 +1,21 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { InfoCircleOutlined } from '@ant-design/icons';
-import { Paragraph } from '../../content/Paragraph';
-import { tasty } from '../../../tasty';
-import { TooltipProvider } from '../../overlays/Tooltip/TooltipProvider';
-import { Text } from '../../content/Text';
-import { wrapNodeIfPlain } from '../../../utils/react';
-import { Space } from '../../layout/Space';
-import { Flex } from '../../layout/Flex';
-import { Label } from '../Label';
+import { Paragraph } from '../content/Paragraph';
+import { tasty } from '../../tasty';
+import { TooltipProvider } from '../overlays/Tooltip/TooltipProvider';
+import { Text } from '../content/Text';
+import { wrapNodeIfPlain } from '../../utils/react';
+import { Space } from '../layout/Space';
+import { Flex } from '../layout/Flex';
+import { Label } from './Label';
 const FieldElement = tasty({
     qa: 'Field',
     styles: {
@@ -50,9 +50,6 @@ const FieldElement = tasty({
         },
     },
 });
-if (process.env.NODE_ENV === 'development') {
-    FieldElement.displayName = 'FieldWrapperElement';
-}
 const MessageElement = tasty({
     qa: 'Field_Message',
     styles: {
@@ -68,11 +65,7 @@ const MessageElement = tasty({
         userSelect: 'none',
     },
 });
-/**
- * A wrapper for form fields to provide additional decoration for inputs.
- * @internal Do not use this component directly.
- */
-export const FieldWrapper = forwardRef(function FieldWrapper(props, ref) {
+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 ? (_jsx(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: _jsxs(Flex, { placeContent: "baseline space-between", width: "100%", children: [_jsxs(Space, { placeItems: "center", gap: "0.25x", children: [_jsx("div", { children: label }, void 0), tooltip ? (_jsx(TooltipProvider, { activeWrap: true, title: tooltip, width: "initial max-content 40x", children: _jsx(InfoCircleOutlined, { style: { color: 'var(--primary-color)', margin: '0 4px' } }, void 0) }, void 0)) : null, _jsx("div", { children: labelSuffix }, void 0)] }, void 0), extra && _jsx(Text, { preset: "t3", children: extra }, void 0)] }, void 0) }, void 0)) : null;
     let descriptionComponent = description ? (_jsx("div", { "data-element": "Description", children: wrapNodeIfPlain(description, () => (_jsx(Paragraph, { children: description }, void 0))) }, void 0)) : null;
@@ -82,7 +75,12 @@ export const FieldWrapper = forwardRef(function FieldWrapper(props, ref) {
         invalid: validationState === 'invalid',
         valid: validationState === 'valid',
     };
-    return (_jsxs(FieldElement, { ref: ref, as: as ?? 'div', mods: mods, isHidden: isHidden, styles: styles, ...fieldProps, children: [labelComponent || descriptionComponent ? (_jsxs("div", { "data-element": "LabelArea", children: [labelComponent, descriptionComponent] }, void 0)) : null, _jsxs("div", { "data-element": "InputArea", children: [Component, message && !isDisabled && (_jsx(MessageElement, { mods: mods, styles: messageStyles, role: validationState === 'invalid' ? 'alert' : undefined, children: message }, void 0))] }, void 0)] }, void 0));
-});
+    return (_jsxs(FieldElement, { ref: ref, as: as || 'div', mods: mods, isHidden: isHidden, styles: styles, ...fieldProps, children: [labelComponent || descriptionComponent ? (_jsxs("div", { "data-element": "LabelArea", children: [labelComponent, descriptionComponent] }, void 0)) : null, _jsxs("div", { "data-element": "InputArea", children: [Component, message && !isDisabled && (_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 = forwardRef(FieldWrapper);
+export { _FieldWrapper as FieldWrapper };
 
         

package/es/components/forms/FileInput/FileInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
@@ -9,7 +9,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useCallback, useImperativeHandle, useRef, useState, } from 'react';
 import { createFocusableRef } from '@react-spectrum/utils';
 import { useProviderProps } from '../../../provider';
-import { Action } from '../../actions';
+import { Action } from '../../actions/Action';
 import { CONTAINER_STYLES, extractStyles, tasty, } from '../../../tasty';
 import { FieldWrapper } from '../FieldWrapper';
 const FileInputElement = tasty(Action, {

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

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

package/es/components/forms/Form/Form.js

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

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

@@ -1,16 +1,14 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
-import { Submit } from './Submit';
 import { Field } from './Field';
 import { useForm } from './useForm';
 import { useFormProps, FormContext, Form as _Form } from './Form';
-const Form = Object.assign(_Form, { Item: Field, useForm, Submit });
-export { useFormProps, Form, Field, useForm, FormContext, Submit };
-export * from './Field';
+const Form = Object.assign(_Form, { Item: Field, useForm });
+export { useFormProps, Form, Field, useForm, FormContext };
 
         

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

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

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
@@ -212,7 +212,6 @@ export class CubeFormInstance {
         if (!skipRender) {
             this.forceReRender();
         }
-        return this.fields[name];
     }
     removeField(name, skipRender) {
         if (this.fields[name]) {

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

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

package/es/components/forms/Input/Input.js

@@ -1,16 +1,20 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
-import { TextInput } from '../TextInput';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { TextInput } from '../TextInput/TextInput';
 import { PasswordInput } from '../PasswordInput/PasswordInput';
 import { NumberInput } from '../NumberInput/NumberInput';
 import { FileInput } from '../FileInput/FileInput';
 import { TextArea } from '../TextArea/TextArea';
-export const Input = Object.assign(TextInput, {
+export const Input = Object.assign(forwardRef(function Input(props, ref) {
+    return _jsx(TextInput, { ref: ref, ...props }, void 0);
+}), {
     Text: TextInput,
     Password: PasswordInput,
     Number: NumberInput,

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

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

package/es/components/forms/Label.js

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

package/es/components/forms/NumberInput/NumberInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
@@ -10,9 +10,9 @@ import { forwardRef, useRef } from 'react';
 import { useLocale } from '@react-aria/i18n';
 import { useNumberFieldState } from '@react-stately/numberfield';
 import { useNumberField } from '@react-aria/numberfield';
-import { useFieldProps } from '../Form';
+import { useFormProps } from '../Form';
 import { useProviderProps } from '../../../provider';
-import { TextInputBase } from '../TextInput';
+import { TextInputBase, } from '../TextInput/TextInputBase';
 import { tasty } from '../../../tasty';
 import { castNullableNumberValue, } from '../../../utils/react/nullableValue';
 import { StepButton } from './StepButton';
@@ -25,25 +25,23 @@ const StepperContainer = tasty({
         placeSelf: 'stretch',
     },
 });
-/**
- * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.
- */
-export const NumberInput = forwardRef(function NumberInput(props, ref) {
+function NumberInput(props, ref) {
     props = castNullableNumberValue(props);
     props = useProviderProps(props);
-    props = useFieldProps(props, {
-        valuePropsMapper: ({ value, onChange }) => ({
-            value: value ?? null,
-            onChange,
-        }),
-    });
-    let { hideStepper, value, defaultValue, onChange, ...otherProps } = props;
+    props = useFormProps(props);
+    let { hideStepper, suffix, suffixPosition = 'after', value, defaultValue, onChange, ...otherProps } = props;
     let showStepper = !hideStepper;
     let { locale } = useLocale();
     let state = useNumberFieldState({ ...props, locale });
     let inputRef = useRef(null);
     let { groupProps, labelProps, inputProps, incrementButtonProps, decrementButtonProps, } = useNumberField(props, state, inputRef);
-    return (_jsx(TextInputBase, { ...otherProps, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: "after", suffix: showStepper ? (_jsxs(StepperContainer, { children: [_jsx(StepButton, { isDisabled: props.isDisabled, direction: "up", ...incrementButtonProps, size: otherProps.size }, void 0), _jsx(StepButton, { isDisabled: props.isDisabled, direction: "down", ...decrementButtonProps, size: otherProps.size }, void 0)] }, void 0)) : null }, void 0));
-});
+    return (_jsx(TextInputBase, { ...otherProps, ref: ref, labelProps: labelProps, inputProps: inputProps, inputRef: inputRef, wrapperProps: groupProps, suffixPosition: suffixPosition, suffix: showStepper ? (_jsxs(StepperContainer, { children: [_jsx(StepButton, { isDisabled: props.isDisabled, direction: "up", ...incrementButtonProps, size: otherProps.size }, void 0), _jsx(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.
+ */
+const _NumberInput = forwardRef(NumberInput);
+_NumberInput.cubeInputType = 'Number';
+export { _NumberInput as NumberInput };
 
         

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

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

package/es/components/forms/PasswordInput/PasswordInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
@@ -9,22 +9,13 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { forwardRef, useCallback, useRef, useState } from 'react';
 import { useTextField } from '@react-aria/textfield';
 import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
-import { TextInputBase } from '../TextInput';
+import { TextInputBase, } from '../TextInput/TextInputBase';
 import { useProviderProps } from '../../../provider';
 import { Button } from '../../actions';
 import { castNullableStringValue, } from '../../../utils/react/nullableValue';
-import { useFieldProps } from '../Form';
 function PasswordInput(props, ref) {
     props = castNullableStringValue(props);
-    props = useProviderProps(props);
-    props = useFieldProps(props, {
-        defaultValidationTrigger: 'onBlur',
-        valuePropsMapper: ({ value, onChange }) => ({
-            value: value?.toString() ?? '',
-            onChange,
-        }),
-    });
-    const { suffix, multiLine, ...otherProps } = props;
+    let { suffix, multiLine, ...otherProps } = useProviderProps({ ...props });
     let [type, setType] = useState('password');
     let inputRef = useRef(null);
     let { labelProps, inputProps } = useTextField({
@@ -43,6 +34,7 @@ function PasswordInput(props, ref) {
  * communicate the entry requirements.
  */
 const _PasswordInput = forwardRef(PasswordInput);
+_PasswordInput.cubeInputType = 'Text';
 export { _PasswordInput as PasswordInput };
 
         

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
@@ -16,7 +16,7 @@ import { mergeProps } from '../../../utils/react';
 import { useProviderProps } from '../../../provider';
 import { INLINE_LABEL_STYLES } from '../Label';
 import { HiddenInput } from '../../HiddenInput';
-import { useFieldProps } from '../Form';
+import { useFormProps } from '../Form';
 import { RadioGroup } from './RadioGroup';
 import { useRadioProvider } from './context';
 const RadioWrapperElement = tasty({
@@ -114,7 +114,7 @@ const RadioLabelElement = tasty({
 });
 function Radio(props, ref) {
     props = useProviderProps(props);
-    props = useFieldProps(props, { defaultValidationTrigger: 'onChange' });
+    props = useFormProps(props);
     let { qa, isDisabled, validationState, children, label, autoFocus, labelStyles, labelProps, inputStyles, type, 'aria-label': ariaLabel, ...otherProps } = props;
     let isButton = type === 'button';
     label = label || children;

package/es/components/forms/RadioGroup/RadioGroup.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
@@ -11,7 +11,7 @@ import { useDOMRef } from '@react-spectrum/utils';
 import { useRadioGroup } from '@react-aria/radio';
 import { useRadioGroupState } from '@react-stately/radio';
 import { useProviderProps } from '../../../provider';
-import { FormContext, useFieldProps } from '../Form';
+import { FormContext, useFormProps } from '../Form';
 import { BLOCK_STYLES, extractStyles, OUTER_STYLES, tasty, } from '../../../tasty';
 import { FieldWrapper } from '../FieldWrapper';
 import { castNullableStringValue, } from '../../../utils/react/nullableValue';
@@ -39,7 +39,7 @@ const RadioGroupElement = tasty({
 function RadioGroup(props, ref) {
     props = castNullableStringValue(props);
     props = useProviderProps(props);
-    props = useFieldProps(props, { defaultValidationTrigger: 'onChange' });
+    props = useFormProps(props);
     let { isDisabled, isRequired, necessityIndicator, label, extra, labelPosition = 'top', validationState, children, orientation = 'vertical', message, description, labelStyles, requiredMark = true, tooltip, isHidden, styles, groupStyles, insideForm, labelSuffix, ...otherProps } = props;
     let domRef = useDOMRef(ref);
     styles = extractStyles(otherProps, OUTER_STYLES, styles);
@@ -82,6 +82,7 @@ function RadioGroup(props, ref) {
  * All possible options are exposed up front for users to compare.
  */
 const _RadioGroup = forwardRef(RadioGroup);
+_RadioGroup.cubeInputType = 'RadioGroup';
 export { _RadioGroup as RadioGroup };
 
         

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

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

package/es/components/forms/SearchInput/SearchInput.js

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

package/es/components/forms/Switch/Switch.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-bd61b85
+ * @cube-dev/ui-kit v0.0.0-canary-e2baff7
  * Released under the MIT license.
  */
 
@@ -18,9 +18,9 @@ import { useFocus } from '../../../utils/react/interactions';
 import { mergeProps } from '../../../utils/react';
 import { HiddenInput } from '../../HiddenInput';
 import { INLINE_LABEL_STYLES, LABEL_STYLES } from '../Label';
+import { useFormProps } from '../Form/Form';
 import { FieldWrapper } from '../FieldWrapper';
 import { castNullableIsSelected, } from '../../../utils/react/nullableValue';
-import { useFieldProps } from '../Form';
 const SwitchWrapperElement = tasty({
     qa: 'SwitchWrapper',
     styles: {
@@ -90,20 +90,10 @@ const SwitchElement = tasty({
         },
     },
 });
-/**
- * Switches allow users to turn an individual option on or off.
- * They are usually used to activate or deactivate a specific setting.
- */
-export const Switch = forwardRef(function Switch(props, ref) {
+function Switch(props, ref) {
     props = castNullableIsSelected(props);
     props = useProviderProps(props);
-    props = useFieldProps(props, {
-        valuePropsMapper: ({ value, onChange }) => ({
-            isSelected: value != null ? value : false,
-            isIndeterminate: false,
-            onChange: onChange,
-        }),
-    });
+    props = useFormProps(props);
     let { qa, isDisabled = false, autoFocus, children, label, extra, labelProps, labelStyles, isLoading, insideForm, validationState, message, description, labelPosition, inputStyles, requiredMark = true, tooltip, labelSuffix, ...otherProps } = props;
     label = label || children;
     let styles = extractStyles(props, OUTER_STYLES);
@@ -150,6 +140,13 @@ export const Switch = forwardRef(function Switch(props, ref) {
     return (_jsxs(SwitchLabelElement, { styles: styles, mods: mods, ...hoverProps, ...filterBaseProps(otherProps), ref: domRef, children: [switchField, label && (_jsxs(Element, { styles: labelStyles, mods: {
                     disabled: isDisabled,
                 }, ...filterBaseProps(labelProps), children: [label, isLoading ? (_jsxs(_Fragment, { children: [label ? _jsx(_Fragment, { children: "\u00A0" }, void 0) : null, _jsx(LoadingOutlined, {}, void 0)] }, void 0)) : null] }, void 0))] }, void 0));
-});
+}
+/**
+ * Switches allow users to turn an individual option on or off.
+ * They are usually used to activate or deactivate a specific setting.
+ */
+let _Switch = forwardRef(Switch);
+_Switch.cubeInputType = 'Checkbox';
+export { _Switch as Switch };