// components/Select.js
import { Tag, For } from "sigpro";

export const Select = (props, children) => {
  const { class: className, ...rest } = props;
  return Tag("select", {
    ...rest,
    class: `select ${className || ''}`.trim()
  }, children);
};

export const Options = (props) => {
  const { items, placeholder, placeholderDisabled = true, ...rest } = props;
  
  const itemArray = typeof items === "function" ? items() : (items || []);
  
  return [
    placeholder && Tag("option", { disabled: placeholderDisabled, selected: true }, placeholder),
    For(itemArray, (item) => {
      const val = typeof item === "string" ? item : item.value;
      const label = typeof item === "string" ? item : item.label;
      return Tag("option", { value: val, ...rest }, label);
    })
  ];
};