@forte-ui/react 1.0.0-alpha.1

package/dist/components/combobox/Combobox.d.ts

@@ -0,0 +1,553 @@
+import { Combobox as BaseCombobox } from '@base-ui/react/combobox';
+import * as React from "react";
+export type ComboboxSize = "sm" | "md" | "lg";
+export type ComboboxVariant = "outline" | "soft" | "ghost";
+/**
+ * Props for {@link ComboboxRoot}. A re-export of Base UI's own root props,
+ * kept generic so `<Combobox.Root<Country>>` still infers the value type of
+ * `onValueChange`, `defaultValue`, `items` and `itemToStringLabel`.
+ */
+export type ComboboxRootProps<Value, Multiple extends boolean | undefined = false> = BaseCombobox.Root.Props<Value, Multiple>;
+/**
+ * Groups every part of the combobox and owns its value, input value and open
+ * state. Renders no DOM element of its own, so it accepts neither `className`
+ * nor `ref`.
+ *
+ * Both generics are forwarded rather than widened to `any`: `Value` is the
+ * type of a single item, and `Multiple` flips the value between `Value` and
+ * `Value[]`. Passing `multiple` alone is enough for `Multiple` to infer.
+ *
+ * One behaviour is added on top of the primitive: a `multiple` combobox never
+ * closes because an item was pressed. Base UI closes it only when a filter had
+ * been typed and the input lives outside the popup, which makes picking from a
+ * short list and picking from a searched list two different gestures — and an
+ * async list, where typing is the only way to see anything, closes on every
+ * single pick. Keeping it open also keeps the query, so "search once, tick
+ * three results" works. A consumer who does want a pick to close can drive
+ * `open` themselves and set it from `onValueChange`.
+ */
+export declare function ComboboxRoot<Value, Multiple extends boolean | undefined = false>({ onOpenChange, ...props }: ComboboxRootProps<Value, Multiple>): React.JSX.Element;
+type BaseLabelProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Label>;
+export interface ComboboxLabelProps extends Omit<BaseLabelProps, "className"> {
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * A visible label wired to the combobox **trigger** — Base UI renders a
+ * `<div>` and associates it with `aria-labelledby`, so clicking it focuses
+ * the trigger without opening the popup. Reach for it in the
+ * input-inside-popup pattern, where the trigger is the form control.
+ *
+ * When `<Combobox.Input>` is the form control (the usual field pattern),
+ * label the input instead: a native `<label htmlFor>`, a `<Field.Label>` in
+ * the same `<Field.Root>`, or `aria-label` on the input.
+ */
+export declare const ComboboxLabel: React.ForwardRefExoticComponent<ComboboxLabelProps & React.RefAttributes<HTMLDivElement>>;
+type BaseInputGroupProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.InputGroup>;
+export interface ComboboxInputGroupProps extends Omit<BaseInputGroupProps, "className"> {
+    /**
+     * How much visual weight the field carries. `outline` reads as a form
+     * control, `soft` as a filled field, `ghost` as an inline affordance.
+     * @default "outline"
+     */
+    variant?: ComboboxVariant;
+    /**
+     * Size of the field. Height, inline padding and font size move together,
+     * and the actual numbers follow the ambient `data-forte-density` setting.
+     * Matches `Input` and `Select.Trigger`, so the three line up on one row.
+     * @default "md"
+     */
+    size?: ComboboxSize;
+    /**
+     * Stretch the field to fill the width of its container.
+     * @default false
+     */
+    fullWidth?: boolean;
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * The field shell: a `<div>` that wraps `<Combobox.Input>` and its associated
+ * controls — `<Combobox.Trigger>`, `<Combobox.Clear>`, `<Combobox.Chips>` —
+ * and carries all of the control chrome (border, background, sizes,
+ * variants), so the input inside stays bare and the buttons sit inside the
+ * boundary. Focus lives on the input; the group rings for it via
+ * `.forte-focus-ring-within`.
+ */
+export declare const ComboboxInputGroup: React.ForwardRefExoticComponent<ComboboxInputGroupProps & React.RefAttributes<HTMLDivElement>>;
+type BaseInputProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Input>;
+export interface ComboboxInputProps extends Omit<BaseInputProps, "className"> {
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * The text input that filters the list. Renders an `<input>`, deliberately
+ * bare: the chrome belongs to whichever surface hosts it —
+ * `<Combobox.InputGroup>` draws the field boundary in the anchor pattern, and
+ * `<Combobox.Popup>` draws it as a search row when the input sits inside the
+ * popup. An input rendered outside both gets no boundary at all.
+ */
+export declare const ComboboxInput: React.ForwardRefExoticComponent<ComboboxInputProps & React.RefAttributes<HTMLInputElement>>;
+type BaseTriggerProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Trigger>;
+export interface ComboboxTriggerProps extends Omit<BaseTriggerProps, "className"> {
+    /**
+     * How much visual weight the trigger carries. Only in play when the trigger
+     * stands alone (the input-inside-popup pattern); inside an
+     * `<Combobox.InputGroup>` the group owns the chrome and the trigger is a
+     * plain icon button.
+     * @default "outline"
+     */
+    variant?: ComboboxVariant;
+    /**
+     * Size of the standalone trigger. Ignored inside an
+     * `<Combobox.InputGroup>`, where the group's `size` decides.
+     * @default "md"
+     */
+    size?: ComboboxSize;
+    /**
+     * Stretch the standalone trigger to fill the width of its container.
+     * @default false
+     */
+    fullWidth?: boolean;
+    /**
+     * Contents of the trigger. Defaults to a caret pair, the right children for
+     * the icon-button form inside an `<Combobox.InputGroup>` — an icon-only
+     * trigger still needs an `aria-label`. In the input-inside-popup pattern
+     * pass `<Combobox.Value>` and `<Combobox.Icon>` instead, and name the
+     * control with a `<Combobox.Label>`.
+     */
+    children?: React.ReactNode;
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * A button that opens the popup. Renders a native `<button>`, in one of two
+ * shapes decided by where it sits: inside an `<Combobox.InputGroup>` it is a
+ * compact icon button at the end of the field; standing alone it is a
+ * select-like trigger that holds `<Combobox.Value>` and `<Combobox.Icon>`
+ * while the input waits inside the popup.
+ */
+export declare const ComboboxTrigger: React.ForwardRefExoticComponent<ComboboxTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+type BaseValueProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Value>;
+export interface ComboboxValueProps extends BaseValueProps {
+}
+/**
+ * The current value, for display inside a standalone `<Combobox.Trigger>`.
+ * Renders no DOM element of its own — pass a function as `children` to
+ * format the value, or `placeholder` for the empty state. The trigger carries
+ * `data-placeholder` while there is no value, which is what the muted
+ * placeholder colour keys off.
+ */
+export declare function ComboboxValue(props: ComboboxValueProps): React.JSX.Element;
+type BaseIconProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Icon>;
+export interface ComboboxIconProps extends Omit<BaseIconProps, "className"> {
+    /**
+     * Icon to render. Defaults to a caret pair whose halves spread apart while
+     * the popup is open.
+     * @default <CaretUpDownIcon />
+     */
+    children?: React.ReactNode;
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * The affordance that marks a standalone trigger as openable. Renders a
+ * `<span>`. Purely decorative — the trigger's own role and `aria-expanded`
+ * are what reach assistive technology.
+ */
+export declare const ComboboxIcon: React.ForwardRefExoticComponent<ComboboxIconProps & React.RefAttributes<HTMLSpanElement>>;
+type BaseClearProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Clear>;
+export interface ComboboxClearProps extends Omit<BaseClearProps, "className"> {
+    /**
+     * Contents of the button. Defaults to an X glyph; the button is icon-only
+     * either way, so it still needs an `aria-label`.
+     * @default <XIcon />
+     */
+    children?: React.ReactNode;
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * A button that clears the value. Renders a native `<button>` that Base UI
+ * only mounts while there is something to clear (`keepMounted` opts out), so
+ * an empty field never shows a dead control.
+ */
+export declare const ComboboxClear: React.ForwardRefExoticComponent<ComboboxClearProps & React.RefAttributes<HTMLButtonElement>>;
+type BaseChipsProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Chips>;
+export interface ComboboxChipsProps extends Omit<BaseChipsProps, "className"> {
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * The container for the selection chips of a `multiple` combobox. Renders a
+ * `<div>` inside `<Combobox.InputGroup>`; render the chips through
+ * `<Combobox.Value>`'s function child and finish with `<Combobox.Input>`, so
+ * the input wraps onto the same line as the last chip.
+ */
+export declare const ComboboxChips: React.ForwardRefExoticComponent<ComboboxChipsProps & React.RefAttributes<HTMLDivElement>>;
+type BaseChipProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Chip>;
+export interface ComboboxChipProps extends Omit<BaseChipProps, "className"> {
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * One selected value of a `multiple` combobox. Renders a `<div>`; put a
+ * `<Combobox.ChipRemove>` inside it so the selection can be removed by
+ * pointer as well as by keyboard (Backspace in the empty input already
+ * removes the last chip). `data-highlighted` marks the chip keyboard
+ * navigation has reached.
+ */
+export declare const ComboboxChip: React.ForwardRefExoticComponent<ComboboxChipProps & React.RefAttributes<HTMLDivElement>>;
+type BaseChipRemoveProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.ChipRemove>;
+export interface ComboboxChipRemoveProps extends Omit<BaseChipRemoveProps, "className"> {
+    /**
+     * Contents of the button. Defaults to an X glyph; give the button an
+     * `aria-label` naming the value it removes.
+     * @default <XIcon />
+     */
+    children?: React.ReactNode;
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * A button that removes its chip's value from the selection. Renders a
+ * native `<button>`.
+ */
+export declare const ComboboxChipRemove: React.ForwardRefExoticComponent<ComboboxChipRemoveProps & React.RefAttributes<HTMLButtonElement>>;
+type BasePopupProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Popup>;
+type BasePositionerProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Positioner>;
+type BasePortalProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Portal>;
+export interface ComboboxPopupProps extends Omit<BasePopupProps, "className"> {
+    /**
+     * The popup's contents — typically `<Combobox.Empty>` followed by
+     * `<Combobox.List>`, plus `<Combobox.Status>` for async lists or an
+     * `<Combobox.Input>` first for the input-inside-popup pattern.
+     */
+    children?: React.ReactNode;
+    /**
+     * Which side of the anchor the popup opens on.
+     * @default "bottom"
+     */
+    side?: BasePositionerProps["side"];
+    /**
+     * How the popup aligns along the chosen side.
+     * @default "start"
+     */
+    align?: BasePositionerProps["align"];
+    /**
+     * Gap in pixels between the anchor and the popup. The default clears the
+     * focus ring rather than sitting flush against it: unlike `Select`, focus
+     * stays on the field while the popup is open, so the group's two-tone ring
+     * (`--forte-focus-ring-offset` + `--forte-focus-ring-width`, 4px together) is
+     * painted in exactly the gap this measures.
+     * @default 8
+     */
+    sideOffset?: BasePositionerProps["sideOffset"];
+    /**
+     * Extra offset in pixels along the alignment axis.
+     * @default 0
+     */
+    alignOffset?: BasePositionerProps["alignOffset"];
+    /**
+     * Space to keep between the popup and the edge of its collision boundary.
+     * @default 5
+     */
+    collisionPadding?: BasePositionerProps["collisionPadding"];
+    /**
+     * Render the popup into a different container instead of `<body>`.
+     */
+    container?: BasePortalProps["container"];
+    /**
+     * Render a dimming layer behind the popup. Off by default — a combobox
+     * popup is a listbox, not a dialog.
+     * @default false
+     */
+    backdrop?: boolean;
+    /**
+     * Additional class name(s) for the popup surface. Applied after the
+     * internal styles so consumer utilities win without needing `!important`.
+     */
+    className?: string;
+    /**
+     * Additional class name(s) for the positioner — the absolutely positioned
+     * wrapper around the popup. Use this to reach `--forte-combobox-z-index`, the
+     * only knob declared on the positioner.
+     */
+    positionerClassName?: string;
+}
+/**
+ * The floating surface holding the list.
+ *
+ * This one part renders the floating half of Base UI's anatomy — `Portal` →
+ * (`Backdrop`) → `Positioner` → `Popup` — and hands you the inside: unlike
+ * `Select.Popup` it does NOT wrap its children in a list, because what sits
+ * next to the list is the point of a combobox — `<Combobox.Empty>`,
+ * `<Combobox.Status>`, or the input itself in the input-inside-popup pattern.
+ */
+export declare const ComboboxPopup: React.ForwardRefExoticComponent<ComboboxPopupProps & React.RefAttributes<HTMLDivElement>>;
+type BaseListProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.List>;
+export interface ComboboxListProps extends Omit<BaseListProps, "className"> {
+    /**
+     * The items, groups and separators — or a function `(item, index) =>
+     * ReactNode` that renders each item Base UI's filtering lets through. The
+     * function form is what keeps the list in sync with the query; it requires
+     * `items` on `<Combobox.Root>`.
+     */
+    children?: BaseListProps["children"];
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * The scrolling container for the items. Renders a `<div>`; scrolling lives
+ * here rather than on the popup so a sibling input or status row stays put
+ * while the items scroll under it.
+ */
+export declare const ComboboxList: React.ForwardRefExoticComponent<ComboboxListProps & React.RefAttributes<HTMLDivElement>>;
+type BaseEmptyProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Empty>;
+export interface ComboboxEmptyProps extends Omit<BaseEmptyProps, "className"> {
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * Shows its children only while the filtered list is empty, and announces the
+ * change politely to screen readers. Requires `items` on `<Combobox.Root>`.
+ * The element itself must stay mounted for the announcement to be reliable —
+ * Base UI keeps it in the DOM and this component collapses it to nothing
+ * while it has no content, so render it unconditionally.
+ */
+export declare const ComboboxEmpty: React.ForwardRefExoticComponent<ComboboxEmptyProps & React.RefAttributes<HTMLDivElement>>;
+type BaseStatusProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Status>;
+export interface ComboboxStatusProps extends Omit<BaseStatusProps, "className"> {
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * A status row announced politely to screen readers when its content changes
+ * — "Searching…", an error, a hint. Like `<Combobox.Empty>` it must stay
+ * mounted to announce reliably: swap its children rather than the element,
+ * and it collapses to nothing while it has none.
+ */
+export declare const ComboboxStatus: React.ForwardRefExoticComponent<ComboboxStatusProps & React.RefAttributes<HTMLDivElement>>;
+type BaseItemProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Item>;
+export interface ComboboxItemProps extends Omit<BaseItemProps, "className"> {
+    /**
+     * The item's label. Rendered next to the indicator column; give the item a
+     * plain-text `aria-label` if this is not text.
+     */
+    children?: React.ReactNode;
+    /**
+     * The value this item selects. Objects are matched by `Object.is` unless
+     * `<Combobox.Root>` is given `isItemEqualToValue`; a `{ value, label }`
+     * shape displays its `label` in the input automatically.
+     * @default null
+     */
+    value?: unknown;
+    /**
+     * Whether the item ignores user interaction. Disabled items stay in the
+     * list and stay announced.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * What marks the item as selected. Rendered inside
+     * `<Combobox.ItemIndicator>`, which only mounts while the item is selected.
+     * @default <CheckIcon />
+     */
+    indicator?: React.ReactNode;
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * One option in the list. Renders a `<div>` with `role="option"`.
+ *
+ * `data-highlighted` is the focus analogue: DOM focus stays on the input
+ * while arrow keys and pointer hover move the highlight between items.
+ * Because the list is a clipping scroll container, the focus ring is applied
+ * inset via `data-focus-inset` so `overflow` cannot crop it.
+ */
+export declare const ComboboxItem: React.ForwardRefExoticComponent<ComboboxItemProps & React.RefAttributes<HTMLDivElement>>;
+type BaseGroupProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Group>;
+export interface ComboboxGroupProps extends Omit<BaseGroupProps, "className"> {
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * Groups related items under a heading. Renders a `<div>` with
+ * `role="group"`, associated with the `<Combobox.GroupLabel>` inside it. Pass
+ * the group's `items` here and render them with `<Combobox.Collection>` so
+ * filtering stays aware of the grouping.
+ */
+export declare const ComboboxGroup: React.ForwardRefExoticComponent<ComboboxGroupProps & React.RefAttributes<HTMLDivElement>>;
+type BaseGroupLabelProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.GroupLabel>;
+export interface ComboboxGroupLabelProps extends Omit<BaseGroupLabelProps, "className"> {
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * The heading for a `<Combobox.Group>`. Renders a `<div>`, set at the list's
+ * own text edge — outdented from the items it heads, and uppercased and
+ * tracked — so it reads a level up from them rather than as one more row.
+ */
+export declare const ComboboxGroupLabel: React.ForwardRefExoticComponent<ComboboxGroupLabelProps & React.RefAttributes<HTMLDivElement>>;
+type BaseSeparatorProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Separator>;
+export interface ComboboxSeparatorProps extends Omit<BaseSeparatorProps, "className"> {
+    /**
+     * Orientation of the rule. A combobox list is vertical, so the separator
+     * between two groups runs horizontally.
+     * @default "horizontal"
+     */
+    orientation?: BaseSeparatorProps["orientation"];
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * A divider between groups of items. Renders a `<div>` with
+ * `role="separator"`, so it is exposed to assistive technology rather than
+ * being a purely visual line.
+ */
+export declare const ComboboxSeparator: React.ForwardRefExoticComponent<ComboboxSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+type BaseRowProps = React.ComponentPropsWithoutRef<typeof BaseCombobox.Row>;
+export interface ComboboxRowProps extends Omit<BaseRowProps, "className"> {
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * One row of items when the list is a grid (`grid` on `<Combobox.Root>`),
+ * where arrow keys navigate across rows and columns. Renders a `<div>`.
+ */
+export declare const ComboboxRow: React.ForwardRefExoticComponent<ComboboxRowProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Renders the filtered items of the nearest `<Combobox.Group>` (or of the
+ * root, inside a grid `<Combobox.Row>`) through a function child. Renders no
+ * DOM element of its own — a flat list can pass the function straight to
+ * `<Combobox.List>` instead. A direct re-export of Base UI's part.
+ */
+export declare const ComboboxCollection: typeof BaseCombobox.Collection;
+/**
+ * `Intl.Collator`-backed matchers (`contains`, `startsWith`, `endsWith`) for
+ * filtering externally — pass the result into `filter` on `<Combobox.Root>`,
+ * or use one inside your own search. A direct re-export of Base UI's
+ * `Combobox.useFilter`.
+ */
+export declare const useComboboxFilter: typeof BaseCombobox.useFilter;
+/**
+ * Returns the items the combobox is currently showing after its internal
+ * filtering — the hook a virtualizer measures. Must be called from a
+ * component rendered inside `<Combobox.Root>`. A direct re-export of Base
+ * UI's `Combobox.useFilteredItems`.
+ */
+export declare const useComboboxFilteredItems: typeof BaseCombobox.useFilteredItems;
+/**
+ * A combobox built on Base UI's unstyled `Combobox` primitives: an input
+ * combined with a filterable list of predefined options. Prefer it over
+ * `Select` when the list is long enough to need typing; prefer `Select` when
+ * there is no input at all.
+ *
+ * ```tsx
+ * <Combobox.Root items={fruits}>
+ *   <Combobox.InputGroup>
+ *     <Combobox.Input placeholder="e.g. Apple" aria-label="Fruit" />
+ *     <Combobox.Clear aria-label="Clear selection" />
+ *     <Combobox.Trigger aria-label="Open popup" />
+ *   </Combobox.InputGroup>
+ *   <Combobox.Popup>
+ *     <Combobox.Empty>No fruits found.</Combobox.Empty>
+ *     <Combobox.List>
+ *       {(fruit: string) => (
+ *         <Combobox.Item key={fruit} value={fruit}>
+ *           {fruit}
+ *         </Combobox.Item>
+ *       )}
+ *     </Combobox.List>
+ *   </Combobox.Popup>
+ * </Combobox.Root>
+ * ```
+ *
+ * Styling is driven entirely by `data-*` attributes and `--forte-combobox-*`
+ * custom properties, so it can be re-skinned from plain CSS or targeted with
+ * Tailwind arbitrary variants (`data-[highlighted]:...`) without wrapping.
+ * Each part declares its own knobs, so an ancestor's value is only inherited
+ * and loses — set them on the part itself via `className`. The popup is also
+ * portalled to `<body>`, so an ancestor of the input could not reach it in
+ * any case; `positionerClassName` reaches `--forte-combobox-z-index`. The
+ * global `--forte-color-*` / `--forte-control-*` / `--forte-radius-*` /
+ * `--forte-space-*` tokens these resolve to ARE inherited, so re-pointing those
+ * from `:root` or a theme scope moves every combobox at once.
+ */
+export declare const Combobox: {
+    Root: typeof ComboboxRoot;
+    Label: React.ForwardRefExoticComponent<ComboboxLabelProps & React.RefAttributes<HTMLDivElement>>;
+    InputGroup: React.ForwardRefExoticComponent<ComboboxInputGroupProps & React.RefAttributes<HTMLDivElement>>;
+    Input: React.ForwardRefExoticComponent<ComboboxInputProps & React.RefAttributes<HTMLInputElement>>;
+    Trigger: React.ForwardRefExoticComponent<ComboboxTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+    Value: typeof ComboboxValue;
+    Icon: React.ForwardRefExoticComponent<ComboboxIconProps & React.RefAttributes<HTMLSpanElement>>;
+    Clear: React.ForwardRefExoticComponent<ComboboxClearProps & React.RefAttributes<HTMLButtonElement>>;
+    Chips: React.ForwardRefExoticComponent<ComboboxChipsProps & React.RefAttributes<HTMLDivElement>>;
+    Chip: React.ForwardRefExoticComponent<ComboboxChipProps & React.RefAttributes<HTMLDivElement>>;
+    ChipRemove: React.ForwardRefExoticComponent<ComboboxChipRemoveProps & React.RefAttributes<HTMLButtonElement>>;
+    Popup: React.ForwardRefExoticComponent<ComboboxPopupProps & React.RefAttributes<HTMLDivElement>>;
+    List: React.ForwardRefExoticComponent<ComboboxListProps & React.RefAttributes<HTMLDivElement>>;
+    Empty: React.ForwardRefExoticComponent<ComboboxEmptyProps & React.RefAttributes<HTMLDivElement>>;
+    Status: React.ForwardRefExoticComponent<ComboboxStatusProps & React.RefAttributes<HTMLDivElement>>;
+    Item: React.ForwardRefExoticComponent<ComboboxItemProps & React.RefAttributes<HTMLDivElement>>;
+    Group: React.ForwardRefExoticComponent<ComboboxGroupProps & React.RefAttributes<HTMLDivElement>>;
+    GroupLabel: React.ForwardRefExoticComponent<ComboboxGroupLabelProps & React.RefAttributes<HTMLDivElement>>;
+    Separator: React.ForwardRefExoticComponent<ComboboxSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+    Row: React.ForwardRefExoticComponent<ComboboxRowProps & React.RefAttributes<HTMLDivElement>>;
+    Collection: typeof BaseCombobox.Collection;
+    useFilter: typeof BaseCombobox.useFilter;
+    useFilteredItems: typeof BaseCombobox.useFilteredItems;
+};
+export {};

package/dist/components/combobox/Combobox.js

@@ -0,0 +1,3 @@
+"use client";
+import { C as e, S as t, _ as n, a as r, b as i, c as a, d as o, f as s, g as c, h as l, i as u, l as d, m as f, n as p, o as m, p as h, r as g, s as _, t as v, u as y, v as b, w as x, x as S, y as C } from "../../Combobox-D-BN-Tvp.js";
+export { v as Combobox, p as ComboboxChip, g as ComboboxChipRemove, u as ComboboxChips, r as ComboboxClear, m as ComboboxCollection, _ as ComboboxEmpty, a as ComboboxGroup, d as ComboboxGroupLabel, y as ComboboxIcon, o as ComboboxInput, s as ComboboxInputGroup, h as ComboboxItem, f as ComboboxLabel, l as ComboboxList, c as ComboboxPopup, n as ComboboxRoot, b as ComboboxRow, C as ComboboxSeparator, i as ComboboxStatus, S as ComboboxTrigger, t as ComboboxValue, e as useComboboxFilter, x as useComboboxFilteredItems };

package/dist/components/combobox/index.d.ts

@@ -0,0 +1,2 @@
+export { Combobox, ComboboxRoot, ComboboxLabel, ComboboxInputGroup, ComboboxInput, ComboboxTrigger, ComboboxValue, ComboboxIcon, ComboboxClear, ComboboxChips, ComboboxChip, ComboboxChipRemove, ComboboxPopup, ComboboxList, ComboboxEmpty, ComboboxStatus, ComboboxItem, ComboboxGroup, ComboboxGroupLabel, ComboboxSeparator, ComboboxRow, ComboboxCollection, useComboboxFilter, useComboboxFilteredItems, } from './Combobox';
+export type { ComboboxRootProps, ComboboxLabelProps, ComboboxInputGroupProps, ComboboxInputProps, ComboboxTriggerProps, ComboboxValueProps, ComboboxIconProps, ComboboxClearProps, ComboboxChipsProps, ComboboxChipProps, ComboboxChipRemoveProps, ComboboxPopupProps, ComboboxListProps, ComboboxEmptyProps, ComboboxStatusProps, ComboboxItemProps, ComboboxGroupProps, ComboboxGroupLabelProps, ComboboxSeparatorProps, ComboboxRowProps, ComboboxSize, ComboboxVariant, } from './Combobox';

package/dist/components/combobox/index.js

@@ -0,0 +1,2 @@
+import { C as e, S as t, _ as n, a as r, b as i, c as a, d as o, f as s, g as c, h as l, i as u, l as d, m as f, n as p, o as m, p as h, r as g, s as _, t as v, u as y, v as b, w as x, x as S, y as C } from "../../Combobox-D-BN-Tvp.js";
+export { v as Combobox, p as ComboboxChip, g as ComboboxChipRemove, u as ComboboxChips, r as ComboboxClear, m as ComboboxCollection, _ as ComboboxEmpty, a as ComboboxGroup, d as ComboboxGroupLabel, y as ComboboxIcon, o as ComboboxInput, s as ComboboxInputGroup, h as ComboboxItem, f as ComboboxLabel, l as ComboboxList, c as ComboboxPopup, n as ComboboxRoot, b as ComboboxRow, C as ComboboxSeparator, i as ComboboxStatus, S as ComboboxTrigger, t as ComboboxValue, e as useComboboxFilter, x as useComboboxFilteredItems };

package/dist/components/context-menu/ContextMenu.d.ts

@@ -0,0 +1,103 @@
+import { ContextMenu as BaseContextMenu } from '@base-ui/react/context-menu';
+import { MenuSubmenuRoot } from '../menu/Menu';
+import * as React from "react";
+export interface ContextMenuRootProps extends BaseContextMenu.Root.Props {
+    /**
+     * The `<ContextMenu.Trigger>` and its `<ContextMenu.Popup>`.
+     */
+    children?: React.ReactNode;
+}
+/**
+ * Groups every part of the context menu and owns its open state. Renders no
+ * DOM element of its own, so it accepts neither `className` nor `ref`.
+ *
+ * Forwards Base UI's own root props unchanged — `open`, `defaultOpen`,
+ * `onOpenChange`, `disabled`, `orientation`, `loopFocus`,
+ * `highlightItemOnHover`, `closeParentOnEsc` and `actionsRef`. Four of
+ * `Menu.Root`'s props are deliberately absent, because a context menu has no
+ * trigger element to hang them on: `modal` (it is always modal), `openOnHover`
+ * with its `delay` / `closeDelay`, and the `handle` / `triggerId` pair.
+ */
+export declare function ContextMenuRoot({ children, ...props }: ContextMenuRootProps): React.JSX.Element;
+export interface ContextMenuTriggerProps extends Omit<BaseContextMenu.Trigger.Props, "className"> {
+    /**
+     * The region that answers a right click or a long press — a card, a table
+     * row, a canvas, a whole panel. It is ordinary content, not a control: the
+     * trigger adds no styling of its own to it beyond marking it while its menu
+     * is open.
+     */
+    children?: React.ReactNode;
+    /**
+     * Replaces the rendered `<div>` with another element or component —
+     * `render={<tr />}` for a table row, `render={<li />}` inside a list, so the
+     * trigger does not break the parent's content model.
+     */
+    render?: BaseContextMenu.Trigger.Props["render"];
+    /**
+     * Additional class name(s). Applied after the internal styles so consumer
+     * utilities (e.g. Tailwind) win without needing `!important`.
+     */
+    className?: string;
+}
+/**
+ * The region that opens the menu on right click or long press. Renders a
+ * `<div>`.
+ *
+ * It takes no tab stop and carries no ARIA of its own — a region that answers a
+ * right click is not a button, and saying otherwise would promise keyboard
+ * behaviour it does not have. The platform's context-menu key (Shift+F10) does
+ * reach it when the region happens to wrap something focusable, since the
+ * `contextmenu` event that key fires bubbles; that is a bonus, not a plan.
+ *
+ * So: **a context menu must never be the only route to an action.** Nothing
+ * announces that a region has one. Put the same commands behind a visible
+ * control — a `<Menu>` button on the card is the usual answer, and the docs
+ * carry a worked example.
+ *
+ * Left click does nothing here, so the trigger declares no cursor and lets the
+ * content it wraps keep its own — text stays a caret, an image stays an arrow.
+ */
+export declare const ContextMenuTrigger: React.ForwardRefExoticComponent<Omit<ContextMenuTriggerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * A menu that opens at the pointer on right click or long press, built on Base
+ * UI's unstyled `ContextMenu` primitives.
+ *
+ * ```tsx
+ * <ContextMenu.Root>
+ *   <ContextMenu.Trigger>
+ *     <Card />
+ *   </ContextMenu.Trigger>
+ *   <ContextMenu.Popup>
+ *     <ContextMenu.Item onClick={duplicate}>Duplicate</ContextMenu.Item>
+ *     <ContextMenu.Separator />
+ *     <ContextMenu.Item tone="danger" onClick={remove}>Delete</ContextMenu.Item>
+ *   </ContextMenu.Popup>
+ * </ContextMenu.Root>
+ * ```
+ *
+ * Everything below `Trigger` is the same component `Menu` uses — Base UI's own
+ * `context-menu` entry point re-exports the Menu parts, and so does this one —
+ * so the popup and its rows look identical, answer the same keyboard, and are
+ * themed through the same `--forte-menu-*` knobs. The trigger is the only part
+ * with `--forte-context-menu-*` properties of its own.
+ *
+ * Treat it as an enhancement: it is undiscoverable, unreachable from the
+ * keyboard, and awkward on touch, so every command in it needs a visible home
+ * as well.
+ */
+export declare const ContextMenu: {
+    Root: typeof ContextMenuRoot;
+    Trigger: React.ForwardRefExoticComponent<Omit<ContextMenuTriggerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Popup: React.ForwardRefExoticComponent<Omit<import('.').ContextMenuPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Item: React.ForwardRefExoticComponent<Omit<import('.').ContextMenuItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    LinkItem: React.ForwardRefExoticComponent<Omit<import('.').ContextMenuLinkItemProps, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+    CheckboxItem: React.ForwardRefExoticComponent<Omit<import('.').ContextMenuCheckboxItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    RadioGroup: React.ForwardRefExoticComponent<Omit<import('.').ContextMenuRadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    RadioItem: React.ForwardRefExoticComponent<Omit<import('.').ContextMenuRadioItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Group: React.ForwardRefExoticComponent<Omit<import('.').ContextMenuGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    GroupLabel: React.ForwardRefExoticComponent<Omit<import('.').ContextMenuGroupLabelProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Separator: React.ForwardRefExoticComponent<import('.').ContextMenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+    SubmenuRoot: typeof MenuSubmenuRoot;
+    SubmenuTrigger: React.ForwardRefExoticComponent<Omit<import('.').ContextMenuSubmenuTriggerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Shortcut: React.ForwardRefExoticComponent<import('.').ContextMenuShortcutProps & React.RefAttributes<HTMLSpanElement>>;
+};