ihk24/gfi-ihk-2024/stories/atoms/input-select/InputSelectComponent.js

import './input-select.scss';
import {createElement} from "../../_global/scripts/helpers";
import {InputSelectData} from "./InputSelectData";

export const createInputSelect = ({
  classes = '',
  selected = -1,
  options = InputSelectData,
  id = 'username',
  name = 'username',
  isRequired = true,
  placeholder = 'Bitte wählen',
}) => {
  const select = createElement('select', classes && classes.length > 0 ? classes.split(' ') : []);
  select.id = id;
  select.name = name;

  if (isRequired) {
    select.required = true;
  }
  if (placeholder && placeholder.length > 0) {
    const ph = createElement('option', [], placeholder, select);
    ph.disabled = true;
    ph.selected = true;
  }

  options.map((opt, index) => {
    const option = createElement('option', [], opt.label, select);
    option.value = opt.value;
    if (index === selected) {
      option.selected = true;
    }
  })

  return select;
}