@nolwenture/formik-jsonschema-form 2.0.2 → 3.0.0-beta.1

package/dist/cjs/v3/raw/core/schemaType.js

@@ -0,0 +1,75 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultValueForType = exports.normaliseType = exports.guessType = exports.getSchemaType = void 0;
+const json_1 = require("./json");
+/** Same answer as 2.x getTypes.getSchemaType for every input 2.x accepted. */
+const getSchemaType = (schema) => {
+    if (!(0, json_1.isSchemaObject)(schema))
+        return undefined;
+    const { type } = schema;
+    if (!type && schema.const)
+        return (0, exports.guessType)(schema.const);
+    if (!type && schema.enum)
+        return "string";
+    if (!type && (schema.properties || schema.additionalProperties))
+        return "object";
+    if (Array.isArray(type) && type.length === 2 && type.includes("null"))
+        return type.find((t) => t !== "null");
+    return type;
+};
+exports.getSchemaType = getSchemaType;
+/** 2.x guessType (getTypes.ts), unchanged: used for `const` type guessing. */
+const guessType = (value) => {
+    if (Array.isArray(value))
+        return "array";
+    if (typeof value === "string")
+        return "string";
+    if (value === null)
+        return "null";
+    if (typeof value === "boolean")
+        return "boolean";
+    if (!isNaN(value))
+        return "number";
+    if (typeof value === "object")
+        return "object";
+    return "string";
+};
+exports.guessType = guessType;
+/**
+ * v3 normalisation used by initial values and validation: always one type plus a
+ * nullable flag; "any" when nothing can be inferred (never a throw).
+ */
+const normaliseType = (schema) => {
+    if (!(0, json_1.isSchemaObject)(schema))
+        return { type: "any", nullable: false };
+    const raw = schema.type;
+    if (Array.isArray(raw)) {
+        const nonNull = raw.filter((t) => t !== "null");
+        return { type: nonNull[0] ?? (raw.length ? "null" : "any"), nullable: raw.includes("null") };
+    }
+    if (raw)
+        return { type: raw, nullable: false };
+    if (schema.const !== undefined)
+        return { type: (0, exports.guessType)(schema.const), nullable: false };
+    if (schema.enum && schema.enum.length > 0) {
+        const kinds = new Set(schema.enum.map((v) => (v === null ? "null" : (0, exports.guessType)(v))));
+        return { type: kinds.size === 1 ? [...kinds][0] : "any", nullable: kinds.has("null") };
+    }
+    if (schema.properties || schema.additionalProperties)
+        return { type: "object", nullable: false };
+    if (schema.items || schema.additionalItems)
+        return { type: "array", nullable: false };
+    return { type: "any", nullable: false };
+};
+exports.normaliseType = normaliseType;
+/** Default value used when an item or property is created (2.x getDefaultValueForType). */
+const defaultValueForType = (type) => {
+    if (type && !Array.isArray(type)) {
+        if (type === "array")
+            return [];
+        if (type === "object")
+            return {};
+    }
+    return undefined;
+};
+exports.defaultValueForType = defaultValueForType;

package/dist/cjs/v3/raw/core/titles.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setTitleValues = void 0;
+exports.immutablySwapItems = immutablySwapItems;
+// setTitleValues and immutablySwapItems ported from 2.x. setTitleValues no longer
+// throws when the stored value at `name` is not an array (2.x: `getIn(...)[index]`).
+const paths_1 = require("./paths");
+// Replaces ${key} placeholders in a collapsible title with the item's values.
+const setTitleValues = (name, title, defaultTitle, values) => {
+    const match = name.match(/^([a-zA-Z_$][\w[\].$]*)\[(\d+)\]$/);
+    const base = match ? match[1] : name;
+    const index = match ? parseInt(match[2], 10) : -1;
+    const container = (0, paths_1.getIn)(values, base);
+    const itemValues = match ? (Array.isArray(container) ? container[index] : undefined) : container;
+    const fallbackName = base.split(".").slice(-1)[0];
+    return title.replace(/\$\{([\w$.:]+)\}/g, (placeholder) => {
+        const key = placeholder.slice(2, -1);
+        const value = itemValues ? (0, paths_1.getIn)(itemValues, key) : undefined;
+        if (key === "index")
+            return (index + 1).toString();
+        return value ? String(value) : defaultTitle || fallbackName;
+    });
+};
+exports.setTitleValues = setTitleValues;
+function immutablySwapItems(items, firstIndex, secondIndex) {
+    const results = items.slice();
+    results[firstIndex] = items[secondIndex];
+    results[secondIndex] = items[firstIndex];
+    return results;
+}

package/dist/cjs/v3/raw/core/trail.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mayEnter = void 0;
+const issues_1 = require("./issues");
+const json_1 = require("./json");
+/** True when `node` may be expanded below `trail`; otherwise reports REF_CYCLE or REF_DEPTH_EXCEEDED and returns false. */
+const mayEnter = (node, trail, sink, path) => {
+    if (trail.includes(node)) {
+        sink((0, issues_1.issue)("REF_CYCLE", path || undefined));
+        return false;
+    }
+    if (trail.length >= json_1.MAX_SCHEMA_DEPTH) {
+        sink((0, issues_1.issue)("REF_DEPTH_EXCEEDED", path || undefined));
+        return false;
+    }
+    return true;
+};
+exports.mayEnter = mayEnter;

package/dist/cjs/v3/raw/core/uiProps.js

@@ -0,0 +1,72 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.filterUiProps = exports.STYLE_PROPERTIES = void 0;
+const issues_1 = require("./issues");
+const json_1 = require("./json");
+/** Allowed keys (React names) and the HTML attribute each becomes. */
+const KEYS = {
+    placeholder: "placeholder", autoComplete: "autocomplete", inputMode: "inputmode", min: "min", max: "max", step: "step",
+    maxLength: "maxlength", className: "class", title: "title", id: "id", tabIndex: "tabindex", disabled: "disabled", readOnly: "readonly",
+};
+/**
+ * Style properties (camelCase) allowed in `style`: typography, colour, box and flex/grid layout.
+ * Not allowed: positioning (`position`, `inset`, `top`..., `zIndex`), `background(-image)`,
+ * `content`, `transform`, `filter`, anything with `url(`, `expression(` or `javascript:` (provisional).
+ */
+exports.STYLE_PROPERTIES = new Set([
+    "color", "backgroundColor", "opacity", "fontFamily", "fontSize", "fontStyle", "fontWeight", "lineHeight", "letterSpacing",
+    "textAlign", "textDecoration", "textTransform", "whiteSpace", "wordBreak", "overflowWrap", "verticalAlign",
+    "display", "boxSizing", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "overflow",
+    "margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft",
+    "border", "borderTop", "borderRight", "borderBottom", "borderLeft", "borderColor", "borderStyle", "borderWidth", "borderRadius",
+    "flex", "flexDirection", "flexWrap", "flexGrow", "flexShrink", "flexBasis", "alignItems", "alignSelf", "justifyContent", "gap",
+    "rowGap", "columnGap", "gridTemplateColumns", "gridColumn", "gridRow", "breakInside", "breakBefore", "breakAfter",
+    "pageBreakInside", "pageBreakBefore", "pageBreakAfter",
+]);
+const UNSAFE_VALUE = /url\s*\(|expression\s*\(|javascript:|@import|[<>{};\\]/i;
+const kebab = (name) => name.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`);
+const primitive = (v) => typeof v === "string" || typeof v === "number" || typeof v === "boolean";
+const styleOf = (style, rejected) => {
+    if (!(0, json_1.isPlainObject)(style)) {
+        rejected.push("style");
+        return undefined;
+    }
+    const rules = [];
+    for (const [name, value] of Object.entries(style)) {
+        if (exports.STYLE_PROPERTIES.has(name) && (typeof value === "string" || typeof value === "number") && !UNSAFE_VALUE.test(String(value)))
+            rules.push(`${kebab(name)}:${value}`);
+        else
+            rejected.push(`style.${name}`);
+    }
+    return rules.length ? rules.join(";") : undefined;
+};
+/** `{attrs, rejected}`: HTML attributes for a library element; rejected keys are reported on `sink`. */
+const filterUiProps = (uiProps, path = "", sink) => {
+    const attrs = {};
+    const rejected = [];
+    if (uiProps === undefined || uiProps === null)
+        return { attrs, rejected };
+    if (!(0, json_1.isPlainObject)(uiProps))
+        rejected.push("(not an object)");
+    else {
+        for (const [key, value] of Object.entries(uiProps)) {
+            const isData = /^data-[a-z0-9-]+$/i.test(key) && !/^data-(fjsf-|keyword$)/i.test(key);
+            const isAria = /^aria-[a-z]+$/i.test(key);
+            if (key === "style") {
+                const css = styleOf(value, rejected);
+                if (css)
+                    attrs.style = css;
+            }
+            else if ((isData || isAria || Object.prototype.hasOwnProperty.call(KEYS, key)) && primitive(value)) {
+                attrs[isData || isAria ? key.toLowerCase() : KEYS[key]] = value;
+            }
+            else
+                rejected.push(key);
+        }
+    }
+    if (sink)
+        for (const key of rejected)
+            sink((0, issues_1.issue)("PROP_REJECTED", path, key));
+    return { attrs, rejected };
+};
+exports.filterUiProps = filterUiProps;

package/dist/cjs/v3/raw/core/uiSchema.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDescription = exports.getTitle = exports.getHiddenProperties = exports.extractUiSchema = void 0;
+exports.orderByUiSchema = orderByUiSchema;
+exports.orderAdditionalProperties = orderAdditionalProperties;
+const json_1 = require("./json");
+/** Flattens `ui:*` keys (prefix removed) and `ui:options` into one object (2.x semantics). */
+const extractUiSchema = (ui = {}) => {
+    const schema = (0, json_1.isPlainObject)(ui) ? { ...ui } : {};
+    if (schema.props !== undefined)
+        schema["ui:props"] = { ...(schema["ui:props"] ?? {}), ...(schema.props ?? {}) };
+    const { "ui:options": options = {}, ...rest } = schema;
+    const result = {};
+    for (const key of Object.keys(rest))
+        result[key.replace("ui:", "")] = rest[key];
+    return { ...result, ...((0, json_1.isPlainObject)(options) ? options : {}) };
+};
+exports.extractUiSchema = extractUiSchema;
+const fieldsOf = (order) => order.flatMap((entry) => (typeof entry === "string" ? entry : entry?.fields ?? []));
+const getHiddenProperties = (order, properties) => {
+    if (!Array.isArray(order) || order.includes("*"))
+        return [];
+    const listed = fieldsOf(order);
+    return properties.filter((key) => !listed.includes(key));
+};
+exports.getHiddenProperties = getHiddenProperties;
+function orderByUiSchema(order, allProperties) {
+    if (order === undefined || allProperties === undefined)
+        return allProperties;
+    if (!Array.isArray(order))
+        return allProperties;
+    if (!order.includes("*"))
+        return order;
+    const unique = [...new Set(order)];
+    const listed = fieldsOf(unique);
+    const result = [];
+    for (const entry of unique) {
+        if (entry === "*")
+            result.push(...allProperties.filter((p) => !listed.includes(p)));
+        else
+            result.push(entry);
+    }
+    return result;
+}
+function orderAdditionalProperties(order, values) {
+    if (!Array.isArray(order) || order.length === 0)
+        return values;
+    const relevant = fieldsOf(order).filter((item) => values.includes(item) || item === "*");
+    return orderByUiSchema(relevant, values);
+}
+const getTitle = ({ title, uiSchema, schema, name }) => uiSchema?.["ui:options"]?.hideTitle
+    ? undefined
+    : title || uiSchema?.["ui:title"] || schema?.title || name?.split(".")[name.split(".").length - 1];
+exports.getTitle = getTitle;
+const getDescription = ({ description, uiSchema, schema }) => description || uiSchema?.["ui:options"]?.description || uiSchema?.["ui:description"] || schema?.description;
+exports.getDescription = getDescription;

package/dist/cjs/v3/raw/dom/bind.js

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.bindEvents = void 0;
+const delegate_1 = require("./delegate");
+const bindEvents = (core, target) => {
+    const undelegate = (0, delegate_1.delegate)(target, core.records, (on, event, el) => {
+        switch (event.type) {
+            case "input":
+            case "change": {
+                if (!on.change)
+                    break;
+                if ((0, delegate_1.isTextControl)(el)) {
+                    // React's onChange: `input` or `change`, once per new value
+                    const value = el.value;
+                    if (core.tracked.get(el) === value)
+                        break;
+                    core.tracked.set(el, value);
+                    core.dispatch(on.change, { value });
+                }
+                else if (event.type === "change" && !core.uploads.handle(on.change, event, el))
+                    core.dispatch(on.change, (0, delegate_1.controlEvent)(el));
+                break;
+            }
+            case "focusout": {
+                // React's onBlur is focusout: it also fires on a container when focus leaves one of its controls
+                const related = event.relatedTarget;
+                if (on.focusout)
+                    core.dispatch(on.focusout, { leftContainer: !related || !el.contains(related) });
+                else if (on.blur)
+                    core.dispatch(on.blur, { value: event.target?.value });
+                break;
+            }
+            case "focusin":
+                if (on.focus)
+                    core.dispatch(on.focus);
+                break;
+            case "paste":
+                if (on.paste) {
+                    event.preventDefault();
+                    core.dispatch(on.paste, { value: event.clipboardData?.getData("text")?.trim() ?? "" });
+                }
+                break;
+            case "mousedown":
+                if (on.mousedown)
+                    event.preventDefault();
+                break;
+            case "keydown":
+                // Q-SEL-2: Enter in a search input never submits the form (the document listener still selects).
+                if (on.keydown?.type === "preventEnter" && event.key === "Enter")
+                    event.preventDefault();
+                break;
+            case "click":
+                if (!on.click)
+                    break;
+                if (el.tagName === "A" || on.click.type === "preventDefault")
+                    event.preventDefault();
+                if (on.click.type !== "preventDefault" && !core.uploads.handle(on.click, event, el))
+                    core.dispatch(on.click);
+                break;
+            case "submit":
+                if (on.submit) {
+                    event.preventDefault();
+                    void core.store.submitForm().catch((error) => globalThis.console?.warn?.("fjsf: an unhandled error was caught from submit", error));
+                }
+                break;
+            default: {
+                // dragenter / dragleave / dragover / drop: the files upload
+                const action = on[event.type];
+                if (action)
+                    core.uploads.handle(action, event, el);
+            }
+        }
+    });
+    // 2.x listened on the document while a searchable dropdown was open; one listener per controller here.
+    const doc = target.ownerDocument;
+    // Q-SEL-1: only the open select whose container holds the key's target (the focused one) reacts.
+    const onKey = (e) => [...core.keyActions.values()].filter(({ el }) => el.contains(e.target)).forEach(({ action }) => core.dispatch(action, { keyName: e.key }));
+    doc.addEventListener("keydown", onKey);
+    return () => {
+        undelegate();
+        doc.removeEventListener("keydown", onKey);
+    };
+};
+exports.bindEvents = bindEvents;

package/dist/cjs/v3/raw/dom/build.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildTree = void 0;
+const form_1 = require("../model/form");
+const view_1 = require("../model/view");
+const markup_1 = require("../model/view/markup");
+const toVNode_1 = require("../model/view/toVNode");
+const buildTree = (schema, uiSchema, state, ui, o, sink) => {
+    const customFields = Object.keys(o.fields ?? {});
+    if (o.mode === "view") {
+        const view = (0, view_1.buildViewNode)(schema, uiSchema ?? {}, state.values, { customFields, formLocalization: o.formLocalization, sink, fileUploadView: o.fileUploadView });
+        return { tree: (0, markup_1.formShellMarkup)(o.className, [(0, toVNode_1.toVNode)(view)]) };
+    }
+    const ctx = (0, form_1.createFormContext)(schema, uiSchema, { values: state.values, errors: state.errors, touched: state.touched, submitting: state.isSubmitting }, {
+        customFields,
+        formLocalization: o.formLocalization ?? {},
+        formOptions: o.formOptions ?? {},
+        locale: o.locale,
+        ui,
+        hideUnmarkedAdditionalProperties: o.hideUnmarkedAdditionalProperties,
+        orderable: !!o.orderable,
+        sink,
+    });
+    const content = (0, form_1.formField)(ctx, { name: "", schema, ui: uiSchema ?? {} }, []);
+    return { tree: (0, form_1.formShell)(content, { className: o.className, hideSubmit: !!o.hideSubmit, submitting: state.isSubmitting }), ctx };
+};
+exports.buildTree = buildTree;

package/dist/cjs/v3/raw/dom/controller.js

@@ -0,0 +1,87 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormController = void 0;
+const bind_1 = require("./bind");
+const core_1 = require("./core");
+const render_1 = require("./render");
+class FormController {
+    core;
+    unbind;
+    unsubscribe;
+    destroyed = false;
+    constructor(init) {
+        this.core = (0, core_1.createCore)(init, (core) => (0, render_1.renderCore)(core, this));
+        const { ui: _ui, ...state } = init.state ?? {};
+        if (Object.keys(state).length)
+            this.core.store.setState(state);
+        this.unsubscribe = this.core.store.subscribe(() => this.core.schedule());
+    }
+    /** The RAW store (the state adapter): values, errors, touched, isSubmitting, submitCount. */
+    get store() {
+        return this.core.store;
+    }
+    /** Draws the form into `target` and binds its events; idempotent per target. */
+    mount(target) {
+        if (this.destroyed || this.core.target === target)
+            return;
+        this.unbind?.();
+        this.core.target = target;
+        this.unbind = (0, bind_1.bindEvents)(this.core, target);
+        this.core.render();
+    }
+    /** New schema / uiSchema / values / options; the form is redrawn (in place). */
+    update(partial) {
+        const core = this.core;
+        if ("schema" in partial)
+            core.schema = partial.schema;
+        if ("uiSchema" in partial)
+            core.uiSchema = partial.uiSchema;
+        if (partial.options)
+            core.options = { ...core.options, ...partial.options };
+        if ("schema" in partial || "uiSchema" in partial)
+            core.reported.clear();
+        if ("values" in partial)
+            core.act(() => core.store.setValues(partial.values, false));
+        core.schedule();
+    }
+    /** Removes every listener (the document one too) and stops the uploads' timers; idempotent. */
+    destroy() {
+        if (this.destroyed)
+            return;
+        this.destroyed = true;
+        this.unbind?.();
+        this.unsubscribe();
+        this.core.uploads.destroy();
+        this.core.emitter.clear();
+        this.core.target = undefined;
+        this.core.keyActions.clear();
+    }
+    getState() {
+        return { ...this.core.store.getState(), ui: this.core.ui };
+    }
+    /** The VNode tree of the last render: what every serialiser draws (toString / toDOM / toReact). */
+    getViewModel() {
+        return this.core.tree;
+    }
+    /** The 2.x error map of `values`; without values, of the current ones, which then become the errors. */
+    async validate(values) {
+        const errors = await this.core.store.validateForm(values);
+        if (values === undefined)
+            this.core.store.setState({ errors });
+        return errors;
+    }
+    /** What the submit button does: touch all, validate, then `submit` and `options.onSubmit` when valid. */
+    submit() {
+        return this.core.store.submitForm().catch((error) => globalThis.console?.warn?.("fjsf: an unhandled error was caught from submit", error));
+    }
+    on(type, handler) {
+        return this.core.emitter.on(type, handler);
+    }
+    off(type, handler) {
+        this.core.emitter.off(type, handler);
+    }
+    once(type, handler) {
+        return this.core.emitter.once(type, handler);
+    }
+}
+exports.FormController = FormController;

package/dist/cjs/v3/raw/dom/core.js

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createCore = void 0;
+const createStore_1 = require("../store/createStore");
+const emitter_1 = require("./emitter");
+const effects_1 = require("./effects");
+const upload_1 = require("./upload");
+const warn = (what) => (error) => globalThis.console?.warn?.(`fjsf: ${what}`, error);
+const createCore = (init, render) => {
+    const core = {
+        schema: init.schema,
+        uiSchema: init.uiSchema,
+        options: init.options ?? {},
+        ui: init.state?.ui ?? {},
+        emitter: (0, emitter_1.createEmitter)(),
+        records: new WeakMap(),
+        tracked: new WeakMap(),
+        keyActions: new Map(),
+        seen: new Set(),
+        reported: new Set(),
+        scrolled: new Map(),
+        slotProps: new Map(),
+        scheduled: false,
+    };
+    core.emit = (event) => core.emitter.emit(event);
+    core.act = (update) => void update().catch(warn("a state update failed"));
+    core.render = () => render(core);
+    core.schedule = () => {
+        if (core.scheduled || !core.target)
+            return;
+        core.scheduled = true;
+        queueMicrotask(() => {
+            core.scheduled = false;
+            core.render();
+        });
+    };
+    core.element = (id) => [...(core.target?.querySelectorAll("[id]") ?? [])].find((el) => el.id === id);
+    core.store = (0, createStore_1.createStore)({
+        initialValues: init.values ?? {},
+        validationSchema: core.options.validationSchema,
+        validateOnChange: core.options.validateOnChange,
+        validateOnBlur: core.options.validateOnBlur,
+        onValidated: (errors) => core.emit({ type: "validate", errors }),
+        onSubmit: (values) => {
+            core.emit({ type: "submit", values });
+            return core.options.onSubmit?.(values);
+        },
+    });
+    core.uploads = (0, upload_1.createUploads)({
+        uploads: () => core.options.uploads,
+        values: () => core.store.getState().values,
+        setValue: (path, value) => core.act(() => core.store.setFieldValue(path, value)),
+        rerender: core.schedule,
+        pick: (id) => core.element(id)?.click(),
+    });
+    core.dispatch = (action, event = {}) => (0, effects_1.runAction)({
+        store: core.store,
+        ui: () => core.ui,
+        setUi: (ui) => ((core.ui = ui), core.schedule()),
+        emit: core.emit,
+        askKey: core.options.askKey ?? (() => (typeof globalThis.prompt === "function" ? globalThis.prompt("Give key") : null)),
+        picker: (id) => (0, effects_1.openPicker)(core.element(id)),
+        failed: warn("an action failed"),
+    }, action, event);
+    return core;
+};
+exports.createCore = createCore;

package/dist/cjs/v3/raw/dom/delegate.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.controlEvent = exports.isTextControl = exports.delegate = void 0;
+const TYPES = ["input", "change", "focusin", "focusout", "click", "keydown", "paste", "mousedown", "dragenter", "dragleave", "dragover", "drop", "submit"];
+const delegate = (root, records, handle) => {
+    const listener = (event) => {
+        for (let el = event.target; el; el = el.parentElement) {
+            const on = records.get(el);
+            if (on)
+                handle(on, event, el);
+            if (el === root || event.cancelBubble)
+                break;
+        }
+    };
+    TYPES.forEach((type) => root.addEventListener(type, listener));
+    return () => TYPES.forEach((type) => root.removeEventListener(type, listener));
+};
+exports.delegate = delegate;
+const TEXT_TYPES = new Set(["checkbox", "radio", "file", "submit", "button", "reset", "image"]);
+/** Controls whose value is typed: React's onChange fires on `input` for them, on `change` for the rest. */
+const isTextControl = (el) => el.tagName === "TEXTAREA" || (el.tagName === "INPUT" && !TEXT_TYPES.has((el.type || "text").toLowerCase()));
+exports.isTextControl = isTextControl;
+/** What a control's change carried (the ControlEvent of applyAction). */
+const controlEvent = (el) => {
+    if (el.tagName === "INPUT" && (el.type === "checkbox" || el.type === "radio"))
+        return { checked: !!el.checked, value: el.value };
+    if (el.tagName === "SELECT" && el.multiple)
+        return { selected: [...el.options].filter((o) => o.selected).map((o) => o.value) };
+    return { value: el.value };
+};
+exports.controlEvent = controlEvent;

package/dist/cjs/v3/raw/dom/effects.js

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.openPicker = exports.runAction = void 0;
+const json_1 = require("../core/json");
+const paths_1 = require("../core/paths");
+const form_1 = require("../model/form");
+const CAUSES = {
+    arrayAdd: "add", arrayRemove: "remove", propertyRemove: "remove", arrayMove: "move", propertyAdd: "additional-key",
+};
+const runAction = (host, action, event = {}) => {
+    const { store } = host;
+    const values = store.getState().values;
+    let effect;
+    try {
+        effect = (0, form_1.applyAction)(action, values, event, host.ui());
+    }
+    catch (error) {
+        return host.failed(error);
+    }
+    if (effect.askKey) {
+        const key = host.askKey();
+        return key ? (0, exports.runAction)(host, action, { ...event, key }) : undefined;
+    }
+    const quietly = (p) => void p.catch(host.failed);
+    if (effect.touchQuietly !== undefined)
+        quietly(store.setFieldTouched(effect.touchQuietly, true, false));
+    if (effect.error)
+        store.setFieldError(effect.error.path, effect.error.message);
+    if (effect.picker)
+        host.picker(effect.picker);
+    if (effect.set) {
+        const { path, value } = effect.set;
+        if (!path)
+            quietly(store.setValues(value));
+        // BUG-109: a primitive root (wrong-typed stored data) becomes an object.
+        else if (!(0, json_1.isPlainObject)(values))
+            quietly(store.setValues((0, paths_1.setIn)({}, path, value)));
+        else
+            quietly(store.setFieldValue(path, value));
+        const after = store.getState().values;
+        host.emit({ type: "change", path, value: path ? (0, paths_1.getIn)(after, path) : after, values: after, cause: CAUSES[action.type] ?? "input" });
+    }
+    if (effect.touch !== undefined) {
+        quietly(store.setFieldTouched(effect.touch, true));
+        host.emit({ type: "blur", path: effect.touch });
+    }
+    if (effect.ui)
+        host.setUi(effect.ui);
+    if (effect.order)
+        host.emit({ type: "order", path: effect.order.path, oldOrder: effect.order.previous, newOrder: effect.order.next });
+};
+exports.runAction = runAction;
+/** 2.x DateInput openPicker on an element of this form: the native picker, or focus + click. */
+const openPicker = (el) => {
+    if (!el)
+        return;
+    try {
+        if (typeof el.showPicker === "function")
+            return el.showPicker();
+    }
+    catch {
+        // jsdom and older browsers: fall through
+    }
+    el.focus();
+    el.click();
+};
+exports.openPicker = openPicker;