@cube-dev/ui-kit 0.0.0-canary-b59dbf7 → 0.0.0-canary-23d9994

package/dist/components/fields/Input/Input.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { TextInput } from "../TextInput/TextInput.js";
 import { _FileInput } from "../FileInput/FileInput.js";
 import { _NumberInput } from "../NumberInput/NumberInput.js";

package/dist/components/fields/ListBox/DraggableListBox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { DraggableCollection } from "../../shared/DraggableCollection.js";
 import { jsx } from "react/jsx-runtime";
 

package/dist/components/fields/ListBox/ListBox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/fields/ListBoxPopover/ListBoxPopover.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";
 import { Portal } from "../../portal/Portal.js";

package/dist/components/fields/ListBoxPopover/listNavigation.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 //#region src/components/fields/ListBoxPopover/listNavigation.ts
 /**
 * Walks a collection (possibly nested under sections) and collects the keys of

package/dist/components/fields/ListBoxPopover/useCompositeFocus.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { useCallback, useEffect, useRef } from "react";
 
 //#region src/components/fields/ListBoxPopover/useCompositeFocus.ts

package/dist/components/fields/NumberInput/NumberInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { castNullableNumberValue } from "../../../utils/react/nullableValue.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";

package/dist/components/fields/NumberInput/StepButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { useI18n } from "../../../i18n/useI18n.js";
 import { DirectionIcon } from "../../../icons/DirectionIcon.js";
 import { Button } from "../../actions/index.js";

package/dist/components/fields/PasswordInput/PasswordInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useBufferedValue } from "../../../utils/react/useBufferedValue.js";

package/dist/components/fields/Picker/Picker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { _Text } from "../../content/Text.js";

package/dist/components/fields/RadioGroup/Radio.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFocus as useFocus$1 } from "../../../utils/react/interactions.js";

package/dist/components/fields/RadioGroup/RadioGroup.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { castNullableStringValue } from "../../../utils/react/nullableValue.js";

package/dist/components/fields/RadioGroup/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { createContext, useContext } from "react";
 
 //#region src/components/fields/RadioGroup/context.ts

package/dist/components/fields/SearchComboBox/SearchComboBox.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";

package/dist/components/fields/SearchInput/SearchInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useBufferedValue } from "../../../utils/react/useBufferedValue.js";

package/dist/components/fields/Select/Select.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { forwardRefWithGenerics } from "../../../utils/react/forwardRefWithGenerics.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/fields/Slider/Gradation.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { SliderGradationElement, SliderGradeElement } from "./elements.js";
 import { jsx } from "react/jsx-runtime";
 

package/dist/components/fields/Slider/HueSlider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { __Slider } from "./Slider.js";
 import { forwardRef, useCallback, useMemo, useState } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/fields/Slider/RangeSlider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { Gradation } from "./Gradation.js";
 import { _SliderBase } from "./SliderBase.js";
 import { SliderThumb } from "./SliderThumb.js";

package/dist/components/fields/Slider/Slider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { Gradation } from "./Gradation.js";

package/dist/components/fields/Slider/SliderBase.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { forwardRefWithGenerics } from "../../../utils/react/forwardRefWithGenerics.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/fields/Slider/SliderThumb.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { getValidationMods } from "../../form/validation/resolve-validation-props.js";
 import { SliderThumbElement } from "./elements.js";

package/dist/components/fields/Slider/SliderTrack.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { getValidationMods } from "../../form/validation/resolve-validation-props.js";
 import { SliderTrackContainerElement } from "./elements.js";
 import { useMemo } from "react";

package/dist/components/fields/Slider/elements.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 
 //#region src/components/fields/Slider/elements.ts

package/dist/components/fields/Slider/index.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { __RangeSlider } from "./RangeSlider.js";
 import { __Slider } from "./Slider.js";
 import { __HueSlider } from "./HueSlider.js";

package/dist/components/fields/Switch/Switch.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useId as useId$2 } from "../../../utils/react/useId.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/fields/TextArea/TextArea.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useBufferedValue } from "../../../utils/react/useBufferedValue.js";

package/dist/components/fields/TextInput/TextInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useBufferedValue } from "../../../utils/react/useBufferedValue.js";

package/dist/components/fields/TextInput/TextInputBase.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/fields/TextInput/useAutoSizeTextArea.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useEffect, useLayoutEffect, useRef } from "react";
 

package/dist/components/fields/TextInputMapper/TextInputMapper.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

package/dist/components/fields/TriggerActions.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { ItemActionIcon } from "../actions/ItemActionsWrapper.js";
 import { Fragment, jsxs } from "react/jsx-runtime";
 

package/dist/components/fields/color/ColorPanel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { formatColor, getContrastingColor, toHex } from "./color.js";
 import { CHANNELS, COLOR_SPACES, COLOR_SPACE_HINTS, COLOR_SPACE_LABELS } from "./channels.js";

package/dist/components/fields/color/channels.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { maxChroma, normalizeHue, oklchToOkhsl } from "../../../utils/colors.js";
 import { fromOkhst, fromRgb, isAchromatic, toHex, toOkhst, toOklch, toRgb } from "./color.js";
 

package/dist/components/fields/color/color.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { anyNaN, clamp, maxChroma, normalizeHue, oklchToOkhsl, parseColorFunction, readComponent, readHue, rgbFromSrgb } from "../../../utils/colors.js";
 import { contrastRatioFromLuminance, formatHsl, formatOkhsl, formatOkhst, formatOklch, formatRgb, hslToSrgb, okhslToLinearSrgb, okhslToOkhst, okhslToOklch, okhslToSrgb, okhstToOkhsl, parseHexAlpha, relativeLuminanceFromLinearRgb, srgbToHex, srgbToOkhsl } from "@tenphi/glaze";
 

package/dist/components/fields/color/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { createContext, useContext } from "react";
 
 //#region src/components/fields/color/context.ts

package/dist/components/form/FieldWrapper/FieldWrapper.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { wrapNodeIfPlain } from "../../../utils/react/wrapNodeIfPlain.js";
 import { isDevEnv } from "../../../utils/is-dev-env.js";

package/dist/components/form/Form/Field.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { warn } from "../../../utils/warnings.js";
 import { useValidationProps } from "../validation/use-validation-props.js";

package/dist/components/form/Form/Form.d.ts

@@ -3,6 +3,7 @@ import { FormBaseProps } from "../../../shared/form.js";
 import "../../../shared/index.js";
 import { FieldTypes } from "./types.js";
 import { CubeFormData, CubeFormInstance } from "./use-form.js";
+import { ModernFormProps } from "./ModernFormRoot.js";
 import { BaseProps, ContainerStyleProps, Styles } from "@tenphi/tasty";
 import * as react from "react";
 import { ContextType, FormHTMLAttributes, ReactElement, ReactNode, Ref } from "react";
@@ -31,7 +32,7 @@ declare function FormScopeMask({
   children?: ReactNode;
 }): react_jsx_runtime0.JSX.Element;
 /** The root components share one signature: generic props plus a form ref. */
-type FormRootComponent = <T extends FieldTypes>(props: CubeFormProps<T> & {
+type FormRootComponent = <T extends FieldTypes>(props: (CubeFormProps<T> | ModernFormProps<T>) & {
   ref?: Ref<HTMLFormElement>;
 }) => ReactElement;
 /**

package/dist/components/form/Form/Form.js

@@ -1,10 +1,11 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { Provider, useProviderProps } from "../../../provider.js";
 import { useValidationProps } from "../validation/use-validation-props.js";
 import { timeout } from "../../../utils/promise.js";
 import { isModernFormController } from "./backend.js";
+import { ModernControllerContext } from "./modern/context.js";
 import { _ModernFormRoot } from "./ModernFormRoot.js";
 import { useForm } from "./use-form.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
@@ -30,11 +31,14 @@ const FormPresentationContext = createContext(EMPTY_PRESENTATION);
 * bare `FormContext.Provider` no longer masks the presentation context.
 */
 function FormScopeMask({ value, children }) {
-	return /* @__PURE__ */ jsx(FormPresentationContext.Provider, {
-		value: EMPTY_PRESENTATION,
-		children: /* @__PURE__ */ jsx(FormContext.Provider, {
-			value,
-			children
+	return /* @__PURE__ */ jsx(ModernControllerContext.Provider, {
+		value: null,
+		children: /* @__PURE__ */ jsx(FormPresentationContext.Provider, {
+			value: EMPTY_PRESENTATION,
+			children: /* @__PURE__ */ jsx(FormContext.Provider, {
+				value,
+				children
+			})
 		})
 	});
 }
@@ -66,8 +70,10 @@ const FormElement = tasty({
 function useFormProps(props) {
 	const presentation = useContext(FormPresentationContext);
 	const ctx = useContext(FormContext);
+	const modern = useContext(ModernControllerContext);
 	return {
 		...presentation,
+		...modern ? { form: modern } : {},
 		...ctx,
 		...props
 	};
@@ -169,17 +175,20 @@ function LegacyFormRoot(props, ref) {
 			horizontal: isHorizontal
 		},
 		onSubmit: onSubmitCallback,
-		children: /* @__PURE__ */ jsx(FormPresentationContext.Provider, {
-			value: presentation,
-			children: /* @__PURE__ */ jsx(FormContext.Provider, {
-				value: ctx,
-				children: /* @__PURE__ */ jsx(Provider, {
-					insideForm: true,
-					isDisabled,
-					isReadOnly,
-					isInvalid,
-					isValid,
-					children
+		children: /* @__PURE__ */ jsx(ModernControllerContext.Provider, {
+			value: null,
+			children: /* @__PURE__ */ jsx(FormPresentationContext.Provider, {
+				value: presentation,
+				children: /* @__PURE__ */ jsx(FormContext.Provider, {
+					value: ctx,
+					children: /* @__PURE__ */ jsx(Provider, {
+						insideForm: true,
+						isDisabled,
+						isReadOnly,
+						isInvalid,
+						isValid,
+						children
+					})
 				})
 			})
 		})
@@ -189,9 +198,8 @@ const _LegacyFormRoot = forwardRef(LegacyFormRoot);
 _LegacyFormRoot.displayName = "LegacyFormRoot";
 /**
 * The `<Form>` facade. It chooses the root by the brand of the `form` prop
-* before any backend hook runs; without a modern controller — which is every
-* form today — it is the legacy root, so `<Form>` and `Form.useForm()` keep
-* their behaviour.
+* before any backend hook runs. Without an explicit modern controller it is
+* the legacy root, so existing `<Form>` and `Form.useForm()` keep their behavior.
 */
 function Form(props, ref) {
 	if (isModernFormController(props.form)) return /* @__PURE__ */ jsx(_ModernFormRoot, {
@@ -210,5 +218,5 @@ const _Form = forwardRef(Form);
 _Form.displayName = "Form";
 
 //#endregion
-export { FormContext, FormScopeMask, _Form, useFormProps };
+export { FormContext, FormElement, FormPresentationContext, FormScopeMask, _Form, formPropNames, useFormProps };
 //# sourceMappingURL=Form.js.map

package/dist/components/form/Form/Form.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.js","names":["ModernFormRoot"],"sources":["../../../../src/components/form/Form/Form.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ContextType,\n  createContext,\n  FormHTMLAttributes,\n  forwardRef,\n  ReactElement,\n  ReactNode,\n  Ref,\n  useContext,\n  useRef,\n} from 'react';\n\nimport { Provider, useProviderProps } from '../../../provider';\nimport { FormBaseProps } from '../../../shared/index';\nimport { timeout } from '../../../utils/promise';\nimport { useCombinedRefs } from '../../../utils/react/index';\nimport { extractStyles } from '../../../utils/styles';\nimport { useValidationProps } from '../validation/index';\n\nimport { isModernFormController } from './backend';\nimport { ModernFormRoot } from './ModernFormRoot';\nimport { FieldTypes } from './types';\nimport { CubeFormData, CubeFormInstance, useForm } from './use-form';\n\n/**\n * Public legacy context. Its value is the full legacy scope (presentation\n * props, the instance, `submitError`, `idPrefix`) and is part of the exported\n * contract: wrappers outside the kit read it and Radio/Checkbox groups mask it.\n */\nexport const FormContext = createContext({});\n\n/**\n * Presentation and configuration that any root — legacy or modern — hands to\n * the fields below it. Backend-neutral by construction: no instance in here.\n */\nexport interface FormPresentationContextValue {\n  labelPosition?: FormBaseProps['labelPosition'];\n  labelStyles?: FormBaseProps['labelStyles'];\n  orientation?: 'vertical' | 'horizontal';\n  necessityIndicator?: FormBaseProps['necessityIndicator'];\n  validateTrigger?: FormBaseProps['validateTrigger'];\n  requiredMark?: boolean;\n  showValid?: boolean;\n  idPrefix?: string;\n}\n\nconst EMPTY_PRESENTATION: FormPresentationContextValue = {};\n\nexport const FormPresentationContext =\n  createContext<FormPresentationContextValue>(EMPTY_PRESENTATION);\n\n/**\n * Scope the inputs below to a new form context. Radio/Checkbox groups use it\n * for their options: they see the group's validation state, but neither the\n * surrounding form's presentation props nor its instance, so a nested `name`\n * never registers as an independent field. Wrappers that used to override\n * `FormContext` directly for the same purpose should render this instead — a\n * bare `FormContext.Provider` no longer masks the presentation context.\n */\nexport function FormScopeMask({\n  value,\n  children,\n}: {\n  value: ContextType<typeof FormContext>;\n  children?: ReactNode;\n}) {\n  return (\n    <FormPresentationContext.Provider value={EMPTY_PRESENTATION}>\n      <FormContext.Provider value={value}>{children}</FormContext.Provider>\n    </FormPresentationContext.Provider>\n  );\n}\n\n/** The root components share one signature: generic props plus a form ref. */\nexport type FormRootComponent = <T extends FieldTypes>(\n  props: CubeFormProps<T> & { ref?: Ref<HTMLFormElement> },\n) => ReactElement;\n\nconst FormElement = tasty({\n  as: 'form',\n  qa: 'Form',\n  styles: {\n    display: {\n      '': 'block',\n      horizontal: 'flex',\n    },\n    flow: {\n      '': 'column',\n      horizontal: 'row',\n    },\n    placeItems: {\n      '': 'initial',\n      horizontal: 'center',\n    },\n    gap: '2x',\n    '$label-width': '25x',\n  },\n});\n\n/**\n * Merge order: presentation context, then the legacy `FormContext`, then the\n * props. Under a legacy root the two contexts carry the same presentation\n * values, so the result is exactly `{ ...FormContext, ...props }` as before.\n */\nexport function useFormProps(props) {\n  const presentation = useContext(FormPresentationContext);\n  const ctx = useContext(FormContext);\n\n  return { ...presentation, ...ctx, ...props };\n}\n\nconst formPropNames = new Set([\n  'action',\n  'autoComplete',\n  'encType',\n  'method',\n  'target',\n]);\n\nexport interface CubeFormProps<T extends FieldTypes = FieldTypes>\n  extends FormBaseProps,\n    BaseProps,\n    ContainerStyleProps,\n    Pick<\n      FormHTMLAttributes<HTMLFormElement>,\n      'action' | 'autoComplete' | 'encType' | 'method' | 'target'\n    > {\n  /** Form name */\n  name?: string;\n  /** Default field values */\n  defaultValues?: Partial<T>;\n  /** Trigger when any value of the Field is changed */\n  onValuesChange?: CubeFormInstance<T>['onValuesChange'];\n  /** Trigger on form submit and success */\n  onSubmit?: CubeFormInstance<T>['onSubmit'];\n  /** Trigger on form submit and failed */\n  onSubmitFailed?: (any?) => void | Promise<any>;\n  /** Set form instance created by useForm */\n  form?: CubeFormInstance<T, CubeFormData<T>>;\n  /** The size of the side area with labels. Only for `labelPosition=\"side\"` */\n  labelWidth?: Styles['width'];\n  orientation?: 'vertical' | 'horizontal';\n}\n\n/**\n * The legacy backend's root: the current engine under an internal name. Its\n * role is compatibility; see `legacy-contract/README.md` for what is frozen.\n */\nfunction LegacyFormRoot<T extends FieldTypes>(\n  props: CubeFormProps<T>,\n  ref: Ref<HTMLFormElement>,\n) {\n  props = useValidationProps(useProviderProps(props));\n  let {\n    qa,\n    name,\n    children,\n    labelPosition,\n    orientation,\n    necessityIndicator,\n    isDisabled,\n    isReadOnly,\n    isInvalid,\n    isValid,\n    labelStyles,\n    validateTrigger,\n    showValid,\n    defaultValues,\n    onValuesChange,\n    requiredMark = true,\n    form,\n    labelWidth,\n    onSubmit,\n    onSubmitFailed,\n    ...otherProps\n  } = props;\n  const defaultValuesRef = useRef(defaultValues);\n  const firstRunRef = useRef(true);\n  const isHorizontal = orientation === 'horizontal';\n\n  if (!orientation) {\n    orientation = 'vertical';\n  }\n\n  if (!labelPosition) {\n    labelPosition = isHorizontal ? 'side' : 'top';\n  }\n\n  if (!labelWidth) {\n    labelWidth = isHorizontal ? 'auto' : undefined;\n  }\n\n  ref = useCombinedRefs(ref);\n\n  let onSubmitCallback;\n\n  if ((onSubmit || onSubmitFailed) && !otherProps.action) {\n    onSubmitCallback = async (e) => {\n      if (e && e?.preventDefault) {\n        e && e?.preventDefault && e?.preventDefault();\n        e && e?.stopPropagation && e?.stopPropagation();\n\n        if (e.nativeEvent) {\n          const evt = e.nativeEvent;\n\n          if (\n            evt.submitter &&\n            evt.submitter.getAttribute('type') !== 'submit'\n          ) {\n            return;\n          }\n        }\n      }\n\n      if (!form || form.isSubmitting) return;\n\n      form.submitError = null;\n      form.setSubmitting(true);\n\n      try {\n        try {\n          await form.validateFields();\n        } catch (e) {\n          form?.setSubmitting(false);\n\n          return;\n        }\n\n        await timeout();\n        await onSubmit?.(form.getFormData());\n      } catch (e) {\n        await timeout();\n\n        // errors are shown\n        form.submitError = e as ReactNode;\n        // transfer errors to the callback\n        onSubmitFailed?.(e);\n\n        if (e instanceof Error) {\n          throw e;\n        }\n      } finally {\n        form?.setSubmitting(false);\n      }\n\n      // output data from form directly\n      // onSubmit(Object.fromEntries(new FormData(e.target).entries()));\n    };\n  }\n\n  [form] = useForm<T>(form, ref && ref.current, {\n    onSubmit: onSubmitCallback,\n    onValuesChange,\n  });\n\n  let styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  if (labelWidth) {\n    styles['$label-width'] = labelWidth;\n  }\n\n  let domRef = useObjectRef(ref);\n\n  const presentation: FormPresentationContextValue = {\n    labelPosition,\n    labelStyles,\n    orientation,\n    necessityIndicator,\n    validateTrigger,\n    requiredMark,\n    showValid,\n    idPrefix: name,\n  };\n\n  let ctx = {\n    ...presentation,\n    form,\n    submitError: form.submitError,\n  };\n\n  if (firstRunRef.current && form) {\n    if (defaultValues) {\n      form.setInitialFieldsValue(defaultValues);\n      form.resetFields(undefined, true);\n      firstRunRef.current = false;\n    }\n  }\n\n  if (defaultValuesRef.current !== defaultValues) {\n    form?.setInitialFieldsValue(defaultValues ?? {});\n    defaultValuesRef.current = defaultValues;\n  }\n\n  return (\n    <FormElement\n      {...filterBaseProps(otherProps, { propNames: formPropNames })}\n      ref={domRef}\n      noValidate\n      qa={qa}\n      styles={styles}\n      mods={{\n        'has-sider': labelPosition === 'side',\n        'has-split': labelPosition === 'split',\n        horizontal: isHorizontal,\n      }}\n      onSubmit={onSubmitCallback}\n    >\n      <FormPresentationContext.Provider value={presentation}>\n        <FormContext.Provider value={ctx}>\n          <Provider\n            insideForm={true}\n            isDisabled={isDisabled}\n            isReadOnly={isReadOnly}\n            isInvalid={isInvalid}\n            isValid={isValid}\n          >\n            {children}\n          </Provider>\n        </FormContext.Provider>\n      </FormPresentationContext.Provider>\n    </FormElement>\n  );\n}\n\nconst _LegacyFormRoot = forwardRef(\n  LegacyFormRoot,\n) as unknown as FormRootComponent;\n\n(_LegacyFormRoot as any).displayName = 'LegacyFormRoot';\n\n/**\n * The `<Form>` facade. It chooses the root by the brand of the `form` prop\n * before any backend hook runs; without a modern controller — which is every\n * form today — it is the legacy root, so `<Form>` and `Form.useForm()` keep\n * their behaviour.\n */\nfunction Form<T extends FieldTypes>(\n  props: CubeFormProps<T>,\n  ref: Ref<HTMLFormElement>,\n) {\n  if (isModernFormController(props.form)) {\n    return <ModernFormRoot {...props} ref={ref} />;\n  }\n\n  return <_LegacyFormRoot {...props} ref={ref} />;\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nconst _Form = forwardRef(Form) as unknown as FormRootComponent;\n\n(_Form as any).displayName = 'Form';\n\nexport { _Form as Form, _LegacyFormRoot as LegacyFormRoot };\n"],"mappings":"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"}
+{"version":3,"file":"Form.js","names":["ModernFormRoot"],"sources":["../../../../src/components/form/Form/Form.tsx"],"sourcesContent":["import { useObjectRef } from '@react-aria/utils';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport {\n  ContextType,\n  createContext,\n  FormHTMLAttributes,\n  forwardRef,\n  ReactElement,\n  ReactNode,\n  Ref,\n  useContext,\n  useRef,\n} from 'react';\n\nimport { Provider, useProviderProps } from '../../../provider';\nimport { FormBaseProps } from '../../../shared/index';\nimport { timeout } from '../../../utils/promise';\nimport { useCombinedRefs } from '../../../utils/react/index';\nimport { extractStyles } from '../../../utils/styles';\nimport { useValidationProps } from '../validation/index';\n\nimport { isModernFormController } from './backend';\nimport { ModernControllerContext } from './modern/context';\nimport { ModernFormRoot } from './ModernFormRoot';\nimport { FieldTypes } from './types';\nimport { CubeFormData, CubeFormInstance, useForm } from './use-form';\n\nimport type { ModernFormProps } from './ModernFormRoot';\n\n/**\n * Public legacy context. Its value is the full legacy scope (presentation\n * props, the instance, `submitError`, `idPrefix`) and is part of the exported\n * contract: wrappers outside the kit read it and Radio/Checkbox groups mask it.\n */\nexport const FormContext = createContext({});\n\n/**\n * Presentation and configuration that any root — legacy or modern — hands to\n * the fields below it. Backend-neutral by construction: no instance in here.\n */\nexport interface FormPresentationContextValue {\n  labelPosition?: FormBaseProps['labelPosition'];\n  labelStyles?: FormBaseProps['labelStyles'];\n  orientation?: 'vertical' | 'horizontal';\n  necessityIndicator?: FormBaseProps['necessityIndicator'];\n  validateTrigger?: FormBaseProps['validateTrigger'];\n  requiredMark?: boolean;\n  showValid?: boolean;\n  idPrefix?: string;\n}\n\nconst EMPTY_PRESENTATION: FormPresentationContextValue = {};\n\nexport const FormPresentationContext =\n  createContext<FormPresentationContextValue>(EMPTY_PRESENTATION);\n\n/**\n * Scope the inputs below to a new form context. Radio/Checkbox groups use it\n * for their options: they see the group's validation state, but neither the\n * surrounding form's presentation props nor its instance, so a nested `name`\n * never registers as an independent field. Wrappers that used to override\n * `FormContext` directly for the same purpose should render this instead — a\n * bare `FormContext.Provider` no longer masks the presentation context.\n */\nexport function FormScopeMask({\n  value,\n  children,\n}: {\n  value: ContextType<typeof FormContext>;\n  children?: ReactNode;\n}) {\n  return (\n    <ModernControllerContext.Provider value={null}>\n      <FormPresentationContext.Provider value={EMPTY_PRESENTATION}>\n        <FormContext.Provider value={value}>{children}</FormContext.Provider>\n      </FormPresentationContext.Provider>\n    </ModernControllerContext.Provider>\n  );\n}\n\n/** The root components share one signature: generic props plus a form ref. */\nexport type FormRootComponent = <T extends FieldTypes>(\n  props: (CubeFormProps<T> | ModernFormProps<T>) & {\n    ref?: Ref<HTMLFormElement>;\n  },\n) => ReactElement;\n\nexport const FormElement = tasty({\n  as: 'form',\n  qa: 'Form',\n  styles: {\n    display: {\n      '': 'block',\n      horizontal: 'flex',\n    },\n    flow: {\n      '': 'column',\n      horizontal: 'row',\n    },\n    placeItems: {\n      '': 'initial',\n      horizontal: 'center',\n    },\n    gap: '2x',\n    '$label-width': '25x',\n  },\n});\n\n/**\n * Merge order: presentation context, then the legacy `FormContext`, then the\n * props. Under a legacy root the two contexts carry the same presentation\n * values, so the result is exactly `{ ...FormContext, ...props }` as before.\n */\nexport function useFormProps(props) {\n  const presentation = useContext(FormPresentationContext);\n  const ctx = useContext(FormContext);\n  const modern = useContext(ModernControllerContext);\n\n  return {\n    ...presentation,\n    ...(modern ? { form: modern } : {}),\n    ...ctx,\n    ...props,\n  };\n}\n\nexport const formPropNames = new Set([\n  'action',\n  'autoComplete',\n  'encType',\n  'method',\n  'target',\n]);\n\nexport interface CubeFormProps<T extends FieldTypes = FieldTypes>\n  extends FormBaseProps,\n    BaseProps,\n    ContainerStyleProps,\n    Pick<\n      FormHTMLAttributes<HTMLFormElement>,\n      'action' | 'autoComplete' | 'encType' | 'method' | 'target'\n    > {\n  /** Form name */\n  name?: string;\n  /** Default field values */\n  defaultValues?: Partial<T>;\n  /** Trigger when any value of the Field is changed */\n  onValuesChange?: CubeFormInstance<T>['onValuesChange'];\n  /** Trigger on form submit and success */\n  onSubmit?: CubeFormInstance<T>['onSubmit'];\n  /** Trigger on form submit and failed */\n  onSubmitFailed?: (any?) => void | Promise<any>;\n  /** Set form instance created by useForm */\n  form?: CubeFormInstance<T, CubeFormData<T>>;\n  /** The size of the side area with labels. Only for `labelPosition=\"side\"` */\n  labelWidth?: Styles['width'];\n  orientation?: 'vertical' | 'horizontal';\n}\n\n/**\n * The legacy backend's root: the current engine under an internal name. Its\n * role is compatibility; see `legacy-contract/README.md` for what is frozen.\n */\nfunction LegacyFormRoot<T extends FieldTypes>(\n  props: CubeFormProps<T>,\n  ref: Ref<HTMLFormElement>,\n) {\n  props = useValidationProps(useProviderProps(props));\n  let {\n    qa,\n    name,\n    children,\n    labelPosition,\n    orientation,\n    necessityIndicator,\n    isDisabled,\n    isReadOnly,\n    isInvalid,\n    isValid,\n    labelStyles,\n    validateTrigger,\n    showValid,\n    defaultValues,\n    onValuesChange,\n    requiredMark = true,\n    form,\n    labelWidth,\n    onSubmit,\n    onSubmitFailed,\n    ...otherProps\n  } = props;\n  const defaultValuesRef = useRef(defaultValues);\n  const firstRunRef = useRef(true);\n  const isHorizontal = orientation === 'horizontal';\n\n  if (!orientation) {\n    orientation = 'vertical';\n  }\n\n  if (!labelPosition) {\n    labelPosition = isHorizontal ? 'side' : 'top';\n  }\n\n  if (!labelWidth) {\n    labelWidth = isHorizontal ? 'auto' : undefined;\n  }\n\n  ref = useCombinedRefs(ref);\n\n  let onSubmitCallback;\n\n  if ((onSubmit || onSubmitFailed) && !otherProps.action) {\n    onSubmitCallback = async (e) => {\n      if (e && e?.preventDefault) {\n        e && e?.preventDefault && e?.preventDefault();\n        e && e?.stopPropagation && e?.stopPropagation();\n\n        if (e.nativeEvent) {\n          const evt = e.nativeEvent;\n\n          if (\n            evt.submitter &&\n            evt.submitter.getAttribute('type') !== 'submit'\n          ) {\n            return;\n          }\n        }\n      }\n\n      if (!form || form.isSubmitting) return;\n\n      form.submitError = null;\n      form.setSubmitting(true);\n\n      try {\n        try {\n          await form.validateFields();\n        } catch (e) {\n          form?.setSubmitting(false);\n\n          return;\n        }\n\n        await timeout();\n        await onSubmit?.(form.getFormData());\n      } catch (e) {\n        await timeout();\n\n        // errors are shown\n        form.submitError = e as ReactNode;\n        // transfer errors to the callback\n        onSubmitFailed?.(e);\n\n        if (e instanceof Error) {\n          throw e;\n        }\n      } finally {\n        form?.setSubmitting(false);\n      }\n\n      // output data from form directly\n      // onSubmit(Object.fromEntries(new FormData(e.target).entries()));\n    };\n  }\n\n  [form] = useForm<T>(form, ref && ref.current, {\n    onSubmit: onSubmitCallback,\n    onValuesChange,\n  });\n\n  let styles = extractStyles(otherProps, CONTAINER_STYLES);\n\n  if (labelWidth) {\n    styles['$label-width'] = labelWidth;\n  }\n\n  let domRef = useObjectRef(ref);\n\n  const presentation: FormPresentationContextValue = {\n    labelPosition,\n    labelStyles,\n    orientation,\n    necessityIndicator,\n    validateTrigger,\n    requiredMark,\n    showValid,\n    idPrefix: name,\n  };\n\n  let ctx = {\n    ...presentation,\n    form,\n    submitError: form.submitError,\n  };\n\n  if (firstRunRef.current && form) {\n    if (defaultValues) {\n      form.setInitialFieldsValue(defaultValues);\n      form.resetFields(undefined, true);\n      firstRunRef.current = false;\n    }\n  }\n\n  if (defaultValuesRef.current !== defaultValues) {\n    form?.setInitialFieldsValue(defaultValues ?? {});\n    defaultValuesRef.current = defaultValues;\n  }\n\n  return (\n    <FormElement\n      {...filterBaseProps(otherProps, { propNames: formPropNames })}\n      ref={domRef}\n      noValidate\n      qa={qa}\n      styles={styles}\n      mods={{\n        'has-sider': labelPosition === 'side',\n        'has-split': labelPosition === 'split',\n        horizontal: isHorizontal,\n      }}\n      onSubmit={onSubmitCallback}\n    >\n      <ModernControllerContext.Provider value={null}>\n        <FormPresentationContext.Provider value={presentation}>\n          <FormContext.Provider value={ctx}>\n            <Provider\n              insideForm={true}\n              isDisabled={isDisabled}\n              isReadOnly={isReadOnly}\n              isInvalid={isInvalid}\n              isValid={isValid}\n            >\n              {children}\n            </Provider>\n          </FormContext.Provider>\n        </FormPresentationContext.Provider>\n      </ModernControllerContext.Provider>\n    </FormElement>\n  );\n}\n\nconst _LegacyFormRoot = forwardRef(LegacyFormRoot) as unknown as <\n  T extends FieldTypes,\n>(\n  props: CubeFormProps<T> & { ref?: Ref<HTMLFormElement> },\n) => ReactElement;\n\n(_LegacyFormRoot as any).displayName = 'LegacyFormRoot';\n\n/**\n * The `<Form>` facade. It chooses the root by the brand of the `form` prop\n * before any backend hook runs. Without an explicit modern controller it is\n * the legacy root, so existing `<Form>` and `Form.useForm()` keep their behavior.\n */\nfunction Form<T extends FieldTypes>(\n  props: CubeFormProps<T> | ModernFormProps<T>,\n  ref: Ref<HTMLFormElement>,\n) {\n  if (isModernFormController(props.form)) {\n    return <ModernFormRoot {...(props as ModernFormProps<T>)} ref={ref} />;\n  }\n\n  return <_LegacyFormRoot {...(props as CubeFormProps<T>)} ref={ref} />;\n}\n\n/**\n * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.\n */\nconst _Form = forwardRef(Form) as unknown as FormRootComponent;\n\n(_Form as any).displayName = 'Form';\n\nexport { _Form as Form, _LegacyFormRoot as LegacyFormRoot };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAyCA,MAAa,cAAc,cAAc,EAAE,CAAC;AAiB5C,MAAM,qBAAmD,EAAE;AAE3D,MAAa,0BACX,cAA4C,mBAAmB;;;;;;;;;AAUjE,SAAgB,cAAc,EAC5B,OACA,YAIC;AACD,QACE,oBAAC,wBAAwB;EAAS,OAAO;YACvC,oBAAC,wBAAwB;GAAS,OAAO;aACvC,oBAAC,YAAY;IAAgB;IAAQ;KAAgC;IACpC;GACF;;AAWvC,MAAa,cAAc,MAAM;CAC/B,IAAI;CACJ,IAAI;CACJ,QAAQ;EACN,SAAS;GACP,IAAI;GACJ,YAAY;GACb;EACD,MAAM;GACJ,IAAI;GACJ,YAAY;GACb;EACD,YAAY;GACV,IAAI;GACJ,YAAY;GACb;EACD,KAAK;EACL,gBAAgB;EACjB;CACF,CAAC;;;;;;AAOF,SAAgB,aAAa,OAAO;CAClC,MAAM,eAAe,WAAW,wBAAwB;CACxD,MAAM,MAAM,WAAW,YAAY;CACnC,MAAM,SAAS,WAAW,wBAAwB;AAElD,QAAO;EACL,GAAG;EACH,GAAI,SAAS,EAAE,MAAM,QAAQ,GAAG,EAAE;EAClC,GAAG;EACH,GAAG;EACJ;;AAGH,MAAa,gBAAgB,IAAI,IAAI;CACnC;CACA;CACA;CACA;CACA;CACD,CAAC;;;;;AA+BF,SAAS,eACP,OACA,KACA;AACA,SAAQ,mBAAmB,iBAAiB,MAAM,CAAC;CACnD,IAAI,EACF,IACA,MACA,UACA,eACA,aACA,oBACA,YACA,YACA,WACA,SACA,aACA,iBACA,WACA,eACA,gBACA,eAAe,MACf,MACA,YACA,UACA,gBACA,GAAG,eACD;CACJ,MAAM,mBAAmB,OAAO,cAAc;CAC9C,MAAM,cAAc,OAAO,KAAK;CAChC,MAAM,eAAe,gBAAgB;AAErC,KAAI,CAAC,YACH,eAAc;AAGhB,KAAI,CAAC,cACH,iBAAgB,eAAe,SAAS;AAG1C,KAAI,CAAC,WACH,cAAa,eAAe,SAAS;AAGvC,OAAM,gBAAgB,IAAI;CAE1B,IAAI;AAEJ,MAAK,YAAY,mBAAmB,CAAC,WAAW,OAC9C,oBAAmB,OAAO,MAAM;AAC9B,MAAI,KAAK,GAAG,gBAAgB;AAC1B,QAAK,GAAG,kBAAkB,GAAG,gBAAgB;AAC7C,QAAK,GAAG,mBAAmB,GAAG,iBAAiB;AAE/C,OAAI,EAAE,aAAa;IACjB,MAAM,MAAM,EAAE;AAEd,QACE,IAAI,aACJ,IAAI,UAAU,aAAa,OAAO,KAAK,SAEvC;;;AAKN,MAAI,CAAC,QAAQ,KAAK,aAAc;AAEhC,OAAK,cAAc;AACnB,OAAK,cAAc,KAAK;AAExB,MAAI;AACF,OAAI;AACF,UAAM,KAAK,gBAAgB;YACpB,GAAG;AACV,UAAM,cAAc,MAAM;AAE1B;;AAGF,SAAM,SAAS;AACf,SAAM,WAAW,KAAK,aAAa,CAAC;WAC7B,GAAG;AACV,SAAM,SAAS;AAGf,QAAK,cAAc;AAEnB,oBAAiB,EAAE;AAEnB,OAAI,aAAa,MACf,OAAM;YAEA;AACR,SAAM,cAAc,MAAM;;;AAQhC,EAAC,QAAQ,QAAW,MAAM,OAAO,IAAI,SAAS;EAC5C,UAAU;EACV;EACD,CAAC;CAEF,IAAI,SAAS,cAAc,YAAY,iBAAiB;AAExD,KAAI,WACF,QAAO,kBAAkB;CAG3B,IAAI,SAAS,aAAa,IAAI;CAE9B,MAAM,eAA6C;EACjD;EACA;EACA;EACA;EACA;EACA;EACA;EACA,UAAU;EACX;CAED,IAAI,MAAM;EACR,GAAG;EACH;EACA,aAAa,KAAK;EACnB;AAED,KAAI,YAAY,WAAW,MACzB;MAAI,eAAe;AACjB,QAAK,sBAAsB,cAAc;AACzC,QAAK,YAAY,QAAW,KAAK;AACjC,eAAY,UAAU;;;AAI1B,KAAI,iBAAiB,YAAY,eAAe;AAC9C,QAAM,sBAAsB,iBAAiB,EAAE,CAAC;AAChD,mBAAiB,UAAU;;AAG7B,QACE,oBAAC;EACC,GAAI,gBAAgB,YAAY,EAAE,WAAW,eAAe,CAAC;EAC7D,KAAK;EACL;EACI;EACI;EACR,MAAM;GACJ,aAAa,kBAAkB;GAC/B,aAAa,kBAAkB;GAC/B,YAAY;GACb;EACD,UAAU;YAEV,oBAAC,wBAAwB;GAAS,OAAO;aACvC,oBAAC,wBAAwB;IAAS,OAAO;cACvC,oBAAC,YAAY;KAAS,OAAO;eAC3B,oBAAC;MACC,YAAY;MACA;MACA;MACD;MACF;MAER;OACQ;MACU;KACU;IACF;GACvB;;AAIlB,MAAM,kBAAkB,WAAW,eAAe;AAMlD,AAAC,gBAAwB,cAAc;;;;;;AAOvC,SAAS,KACP,OACA,KACA;AACA,KAAI,uBAAuB,MAAM,KAAK,CACpC,QAAO,oBAACA;EAAe,GAAK;EAAmC;GAAO;AAGxE,QAAO,oBAAC;EAAgB,GAAK;EAAiC;GAAO;;;;;AAMvE,MAAM,QAAQ,WAAW,KAAK;AAE9B,AAAC,MAAc,cAAc"}

package/dist/components/form/Form/ModernFormRoot.d.ts

@@ -0,0 +1,17 @@
+
+import { FormController } from "./modern/controller.js";
+import { CubeFormProps } from "./Form.js";
+import { ReactElement, Ref } from "react";
+
+//#region src/components/form/Form/ModernFormRoot.d.ts
+/** Phase 5 root: presentation and subscriptions; callbacks arrive in phase 7. */
+interface ModernFormProps<T extends object = Record<string, unknown>> extends Omit<CubeFormProps<T>, 'form' | 'defaultValues' | 'onSubmit' | 'onSubmitFailed' | 'onValuesChange'> {
+  form: FormController<T>;
+  defaultValues?: never;
+  onSubmit?: never;
+  onSubmitFailed?: never;
+  onValuesChange?: never;
+}
+//#endregion
+export { ModernFormProps };
+//# sourceMappingURL=ModernFormRoot.d.ts.map

package/dist/components/form/Form/ModernFormRoot.js

@@ -1,16 +1,76 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
-import { modernBackendUnavailableError } from "./backend.js";
-import { forwardRef } from "react";
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
+import { extractStyles } from "../../../utils/styles.js";
+import { Provider, useProviderProps } from "../../../provider.js";
+import { useValidationProps } from "../validation/use-validation-props.js";
+import { ModernControllerContext } from "./modern/context.js";
+import { getControllerInternals } from "./modern/controller.js";
+import { FormContext, FormElement, FormPresentationContext, formPropNames } from "./Form.js";
+import { CONTAINER_STYLES, filterBaseProps } from "@tenphi/tasty";
+import { forwardRef, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
 
 //#region src/components/form/Form/ModernFormRoot.tsx
-/**
-* The `<Form>` facade renders this root for a branded modern controller. It is
-* a boundary, not an implementation: the modern backend is not in this version,
-* so reaching it is an error rather than silent legacy behaviour (plan §9,
-* Phase 3 gate: "no modern behavior is reachable accidentally").
-*/
-function ModernFormRoot(_props, _ref) {
-	throw modernBackendUnavailableError("<Form>");
+const EMPTY_LEGACY_CONTEXT = {};
+function preventUnimplementedSubmit(event) {
+	event.preventDefault();
+	event.stopPropagation();
+}
+function ModernFormRoot(props, ref) {
+	const { form, qa, name, children, orientation = "vertical", labelPosition = orientation === "horizontal" ? "side" : "top", labelWidth = orientation === "horizontal" ? "auto" : void 0, labelStyles, necessityIndicator, validateTrigger, requiredMark = true, showValid, isDisabled, isReadOnly, isInvalid, isValid, defaultValues, onSubmit, onSubmitFailed, onValuesChange, ...otherProps } = useValidationProps(useProviderProps(props));
+	getControllerInternals(form, "<Form>");
+	if (defaultValues !== void 0) throw new Error("A modern <Form> does not accept defaultValues. Seed Form.useController() or use an explicit defaults command.");
+	if (onSubmit || onSubmitFailed || onValuesChange) throw new Error("Modern <Form> callback bindings are not available yet. Use the controller creation options for onValuesChange; submission arrives in a later phase.");
+	const presentation = useMemo(() => ({
+		labelPosition,
+		labelStyles,
+		orientation,
+		necessityIndicator,
+		validateTrigger,
+		requiredMark,
+		showValid,
+		idPrefix: name
+	}), [
+		labelPosition,
+		labelStyles,
+		orientation,
+		necessityIndicator,
+		validateTrigger,
+		requiredMark,
+		showValid,
+		name
+	]);
+	const styles = extractStyles(otherProps, CONTAINER_STYLES);
+	if (labelWidth) styles["$label-width"] = labelWidth;
+	return /* @__PURE__ */ jsx(FormElement, {
+		...filterBaseProps(otherProps, { propNames: formPropNames }),
+		ref,
+		qa,
+		noValidate: true,
+		styles,
+		mods: {
+			"has-sider": labelPosition === "side",
+			"has-split": labelPosition === "split",
+			horizontal: orientation === "horizontal"
+		},
+		onSubmit: otherProps.action == null ? preventUnimplementedSubmit : void 0,
+		children: /* @__PURE__ */ jsx(FormContext.Provider, {
+			value: EMPTY_LEGACY_CONTEXT,
+			children: /* @__PURE__ */ jsx(ModernControllerContext.Provider, {
+				value: form,
+				children: /* @__PURE__ */ jsx(FormPresentationContext.Provider, {
+					value: presentation,
+					children: /* @__PURE__ */ jsx(Provider, {
+						insideForm: true,
+						isDisabled,
+						isReadOnly,
+						isInvalid,
+						isValid,
+						children
+					})
+				})
+			})
+		})
+	});
 }
 const _ModernFormRoot = forwardRef(ModernFormRoot);
 _ModernFormRoot.displayName = "ModernFormRoot";

package/dist/components/form/Form/ModernFormRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModernFormRoot.js","names":[],"sources":["../../../../src/components/form/Form/ModernFormRoot.tsx"],"sourcesContent":["import { forwardRef, ReactElement, Ref } from 'react';\n\nimport { modernBackendUnavailableError } from './backend';\n\nimport type { CubeFormProps, FormRootComponent } from './Form';\nimport type { FieldTypes } from './types';\n\n/**\n * The `<Form>` facade renders this root for a branded modern controller. It is\n * a boundary, not an implementation: the modern backend is not in this version,\n * so reaching it is an error rather than silent legacy behaviour (plan §9,\n * Phase 3 gate: \"no modern behavior is reachable accidentally\").\n */\nfunction ModernFormRoot<T extends FieldTypes>(\n  _props: CubeFormProps<T>,\n  _ref: Ref<HTMLFormElement>,\n): ReactElement {\n  throw modernBackendUnavailableError('<Form>');\n}\n\nconst _ModernFormRoot = forwardRef(\n  ModernFormRoot,\n) as unknown as FormRootComponent;\n\n(_ModernFormRoot as any).displayName = 'ModernFormRoot';\n\nexport { _ModernFormRoot as ModernFormRoot };\n"],"mappings":";;;;;;;;;;;AAaA,SAAS,eACP,QACA,MACc;AACd,OAAM,8BAA8B,SAAS;;AAG/C,MAAM,kBAAkB,WACtB,eACD;AAED,AAAC,gBAAwB,cAAc"}
+{"version":3,"file":"ModernFormRoot.js","names":[],"sources":["../../../../src/components/form/Form/ModernFormRoot.tsx"],"sourcesContent":["import { CONTAINER_STYLES, filterBaseProps } from '@tenphi/tasty';\nimport { forwardRef, useMemo } from 'react';\n\nimport { Provider, useProviderProps } from '../../../provider';\nimport { extractStyles } from '../../../utils/styles';\nimport { useValidationProps } from '../validation/use-validation-props';\n\nimport {\n  FormContext,\n  FormElement,\n  FormPresentationContext,\n  formPropNames,\n} from './Form';\nimport { ModernControllerContext } from './modern/context';\nimport { getControllerInternals } from './modern/controller';\n\nimport type { FormEvent, ReactElement, Ref } from 'react';\nimport type { CubeFormProps, FormPresentationContextValue } from './Form';\nimport type { FormController } from './modern/controller';\n\n/** Phase 5 root: presentation and subscriptions; callbacks arrive in phase 7. */\nexport interface ModernFormProps<T extends object = Record<string, unknown>>\n  extends Omit<\n    CubeFormProps<T>,\n    'form' | 'defaultValues' | 'onSubmit' | 'onSubmitFailed' | 'onValuesChange'\n  > {\n  form: FormController<T>;\n  defaultValues?: never;\n  onSubmit?: never;\n  onSubmitFailed?: never;\n  onValuesChange?: never;\n}\n\nconst EMPTY_LEGACY_CONTEXT = {};\n\nfunction preventUnimplementedSubmit(event: FormEvent<HTMLFormElement>) {\n  event.preventDefault();\n  event.stopPropagation();\n}\n\nfunction ModernFormRoot<T extends object>(\n  props: ModernFormProps<T>,\n  ref: Ref<HTMLFormElement>,\n): ReactElement {\n  const resolved = useValidationProps(useProviderProps(props));\n  const {\n    form,\n    qa,\n    name,\n    children,\n    orientation = 'vertical',\n    labelPosition = orientation === 'horizontal' ? 'side' : 'top',\n    labelWidth = orientation === 'horizontal' ? 'auto' : undefined,\n    labelStyles,\n    necessityIndicator,\n    validateTrigger,\n    requiredMark = true,\n    showValid,\n    isDisabled,\n    isReadOnly,\n    isInvalid,\n    isValid,\n    defaultValues,\n    onSubmit,\n    onSubmitFailed,\n    onValuesChange,\n    ...otherProps\n  } = resolved;\n  getControllerInternals(form, '<Form>');\n  if (defaultValues !== undefined) {\n    throw new Error(\n      'A modern <Form> does not accept defaultValues. Seed Form.useController() or use an explicit defaults command.',\n    );\n  }\n  if (onSubmit || onSubmitFailed || onValuesChange) {\n    throw new Error(\n      'Modern <Form> callback bindings are not available yet. Use the controller creation options for onValuesChange; submission arrives in a later phase.',\n    );\n  }\n  const presentation = useMemo<FormPresentationContextValue>(\n    () => ({\n      labelPosition,\n      labelStyles,\n      orientation,\n      necessityIndicator,\n      validateTrigger,\n      requiredMark,\n      showValid,\n      idPrefix: name,\n    }),\n    [\n      labelPosition,\n      labelStyles,\n      orientation,\n      necessityIndicator,\n      validateTrigger,\n      requiredMark,\n      showValid,\n      name,\n    ],\n  );\n  const styles = extractStyles(otherProps, CONTAINER_STYLES);\n  if (labelWidth) styles['$label-width'] = labelWidth;\n\n  return (\n    <FormElement\n      {...filterBaseProps(otherProps, { propNames: formPropNames })}\n      ref={ref}\n      qa={qa}\n      noValidate\n      styles={styles}\n      mods={{\n        'has-sider': labelPosition === 'side',\n        'has-split': labelPosition === 'split',\n        horizontal: orientation === 'horizontal',\n      }}\n      onSubmit={\n        otherProps.action == null ? preventUnimplementedSubmit : undefined\n      }\n    >\n      <FormContext.Provider value={EMPTY_LEGACY_CONTEXT}>\n        <ModernControllerContext.Provider value={form}>\n          <FormPresentationContext.Provider value={presentation}>\n            <Provider\n              insideForm\n              isDisabled={isDisabled}\n              isReadOnly={isReadOnly}\n              isInvalid={isInvalid}\n              isValid={isValid}\n            >\n              {children}\n            </Provider>\n          </FormPresentationContext.Provider>\n        </ModernControllerContext.Provider>\n      </FormContext.Provider>\n    </FormElement>\n  );\n}\n\nconst _ModernFormRoot = forwardRef(ModernFormRoot) as unknown as <\n  T extends object,\n>(\n  props: ModernFormProps<T> & { ref?: Ref<HTMLFormElement> },\n) => ReactElement;\n\n(_ModernFormRoot as any).displayName = 'ModernFormRoot';\n\nexport { _ModernFormRoot as ModernFormRoot };\n"],"mappings":";;;;;;;;;;;;AAiCA,MAAM,uBAAuB,EAAE;AAE/B,SAAS,2BAA2B,OAAmC;AACrE,OAAM,gBAAgB;AACtB,OAAM,iBAAiB;;AAGzB,SAAS,eACP,OACA,KACc;CAEd,MAAM,EACJ,MACA,IACA,MACA,UACA,cAAc,YACd,gBAAgB,gBAAgB,eAAe,SAAS,OACxD,aAAa,gBAAgB,eAAe,SAAS,QACrD,aACA,oBACA,iBACA,eAAe,MACf,WACA,YACA,YACA,WACA,SACA,eACA,UACA,gBACA,gBACA,GAAG,eAtBY,mBAAmB,iBAAiB,MAAM,CAAC;AAwB5D,wBAAuB,MAAM,SAAS;AACtC,KAAI,kBAAkB,OACpB,OAAM,IAAI,MACR,gHACD;AAEH,KAAI,YAAY,kBAAkB,eAChC,OAAM,IAAI,MACR,sJACD;CAEH,MAAM,eAAe,eACZ;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA,UAAU;EACX,GACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CACD,MAAM,SAAS,cAAc,YAAY,iBAAiB;AAC1D,KAAI,WAAY,QAAO,kBAAkB;AAEzC,QACE,oBAAC;EACC,GAAI,gBAAgB,YAAY,EAAE,WAAW,eAAe,CAAC;EACxD;EACD;EACJ;EACQ;EACR,MAAM;GACJ,aAAa,kBAAkB;GAC/B,aAAa,kBAAkB;GAC/B,YAAY,gBAAgB;GAC7B;EACD,UACE,WAAW,UAAU,OAAO,6BAA6B;YAG3D,oBAAC,YAAY;GAAS,OAAO;aAC3B,oBAAC,wBAAwB;IAAS,OAAO;cACvC,oBAAC,wBAAwB;KAAS,OAAO;eACvC,oBAAC;MACC;MACY;MACA;MACD;MACF;MAER;OACQ;MACsB;KACF;IACd;GACX;;AAIlB,MAAM,kBAAkB,WAAW,eAAe;AAMlD,AAAC,gBAAwB,cAAc"}

package/dist/components/form/Form/ResetButton/ResetButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b59dbf7 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-23d9994 | Cube Dev Team */
 import { mergeProps } from "../../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { useProviderProps } from "../../../../provider.js";