// packages/core/src/components/command-palette/command-palette-empty.tsx
import type { JSX } from "solid-js";
import { Show, splitProps } from "solid-js";
import { useCommandPaletteContext } from "./command-palette-context";
import type { CommandPaletteEmptyProps } from "./command-palette.props";

/**
 * Rendered only when the current search produces no matching items.
 * Wrap your "No results" message inside this component.
 */
export function CommandPaletteEmpty(props: CommandPaletteEmptyProps): JSX.Element {
  const [local, rest] = splitProps(props, ["children"]);
  const ctx = useCommandPaletteContext();

  return (
    <Show when={ctx.filteredItems().length === 0}>
      <div data-part="empty" {...rest}>
        {local.children}
      </div>
    </Show>
  );
}
