import type { JSX } from "@solidjs/web";
import {
	type Accessor,
	createContext,
	createMemo,
	runWithOwner,
	useContext,
} from "solid-js";
import {
	createCollatorItemFilter,
	type Filter,
	getFilter,
} from "../combobox/internals/filter";
import {
	type Group,
	isGroupedItems,
	stringifyAsLabel,
} from "../combobox/internals/resolve-value-label";
import { type MaybeAccessor, readOption } from "../internals/maybe-accessor";
import {
	SNAPSHOT_KEYS,
	type Snapshottable,
	snapshotKeys,
} from "../internals/observability/snapshot";

// ---------------------------------------------------------------------------
// Public types
// ---------------------------------------------------------------------------

export type AutocompleteMode = "list" | "both" | "inline" | "none";

export type AutocompleteChangeReason =
	| "item-press"
	| "input-change"
	| "escape-key"
	| "outside-press"
	| "imperative";

export interface CreateAutocompleteOptions<Value = unknown> {
	/**
	 * Input value (the text in the autocomplete input). Consumer-owned signal.
	 * Writes happen via `onValueChange` — the primitive does NOT keep an internal
	 * copy.
	 */
	value: MaybeAccessor<string | undefined>;
	onValueChange?: (value: string, reason: AutocompleteChangeReason) => void;

	/** Open state. Consumer-owned signal. */
	open: MaybeAccessor<boolean>;
	onOpenChange?: (open: boolean, reason: AutocompleteChangeReason) => void;

	/** Items to filter. Flat array or grouped (`{ items: [...] }`). */
	items?: MaybeAccessor<readonly Value[] | readonly Group<Value>[] | undefined>;

	/**
	 * Filter function. Pass `null` to disable filtering. Defaults to an
	 * `Intl.Collator`-backed "contains" filter.
	 */
	filter?:
		| MaybeAccessor<
				| ((
						item: Value,
						query: string,
						itemToStringLabel?: (item: Value) => string,
				  ) => boolean)
				| null
				| undefined
		  >
		| undefined;

	/** Locale for the default `Intl.Collator`. */
	locale?: MaybeAccessor<Intl.LocalesArgument | undefined>;

	/**
	 * Filtering and inline-autocomplete mode.
	 * @default "list"
	 */
	mode?: MaybeAccessor<AutocompleteMode | undefined>;

	disabled?: MaybeAccessor<boolean | undefined>;
	readOnly?: MaybeAccessor<boolean | undefined>;

	/** Converts object items to a display string. */
	itemToStringLabel?: MaybeAccessor<((item: Value) => string) | undefined>;
	/** Custom item equality. Defaults to `Object.is`. */
	isItemEqualToValue?: MaybeAccessor<
		((item: Value, value: Value) => boolean) | undefined
	>;
}

export interface AutocompleteApi<Value = unknown> {
	/** Reactive accessor for the current input value. */
	value: Accessor<string>;
	/** Reactive accessor for the open state. */
	open: Accessor<boolean>;

	/** Current mode. */
	mode: Accessor<AutocompleteMode>;
	disabled: Accessor<boolean>;
	readOnly: Accessor<boolean>;

	/** All items (before filtering). */
	items: Accessor<readonly Value[] | readonly Group<Value>[] | undefined>;
	/** Items after applying the filter against the current query. */
	filteredItems: Accessor<readonly Value[] | readonly Group<Value>[]>;
	/** Flat version of `filteredItems` (groups are unwrapped). */
	flatFilteredItems: Accessor<readonly Value[]>;
	/** Trimmed query string used for filtering. */
	query: Accessor<string>;
	/** Whether the items list is grouped. */
	isGrouped: Accessor<boolean>;

	/** Label accessor for rendering item text. */
	itemLabel: (item: Value) => string;

	/** Pure event-emitter — fire `onValueChange`. Consumer owns the signal write. */
	setValue: (next: string, reason?: AutocompleteChangeReason) => void;
	/** Pure event-emitter — fire `onOpenChange`. */
	setOpen: (next: boolean, reason?: AutocompleteChangeReason) => void;

	/**
	 * Context provider. Wrap a subtree to make the api discoverable via
	 * `useAutocomplete()` without prop-drilling.
	 */
	Provider: (props: { children: JSX.Element }) => JSX.Element;
}

// ---------------------------------------------------------------------------
// Context
// ---------------------------------------------------------------------------

const AutocompleteCtx = createContext<AutocompleteApi<unknown> | null>(null);

export function useAutocomplete<Value = unknown>(): AutocompleteApi<Value> {
	const ctx = useContext(AutocompleteCtx);
	if (ctx == null) {
		throw new Error(
			"Base UI: useAutocomplete() must be called inside a <c.Provider>.",
		);
	}
	return ctx as AutocompleteApi<Value>;
}

// ---------------------------------------------------------------------------
// Primitive
// ---------------------------------------------------------------------------

/**
 * Solid 2-native headless primitive for autocomplete selection + filtering
 * logic. Autocomplete is the "input value is the source of truth" variant:
 * there is no separate selected-value state — the input text IS the value.
 * Owns: value / open state, items / filteredItems / query derivation, and
 * item label helpers. DOM concerns (floating-ui, input element, keyboard nav,
 * portal) live in the structural `<Autocomplete.Root>` wrapper.
 */
export function createAutocomplete<Value = unknown>(
	options: CreateAutocompleteOptions<Value>,
): AutocompleteApi<Value> {
	const mode = createMemo<AutocompleteMode>(
		() => (readOption(options.mode) ?? "list") as AutocompleteMode,
		{ name: "autocomplete.mode" },
	);

	const disabled = createMemo<boolean>(
		() => Boolean(readOption(options.disabled)),
		{ name: "autocomplete.disabled" },
	);

	const readOnly = createMemo<boolean>(
		() => Boolean(readOption(options.readOnly)),
		{ name: "autocomplete.readOnly" },
	);

	const itemToStringLabel = createMemo<((item: Value) => string) | undefined>(
		() => readOption(options.itemToStringLabel),
		{ name: "autocomplete.itemToStringLabel" },
	);

	// Value — reads through the consumer's accessor (defaults to "").
	const value = createMemo<string>(() => readOption(options.value) ?? "", {
		name: "autocomplete.value",
	});

	// Open — reads through the consumer's accessor.
	const open = createMemo<boolean>(() => Boolean(readOption(options.open)), {
		name: "autocomplete.open",
	});

	// Items
	const items = createMemo<
		readonly Value[] | readonly Group<Value>[] | undefined
	>(() => readOption(options.items), { name: "autocomplete.items" });

	const isGrouped = createMemo<boolean>(
		() => isGroupedItems(items() as unknown[]),
		{ name: "autocomplete.isGrouped" },
	);

	// In "both" mode we filter against the typed value (not any inline-autocomplete
	// overlay). The query is the trimmed text.
	const query = createMemo<string>(() => value().trim(), {
		name: "autocomplete.query",
	});

	// Filtering — "inline" and "none" modes show all items unfiltered.
	const isStaticItems = createMemo<boolean>(() => {
		const m = mode();
		return m === "inline" || m === "none";
	});

	const collatorFilter = createMemo<Filter>(
		() => getFilter({ locale: readOption(options.locale) }),
		{ name: "autocomplete.collatorFilter" },
	);

	const resolvedFilter = createMemo<
		(
			item: Value,
			query: string,
			itemToStringLabel?: (item: Value) => string,
		) => boolean
	>(
		() => {
			if (isStaticItems()) return () => true;
			const userFilter = readOption(options.filter) as
				| ((item: Value, q: string) => boolean)
				| null
				| undefined;
			if (userFilter === null) return () => true;
			if (userFilter !== undefined) return userFilter;
			return createCollatorItemFilter(
				collatorFilter(),
				itemToStringLabel() as ((item: unknown) => string) | undefined,
			) as (item: Value, q: string) => boolean;
		},
		{ name: "autocomplete.resolvedFilter" },
	);

	const filteredItems = createMemo<readonly Value[] | readonly Group<Value>[]>(
		() => {
			const list = items();
			if (!list) return [];
			const filt = resolvedFilter();
			const q = query();
			const label = itemToStringLabel();
			if (isGrouped()) {
				const groups = list as ReadonlyArray<Group<Value>>;
				const out: Group<Value>[] = [];
				for (const g of groups) {
					const candidates =
						q === "" ? g.items : g.items.filter((item) => filt(item, q, label));
					if (candidates.length > 0) {
						out.push({ ...g, items: candidates });
					}
				}
				return out;
			}
			if (q === "") return list as readonly Value[];
			return (list as readonly Value[]).filter((item) => filt(item, q, label));
		},
		{ name: "autocomplete.filteredItems" },
	);

	const flatFilteredItems = createMemo<readonly Value[]>(
		() => {
			const fi = filteredItems();
			if (isGrouped()) {
				return (fi as ReadonlyArray<Group<Value>>).flatMap(
					(g) => g.items as Value[],
				);
			}
			return fi as readonly Value[];
		},
		{ name: "autocomplete.flatFilteredItems" },
	);

	const itemLabel = (item: Value): string =>
		stringifyAsLabel(
			item,
			itemToStringLabel() as ((item: unknown) => string) | undefined,
		);

	// Pure event-emitters — runWithOwner(null, ...) escapes the reactive owner
	// so signal writes inside the callback don't trigger SIGNAL_WRITE_IN_OWNED_SCOPE.
	const setValue = (
		next: string,
		reason: AutocompleteChangeReason = "imperative",
	): void => {
		runWithOwner(null, () => options.onValueChange?.(next, reason));
	};

	const setOpen = (
		next: boolean,
		reason: AutocompleteChangeReason = "imperative",
	): void => {
		runWithOwner(null, () => options.onOpenChange?.(next, reason));
	};

	const api: AutocompleteApi<Value> = {
		value,
		open,
		mode,
		disabled,
		readOnly,
		items,
		filteredItems,
		flatFilteredItems,
		query,
		isGrouped,
		itemLabel,
		setValue,
		setOpen,
		Provider: (props) => (
			<AutocompleteCtx value={api as AutocompleteApi<unknown>}>
				{props.children}
			</AutocompleteCtx>
		),
	};

	(api as AutocompleteApi<Value> & Snapshottable)[SNAPSHOT_KEYS] =
		AUTOCOMPLETE_SNAPSHOT_KEYS;

	return api;
}

const AUTOCOMPLETE_SNAPSHOT_KEYS = snapshotKeys<AutocompleteApi>(
	"value",
	"open",
	"mode",
	"disabled",
	"readOnly",
	"query",
);