"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.generateModelInputs = generateModelInputs;
const generator_1 = require("@postxl/generator");
function generateModelInputs({ model }) {
    const imports = new generator_1.ImportGenerator({ path: '' });
    imports
        .addTypeImport({ from: (0, generator_1.toBackendModuleLocation)('@postxl/utils'), items: [(0, generator_1.toTypeName)('UnionOmit')] })
        .addType(model.types)
        .addType(model.types.id)
        .add(model.itemsHook)
        .addImports({
        [(0, generator_1.toPackageName)('react')]: [(0, generator_1.toFunctionName)('useCallback'), (0, generator_1.toFunctionName)('useState'), (0, generator_1.toFunctionName)('useMemo')],
        [(0, generator_1.toPackageName)('lucide-react')]: [(0, generator_1.toClassName)('ChevronsUpDownIcon'), (0, generator_1.toClassName)('CheckIcon')],
        [(0, generator_1.toBackendModuleLocation)('@components/ui/button/button')]: [(0, generator_1.toClassName)('Button')],
        [(0, generator_1.toBackendModuleLocation)('@components/ui/select/select')]: [
            (0, generator_1.toClassName)('Select'),
            (0, generator_1.toClassName)('SelectContent'),
            (0, generator_1.toClassName)('SelectItem'),
            (0, generator_1.toClassName)('SelectTrigger'),
            (0, generator_1.toClassName)('SelectValue'),
        ],
        [(0, generator_1.toBackendModuleLocation)('@components/ui/popover/popover')]: [
            (0, generator_1.toClassName)('Popover'),
            (0, generator_1.toClassName)('PopoverContent'),
            (0, generator_1.toClassName)('PopoverTrigger'),
        ],
        [(0, generator_1.toBackendModuleLocation)('@components/ui/command/command')]: [
            (0, generator_1.toClassName)('Command'),
            (0, generator_1.toClassName)('CommandEmpty'),
            (0, generator_1.toClassName)('CommandGroup'),
            (0, generator_1.toClassName)('CommandInput'),
            (0, generator_1.toClassName)('CommandItem'),
            (0, generator_1.toClassName)('CommandList'),
        ],
        [(0, generator_1.toBackendModuleLocation)('@lib/utils')]: [(0, generator_1.toFunctionName)('cn')],
    });
    const map = model.itemsHook.map.name;
    return `
  ${imports.generate()}

  export type ${model.types.name}SelectProps =
    UnionOmit<
      React.ComponentPropsWithoutRef<typeof Select>,
      'value' | 'onValueChange'
  > & {
    value?: ${model.types.id.name} | null;
    defaultValue?: ${model.types.id.name};
    label?: (variant: ${model.types.name}) => string;
    item?: (variant: ${model.types.name}) => React.ReactNode;

    onValueChange: (value: ${model.types.name}) => void;
  }

  export function ${model.types.name}Select(
    { value, onValueChange, label = (item) => item.${model.labelField.name}, item = label, children, ...delegated }: ${model.types.name}SelectProps,
  ) {
    const { ${map} } = ${model.itemsHook.name}()
    const handleChange = useCallback(
    (value: ${model.types.id.name}) => {
      const option = ${map}.get(value)

      if (option) {
        onValueChange(option)
      }
    },
    [onValueChange, ${map}],
  )

  const selected = useMemo(() => value ? ${map}.get(value) : undefined, [value, ${map}])
    return (
      <Select {...delegated} value={value ?? undefined} onValueChange={handleChange}>
        {children ?? (
          <SelectTrigger>
            {selected ? label(selected) : <SelectValue />}
          </SelectTrigger>
        )}

        <SelectContent>
          {Array.from(${map}.values()).map((option) => (
            <SelectItem key={option.id} value={option.id}>
              {item(option)}
            </SelectItem>
          ))}
        </SelectContent>
      </Select>
    )
  }

  export type ${model.types.name}ComboboxProps =
    React.ComponentPropsWithoutRef<typeof Command> & {
    value?: ${model.types.id.name} | null;
    onValueChange: (value: ${model.types.name}) => void;
    label: (variant: ${model.types.name}) => string;
    item?: (variant: ${model.types.name}) => React.ReactNode;
  }

  export function ${model.types.name}Combobox(
    { value, onValueChange, label, item = label, ...delegated }: ${model.types.name}ComboboxProps,
  ) {
    const { ${map} } = ${model.itemsHook.name}()

    const [open, setOpen] = useState(false)
    const handleSelect = useCallback((option: ${model.types.name}) => {
      onValueChange(option)
      setOpen(false)
    }, [onValueChange])

    const selected = useMemo(() => value ? ${map}.get(value) : undefined, [value, ${map}])

    return (
      <Popover open={open} onOpenChange={setOpen}>
        <PopoverTrigger asChild>
          <Button variant="outline" aria-expanded={open} className="w-[200px] justify-between">
            {selected ? label(selected) : value ?? 'Select ${model.userFriendlyName}...'}
            <ChevronsUpDownIcon className="ml-2 h-4 w-4 shrink-0 opacity-50" />
          </Button>
        </PopoverTrigger>

        <PopoverContent className="w-[200px] p-0">
          <Command {...delegated}>
            <CommandInput placeholder="Search ${model.userFriendlyName}..." className="h-9" />

            <CommandList>
              <CommandEmpty>No ${model.userFriendlyName} found.</CommandEmpty>

              <CommandGroup>
                {Array.from(${map}.values()).map((option) => (
                  <CommandItem
                    key={option.id}
                    className="pr-6 relative"
                    value={option.id}
                    onSelect={() => handleSelect(option)}
                  >
                    {item(option)}
                    <CheckIcon className={cn('absolute right-2 size-4', value === option.id ? 'opacity-100' : 'opacity-0')} />
                  </CommandItem>
                ))}
              </CommandGroup>
            </CommandList>
          </Command>
        </PopoverContent>
      </Popover>
    )
  }
  `;
}
//# sourceMappingURL=inputs.generator.js.map