Function generateInputHtml

public/ts/utils/form.ts:90–238

(
  {
    name,
    placeholder,
    type,
    options,
    step,
    max,
    min,
    rows = '6',
    checked,
    multiple,
    disabled,
    required,
    readOnly,
    extraInputAttributes,
  }: FormField,
  value?: string | string[] | null,
)

}

function generateInputHtml(
  {
    name,
    placeholder,
    type,
    options,
    step,
    max,
    min,
    rows = '6',
    checked,
    multiple,
    disabled,
    required,
    readOnly,
    extraInputAttributes,
  }: FormField,
  value?: string | string[] | null,
) {
  const stepAttribute = step && `step="${step}"`;
  const maxAttribute = max && `max="${max}"`;
  const minAttribute = min && `min="${min}"`;
  const checkedAttribute = checked && type === 'checkbox' && value && 'checked';
  const multipleAttribute = multiple && 'multiple';
  const requiredAttritbute = required && 'required';
  const disabledAttribute = disabled && 'disabled';
  const readOnlyAttritubte = readOnly && 'readonly';

  const additionalAttributes = [
    stepAttribute,
    maxAttribute,
    minAttribute,
    checkedAttribute,
    multipleAttribute,
    requiredAttritbute,
    disabledAttribute,
    readOnlyAttritubte,
  ].filter(Boolean).join(' ');

  if (type === 'select') {
    return html`
      <select
        ${additionalAttributes}
        ${extraInputAttributes || ''}
        class="mt-1 input-field"
        id="field_${name}"
        name="${name}"
      >
        ${options
          ?.map(
            (option) =>
              html`
                <option
                  value="${option.value}"
                  ${option.value === value || (multiple && (value || [])?.includes(option.value)) ? 'selected' : ''}
                >
                  ${option.label}
                </option>