@modular-forms/qwik/dist/source/components/Field.js

The modular and type-safe form library for Qwik

import { jsx as _jsx } from "@builder.io/qwik/jsx-runtime";
import { $ } from '@builder.io/qwik';
import { isServer } from '@builder.io/qwik/build';
import { getElementInput, getFieldStore, handleFieldEvent } from '../utils';
import { Lifecycle } from './Lifecycle';
export function Field({ children, name, type, ...props }) {
    // Destructure props
    const { of: form } = props;
    // Get store of specified field
    const field = getFieldStore(form, name);
    return (_jsx(Lifecycle, { store: field, ...props, children: children(field, {
            name,
            autoFocus: isServer && !!field.error,
            ref: $((element) => {
                field.internal.elements.push(element);
            }),
            onInput$: $((event, element) => {
                handleFieldEvent(form, field, name, event, element, ['touched', 'input'], getElementInput(element, field, type));
            }),
            onChange$: $((event, element) => {
                handleFieldEvent(form, field, name, event, element, ['change']);
            }),
            onBlur$: $((event, element) => {
                handleFieldEvent(form, field, name, event, element, [
                    'touched',
                    'blur',
                ]);
            }),
        }) }, name));
}