zod-form-kit/dist/components/fields/StringField.js

UI-agnostic form generation library based on Zod schemas with extensible adapter pattern

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export function StringField({ name, label, value = '', onChange, error, required, options = {}, className = '' }) {
    const inputType = getInputType(options.format);
    return (_jsxs("div", { className: `field string-field ${className}`, children: [_jsx("label", { htmlFor: name, id: name + '-label', className: `field-label ${required ? 'required' : ''}`, children: label }), _jsx("input", { id: name, name: name, type: inputType, value: value, onChange: (e) => onChange(e.target.value), minLength: options.minLength, maxLength: options.maxLength, pattern: options.pattern?.source, className: `field-input ${error ? 'error' : ''}`, required: required, readOnly: options.readonly, "aria-labelledby": name + '-label' }), error && _jsx("span", { className: "field-error", children: error })] }));
}
function getInputType(format) {
    switch (format) {
        case 'email': return 'email';
        case 'url': return 'url';
        default: return 'text';
    }
}