@sectile/vue 0.2.1

package/dist/tags-input.js

@@ -0,0 +1,196 @@
+import { computed, defineComponent, h, inject, mergeProps, onBeforeUnmount, onMounted, provide, shallowRef, watch, } from 'vue';
+import { createTagsInput } from '@sectile/dom/tags-input';
+import { Primitive } from './primitive.js';
+import { visuallyHiddenInputStyle } from './internal/native-input.js';
+import { provideFormControlOwner } from './form.js';
+import { hiddenValueSubmissionCapabilities, useCompositeFormControl, } from './internal/form-control.js';
+import { useHostDirection } from './host-provider.js';
+const rootKey = Symbol('SectileTagsInputRoot');
+const itemKey = Symbol('SectileTagsInputItem');
+const partProps = {
+    as: { type: [String, Object, Function], default: 'span' }, asChild: { type: Boolean, default: false },
+};
+export const TagsInputRoot = defineComponent({
+    name: 'SectileTagsInputRoot', inheritAttrs: false,
+    props: {
+        modelValue: { type: Array, default: undefined },
+        defaultValue: { type: Array, default: () => [] },
+        inputValue: { type: String, default: undefined }, defaultInputValue: { type: String, default: '' },
+        disabled: { type: Boolean, default: false }, readonly: { type: Boolean, default: false },
+        label: { type: String, default: 'Tags' }, name: { type: String, default: undefined },
+        form: { type: String, default: undefined }, required: { type: Boolean, default: false },
+        policies: { type: Object, default: undefined },
+        as: { type: [String, Object, Function], default: 'div' }, asChild: { type: Boolean, default: false },
+    },
+    emits: {
+        'update:modelValue': (_value) => true,
+        'update:inputValue': (_value) => true,
+    },
+    slots: Object,
+    setup(props, { attrs, emit, slots }) {
+        const direction = useHostDirection();
+        const root = shallowRef(null);
+        const input = shallowRef(null);
+        const submissionElements = [];
+        const participation = useCompositeFormControl({
+            root,
+            focusTarget: input,
+            submissions: () => state.value.value.map((_, index) => ({
+                element: () => submissionElements[index] ?? null,
+                capabilities: hiddenValueSubmissionCapabilities,
+            })),
+        });
+        provideFormControlOwner();
+        const connection = shallowRef();
+        const localTags = shallowRef(props.modelValue ?? props.defaultValue);
+        const localInput = shallowRef(props.inputValue ?? props.defaultInputValue);
+        const valueControlled = props.modelValue !== undefined;
+        const inputControlled = props.inputValue !== undefined;
+        const state = computed(() => Object.freeze({
+            value: props.modelValue ?? localTags.value, inputValue: props.inputValue ?? localInput.value,
+            disabled: props.disabled, readonly: props.readonly,
+        }));
+        const refresh = () => {
+            const snapshot = connection.value?.getSnapshot().state;
+            if (snapshot === undefined)
+                return;
+            localTags.value = snapshot.tags;
+            localInput.value = snapshot.draft;
+            refreshDeletes();
+        };
+        const refreshDeletes = () => {
+            if (root.value === null || connection.value === undefined)
+                return;
+            root.value.querySelectorAll('[data-sectile-tags-delete]').forEach((element) => {
+                connection.value?.setTagAttributes(element, Number(element.dataset['sectileTagsDelete']));
+            });
+        };
+        const connect = () => {
+            connection.value?.disconnect();
+            if (root.value === null || input.value === null)
+                return;
+            connection.value = createTagsInput({
+                root: root.value, input: input.value, direction: direction.value,
+                ...(props.policies === undefined ? {} : { policies: props.policies }),
+                ...(valueControlled ? { value: props.modelValue } : { defaultValue: localTags.value }),
+                ...(inputControlled ? { inputValue: props.inputValue } : { defaultInputValue: localInput.value }),
+                disabled: props.disabled, readOnly: props.readonly, label: props.label,
+                onValueChange: (next) => { localTags.value = next; emit('update:modelValue', next); },
+                onInputValueChange: (next) => { localInput.value = next; emit('update:inputValue', next); },
+                onUpdate: refresh,
+            });
+            refresh();
+        };
+        provide(rootKey, {
+            state, label: computed(() => props.label),
+            registerRoot: (element) => { root.value = element ?? null; }, registerInput: (element) => { input.value = element ?? null; },
+            registerDelete: (element, index) => connection.value?.setTagAttributes(element, index),
+            clear: () => { for (let index = state.value.value.length - 1; index >= 0; index -= 1)
+                connection.value?.handleEvent({ type: 'remove', index }); },
+        });
+        onMounted(connect);
+        onBeforeUnmount(() => connection.value?.disconnect());
+        watch([() => props.disabled, () => props.readonly, () => props.label, () => props.policies, direction], connect);
+        watch([() => props.modelValue, () => props.inputValue], () => {
+            if (connection.value === undefined)
+                return;
+            const result = connection.value.syncControlledValues({
+                ...(valueControlled ? { value: props.modelValue } : {}),
+                ...(inputControlled ? { inputValue: props.inputValue } : {}),
+            });
+            if (!result.ok)
+                throw new TypeError(result.error.message);
+            refresh();
+        });
+        return () => {
+            const visual = h(Primitive, mergeProps(attrs, {
+                as: props.as, asChild: props.asChild, elementRef: (node) => { root.value = node instanceof HTMLElement ? node : null; },
+                role: 'group', 'aria-label': props.label, dir: direction.value, 'data-scope': 'tags-input', 'data-part': 'root',
+                'data-disabled': props.disabled ? '' : undefined, 'data-readonly': props.readonly ? '' : undefined,
+            }, participation.controlProps.value), { default: () => slots['default']?.(state.value) });
+            if (!participation.participating && props.name === undefined && props.form === undefined)
+                return visual;
+            return [visual, ...state.value.value.map((tag, index) => h('input', {
+                    ref: (element) => {
+                        submissionElements[index] = element instanceof HTMLInputElement ? element : null;
+                    },
+                    type: 'hidden', name: props.name, form: props.form, value: tag, disabled: props.disabled,
+                    style: visuallyHiddenInputStyle,
+                }))];
+        };
+    },
+});
+export const TagsInputItem = defineComponent({
+    name: 'SectileTagsInputItem', inheritAttrs: false,
+    props: { index: { type: Number, required: true }, ...partProps },
+    slots: Object,
+    setup(props, { attrs, slots }) {
+        const root = useRoot('TagsInputItem');
+        const state = computed(() => ({
+            index: props.index, value: root.state.value.value[props.index] ?? '',
+            disabled: root.state.value.disabled, readonly: root.state.value.readonly,
+        }));
+        provide(itemKey, { state });
+        return () => h(Primitive, mergeProps(attrs, {
+            as: props.as, asChild: props.asChild, 'data-scope': 'tags-input', 'data-part': 'item', 'data-index': props.index,
+        }), { default: () => slots['default']?.(state.value) });
+    },
+});
+export const TagsInputItemText = defineComponent({
+    name: 'SectileTagsInputItemText', inheritAttrs: false, props: partProps,
+    slots: Object,
+    setup(props, { attrs, slots }) {
+        const item = useItem('TagsInputItemText');
+        return () => h(Primitive, mergeProps(attrs, {
+            as: props.as, asChild: props.asChild, 'data-scope': 'tags-input', 'data-part': 'item-text',
+        }), { default: () => slots['default']?.(item.state.value) ?? item.state.value.value });
+    },
+});
+export const TagsInputItemDelete = defineComponent({
+    name: 'SectileTagsInputItemDelete', inheritAttrs: false,
+    props: { as: { type: [String, Object, Function], default: 'button' }, asChild: { type: Boolean, default: false } },
+    slots: Object,
+    setup(props, { attrs, slots }) {
+        const root = useRoot('TagsInputItemDelete');
+        const item = useItem('TagsInputItemDelete');
+        return () => h(Primitive, mergeProps(attrs, {
+            as: props.as, asChild: props.asChild, type: props.as === 'button' ? 'button' : undefined,
+            elementRef: (node) => { if (node instanceof HTMLElement)
+                root.registerDelete(node, item.state.value.index); },
+            'data-sectile-tags-delete': item.state.value.index, 'data-scope': 'tags-input', 'data-part': 'item-delete',
+            disabled: item.state.value.disabled || item.state.value.readonly,
+        }), { default: () => slots['default']?.(item.state.value) });
+    },
+});
+export const TagsInputInput = defineComponent({
+    name: 'SectileTagsInputInput', inheritAttrs: false,
+    props: { as: { type: [String, Object, Function], default: 'input' }, asChild: { type: Boolean, default: false } },
+    setup(props, { attrs }) {
+        const root = useRoot('TagsInputInput');
+        return () => h(Primitive, mergeProps(attrs, {
+            as: props.as, asChild: props.asChild,
+            elementRef: (node) => root.registerInput(node instanceof HTMLInputElement ? node : undefined),
+            type: 'text', value: root.state.value.inputValue, disabled: root.state.value.disabled,
+            readonly: root.state.value.readonly, 'aria-label': root.label.value,
+            'data-scope': 'tags-input', 'data-part': 'input',
+        }));
+    },
+});
+export const TagsInputClear = defineComponent({
+    name: 'SectileTagsInputClear', inheritAttrs: false,
+    props: { as: { type: [String, Object, Function], default: 'button' }, asChild: { type: Boolean, default: false } },
+    slots: Object,
+    setup(props, { attrs, slots }) {
+        const root = useRoot('TagsInputClear');
+        return () => h(Primitive, mergeProps(attrs, {
+            as: props.as, asChild: props.asChild, type: props.as === 'button' ? 'button' : undefined,
+            disabled: root.state.value.disabled || root.state.value.readonly || root.state.value.value.length === 0,
+            onClick: root.clear, 'data-scope': 'tags-input', 'data-part': 'clear',
+        }), { default: () => slots['default']?.(root.state.value) });
+    },
+});
+function useRoot(part) { const root = inject(rootKey); if (root === undefined)
+    throw new TypeError(`${part} must be used inside TagsInputRoot.`); return root; }
+function useItem(part) { const item = inject(itemKey); if (item === undefined)
+    throw new TypeError(`${part} must be used inside TagsInputItem.`); return item; }
+//# sourceMappingURL=tags-input.js.map

package/dist/tags-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tags-input.js","sourceRoot":"","sources":["../src/tags-input.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EAAE,eAAe,EAAE,CAAC,EAAE,MAAM,EAAE,UAAU,EAAE,eAAe,EAAE,SAAS,EAAE,OAAO,EACrF,UAAU,EAAE,KAAK,GAClB,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,eAAe,EAAoD,MAAM,yBAAyB,CAAC;AAC5G,OAAO,EAAE,SAAS,EAAoB,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,uBAAuB,EAAE,MAAM,WAAW,CAAC;AACpD,OAAO,EACL,iCAAiC,EACjC,uBAAuB,GACxB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AA+BtD,MAAM,OAAO,GAAG,MAAM,CAAC,sBAAsB,CAAC,CAAC;AAC/C,MAAM,OAAO,GAAG,MAAM,CAAC,sBAAsB,CAAC,CAAC;AAC/C,MAAM,SAAS,GAAG;IAChB,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAA0B,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE;CAC/H,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,eAAe,CAAC;IAC3C,IAAI,EAAE,sBAAsB,EAAE,YAAY,EAAE,KAAK;IACjD,KAAK,EAAE;QACL,UAAU,EAAE,EAAE,IAAI,EAAE,KAAoC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC9E,YAAY,EAAE,EAAE,IAAI,EAAE,KAAoC,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE;QAC/E,UAAU,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,iBAAiB,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE;QAClG,QAAQ,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE;QACxF,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE;QACpF,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,QAAQ,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE;QACvF,QAAQ,EAAE,EAAE,IAAI,EAAE,MAAqC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC7E,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAA0B,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE;KAC9H;IACD,KAAK,EAAE;QACL,mBAAmB,EAAE,CAAC,MAAyB,EAAW,EAAE,CAAC,IAAI;QACjE,mBAAmB,EAAE,CAAC,MAAc,EAAW,EAAE,CAAC,IAAI;KACvD;IACD,KAAK,EAAE,MAA+E;IACtF,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE;QACjC,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;QACrC,MAAM,IAAI,GAAG,UAAU,CAAqB,IAAI,CAAC,CAAC;QAAC,MAAM,KAAK,GAAG,UAAU,CAA0B,IAAI,CAAC,CAAC;QAC3G,MAAM,kBAAkB,GAAmC,EAAE,CAAC;QAC9D,MAAM,aAAa,GAAG,uBAAuB,CAAC;YAC5C,IAAI;YACJ,WAAW,EAAE,KAAK;YAClB,WAAW,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;gBACtD,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,IAAI,IAAI;gBAChD,YAAY,EAAE,iCAAiC;aAChD,CAAC,CAAC;SACJ,CAAC,CAAC;QACH,uBAAuB,EAAE,CAAC;QAC1B,MAAM,UAAU,GAAG,UAAU,EAAuB,CAAC;QACrD,MAAM,SAAS,GAAG,UAAU,CAAoB,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,YAAY,CAAC,CAAC;QACxF,MAAM,UAAU,GAAG,UAAU,CAAC,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,iBAAiB,CAAC,CAAC;QAC3E,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,KAAK,SAAS,CAAC;QAAC,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,KAAK,SAAS,CAAC;QAC/G,MAAM,KAAK,GAAG,QAAQ,CAAyB,GAAG,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC;YACjE,KAAK,EAAE,KAAK,CAAC,UAAU,IAAI,SAAS,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,IAAI,UAAU,CAAC,KAAK;YAC5F,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ;SACnD,CAAC,CAAC,CAAC;QACJ,MAAM,OAAO,GAAG,GAAS,EAAE;YACzB,MAAM,QAAQ,GAAG,UAAU,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC,KAAK,CAAC;YACvD,IAAI,QAAQ,KAAK,SAAS;gBAAE,OAAO;YACnC,SAAS,CAAC,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC;YAAC,UAAU,CAAC,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC;YACnE,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC;QACF,MAAM,cAAc,GAAG,GAAS,EAAE;YAChC,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,IAAI,UAAU,CAAC,KAAK,KAAK,SAAS;gBAAE,OAAO;YAClE,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAc,4BAA4B,CAAC,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;gBACzF,UAAU,CAAC,KAAK,EAAE,gBAAgB,CAAC,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC;YAC5F,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QACF,MAAM,OAAO,GAAG,GAAS,EAAE;YACzB,UAAU,CAAC,KAAK,EAAE,UAAU,EAAE,CAAC;YAC/B,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,IAAI,KAAK,CAAC,KAAK,KAAK,IAAI;gBAAE,OAAO;YACxD,UAAU,CAAC,KAAK,GAAG,eAAe,CAAC;gBACjC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,SAAS,EAAE,SAAS,CAAC,KAAK;gBAChE,GAAG,CAAC,KAAK,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC;gBACrE,GAAG,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,UAA+B,EAAE,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,SAAS,CAAC,KAAK,EAAE,CAAC;gBAC3G,GAAG,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,KAAK,CAAC,UAAoB,EAAE,CAAC,CAAC,CAAC,EAAE,iBAAiB,EAAE,UAAU,CAAC,KAAK,EAAE,CAAC;gBAC3G,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK;gBACtE,aAAa,EAAE,CAAC,IAAI,EAAE,EAAE,GAAG,SAAS,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC,IAAI,CAAC,mBAAmB,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;gBACrF,kBAAkB,EAAE,CAAC,IAAI,EAAE,EAAE,GAAG,UAAU,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC,IAAI,CAAC,mBAAmB,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;gBAC3F,QAAQ,EAAE,OAAO;aAClB,CAAC,CAAC;YACH,OAAO,EAAE,CAAC;QACZ,CAAC,CAAC;QACF,OAAO,CAAc,OAAO,EAAE;YAC5B,KAAK,EAAE,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC;YACzC,YAAY,EAAE,CAAC,OAAO,EAAE,EAAE,GAAG,IAAI,CAAC,KAAK,GAAG,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,aAAa,EAAE,CAAC,OAAO,EAAE,EAAE,GAAG,KAAK,CAAC,KAAK,GAAG,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC;YAC5H,cAAc,EAAE,CAAC,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC,UAAU,CAAC,KAAK,EAAE,gBAAgB,CAAC,OAAO,EAAE,KAAK,CAAC;YACtF,KAAK,EAAE,GAAG,EAAE,GAAG,KAAK,IAAI,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC;gBAAE,UAAU,CAAC,KAAK,EAAE,WAAW,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC;SAClJ,CAAC,CAAC;QACH,SAAS,CAAC,OAAO,CAAC,CAAC;QAAC,eAAe,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,EAAE,UAAU,EAAE,CAAC,CAAC;QAC1E,KAAK,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,EAAE,SAAS,CAAC,EAAE,OAAO,CAAC,CAAC;QACjH,KAAK,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,UAAU,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,UAAU,CAAC,EAAE,GAAG,EAAE;YAC3D,IAAI,UAAU,CAAC,KAAK,KAAK,SAAS;gBAAE,OAAO;YAC3C,MAAM,MAAM,GAAG,UAAU,CAAC,KAAK,CAAC,oBAAoB,CAAC;gBACnD,GAAG,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,UAA+B,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;gBAC5E,GAAG,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,KAAK,CAAC,UAAoB,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;aACvE,CAAC,CAAC;YACH,IAAI,CAAC,MAAM,CAAC,EAAE;gBAAE,MAAM,IAAI,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;YAC1D,OAAO,EAAE,CAAC;QACZ,CAAC,CAAC,CAAC;QACH,OAAO,GAAe,EAAE;YACtB,MAAM,MAAM,GAAG,CAAC,CAAC,SAAS,EAAE,UAAU,CAAC,KAAK,EAAE;gBAC5C,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,UAAU,EAAE,CAAC,IAAa,EAAE,EAAE,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,YAAY,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;gBAChI,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,KAAK,CAAC,KAAK,EAAE,GAAG,EAAE,SAAS,CAAC,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM;gBAC/G,eAAe,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,eAAe,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS;aACnG,EAAE,aAAa,CAAC,YAAY,CAAC,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;YAC1F,IAAI,CAAC,aAAa,CAAC,aAAa,IAAI,KAAK,CAAC,IAAI,KAAK,SAAS,IAAI,KAAK,CAAC,IAAI,KAAK,SAAS;gBAAE,OAAO,MAAM,CAAC;YACxG,OAAO,CAAC,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,EAAE;oBAClE,GAAG,EAAE,CAAC,OAAgB,EAAE,EAAE;wBACxB,kBAAkB,CAAC,KAAK,CAAC,GAAG,OAAO,YAAY,gBAAgB,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC;oBACnF,CAAC;oBACD,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ;oBACxF,KAAK,EAAE,wBAAwB;iBAChC,CAAC,CAAC,CAAC,CAAC;QACP,CAAC,CAAC;IACJ,CAAC;CACF,CAAC,CAAC;AAKH,MAAM,CAAC,MAAM,aAAa,GAAG,eAAe,CAAC;IAC3C,IAAI,EAAE,sBAAsB,EAAE,YAAY,EAAE,KAAK;IACjD,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,GAAG,SAAS,EAAE;IAChE,KAAK,EAAE,MAA+E;IACtF,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,MAAM,IAAI,GAAG,OAAO,CAAC,eAAe,CAAC,CAAC;QACtC,MAAM,KAAK,GAAG,QAAQ,CAAyB,GAAG,EAAE,CAAC,CAAC;YACpD,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE;YACpE,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ;SACzE,CAAC,CAAC,CAAC;QACJ,OAAO,CAAc,OAAO,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;QACzC,OAAO,GAAe,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,UAAU,CAAC,KAAK,EAAE;YACtD,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,CAAC,KAAK;SACjH,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAC1D,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,iBAAiB,GAAG,eAAe,CAAC;IAC/C,IAAI,EAAE,0BAA0B,EAAE,YAAY,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS;IACvE,KAAK,EAAE,MAA+E;IACtF,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,MAAM,IAAI,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;QAC1C,OAAO,GAAe,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,UAAU,CAAC,KAAK,EAAE;YACtD,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW;SAC3F,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC;IACzF,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,mBAAmB,GAAG,eAAe,CAAC;IACjD,IAAI,EAAE,4BAA4B,EAAE,YAAY,EAAE,KAAK;IACvD,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAA0B,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE;IAC3I,KAAK,EAAE,MAA+E;IACtF,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,MAAM,IAAI,GAAG,OAAO,CAAC,qBAAqB,CAAC,CAAC;QAAC,MAAM,IAAI,GAAG,OAAO,CAAC,qBAAqB,CAAC,CAAC;QACzF,OAAO,GAAe,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,UAAU,CAAC,KAAK,EAAE;YACtD,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;YACxF,UAAU,EAAE,CAAC,IAAa,EAAE,EAAE,GAAG,IAAI,IAAI,YAAY,WAAW;gBAAE,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YACtH,0BAA0B,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,aAAa;YAC1G,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ;SACjE,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAC/D,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,cAAc,GAAG,eAAe,CAAC;IAC5C,IAAI,EAAE,uBAAuB,EAAE,YAAY,EAAE,KAAK;IAClD,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAA0B,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE;IAC1I,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE;QACpB,MAAM,IAAI,GAAG,OAAO,CAAC,gBAAgB,CAAC,CAAC;QACvC,OAAO,GAAe,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,UAAU,CAAC,KAAK,EAAE;YACtD,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO;YACpC,UAAU,EAAE,CAAC,IAAa,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,YAAY,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;YACtG,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ;YACrF,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK;YACnE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,OAAO;SACjD,CAAC,CAAC,CAAC;IACN,CAAC;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,cAAc,GAAG,eAAe,CAAC;IAC5C,IAAI,EAAE,uBAAuB,EAAE,YAAY,EAAE,KAAK;IAClD,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAA0B,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE;IAC3I,KAAK,EAAE,MAA+E;IACtF,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,MAAM,IAAI,GAAG,OAAO,CAAC,gBAAgB,CAAC,CAAC;QACvC,OAAO,GAAe,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,UAAU,CAAC,KAAK,EAAE;YACtD,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,IAAI,EAAE,KAAK,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;YACxF,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC;YACvG,OAAO,EAAE,IAAI,CAAC,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,OAAO;SACtE,CAAC,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAC/D,CAAC;CACF,CAAC,CAAC;AAEH,SAAS,OAAO,CAAC,IAAY,IAAiB,MAAM,IAAI,GAAG,MAAM,CAAc,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,KAAK,SAAS;IAAE,MAAM,IAAI,SAAS,CAAC,GAAG,IAAI,qCAAqC,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC;AAClM,SAAS,OAAO,CAAC,IAAY,IAAiB,MAAM,IAAI,GAAG,MAAM,CAAc,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,KAAK,SAAS;IAAE,MAAM,IAAI,SAAS,CAAC,GAAG,IAAI,qCAAqC,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC"}

package/dist/text.d.ts

@@ -0,0 +1,138 @@
+import { type PropType, type VNodeChild } from 'vue';
+export interface TextFieldProps {
+    readonly modelValue?: string | number;
+    readonly defaultValue?: string | number;
+    readonly modelModifiers?: TextFieldModelModifiers;
+    readonly disabled?: boolean;
+    readonly?: boolean;
+    readonly multiline?: boolean;
+    readonly type?: string;
+    readonly name?: string;
+    readonly form?: string;
+    readonly required?: boolean;
+    readonly placeholder?: string;
+    readonly autocomplete?: string;
+}
+export interface TextFieldModelModifiers {
+    readonly lazy?: boolean;
+    readonly number?: boolean;
+    readonly trim?: boolean;
+}
+export declare const TextField: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: undefined;
+    };
+    defaultValue: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    modelModifiers: {
+        type: PropType<TextFieldModelModifiers>;
+        default: () => TextFieldModelModifiers;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiline: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    name: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    form: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    autocomplete: {
+        type: PropType<string>;
+        default: undefined;
+    };
+}>, () => VNodeChild, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    'update:modelValue': (_value: string | number) => boolean;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: undefined;
+    };
+    defaultValue: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    modelModifiers: {
+        type: PropType<TextFieldModelModifiers>;
+        default: () => TextFieldModelModifiers;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    multiline: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    name: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    form: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    autocomplete: {
+        type: PropType<string>;
+        default: undefined;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: (_value: string | number) => any;
+}>, {
+    modelValue: string | number;
+    defaultValue: string | number;
+    modelModifiers: TextFieldModelModifiers;
+    disabled: boolean;
+    readonly: boolean;
+    multiline: boolean;
+    type: string;
+    name: string;
+    form: string;
+    required: boolean;
+    placeholder: string;
+    autocomplete: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export type TextFieldValueChangeHandler = (value: string | number) => void;
+//# sourceMappingURL=text.d.ts.map

package/dist/text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../src/text.ts"],"names":[],"mappings":"AAAA,OAAO,EASL,KAAK,QAAQ,EACb,KAAK,UAAU,EAChB,MAAM,KAAK,CAAC;AAWb,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtC,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxC,QAAQ,CAAC,cAAc,CAAC,EAAE,uBAAuB,CAAC;IAClD,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,SAAS;;QAIJ,IAAI;QAAoB,OAAO;;;QAC7B,IAAI;QAAoB,OAAO;;;QAE7C,IAAI,EAAY,QAAQ,CAAC,uBAAuB,CAAC;QACjD,OAAO,QAAM,uBAAuB;;;QAE1B,IAAI;QAAW,OAAO;;;QACtB,IAAI;QAAW,OAAO;;;QACrB,IAAI;QAAW,OAAO;;;QAC3B,IAAI;QAAU,OAAO;;;QACrB,IAAI;QAAU,OAAO;;;QACrB,IAAI;QAAU,OAAO;;;QACjB,IAAI;QAAW,OAAO;;;QACnB,IAAI;QAAU,OAAO;;;QACpB,IAAI,EAAY,QAAQ,CAAC,MAAM,CAAC;QAAE,OAAO;;UA+E9C,UAAU;kCA5ES,MAAM,GAAG,MAAM,KAAG,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4EAoGzD,CAAC;AAEH,MAAM,MAAM,2BAA2B,GAAG,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC"}

package/dist/text.js

@@ -0,0 +1,125 @@
+import { defineComponent, h, mergeProps, nextTick, onBeforeUnmount, onMounted, ref, watch, } from 'vue';
+import { connectText, createTextController, createTextState, } from '@sectile/dom/text';
+import { useNativeInputFormControl } from './internal/form-control.js';
+export const TextField = defineComponent({
+    name: 'SectileTextField',
+    inheritAttrs: false,
+    props: {
+        modelValue: { type: [String, Number], default: undefined },
+        defaultValue: { type: [String, Number], default: '' },
+        modelModifiers: {
+            type: Object,
+            default: () => ({}),
+        },
+        disabled: { type: Boolean, default: false },
+        readonly: { type: Boolean, default: false },
+        multiline: { type: Boolean, default: false },
+        type: { type: String, default: 'text' },
+        name: { type: String, default: undefined },
+        form: { type: String, default: undefined },
+        required: { type: Boolean, default: false },
+        placeholder: { type: String, default: undefined },
+        autocomplete: { type: String, default: undefined },
+    },
+    emits: {
+        'update:modelValue': (_value) => true,
+    },
+    setup(props, { attrs, emit }) {
+        const element = ref(null);
+        const participation = useNativeInputFormControl(element);
+        const controlled = props.modelValue !== undefined;
+        const initialValue = String(controlled ? props.modelValue : props.defaultValue);
+        let controller = null;
+        let connection = null;
+        let proposedState = null;
+        const createController = (state) => {
+            const result = createTextController({
+                ...(controlled && !props.modelModifiers.lazy
+                    ? { value: state }
+                    : { defaultValue: state }),
+                disabled: props.disabled,
+                readOnly: props.readonly,
+                onValueChange: (change) => {
+                    proposedState = change.value;
+                    if (!props.modelModifiers.lazy) {
+                        const proposal = change.value;
+                        const text = proposal.snapshot.text;
+                        emit('update:modelValue', text);
+                        void nextTick(() => {
+                            if (connection === null || proposedState !== proposal)
+                                return;
+                            if (String(props.modelValue) !== text)
+                                return;
+                            proposedState = null;
+                            const result = connection.syncControlledValues({ value: proposal });
+                            if (!result.ok)
+                                throw new TypeError(result.error.message);
+                        });
+                    }
+                },
+            });
+            if (!result.ok)
+                throw new TypeError(result.error.message);
+            return result.value;
+        };
+        const mountConnection = (state) => {
+            if (element.value === null)
+                return;
+            connection?.disconnect();
+            controller = createController(state);
+            connection = connectText({
+                controller,
+                element: element.value,
+                disabled: props.disabled,
+                readOnly: props.readonly,
+            });
+            connection.render();
+        };
+        onMounted(() => mountConnection(createTextState(initialValue)));
+        onBeforeUnmount(() => connection?.disconnect());
+        watch(() => props.modelValue, (value) => {
+            if (!controlled || value === undefined || connection === null)
+                return;
+            const text = String(value);
+            const state = proposedState?.snapshot.text === text ? proposedState : createTextState(text);
+            proposedState = null;
+            if (props.modelModifiers.lazy) {
+                mountConnection(state);
+                return;
+            }
+            const result = connection.syncControlledValues({ value: state });
+            if (!result.ok)
+                throw new TypeError(result.error.message);
+        });
+        watch([() => props.disabled, () => props.readonly], () => {
+            const state = controller?.getSnapshot().state
+                ?? createTextState(String(controlled ? props.modelValue : props.defaultValue));
+            mountConnection(state);
+        });
+        const commitLazyValue = () => {
+            if (!props.modelModifiers.lazy || controller === null)
+                return;
+            emit('update:modelValue', controller.getSnapshot().state.snapshot.text);
+        };
+        return () => h(props.multiline ? 'textarea' : 'input', mergeProps(attrs, {
+            ref: element,
+            ...(!props.multiline ? { type: props.type } : {}),
+            value: controlled && !props.modelModifiers.lazy
+                ? props.modelValue
+                : controller?.getSnapshot().state.snapshot.text ?? initialValue,
+            disabled: props.disabled,
+            readonly: props.readonly,
+            required: props.required,
+            name: props.name,
+            form: props.form,
+            placeholder: props.placeholder,
+            autocomplete: props.autocomplete,
+            onChange: commitLazyValue,
+            'data-scope': 'text',
+            'data-part': 'input',
+            'data-disabled': props.disabled ? '' : undefined,
+            'data-readonly': props.readonly ? '' : undefined,
+        }, participation.controlProps.value));
+    },
+});
+//# sourceMappingURL=text.js.map

package/dist/text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.js","sourceRoot":"","sources":["../src/text.ts"],"names":[],"mappings":"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"}

package/dist/time-field.d.ts

@@ -0,0 +1,15 @@
+import { type TimeFieldOptions } from '@sectile/dom/time-field';
+export type TimeValue = NonNullable<TimeFieldOptions['value']>;
+export interface TimeFieldProps {
+    readonly modelValue?: TimeValue | null;
+    readonly defaultValue?: TimeValue | null;
+    readonly policies?: TimeFieldOptions['policies'];
+    readonly disabled?: boolean;
+    readonly?: boolean;
+    readonly required?: boolean;
+    readonly label?: string;
+    readonly native?: boolean;
+}
+export declare const TimeField: import("vue").DefineComponent<import("./internal/native-field.js").NativeFieldPublicProps<import("@sectile/core/time-field").TimeValue>>;
+export type TimeFieldValueChangeHandler = (value: TimeValue | null) => void;
+//# sourceMappingURL=time-field.d.ts.map

package/dist/time-field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-field.d.ts","sourceRoot":"","sources":["../src/time-field.ts"],"names":[],"mappings":"AACA,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,yBAAyB,CAAC;AAGjC,MAAM,MAAM,SAAS,GAAG,WAAW,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC;AAC/D,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,UAAU,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IACvC,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IACzC,QAAQ,CAAC,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACjD,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,SAAS,0IAcpB,CAAC;AACH,MAAM,MAAM,2BAA2B,GAAG,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,KAAK,IAAI,CAAC"}

package/dist/time-field.js

@@ -0,0 +1,19 @@
+import {} from 'vue';
+import { createTimeField, formatTimeValue, } from '@sectile/dom/time-field';
+import { createNativeFieldComponent } from './internal/native-field.js';
+export const TimeField = createNativeFieldComponent({
+    name: 'SectileTimeField',
+    scope: 'time-field',
+    inputMode: 'numeric',
+    nativeInputType: 'time',
+    placeholder: 'HH:mm',
+    formatValue: formatTimeValue,
+    valueType: Object,
+    create: (options) => createTimeField({
+        ...options,
+        ...(options.policies === undefined
+            ? {}
+            : { policies: options.policies }),
+    }),
+});
+//# sourceMappingURL=time-field.js.map

package/dist/time-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-field.js","sourceRoot":"","sources":["../src/time-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,MAAM,KAAK,CAAC;AACpC,OAAO,EACL,eAAe,EACf,eAAe,GAGhB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,0BAA0B,EAAkC,MAAM,4BAA4B,CAAC;AAcxG,MAAM,CAAC,MAAM,SAAS,GAAG,0BAA0B,CAAY;IAC7D,IAAI,EAAE,kBAAkB;IACxB,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,SAAS;IACpB,eAAe,EAAE,MAAM;IACvB,WAAW,EAAE,OAAO;IACpB,WAAW,EAAE,eAAe;IAC5B,SAAS,EAAE,MAAoC;IAC/C,MAAM,EAAE,CAAC,OAA6C,EAAuB,EAAE,CAAC,eAAe,CAAC;QAC9F,GAAG,OAAO;QACV,GAAG,CAAC,OAAO,CAAC,QAAQ,KAAK,SAAS;YAChC,CAAC,CAAC,EAAE;YACJ,CAAC,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,QAAqD,EAAE,CAAC;KACjF,CAAC;CACH,CAAC,CAAC"}