@cube-dev/ui-kit 0.179.0 → 0.180.0

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

@@ -0,0 +1,48 @@
+/** @license MIT | @cube-dev/ui-kit v0.180.0 | Cube Dev Team */
+import { FORM_BACKEND, isModernFormController } from "../backend.js";
+import { createFormStore } from "./store.js";
+
+//#region src/components/form/Form/modern/controller.ts
+const CONTROLLER_STORE = Symbol.for("@cube-dev/ui-kit/form-controller-store");
+/** Pure allocation for the creation hook; no listeners or external effects. */
+function createFormController(options) {
+	const store = createFormStore(options);
+	const serverSnapshot = store.getSnapshot();
+	const internals = {
+		store,
+		getServerSnapshot: () => serverSnapshot
+	};
+	return Object.freeze({
+		[FORM_BACKEND]: "modern",
+		[CONTROLLER_STORE]: internals,
+		validate: store.validate,
+		submit: store.submit,
+		blur: store.blur,
+		getSnapshot: store.getSnapshot,
+		getFieldSnapshot: store.getFieldSnapshot,
+		getValue: store.getValue,
+		getValues: store.getValues,
+		getActiveValues: store.getActiveValues,
+		subscribe: store.subscribe,
+		setValue: store.setValue,
+		setValues: store.setValues,
+		batch: store.batch,
+		setDefaultValues: store.setDefaultValues,
+		adoptDefaultValues: store.adoptDefaultValues,
+		reset: store.reset,
+		touch: store.touch,
+		setFieldErrors: store.setFieldErrors,
+		clearFieldErrors: store.clearFieldErrors,
+		setSubmitError: store.setSubmitError,
+		clearSubmitError: store.clearSubmitError
+	});
+}
+function getControllerInternals(controller, receiver) {
+	const internals = isModernFormController(controller) ? controller[CONTROLLER_STORE] : void 0;
+	if (!internals) throw new Error(`${receiver} requires a modern form controller created by Form.useController(). Legacy Form instances and bare backend brands are not supported.`);
+	return internals;
+}
+
+//#endregion
+export { createFormController, getControllerInternals };
+//# sourceMappingURL=controller.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"controller.js","names":[],"sources":["../../../../../src/components/form/Form/modern/controller.ts"],"sourcesContent":["import { FORM_BACKEND, isModernFormController } from '../backend';\n\nimport { createFormStore } from './store';\n\nimport type { ReactNode } from 'react';\nimport type { FormValueAtPath } from './path-types';\nimport type {\n  FormState,\n  FormStore,\n  FormStoreOptions,\n  SetValueOptions,\n  ModernFieldValidationResult as StoreFieldValidationResult,\n  ModernSubmitResult as StoreSubmitResult,\n  ModernValidationResult as StoreValidationResult,\n} from './types';\nimport type { ModernValidationRule as StoreValidationRule } from './validation';\nimport type { FormPath } from './values';\n\nexport type ModernValidationRule = StoreValidationRule<ReactNode>;\nexport type ModernValidationResult = StoreValidationResult<ReactNode>;\nexport type ModernFieldValidationResult = StoreFieldValidationResult<ReactNode>;\nexport type ModernSubmitResult = StoreSubmitResult<ReactNode>;\n\nexport type ModernFormState<T extends object = Record<string, unknown>> =\n  FormState<T, ReactNode>;\n\nexport type UseFormControllerOptions<\n  T extends object = Record<string, unknown>,\n> = FormStoreOptions<T>;\n\n/** Public commands; registration and pipeline state tokens stay internal. */\nexport type FormController<T extends object = Record<string, unknown>> =\n  Readonly<\n    Pick<\n      FormStore<T, ReactNode>,\n      | typeof FORM_BACKEND\n      | 'validate'\n      | 'submit'\n      | 'blur'\n      | 'getSnapshot'\n      | 'getFieldSnapshot'\n      | 'getValues'\n      | 'getActiveValues'\n      | 'subscribe'\n      | 'setValues'\n      | 'batch'\n      | 'setDefaultValues'\n      | 'adoptDefaultValues'\n      | 'reset'\n      | 'touch'\n      | 'setFieldErrors'\n      | 'clearFieldErrors'\n      | 'setSubmitError'\n      | 'clearSubmitError'\n    > & {\n      getValue<const Path extends FormPath>(\n        path: Path,\n      ): FormValueAtPath<T, Path> | undefined;\n      setValue<const Path extends FormPath>(\n        path: Path,\n        value: FormValueAtPath<T, NoInfer<Path>> | undefined,\n        options?: SetValueOptions,\n      ): void;\n    }\n  >;\n\n// Symbol.for also lets two copies of the kit share a controller, just as the\n// backend brand does. This symbol and the store are not package exports.\nconst CONTROLLER_STORE = Symbol.for('@cube-dev/ui-kit/form-controller-store');\n\ninterface ControllerInternals<T extends object> {\n  store: FormStore<T, ReactNode>;\n  getServerSnapshot(): ModernFormState<T>;\n}\n\n/** Pure allocation for the creation hook; no listeners or external effects. */\nexport function createFormController<T extends object>(\n  options?: UseFormControllerOptions<T>,\n): FormController<T> {\n  const store = createFormStore<T, ReactNode>(options);\n  const serverSnapshot = store.getSnapshot();\n  const internals: ControllerInternals<T> = {\n    store,\n    getServerSnapshot: () => serverSnapshot,\n  };\n  return Object.freeze({\n    [FORM_BACKEND]: 'modern' as const,\n    [CONTROLLER_STORE]: internals,\n    validate: store.validate,\n    submit: store.submit,\n    blur: store.blur,\n    getSnapshot: store.getSnapshot,\n    getFieldSnapshot: store.getFieldSnapshot,\n    getValue: store.getValue,\n    getValues: store.getValues,\n    getActiveValues: store.getActiveValues,\n    subscribe: store.subscribe,\n    setValue: store.setValue,\n    setValues: store.setValues,\n    batch: store.batch,\n    setDefaultValues: store.setDefaultValues,\n    adoptDefaultValues: store.adoptDefaultValues,\n    reset: store.reset,\n    touch: store.touch,\n    setFieldErrors: store.setFieldErrors,\n    clearFieldErrors: store.clearFieldErrors,\n    setSubmitError: store.setSubmitError,\n    clearSubmitError: store.clearSubmitError,\n  }) as FormController<T>;\n}\n\nexport function getControllerInternals<T extends object>(\n  controller: FormController<T>,\n  receiver: string,\n): ControllerInternals<T> {\n  const internals = isModernFormController(controller)\n    ? (controller as unknown as Record<symbol, ControllerInternals<T>>)[\n        CONTROLLER_STORE\n      ]\n    : undefined;\n  if (!internals) {\n    throw new Error(\n      `${receiver} requires a modern form controller created by Form.useController(). Legacy Form instances and bare backend brands are not supported.`,\n    );\n  }\n  return internals;\n}\n"],"mappings":";;;;;AAoEA,MAAM,mBAAmB,OAAO,IAAI,yCAAyC;;AAQ7E,SAAgB,qBACd,SACmB;CACnB,MAAM,QAAQ,gBAA8B,QAAQ;CACpD,MAAM,iBAAiB,MAAM,aAAa;CAC1C,MAAM,YAAoC;EACxC;EACA,yBAAyB;EAC1B;AACD,QAAO,OAAO,OAAO;GAClB,eAAe;GACf,mBAAmB;EACpB,UAAU,MAAM;EAChB,QAAQ,MAAM;EACd,MAAM,MAAM;EACZ,aAAa,MAAM;EACnB,kBAAkB,MAAM;EACxB,UAAU,MAAM;EAChB,WAAW,MAAM;EACjB,iBAAiB,MAAM;EACvB,WAAW,MAAM;EACjB,UAAU,MAAM;EAChB,WAAW,MAAM;EACjB,OAAO,MAAM;EACb,kBAAkB,MAAM;EACxB,oBAAoB,MAAM;EAC1B,OAAO,MAAM;EACb,OAAO,MAAM;EACb,gBAAgB,MAAM;EACtB,kBAAkB,MAAM;EACxB,gBAAgB,MAAM;EACtB,kBAAkB,MAAM;EACzB,CAAC;;AAGJ,SAAgB,uBACd,YACA,UACwB;CACxB,MAAM,YAAY,uBAAuB,WAAW,GAC/C,WACC,oBAEF;AACJ,KAAI,CAAC,UACH,OAAM,IAAI,MACR,GAAG,SAAS,sIACb;AAEH,QAAO"}

package/dist/components/form/Form/modern/field-binding.js

@@ -0,0 +1,41 @@
+/** @license MIT | @cube-dev/ui-kit v0.180.0 | Cube Dev Team */
+import { getFieldKey } from "./values.js";
+import { getControllerInternals } from "./controller.js";
+
+//#region src/components/form/Form/modern/field-binding.ts
+function sameFieldView(a, b) {
+	return Object.is(a?.value, b?.value) && a?.errors === b?.errors && a?.status === b?.status;
+}
+function createModernFieldBackend(form, name) {
+	const { store, getServerSnapshot } = getControllerInternals(form, `The "${name}" field`);
+	const key = getFieldKey(name);
+	return {
+		subscribe: store.subscribe,
+		getSnapshot: () => store.getFieldSnapshot(name),
+		getServerSnapshot: () => getServerSnapshot().fields[key],
+		register: () => store.register(name),
+		change: (value, dontTouch) => store.setValue(name, value, {
+			source: "user",
+			touch: !dontTouch,
+			validate: dontTouch ? "never" : "auto"
+		}),
+		blur: () => store.blur(name)
+	};
+}
+function fieldRegistrationOptions(props, defaultTrigger) {
+	const rules = props.rules?.flat(Infinity);
+	return {
+		...Object.hasOwn(props, "defaultValue") ? { defaultValue: props.defaultValue } : {},
+		preserve: props.preserve,
+		isEqual: props.isEqual,
+		rules: props.isRequired && !rules?.some((rule) => rule.required) ? [{ required: true }, ...rules ?? []] : rules,
+		rulesKey: props.rulesKey === void 0 ? void 0 : `${props.isRequired ? "required:" : ""}${props.rulesKey}`,
+		validationDelay: props.validationDelay,
+		validateTrigger: props.validateTrigger ?? defaultTrigger ?? "onBlur",
+		errorPolicy: props.errorPolicy
+	};
+}
+
+//#endregion
+export { createModernFieldBackend, fieldRegistrationOptions, sameFieldView };
+//# sourceMappingURL=field-binding.js.map

package/dist/components/form/Form/modern/field-binding.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-binding.js","names":[],"sources":["../../../../../src/components/form/Form/modern/field-binding.ts"],"sourcesContent":["import { getControllerInternals } from './controller';\nimport { getFieldKey } from './values';\n\nimport type { ReactNode } from 'react';\nimport type { FieldCoreProps, ValidateTrigger } from '../../../../shared/form';\nimport type { FormController } from './controller';\nimport type {\n  FieldState,\n  RegistrationOptions,\n  RegistrationToken,\n} from './types';\n\n/** The only state a bound input renders; metadata stays in selector subscribers. */\nexport type FieldView = Pick<\n  FieldState<ReactNode>,\n  'value' | 'errors' | 'status'\n>;\n\nexport interface FieldBackendHandle {\n  subscribe(listener: () => void): () => void;\n  getSnapshot(): FieldView | undefined;\n  getServerSnapshot(): FieldView | undefined;\n  register(): RegistrationToken<ReactNode> | undefined;\n  change(value: unknown, dontTouch: boolean, trigger: ValidateTrigger): void;\n  blur(): void;\n}\n\nexport function sameFieldView(a?: FieldView, b?: FieldView) {\n  return (\n    Object.is(a?.value, b?.value) &&\n    a?.errors === b?.errors &&\n    a?.status === b?.status\n  );\n}\n\nexport function createModernFieldBackend(\n  form: FormController<any>,\n  name: string,\n): FieldBackendHandle {\n  const { store, getServerSnapshot } = getControllerInternals(\n    form,\n    `The \"${name}\" field`,\n  );\n  const key = getFieldKey(name);\n  return {\n    subscribe: store.subscribe,\n    getSnapshot: () => store.getFieldSnapshot(name),\n    getServerSnapshot: () => getServerSnapshot().fields[key],\n    register: () => store.register(name),\n    change: (value, dontTouch) =>\n      store.setValue(name, value, {\n        source: 'user',\n        touch: !dontTouch,\n        validate: dontTouch ? 'never' : 'auto',\n      }),\n    blur: () => store.blur(name),\n  };\n}\n\nexport function fieldRegistrationOptions(\n  props: FieldCoreProps & {\n    defaultValue?: unknown;\n    validateTrigger?: ValidateTrigger;\n  },\n  defaultTrigger?: ValidateTrigger,\n): RegistrationOptions<ReactNode> {\n  const rules = props.rules?.flat(Infinity);\n  return {\n    ...(Object.hasOwn(props, 'defaultValue')\n      ? { defaultValue: props.defaultValue }\n      : {}),\n    preserve: props.preserve,\n    isEqual: props.isEqual,\n    rules:\n      props.isRequired && !rules?.some((rule) => rule.required)\n        ? [{ required: true }, ...(rules ?? [])]\n        : rules,\n    rulesKey:\n      props.rulesKey === undefined\n        ? undefined\n        : `${props.isRequired ? 'required:' : ''}${props.rulesKey}`,\n    validationDelay: props.validationDelay,\n    validateTrigger: props.validateTrigger ?? defaultTrigger ?? 'onBlur',\n    errorPolicy: props.errorPolicy,\n  };\n}\n"],"mappings":";;;;;AA2BA,SAAgB,cAAc,GAAe,GAAe;AAC1D,QACE,OAAO,GAAG,GAAG,OAAO,GAAG,MAAM,IAC7B,GAAG,WAAW,GAAG,UACjB,GAAG,WAAW,GAAG;;AAIrB,SAAgB,yBACd,MACA,MACoB;CACpB,MAAM,EAAE,OAAO,sBAAsB,uBACnC,MACA,QAAQ,KAAK,SACd;CACD,MAAM,MAAM,YAAY,KAAK;AAC7B,QAAO;EACL,WAAW,MAAM;EACjB,mBAAmB,MAAM,iBAAiB,KAAK;EAC/C,yBAAyB,mBAAmB,CAAC,OAAO;EACpD,gBAAgB,MAAM,SAAS,KAAK;EACpC,SAAS,OAAO,cACd,MAAM,SAAS,MAAM,OAAO;GAC1B,QAAQ;GACR,OAAO,CAAC;GACR,UAAU,YAAY,UAAU;GACjC,CAAC;EACJ,YAAY,MAAM,KAAK,KAAK;EAC7B;;AAGH,SAAgB,yBACd,OAIA,gBACgC;CAChC,MAAM,QAAQ,MAAM,OAAO,KAAK,SAAS;AACzC,QAAO;EACL,GAAI,OAAO,OAAO,OAAO,eAAe,GACpC,EAAE,cAAc,MAAM,cAAc,GACpC,EAAE;EACN,UAAU,MAAM;EAChB,SAAS,MAAM;EACf,OACE,MAAM,cAAc,CAAC,OAAO,MAAM,SAAS,KAAK,SAAS,GACrD,CAAC,EAAE,UAAU,MAAM,EAAE,GAAI,SAAS,EAAE,CAAE,GACtC;EACN,UACE,MAAM,aAAa,SACf,SACA,GAAG,MAAM,aAAa,cAAc,KAAK,MAAM;EACrD,iBAAiB,MAAM;EACvB,iBAAiB,MAAM,mBAAmB,kBAAkB;EAC5D,aAAa,MAAM;EACpB"}

package/dist/components/form/Form/modern/path-types.d.ts

@@ -0,0 +1,12 @@
+
+import { FormPath } from "./values.js";
+
+//#region src/components/form/Form/modern/path-types.d.ts
+/** Resolve only the supplied path; never enumerate a model's possible paths. */
+type SegmentValue<Value, Key extends string | number> = Value extends null | undefined ? undefined : Key extends keyof Value ? Value[Key] : Value extends readonly (infer Item)[] ? Key extends `${number}` ? Item : unknown : unknown;
+type TupleValue<Value, Path extends readonly (string | number)[]> = Path extends readonly [infer Key extends string | number, ...infer Rest extends readonly (string | number)[]] ? Rest extends readonly [] ? SegmentValue<Value, Key> : TupleValue<SegmentValue<Value, Key>, Rest> : unknown;
+/** Strings are literal keys; unknown/dynamic names and paths return unknown. */
+type FormValueAtPath<Values extends object, Path extends FormPath> = Path extends string ? Path extends keyof Values ? Values[Path] : unknown : Path extends readonly (string | number)[] ? TupleValue<Values, Path> : unknown;
+//#endregion
+export { FormValueAtPath };
+//# sourceMappingURL=path-types.d.ts.map

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

@@ -0,0 +1,21 @@
+
+import { FormController, ModernFormState, UseFormControllerOptions } from "./controller.js";
+import { ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/form/Form/modern/react.d.ts
+declare function useFormController<T extends object = Record<string, unknown>>(options?: UseFormControllerOptions<T>): FormController<T>;
+interface FormSelectorOptions<Selected> {
+  isEqual?: (previous: Selected, next: Selected) => boolean;
+}
+declare function useFormSelector<T extends object, Selected>(controller: FormController<T>, selector: (state: ModernFormState<T>) => Selected, options?: FormSelectorOptions<Selected>): Selected;
+interface FormSubscribeProps<T extends object, Selected> extends FormSelectorOptions<Selected> {
+  /** Omit to use modern context. An explicit undefined detaches from context. */
+  form?: FormController<T>;
+  selector: (state: ModernFormState<T>) => Selected;
+  children: (selected: Selected) => ReactNode;
+}
+declare function FormSubscribe<T extends object = Record<string, unknown>, Selected = unknown>(props: FormSubscribeProps<T, Selected>): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { FormSelectorOptions, FormSubscribe, FormSubscribeProps, useFormController, useFormSelector };
+//# sourceMappingURL=react.d.ts.map

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

@@ -0,0 +1,27 @@
+/** @license MIT | @cube-dev/ui-kit v0.180.0 | Cube Dev Team */
+import { ModernControllerContext } from "./context.js";
+import { createFormController, getControllerInternals } from "./controller.js";
+import { useContext, useState } from "react";
+import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
+import { useSyncExternalStoreWithSelector } from "use-sync-external-store/with-selector.js";
+
+//#region src/components/form/Form/modern/react.tsx
+function useFormController(options) {
+	const [controller] = useState(() => createFormController(options));
+	return controller;
+}
+function useFormSelector(controller, selector, options) {
+	const { getServerSnapshot } = getControllerInternals(controller, "Form.useSelector()");
+	return useSyncExternalStoreWithSelector(controller.subscribe, controller.getSnapshot, getServerSnapshot, selector, options?.isEqual);
+}
+function FormSubscribe(props) {
+	const fromContext = useContext(ModernControllerContext);
+	const controller = Object.hasOwn(props, "form") ? props.form : fromContext;
+	if (!controller) throw new Error("<Form.Subscribe> requires a modern form prop or a modern <Form> root.");
+	const selected = useFormSelector(controller, props.selector, { isEqual: props.isEqual });
+	return /* @__PURE__ */ jsx(Fragment$1, { children: props.children(selected) });
+}
+
+//#endregion
+export { FormSubscribe, useFormController, useFormSelector };
+//# sourceMappingURL=react.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"react.js","names":[],"sources":["../../../../../src/components/form/Form/modern/react.tsx"],"sourcesContent":["import { useContext, useState } from 'react';\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js';\n\nimport { ModernControllerContext } from './context';\nimport { createFormController, getControllerInternals } from './controller';\n\nimport type { ReactNode } from 'react';\nimport type {\n  FormController,\n  ModernFormState,\n  UseFormControllerOptions,\n} from './controller';\n\nexport function useFormController<T extends object = Record<string, unknown>>(\n  options?: UseFormControllerOptions<T>,\n): FormController<T> {\n  // Initial options seed synchronously. A new options object never resets the\n  // controller, and the creator does not subscribe its owner to form changes.\n  const [controller] = useState(() => createFormController(options));\n  // Do not dispose from effect cleanup: Strict Mode and hidden React trees\n  // reconnect effects while preserving state. Subscriptions own their cleanup;\n  // the controller has no external resources and is collected with its owner.\n  return controller;\n}\n\nexport interface FormSelectorOptions<Selected> {\n  isEqual?: (previous: Selected, next: Selected) => boolean;\n}\n\nexport function useFormSelector<T extends object, Selected>(\n  controller: FormController<T>,\n  selector: (state: ModernFormState<T>) => Selected,\n  options?: FormSelectorOptions<Selected>,\n): Selected {\n  const { getServerSnapshot } = getControllerInternals(\n    controller,\n    'Form.useSelector()',\n  );\n  return useSyncExternalStoreWithSelector(\n    controller.subscribe,\n    controller.getSnapshot,\n    getServerSnapshot,\n    selector,\n    options?.isEqual,\n  );\n}\n\nexport interface FormSubscribeProps<T extends object, Selected>\n  extends FormSelectorOptions<Selected> {\n  /** Omit to use modern context. An explicit undefined detaches from context. */\n  form?: FormController<T>;\n  selector: (state: ModernFormState<T>) => Selected;\n  children: (selected: Selected) => ReactNode;\n}\n\nexport function FormSubscribe<\n  T extends object = Record<string, unknown>,\n  Selected = unknown,\n>(props: FormSubscribeProps<T, Selected>) {\n  const fromContext = useContext(ModernControllerContext);\n  const controller = Object.hasOwn(props, 'form') ? props.form : fromContext;\n  if (!controller) {\n    throw new Error(\n      '<Form.Subscribe> requires a modern form prop or a modern <Form> root.',\n    );\n  }\n  const selected = useFormSelector(controller, props.selector, {\n    isEqual: props.isEqual,\n  });\n  return <>{props.children(selected)}</>;\n}\n"],"mappings":";;;;;;;;AAaA,SAAgB,kBACd,SACmB;CAGnB,MAAM,CAAC,cAAc,eAAe,qBAAqB,QAAQ,CAAC;AAIlE,QAAO;;AAOT,SAAgB,gBACd,YACA,UACA,SACU;CACV,MAAM,EAAE,sBAAsB,uBAC5B,YACA,qBACD;AACD,QAAO,iCACL,WAAW,WACX,WAAW,aACX,mBACA,UACA,SAAS,QACV;;AAWH,SAAgB,cAGd,OAAwC;CACxC,MAAM,cAAc,WAAW,wBAAwB;CACvD,MAAM,aAAa,OAAO,OAAO,OAAO,OAAO,GAAG,MAAM,OAAO;AAC/D,KAAI,CAAC,WACH,OAAM,IAAI,MACR,wEACD;CAEH,MAAM,WAAW,gBAAgB,YAAY,MAAM,UAAU,EAC3D,SAAS,MAAM,SAChB,CAAC;AACF,QAAO,4CAAG,MAAM,SAAS,SAAS,GAAI"}