@stridge/noctis 1.0.0-beta.0

package/dist/components/alert-dialog/alert-dialog.props.js

@@ -0,0 +1,84 @@
+import { ALERT_DIALOG_SLOTS } from "./alert-dialog.slots.js";
+//#region src/components/alert-dialog/alert-dialog.props.ts
+/**
+* The D12 unified variant contract for AlertDialog — each compound part exposes a `props(...)` builder
+* returning a **spreadable props object** of the form `{ "data-slot": "noctis-alert-dialog-<part>",
+* ...dataAttrs }`, derived from the part's variant inputs. Under the single-`data-slot` anchor model the
+* `data-slot` (plus `data-tone` on the action) is the only styling hook needed — `alert-dialog.css` keys
+* every rule off it — so spreading a part's `props()` onto a *foreign* element styles it as that part:
+*
+*     <div {...AlertDialog.Header.props()} />
+*     // → <div data-slot="noctis-alert-dialog-header">
+*     <button {...AlertDialog.Action.props({ tone: "danger" })} />
+*     // → <button data-slot="noctis-alert-dialog-action" data-tone="danger">
+*
+* The escape hatch carries no className (styling is attribute-driven); an optional `className`
+* passthrough is accepted and forwarded verbatim. The same variant→data-attribute→values mapping is
+* emitted as data from the token graph (`generated/declarations.json` → `variantSchema`) so non-React /
+* agent consumers can hand-write the markup from the docs.
+*/
+const withClassName = (bag, className) => className === void 0 ? bag : {
+	...bag,
+	className
+};
+/** Trigger prop bag: just the slot anchor. */
+function triggerProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.trigger }, className);
+}
+/** Backdrop prop bag: just the slot anchor (the scrim's paint flows from `alert-dialog.css`). */
+function backdropProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.backdrop }, className);
+}
+/** Viewport prop bag: just the slot anchor (the centring container's paint flows from the CSS). */
+function viewportProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.viewport }, className);
+}
+/** Popup prop bag: slot anchor plus the `data-tone`/`data-size` the panel cue and width rules read. */
+function popupProps({ tone = "neutral", size = "md", className } = {}) {
+	return withClassName({
+		"data-slot": ALERT_DIALOG_SLOTS.popup,
+		"data-tone": tone,
+		"data-size": size
+	}, className);
+}
+/** Close prop bag: just the slot anchor (it carries no paint of its own — it composes with a Button). */
+function closeProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.close }, className);
+}
+/** Header prop bag: just the slot anchor. */
+function headerProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.header }, className);
+}
+/** Body prop bag: just the slot anchor. */
+function bodyProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.body }, className);
+}
+/** Footer prop bag: just the slot anchor. */
+function footerProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.footer }, className);
+}
+/** Icon prop bag: just the slot anchor (the leading tone glyph; its colour flows from the popup tone). */
+function iconProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.icon }, className);
+}
+/** Title prop bag: just the slot anchor. */
+function titleProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.title }, className);
+}
+/** Description prop bag: just the slot anchor. */
+function descriptionProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.description }, className);
+}
+/** Cancel prop bag: just the slot anchor (it composes with a Button — no paint of its own). */
+function cancelProps({ className } = {}) {
+	return withClassName({ "data-slot": ALERT_DIALOG_SLOTS.cancel }, className);
+}
+/** Action prop bag: slot anchor plus the `data-tone` the action keys its intent off. */
+function actionProps({ tone = "neutral", className } = {}) {
+	return withClassName({
+		"data-slot": ALERT_DIALOG_SLOTS.action,
+		"data-tone": tone
+	}, className);
+}
+//#endregion
+export { actionProps, backdropProps, bodyProps, cancelProps, closeProps, descriptionProps, footerProps, headerProps, iconProps, popupProps, titleProps, triggerProps, viewportProps };

package/dist/components/alert-dialog/alert-dialog.slots.d.ts

@@ -0,0 +1,29 @@
+//#region src/components/alert-dialog/alert-dialog.slots.d.ts
+/**
+ * The `data-*` attributes an `AlertDialog` part carries, beyond its `data-slot`. Each member's value is
+ * the attribute name; its JSDoc is the description docgen renders into the attributes table. The boolean
+ * state attributes are stamped by Base UI on the popup and backdrop as the dialog transitions.
+ */
+declare enum AlertDialogDataAttributes {
+  /** The stable styling/testing hook every part carries. */
+  slot = "data-slot",
+  /** Present on the popup and backdrop while the dialog is open. */
+  open = "data-open",
+  /** Present on the popup and backdrop while the dialog is closed. */
+  closed = "data-closed",
+  /** Present on the popup and backdrop during the enter transition. */
+  startingStyle = "data-starting-style",
+  /** Present on the popup and backdrop during the exit transition. */
+  endingStyle = "data-ending-style",
+  /**
+   * Severity, stamped on the popup (and mirrored on the action) — `neutral` (default), `danger`, or
+   * `warning`. Drives the restrained status-role cue (toned icon + title emphasis).
+   */
+  tone = "data-tone",
+  /** Present on the popup: the cross-axis cap (`sm` / `md`) the width rule keys off. */
+  size = "data-size",
+  /** Present on the popup when it has a nested dialog open on top of it (drives the recede). */
+  nestedDialogOpen = "data-nested-dialog-open"
+}
+//#endregion
+export { AlertDialogDataAttributes };

package/dist/components/alert-dialog/alert-dialog.slots.js

@@ -0,0 +1,52 @@
+//#region src/components/alert-dialog/alert-dialog.slots.ts
+/**
+* The slot vocabulary every `AlertDialog` part stamps as its `data-slot` — the authored source the
+* orchestration file reads from, kebab-cased `{component}-{part}`; SLOTS.md still generates from the
+* token-graph declaration. `AlertDialog.Root` wraps Base UI's `AlertDialog.Root` without rendering an
+* element of its own, and `AlertDialog.Content` composes the portal/backdrop/viewport/popup without
+* stamping a slot — so neither appears here, keeping the const parity-true to the rendered DOM.
+*/
+const ALERT_DIALOG_SLOTS = {
+	trigger: "noctis-alert-dialog-trigger",
+	backdrop: "noctis-alert-dialog-backdrop",
+	viewport: "noctis-alert-dialog-viewport",
+	popup: "noctis-alert-dialog-popup",
+	close: "noctis-alert-dialog-close",
+	header: "noctis-alert-dialog-header",
+	body: "noctis-alert-dialog-body",
+	footer: "noctis-alert-dialog-footer",
+	icon: "noctis-alert-dialog-icon",
+	title: "noctis-alert-dialog-title",
+	description: "noctis-alert-dialog-description",
+	cancel: "noctis-alert-dialog-cancel",
+	action: "noctis-alert-dialog-action"
+};
+/**
+* The `data-*` attributes an `AlertDialog` part carries, beyond its `data-slot`. Each member's value is
+* the attribute name; its JSDoc is the description docgen renders into the attributes table. The boolean
+* state attributes are stamped by Base UI on the popup and backdrop as the dialog transitions.
+*/
+let AlertDialogDataAttributes = /* @__PURE__ */ function(AlertDialogDataAttributes) {
+	/** The stable styling/testing hook every part carries. */
+	AlertDialogDataAttributes["slot"] = "data-slot";
+	/** Present on the popup and backdrop while the dialog is open. */
+	AlertDialogDataAttributes["open"] = "data-open";
+	/** Present on the popup and backdrop while the dialog is closed. */
+	AlertDialogDataAttributes["closed"] = "data-closed";
+	/** Present on the popup and backdrop during the enter transition. */
+	AlertDialogDataAttributes["startingStyle"] = "data-starting-style";
+	/** Present on the popup and backdrop during the exit transition. */
+	AlertDialogDataAttributes["endingStyle"] = "data-ending-style";
+	/**
+	* Severity, stamped on the popup (and mirrored on the action) — `neutral` (default), `danger`, or
+	* `warning`. Drives the restrained status-role cue (toned icon + title emphasis).
+	*/
+	AlertDialogDataAttributes["tone"] = "data-tone";
+	/** Present on the popup: the cross-axis cap (`sm` / `md`) the width rule keys off. */
+	AlertDialogDataAttributes["size"] = "data-size";
+	/** Present on the popup when it has a nested dialog open on top of it (drives the recede). */
+	AlertDialogDataAttributes["nestedDialogOpen"] = "data-nested-dialog-open";
+	return AlertDialogDataAttributes;
+}({});
+//#endregion
+export { ALERT_DIALOG_SLOTS, AlertDialogDataAttributes };

package/dist/components/alert-dialog/alert-dialog.types.d.ts

@@ -0,0 +1,22 @@
+//#region src/components/alert-dialog/alert-dialog.types.d.ts
+/**
+ * The tone and size vocabularies the `AlertDialog` carries — the authored source of truth, since
+ * styling lives in precompiled `alert-dialog.css`. Types-only: no runtime code, so they never
+ * participate in the styling layer.
+ */
+/**
+ * The confirmation's severity: a neutral commit, a destructive `danger`, or a cautionary `warning`. On
+ * the panel it paints a restrained status-role cue (a toned leading icon + title emphasis) — never an
+ * accent or a full red wash. `info`/`success` are intentionally out of scope: an alert dialog is an
+ * action gate, not a notice (route those to a `Dialog`).
+ */
+type AlertDialogTone = "neutral" | "danger" | "warning";
+/**
+ * The action button's intent — an alias of {@link AlertDialogTone} so a granular `Action` can carry its
+ * own tone, though the danger look itself flows from the composed `Button` variant.
+ */
+type AlertDialogActionTone = AlertDialogTone;
+/** The panel's cross-axis extent — its maximum width. `md` (default) or a compact `sm`. */
+type AlertDialogSize = "sm" | "md";
+//#endregion
+export { AlertDialogActionTone, AlertDialogSize, AlertDialogTone };

package/dist/components/alert-dialog/index.d.ts

@@ -0,0 +1,3 @@
+import { AlertDialogActionTone } from "./alert-dialog.types.js";
+import { AlertDialog } from "./alert-dialog.js";
+import { AlertDialogDataAttributes } from "./alert-dialog.slots.js";

package/dist/components/autocomplete/autocomplete.context.d.ts

@@ -0,0 +1,5 @@
+//#region src/components/autocomplete/autocomplete.context.d.ts
+/** Control height and type of the field — `md` or `lg`. */
+type AutocompleteSize = "md" | "lg";
+//#endregion
+export { AutocompleteSize };

package/dist/components/autocomplete/autocomplete.context.js

@@ -0,0 +1,13 @@
+"use client";
+import { createContext, use } from "react";
+//#region src/components/autocomplete/autocomplete.context.ts
+const AutocompleteContext = createContext(null);
+const AutocompleteProvider = AutocompleteContext.Provider;
+/** Read the field context, throwing a named error when a part renders outside `Autocomplete.Root`. */
+function useAutocompleteContext(part) {
+	const context = use(AutocompleteContext);
+	if (context === null) throw new Error(`Autocomplete.${part} must be rendered inside <Autocomplete.Root>.`);
+	return context;
+}
+//#endregion
+export { AutocompleteProvider, useAutocompleteContext };

package/dist/components/autocomplete/autocomplete.d.ts

@@ -0,0 +1,364 @@
+import { IconGlyph } from "../../icons/glyphs.js";
+import { Autocomplete as Autocomplete$2 } from "../../primitives/autocomplete/autocomplete.js";
+import { AutocompleteSize } from "./autocomplete.context.js";
+import { AutocompleteInputPropsArgs, AutocompleteItemPropsArgs, AutocompletePartProps, contentProps, emptyProps, groupLabelProps, groupProps, iconProps, inputProps, itemProps, listProps, loadingProps, separatorProps, statusProps } from "./autocomplete.props.js";
+import { ComponentProps, ReactElement } from "react";
+import { Autocomplete } from "@base-ui/react/autocomplete";
+import * as _$_base_ui_react_internals_filter0 from "@base-ui/react/internals/filter";
+
+//#region src/components/autocomplete/autocomplete.d.ts
+/**
+ * Owns the autocomplete state, the suggestion list (`items`), and filtering. Shares the control `size`
+ * and the `loading` flag with the field and rows through context. The committed value is the free text
+ * the user types — pass a `filter` (or the `useFilter` collator) to control how `items` are matched.
+ * Set `mode` for inline completion, `autoHighlight` to commit the top match on `Enter`, and
+ * `openOnFocus` to surface recent suggestions the moment the field is focused. Renders no DOM element.
+ */
+declare function AutocompleteRoot<ItemValue>({
+  size,
+  loading,
+  openOnFocus,
+  open: openProp,
+  defaultOpen,
+  onOpenChange,
+  onValueChange,
+  children,
+  ...props
+}: Autocomplete$1.Root.Props<ItemValue>): ReactElement;
+/**
+ * The text field the user types into — opens the suggestions popup as they type and filters the list.
+ * Follows the field family look (filled surface, field border, a calm ring-less focus that shifts only
+ * the border) and reads the control `size` from the root unless overridden. Pass `invalid` for the
+ * danger border. Give it an `aria-label` (or wire a visible `Field.Label`) so it is named for AT.
+ */
+declare function AutocompleteInput({
+  size,
+  invalid,
+  onFocus,
+  className,
+  ...props
+}: Autocomplete$1.Input.Props): ReactElement;
+/**
+ * The field shell that lays out the `Input` beside its leading `Icon` and trailing `Clear`/`Loading`
+ * affordances. Wrap the input and the affordances in it so they pin inside the field's edges without
+ * sitting over the typed text. Mirrors to the inline-start/-end under RTL.
+ */
+declare function AutocompleteInputGroup({
+  className,
+  ...props
+}: Autocomplete$1.InputGroup.Props): ReactElement;
+/**
+ * A leading decorative icon in the field (a search magnifier by default), reserving a leading column.
+ * Muted and signal-free; Base UI marks it `aria-hidden`. Render it as the first child of the
+ * `InputGroup`, before the `Input`.
+ */
+declare function AutocompleteIcon({
+  className,
+  children,
+  ...props
+}: Autocomplete$1.Icon.Props): ReactElement;
+/**
+ * The button that clears the current value, shown only while the field holds one. Carries a localized
+ * `aria-label` (override it with your own `aria-label`); it renders a small dismiss glyph by default and
+ * refocuses the input after clearing.
+ */
+declare function AutocompleteClear({
+  "aria-label": ariaLabel,
+  className,
+  children,
+  ...props
+}: Autocomplete$1.Clear.Props): ReactElement;
+/**
+ * The trailing async busy indicator — a spinner that appears while the root is `loading`, naming itself
+ * for assistive tech with a localized hidden "Loading" label (defense in depth alongside a composed
+ * `Status` live region). Renders nothing while not loading. Place it inside the `InputGroup`.
+ */
+declare function AutocompleteLoading({
+  className,
+  children,
+  ...props
+}: Autocomplete$1.Loading.Props): ReactElement | null;
+/**
+ * The floating suggestions surface — portaled, elevated, and animated — holding the `List` of `Item`s
+ * and the `Empty` message. Opens below the field aligned to its start, flipping above at the viewport
+ * edge, and caps at the available viewport height, scrolling its list and keeping the keyboard
+ * highlight in view. Mirrors the root `size` as `data-size` so the rows take the matching density.
+ */
+declare function AutocompleteContent({
+  side,
+  align,
+  sideOffset,
+  collisionPadding,
+  className,
+  style,
+  children,
+  ...props
+}: Autocomplete$1.Content.Props): ReactElement;
+/** The scrollable list rendering the filtered suggestions. Pass a render function to map each item. */
+declare function AutocompleteList({
+  className,
+  ...props
+}: Autocomplete$1.List.Props): ReactElement;
+/**
+ * One suggestion row. Optional leading `icon`; the row lights up with a neutral highlight on hover or
+ * keyboard focus (the accent stays a signal, never a hover). Give it a `value` so selecting it commits
+ * that text to the input.
+ */
+declare function AutocompleteItem({
+  icon,
+  className,
+  children,
+  ...props
+}: Autocomplete$1.Item.Props): ReactElement;
+/**
+ * The free-text "Create" row — a conditional "Use «query»" option you render inside the list when the
+ * typed query has no exact match, so committing it accepts the typed value. Marked `data-create` for
+ * its slightly emphasized styling and a leading "+" glyph; this is the differentiator vs Combobox's
+ * constrained selection. Give it the typed query as its `value`.
+ */
+declare function AutocompleteCreate({
+  className,
+  children,
+  ...props
+}: Autocomplete$1.Create.Props): ReactElement;
+/**
+ * Bolds the part of a suggestion that matches the typed query — the signature autocomplete affordance.
+ * Wraps the matched substring in a `<mark>` styled with weight and foreground only (no fill, never the
+ * accent), so the match reads clearly while the row stays quiet. Pass the row's `text` and the current
+ * `query`; renders the text unchanged when the query is empty or absent from it.
+ *
+ * The label is wrapped in a single inline `<span>` so the row's flex `gap` (which spaces the leading
+ * glyph from the label) never falls *between* the matched and unmatched text runs — without the wrapper
+ * each run would become its own flex item and the gap would tear the word apart.
+ */
+declare function AutocompleteHighlight({
+  text,
+  query,
+  className,
+  ...props
+}: Autocomplete$1.Highlight.Props): ReactElement;
+/**
+ * The message shown inside the popup while the filtered list is empty — a "no matches" line. Kept
+ * mounted and announced politely to screen readers, so update or conditionally render its *children*
+ * rather than the part itself.
+ */
+declare function AutocompleteEmpty({
+  className,
+  ...props
+}: Autocomplete$1.Empty.Props): ReactElement;
+/**
+ * A polite status line for an asynchronously loaded list (a "Searching…" / result-count message). Kept
+ * mounted and announced to screen readers, so update or conditionally render its *children* rather than
+ * the part itself.
+ */
+declare function AutocompleteStatus({
+  className,
+  ...props
+}: Autocomplete$1.Status.Props): ReactElement;
+/** A labelled section of related suggestions. Put a `GroupLabel` inside to name it for screen readers. */
+declare function AutocompleteGroup({
+  className,
+  ...props
+}: Autocomplete$1.Group.Props): ReactElement;
+/** Maps a group's filtered items to rows via a render-prop child. Renders no element of its own. */
+declare function AutocompleteCollection(props: Autocomplete$1.Collection.Props): ReactElement;
+/** The group's muted, non-interactive heading — announced as the group's accessible name. */
+declare function AutocompleteGroupLabel({
+  className,
+  ...props
+}: Autocomplete$1.GroupLabel.Props): ReactElement;
+/** A hairline between groups of suggestions. */
+declare function AutocompleteSeparator({
+  className,
+  ...props
+}: Autocomplete$1.Separator.Props): ReactElement;
+/**
+ * A free-text input with a suggestion list: as the user types, `Autocomplete.Content` floats a filtered
+ * list of `Item`s beneath the field. Unlike `Combobox`, the committed value is the typed text — the
+ * suggestions complete and accelerate free entry rather than constraining it to a fixed option set.
+ *
+ * Built on Base UI's Autocomplete for keyboard navigation (arrows, Home/End, typeahead, `Alt`+arrow to
+ * open without moving the highlight), focus management, and `Escape`/outside-click dismissal; the
+ * noctis wrapper injects the active locale so the filter collator matches the reader.
+ *
+ * Compose from parts: `Autocomplete.Root` owns the state and the `items`, `Autocomplete.Input` is the
+ * field (with optional leading `Icon`, `Clear`, and `Loading` affordances inside an `InputGroup`), and
+ * `Autocomplete.Content` holds the popup — an `Autocomplete.List` of `Item`s (use `Autocomplete.Highlight`
+ * to bold the match and `Autocomplete.Create` for the free-text "Use «query»" row), an
+ * `Autocomplete.Empty` no-matches line, an optional `Autocomplete.Status` for async loading, and
+ * `Group`/`GroupLabel`/`Separator` for sectioned suggestions.
+ *
+ * Styling is precompiled in `autocomplete.css`, keyed off each part's prefixed `data-slot`. Each part
+ * also carries the D12 `props()` escape hatch via `Object.assign` (e.g. `Autocomplete.Item.props({
+ * highlighted })`), returning a spreadable `{ "data-slot": "noctis-autocomplete-<part>", ...dataAttrs }`
+ * bag for a foreign element an `<Autocomplete.*>` can't wrap.
+ *
+ * The runtime compound is a plain object (kept tree-shakeable); per-part prop and state types are
+ * exposed through the matching `Autocomplete` namespace — e.g. `Autocomplete.Item.Props`.
+ */
+declare const Autocomplete$1: {
+  Root: typeof AutocompleteRoot;
+  Input: typeof AutocompleteInput & {
+    props: typeof inputProps;
+  };
+  InputGroup: typeof AutocompleteInputGroup;
+  Icon: typeof AutocompleteIcon & {
+    props: typeof iconProps;
+  };
+  Clear: typeof AutocompleteClear;
+  Loading: typeof AutocompleteLoading & {
+    props: typeof loadingProps;
+  };
+  Content: typeof AutocompleteContent & {
+    props: typeof contentProps;
+  };
+  List: typeof AutocompleteList & {
+    props: typeof listProps;
+  };
+  Item: typeof AutocompleteItem & {
+    props: typeof itemProps;
+  };
+  Create: typeof AutocompleteCreate;
+  Highlight: typeof AutocompleteHighlight;
+  Empty: typeof AutocompleteEmpty & {
+    props: typeof emptyProps;
+  };
+  Status: typeof AutocompleteStatus & {
+    props: typeof statusProps;
+  };
+  Group: typeof AutocompleteGroup & {
+    props: typeof groupProps;
+  };
+  GroupLabel: typeof AutocompleteGroupLabel & {
+    props: typeof groupLabelProps;
+  };
+  Collection: typeof AutocompleteCollection;
+  Separator: typeof AutocompleteSeparator & {
+    props: typeof separatorProps;
+  }; /** Base UI's locale-aware filter collator hook, for custom `filter` logic on the root. */
+  useFilter: typeof _$_base_ui_react_internals_filter0.getFilter;
+};
+/**
+ * Per-part prop and state types, mirroring Base UI's `Component.Part.Props` convention. Types-only — it
+ * emits no runtime code and merges with the `Autocomplete` object above, so `Autocomplete.Item` is the
+ * component value while `Autocomplete.Item.Props` is its prop type.
+ */
+declare namespace Autocomplete$1 {
+  /** Control height and type of the field — `md` or `lg`. */
+  type Size = AutocompleteSize;
+  /** The spreadable data-attribute prop bag every `Autocomplete.*.props()` returns (D12). */
+  type PartProps = AutocompletePartProps;
+  namespace Root {
+    type Props<ItemValue> = Autocomplete$2.Root.Props<ItemValue> & {
+      /**
+       * Control height and type of the field and its popup metrics.
+       * @default "md"
+       */
+      size?: AutocompleteSize;
+      /**
+       * Whether the autocomplete is loading async results — shows the trailing `Loading` spinner and
+       * sets `aria-busy` on the field. Compose a `Status` for a richer live announcement.
+       * @default false
+       */
+      loading?: boolean;
+      /**
+       * Whether focusing the field opens the popup (the recent-searches-on-focus idiom), in addition
+       * to opening as the user types. Manages the open state internally; do not combine with a
+       * controlled `open`.
+       * @default false
+       */
+      openOnFocus?: boolean;
+    };
+  }
+  namespace Input {
+    type Props = Omit<Autocomplete.Input.Props, "size"> & {
+      /**
+       * Control height and type, overriding the root's `size` for this field.
+       * @default the root's size
+       */
+      size?: AutocompleteSize;
+      /**
+       * Whether the field is invalid — shifts the border to the danger role. Usually flows from a
+       * `Field.Root` automatically; set it explicitly as an additive override.
+       */
+      invalid?: boolean;
+    };
+    /** Argument to the `Autocomplete.Input.props(...)` escape-hatch helper. */
+    type PropsArgs = AutocompleteInputPropsArgs;
+  }
+  namespace InputGroup {
+    type Props = ComponentProps<typeof Autocomplete$2.InputGroup>;
+  }
+  namespace Icon {
+    type Props = ComponentProps<typeof Autocomplete$2.Icon>;
+  }
+  namespace Clear {
+    type Props = ComponentProps<typeof Autocomplete$2.Clear>;
+  }
+  namespace Loading {
+    type Props = ComponentProps<"span">;
+  }
+  namespace Content {
+    type Props = Autocomplete.Popup.Props & {
+      /**
+       * Which side of the field to open on.
+       * @default "bottom"
+       */
+      side?: Autocomplete.Positioner.Props["side"];
+      /**
+       * Alignment along that side.
+       * @default "start"
+       */
+      align?: Autocomplete.Positioner.Props["align"];
+      /**
+       * Gap from the field, in px.
+       * @default 6
+       */
+      sideOffset?: Autocomplete.Positioner.Props["sideOffset"];
+      /**
+       * Minimum space kept from the viewport edge when avoiding collisions, in px.
+       * @default 8
+       */
+      collisionPadding?: Autocomplete.Positioner.Props["collisionPadding"];
+    };
+  }
+  namespace List {
+    type Props = Autocomplete.List.Props;
+  }
+  namespace Item {
+    type Props = Autocomplete.Item.Props & {
+      /** Optional leading glyph. */icon?: IconGlyph;
+    };
+    /** Argument to the `Autocomplete.Item.props(...)` escape-hatch helper. */
+    type PropsArgs = AutocompleteItemPropsArgs;
+  }
+  namespace Create {
+    type Props = Autocomplete.Item.Props;
+  }
+  namespace Highlight {
+    type Props = ComponentProps<"span"> & {
+      /** The full suggestion text to render. */text: string; /** The current query whose first match in `text` is bolded. */
+      query: string;
+    };
+  }
+  namespace Empty {
+    type Props = Autocomplete.Empty.Props;
+  }
+  namespace Status {
+    type Props = Autocomplete.Status.Props;
+  }
+  namespace Group {
+    type Props = ComponentProps<typeof Autocomplete$2.Group>;
+  }
+  namespace GroupLabel {
+    type Props = ComponentProps<typeof Autocomplete$2.GroupLabel>;
+  }
+  namespace Collection {
+    type Props = ComponentProps<typeof Autocomplete$2.Collection>;
+  }
+  namespace Separator {
+    type Props = ComponentProps<typeof Autocomplete.Separator>;
+  }
+}
+//#endregion
+export { Autocomplete$1 as Autocomplete };