import { z } from "zod/v4";
import type { JSX } from "solid-js";
import type { ComponentMeta } from "../../meta";

export const SelectRootPropsSchema = z.object({
  value: z.string().optional().describe("Controlled selected value"),
  defaultValue: z.string().optional().describe("Initial selected value (uncontrolled)"),
  name: z.string().optional().describe("Form field name for hidden input"),
  placeholder: z.string().optional().describe("Placeholder text shown when no value is selected"),
  disabled: z.boolean().optional().describe("Whether the select is disabled"),
  required: z.boolean().optional().describe("Whether selection is required"),
});

export interface SelectRootProps extends z.infer<typeof SelectRootPropsSchema> {
  items: string[];
  onValueChange?: (value: string) => void;
  open?: boolean;
  defaultOpen?: boolean;
  onOpenChange?: (open: boolean) => void;
  getLabel?: (value: string) => string;
  children: JSX.Element;
}

export const SelectItemPropsSchema = z.object({
  value: z.string().describe("The value this item represents"),
  disabled: z.boolean().optional().describe("Whether this item is disabled"),
  textValue: z.string().optional().describe("Accessible text used for typeahead matching"),
});

export interface SelectItemProps extends z.infer<typeof SelectItemPropsSchema>, JSX.HTMLAttributes<HTMLDivElement> {
  children?: JSX.Element;
}

export const SelectMeta: ComponentMeta = {
  name: "Select",
  description: "Dropdown for selecting a single option from a list, with keyboard navigation and typeahead",
  parts: ["Root", "Trigger", "Value", "Portal", "Content", "Listbox", "Item", "ItemLabel", "ItemIndicator", "Group", "GroupLabel"] as const,
  requiredParts: ["Root", "Trigger", "Content", "Item"] as const,
} as const;
