@tailor-platform/app-shell 0.29.0 → 0.31.0

package/dist/app-shell.d.ts

@@ -1,12 +1,24 @@
 import { AuthClient } from '@tailor-platform/auth-public-client';
+import { Autocomplete as Autocomplete_2 } from '@base-ui/react/autocomplete';
+import { AutocompleteFilter } from '@base-ui/react';
+import { AutocompleteFilterOptions } from '@base-ui/react';
+import { AutocompleteRootProps } from '@base-ui/react/autocomplete';
 import { ClassProp } from 'class-variance-authority/types';
+import { Combobox as Combobox_2 } from '@base-ui/react/combobox';
+import { CSSProperties } from 'react';
+import { Dialog as Dialog_2 } from '@base-ui/react/dialog';
+import { Drawer } from '@base-ui/react/drawer';
 import { FC } from 'react';
 import { JSX } from 'react/jsx-runtime';
 import { Link } from 'react-router';
 import { LoaderFunctionArgs } from 'react-router';
+import { Menu as Menu_2 } from '@base-ui/react/menu';
 import * as React_2 from 'react';
 import { ReactNode } from 'react';
+import { Select as Select_2 } from '@base-ui/react/select';
 import { toast } from 'sonner';
+import { Tooltip as Tooltip_2 } from '@base-ui/react/tooltip';
+import { useFilter } from 'node_modules/@base-ui/react/esm/combobox/index.parts';
 import { useLocation } from 'react-router';
 import { useNavigate } from 'react-router';
 import { useParams } from 'react-router';
@@ -201,6 +213,52 @@ export declare type AppShellProps = SharedAppShellProps & {
 export declare interface AppShellRegister {
 }
 
+/**
+ * Fetcher specification for async item loading.
+ *
+ * Can be either:
+ * - A plain function — uses the default debounce delay (300ms)
+ * - An object with `fn` and `debounceMs` — uses the specified debounce delay
+ *
+ * @example
+ * ```tsx
+ * // Plain function (default 300ms debounce)
+ * fetcher: async (query, { signal }) => {
+ *   const res = await fetch(`/api/search?q=${query}`, { signal });
+ *   return res.json();
+ * }
+ *
+ * // Object with custom debounce
+ * fetcher: {
+ *   fn: async (query, { signal }) => {
+ *     const res = await fetch(`/api/search?q=${query}`, { signal });
+ *     return res.json();
+ *   },
+ *   debounceMs: 500,
+ * }
+ * ```
+ */
+declare type AsyncFetcher<T> = AsyncFetcherFn<T> | {
+    fn: AsyncFetcherFn<T>;
+    debounceMs: number;
+};
+
+/**
+ * A function that fetches items for a given query string.
+ *
+ * Receives an `AbortSignal` that is aborted when a newer request supersedes
+ * this one — pass it through to `fetch()` so the browser cancels the
+ * in-flight HTTP request automatically.
+ *
+ * **Error handling:** Errors should be handled inside the fetcher.
+ * If the fetcher throws, the component silently falls back to an empty
+ * item list — there is no `onError` callback. Catch errors in the
+ * fetcher to show toasts, log to error tracking, or return fallback data.
+ */
+declare type AsyncFetcherFn<T> = (query: string, options: {
+    signal: AbortSignal;
+}) => Promise<T[]>;
+
 export { AuthClient }
 
 /**
@@ -279,6 +337,186 @@ export declare type AuthState = {
     isReady: boolean;
 };
 
+export declare const Autocomplete: typeof AutocompleteStandalone & {
+    Async: typeof AutocompleteAsyncStandalone;
+    Parts: {
+        Root: typeof AutocompleteRoot;
+        Value: AutocompleteValue;
+        InputGroup: typeof AutocompleteInputGroup;
+        Input: typeof AutocompleteInput;
+        Trigger: typeof AutocompleteTrigger;
+        Content: typeof AutocompleteContent;
+        List: typeof AutocompleteList;
+        Item: typeof AutocompleteItem;
+        Empty: typeof AutocompleteEmpty;
+        Clear: typeof AutocompleteClear;
+        Group: typeof AutocompleteGroup;
+        GroupLabel: typeof AutocompleteGroupLabel;
+        Collection: typeof AutocompleteCollection;
+        Status: AutocompleteStatus;
+        useFilter: (options?: AutocompleteFilterOptions) => AutocompleteFilter;
+        useAsync: typeof useAsync_2;
+    };
+};
+
+/** Fetcher type for `Autocomplete.Async`. */
+export declare type AutocompleteAsyncFetcher<T> = AsyncFetcher<T>;
+
+declare function AutocompleteAsyncStandalone<T>(props: AutocompleteAsyncStandaloneProps<T>): JSX.Element;
+
+declare namespace AutocompleteAsyncStandalone {
+    var displayName: string;
+}
+
+declare interface AutocompleteAsyncStandaloneProps<T> extends AutocompletePropsBase<T> {
+    /** Fetcher for async item loading. Pass a function for default debounce, or `{ fn, debounceMs }` to customize. */
+    fetcher: AutocompleteAsyncFetcher<T>;
+    /** Text shown while loading. @default "Loading..." */
+    loadingText?: string;
+}
+
+declare function AutocompleteClear({ className, children, ...props }: React_2.ComponentProps<typeof Autocomplete_2.Clear>): JSX.Element;
+
+declare namespace AutocompleteClear {
+    var displayName: string;
+}
+
+declare function AutocompleteCollection({ ...props }: React_2.ComponentProps<typeof Autocomplete_2.Collection>): JSX.Element;
+
+declare namespace AutocompleteCollection {
+    var displayName: string;
+}
+
+declare function AutocompleteContent({ className, ...props }: React_2.ComponentProps<typeof Autocomplete_2.Popup>): JSX.Element;
+
+declare namespace AutocompleteContent {
+    var displayName: string;
+}
+
+declare function AutocompleteEmpty({ className, ...props }: React_2.ComponentProps<typeof Autocomplete_2.Empty>): JSX.Element;
+
+declare namespace AutocompleteEmpty {
+    var displayName: string;
+}
+
+declare function AutocompleteGroup({ ...props }: React_2.ComponentProps<typeof Autocomplete_2.Group>): JSX.Element;
+
+declare namespace AutocompleteGroup {
+    var displayName: string;
+}
+
+declare function AutocompleteGroupLabel({ className, ...props }: React_2.ComponentProps<typeof Autocomplete_2.GroupLabel>): JSX.Element;
+
+declare namespace AutocompleteGroupLabel {
+    var displayName: string;
+}
+
+declare function AutocompleteInput({ className, ...props }: React_2.ComponentProps<typeof Autocomplete_2.Input>): JSX.Element;
+
+declare namespace AutocompleteInput {
+    var displayName: string;
+}
+
+declare function AutocompleteInputGroup({ className, children, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+declare namespace AutocompleteInputGroup {
+    var displayName: string;
+}
+
+declare function AutocompleteItem({ className, ...props }: React_2.ComponentProps<typeof Autocomplete_2.Item>): JSX.Element;
+
+declare namespace AutocompleteItem {
+    var displayName: string;
+}
+
+declare function AutocompleteList({ className, ...props }: React_2.ComponentProps<typeof Autocomplete_2.List>): JSX.Element;
+
+declare namespace AutocompleteList {
+    var displayName: string;
+}
+
+declare type AutocompletePickedRootProps<Value> = Pick<AutocompleteRootProps<Value>, "value" | "defaultValue" | "onValueChange" | "filter" | "disabled" | "children"> & {
+    items?: readonly Value[];
+};
+
+/**
+ * Common props shared between Autocomplete and Autocomplete.Async.
+ *
+ * Unlike Select and Combobox, Autocomplete always operates in single-value
+ * mode — its value is the raw input string, not a discrete item selection.
+ */
+declare interface AutocompletePropsBase<T> {
+    /** Placeholder text for the input */
+    placeholder?: string;
+    /** Text shown when no items match */
+    emptyText?: string;
+    /** Map each item to its label, key, and optional custom render. */
+    mapItem?: (item: T) => MappedItem;
+    /** Additional className for the root container */
+    className?: string;
+    /** Whether the autocomplete is disabled */
+    disabled?: boolean;
+    /** Current value (controlled) */
+    value?: string;
+    /** Default value (uncontrolled) */
+    defaultValue?: string;
+    /** Called when the value changes */
+    onValueChange?: (value: string) => void;
+}
+
+declare function AutocompleteRoot<Value>(props: AutocompletePickedRootProps<Value>): JSX.Element;
+
+declare namespace AutocompleteRoot {
+    var displayName: string;
+}
+
+declare function AutocompleteStandalone<I>(props: AutocompleteStandaloneProps<I>): JSX.Element;
+
+declare namespace AutocompleteStandalone {
+    var displayName: string;
+}
+
+declare interface AutocompleteStandaloneProps<I> extends AutocompletePropsBase<ExtractItem<I>> {
+    /**
+     * Items to show as suggestions. May be a flat array of `T` or an array of
+     * `ItemGroup<T>`. Items are identified as groups by the presence of
+     * `label: string` and `items: T[]` fields — avoid item types whose
+     * shape coincidentally matches this structure.
+     */
+    items: I[];
+}
+
+declare function AutocompleteStatus({ className, ...props }: React_2.ComponentProps<typeof Autocomplete_2.Status>): JSX.Element;
+
+declare namespace AutocompleteStatus {
+    var displayName: string;
+}
+
+declare function AutocompleteTrigger({ className, children, ...props }: React_2.ComponentProps<typeof Autocomplete_2.Trigger>): JSX.Element;
+
+declare namespace AutocompleteTrigger {
+    var displayName: string;
+}
+
+declare interface AutocompleteUseAsyncReturn<T> {
+    /** Fetched items — pass to the Root `items` prop */
+    items: T[];
+    /** Whether a fetch is currently in-flight */
+    loading: boolean;
+    /** Current input value — pass to the Root `value` prop */
+    value: string;
+    /** The error thrown by the last fetch, if any */
+    error: unknown;
+    /** Value change handler — pass to the Root `onValueChange` prop. */
+    onValueChange: (value: string) => void;
+}
+
+declare function AutocompleteValue({ ...props }: React_2.ComponentProps<typeof Autocomplete_2.Value>): JSX.Element;
+
+declare namespace AutocompleteValue {
+    var displayName: string;
+}
+
 export declare function Badge({ className, variant, children, ...props }: BadgeProps): JSX.Element;
 
 export declare interface BadgeProps extends React_2.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
@@ -293,6 +531,78 @@ export declare const badgeVariants: (props?: ({
  */
 declare type BadgeVariantType = "default" | "success" | "warning" | "error" | "neutral" | "outline-success" | "outline-warning" | "outline-error" | "outline-info" | "outline-neutral";
 
+/** The table body section (`<tbody>`). */
+declare function Body_2({ className, ...props }: React_2.ComponentProps<"tbody">): JSX.Element;
+
+declare namespace Body_2 {
+    var displayName: string;
+}
+
+/**
+ * A styled button component with multiple variants and sizes.
+ *
+ * @example
+ * ```tsx
+ * import { Button } from "@tailor-platform/app-shell";
+ *
+ * <Button variant="default">Click me</Button>
+ * <Button variant="outline" size="sm">Small</Button>
+ * <Button variant="destructive">Delete</Button>
+ * ```
+ */
+export declare function Button({ className, variant, size, render, children, ...props }: ButtonProps): React_2.ReactElement<unknown, string | React_2.JSXElementConstructor<any>>;
+
+export declare type ButtonProps = React_2.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
+    render?: React_2.ReactElement;
+};
+
+export declare const buttonVariants: (props?: ({
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+} & ClassProp) | undefined) => string;
+
+/** A table caption element. */
+declare function Caption({ className, ...props }: React_2.ComponentProps<"caption">): JSX.Element;
+
+declare namespace Caption {
+    var displayName: string;
+}
+
+/** A table data cell (`<td>`). */
+declare function Cell({ className, ...props }: React_2.ComponentProps<"td">): JSX.Element;
+
+declare namespace Cell {
+    var displayName: string;
+}
+
+/** A menu item that toggles a setting on or off. */
+declare function CheckboxItem({ className, ...props }: React_2.ComponentProps<typeof Menu_2.CheckboxItem>): JSX.Element;
+
+declare namespace CheckboxItem {
+    var displayName: string;
+}
+
+/** Indicates whether the checkbox item is ticked. */
+declare function CheckboxItemIndicator({ className, ...props }: React_2.ComponentProps<typeof Menu_2.CheckboxItemIndicator>): JSX.Element;
+
+declare namespace CheckboxItemIndicator {
+    var displayName: string;
+}
+
+/** A button that closes the dialog. */
+declare function Close({ ...props }: React_2.ComponentProps<typeof Dialog_2.Close>): JSX.Element;
+
+declare namespace Close {
+    var displayName: string;
+}
+
+/** A button that closes the sheet. */
+declare function Close_2({ ...props }: React_2.ComponentProps<typeof Drawer.Close>): JSX.Element;
+
+declare namespace Close_2 {
+    var displayName: string;
+}
+
 /**
  * Supported area values for Layout.Column
  */
@@ -309,6 +619,8 @@ declare type ColumnCount = 1 | 2 | 3;
 declare interface ColumnProps {
     /** Additional CSS classes */
     className?: string;
+    /** Inline styles */
+    style?: CSSProperties;
     /**
      * Column area role. When specified on all columns, determines width template
      * based on role rather than position.
@@ -326,6 +638,209 @@ declare interface ColumnProps {
  */
 declare type Columns = 3 | 4;
 
+export declare const Combobox: typeof ComboboxStandalone & {
+    Async: typeof ComboboxAsyncStandalone;
+    Parts: {
+        Root: typeof ComboboxRoot;
+        InputGroup: typeof ComboboxInputGroup;
+        Input: typeof ComboboxInput;
+        Trigger: typeof ComboboxTrigger;
+        Content: typeof ComboboxContent;
+        List: typeof ComboboxList;
+        Item: typeof ComboboxItem;
+        Empty: typeof ComboboxEmpty;
+        Group: typeof ComboboxGroup;
+        GroupLabel: typeof ComboboxGroupLabel;
+        Clear: typeof ComboboxClear;
+        Chips: typeof ComboboxChips;
+        Chip: typeof ComboboxChip;
+        ChipRemove: typeof ComboboxChipRemove;
+        Value: typeof ComboboxValue;
+        Collection: typeof ComboboxCollection;
+        Status: ComboboxStatus;
+        useFilter: useFilter;
+        useCreatable: typeof useCreatable;
+        useAsync: typeof useAsync;
+    };
+};
+
+declare type ComboboxAsyncCreatableProps<T extends object> = (ComboboxAsyncOwnProps<T> & CreatableProps<T> & Omit<ComboboxPropsSingle<T>, "mapItem">) | (ComboboxAsyncOwnProps<T> & CreatableProps<T> & Omit<ComboboxPropsMultiple<T>, "mapItem">);
+
+/** Fetcher type for `Combobox.Async`. */
+export declare type ComboboxAsyncFetcher<T> = AsyncFetcher<T>;
+
+declare interface ComboboxAsyncOwnProps<T> {
+    /** Fetcher for async item loading. Pass a function for default debounce, or `{ fn, debounceMs }` to customize. */
+    fetcher: ComboboxAsyncFetcher<T>;
+    /** Text shown while loading. @default "Loading..." */
+    loadingText?: string;
+}
+
+declare type ComboboxAsyncPlainProps<T> = (ComboboxAsyncOwnProps<T> & ComboboxPropsSingle<T>) | (ComboboxAsyncOwnProps<T> & ComboboxPropsMultiple<T>);
+
+declare function ComboboxAsyncStandalone<T extends object>(props: ComboboxAsyncCreatableProps<T>): React_2.JSX.Element;
+
+declare function ComboboxAsyncStandalone<T>(props: ComboboxAsyncPlainProps<T>): React_2.JSX.Element;
+
+declare function ComboboxChip({ className, ...props }: React_2.ComponentProps<typeof Combobox_2.Chip>): JSX.Element;
+
+declare namespace ComboboxChip {
+    var displayName: string;
+}
+
+declare function ComboboxChipRemove({ className, children, ...props }: React_2.ComponentProps<typeof Combobox_2.ChipRemove>): JSX.Element;
+
+declare namespace ComboboxChipRemove {
+    var displayName: string;
+}
+
+declare function ComboboxChips({ className, ...props }: React_2.ComponentProps<typeof Combobox_2.Chips>): JSX.Element;
+
+declare namespace ComboboxChips {
+    var displayName: string;
+}
+
+declare function ComboboxClear({ className, children, ...props }: React_2.ComponentProps<typeof Combobox_2.Clear>): JSX.Element;
+
+declare namespace ComboboxClear {
+    var displayName: string;
+}
+
+declare function ComboboxCollection({ ...props }: React_2.ComponentProps<typeof Combobox_2.Collection>): JSX.Element;
+
+declare namespace ComboboxCollection {
+    var displayName: string;
+}
+
+declare function ComboboxContent({ className, ...props }: React_2.ComponentProps<typeof Combobox_2.Popup>): JSX.Element;
+
+declare namespace ComboboxContent {
+    var displayName: string;
+}
+
+declare function ComboboxEmpty({ className, ...props }: React_2.ComponentProps<typeof Combobox_2.Empty>): JSX.Element;
+
+declare namespace ComboboxEmpty {
+    var displayName: string;
+}
+
+declare function ComboboxGroup({ ...props }: React_2.ComponentProps<typeof Combobox_2.Group>): JSX.Element;
+
+declare namespace ComboboxGroup {
+    var displayName: string;
+}
+
+declare function ComboboxGroupLabel({ className, ...props }: React_2.ComponentProps<typeof Combobox_2.GroupLabel>): JSX.Element;
+
+declare namespace ComboboxGroupLabel {
+    var displayName: string;
+}
+
+declare function ComboboxInput({ className, ...props }: React_2.ComponentProps<typeof Combobox_2.Input>): JSX.Element;
+
+declare namespace ComboboxInput {
+    var displayName: string;
+}
+
+declare function ComboboxInputGroup({ className, children, ...props }: React_2.ComponentProps<typeof Combobox_2.InputGroup>): JSX.Element;
+
+declare namespace ComboboxInputGroup {
+    var displayName: string;
+}
+
+declare function ComboboxItem({ className, children, ...props }: React_2.ComponentProps<typeof Combobox_2.Item>): JSX.Element;
+
+declare namespace ComboboxItem {
+    var displayName: string;
+}
+
+declare function ComboboxList({ className, ...props }: React_2.ComponentProps<typeof Combobox_2.List>): JSX.Element;
+
+declare namespace ComboboxList {
+    var displayName: string;
+}
+
+declare interface ComboboxPropsBase<T> {
+    /** Placeholder text for the input */
+    placeholder?: string;
+    /** Text shown when no items match. @default "No results." */
+    emptyText?: string;
+    /** Map each item to its label, key, and optional custom render. */
+    mapItem?: (item: T) => MappedItem;
+    /** Additional className for the root container */
+    className?: string;
+    /** Whether the combobox is disabled */
+    disabled?: boolean;
+}
+
+declare interface ComboboxPropsMultiple<T> extends ComboboxPropsBase<T> {
+    multiple: true;
+    /** Current value (controlled) */
+    value?: T[];
+    /** Default value (uncontrolled) */
+    defaultValue?: T[];
+    /** Called when the selected values change */
+    onValueChange?: (value: T[]) => void;
+}
+
+declare interface ComboboxPropsSingle<T> extends ComboboxPropsBase<T> {
+    multiple?: false | undefined;
+    /** Current value (controlled) */
+    value?: T | null;
+    /** Default value (uncontrolled) */
+    defaultValue?: T | null;
+    /** Called when the selected value changes */
+    onValueChange?: (value: T | null) => void;
+}
+
+declare function ComboboxRoot<Value, Multiple extends boolean | undefined = false>(props: ComboboxRootProps<Value, Multiple>): JSX.Element;
+
+declare namespace ComboboxRoot {
+    var displayName: string;
+}
+
+declare type ComboboxRootProps<Value, Multiple extends boolean | undefined = false> = Pick<React_2.ComponentProps<typeof Combobox_2.Root<Value, Multiple>>, "items" | "value" | "defaultValue" | "onValueChange" | "multiple" | "filter" | "inputValue" | "onInputValueChange" | "itemToStringLabel" | "itemToStringValue" | "disabled" | "children">;
+
+declare function ComboboxStandalone<T extends object>(props: ComboboxStaticCreatableProps<T>): React_2.JSX.Element;
+
+declare function ComboboxStandalone<I>(props: ComboboxStaticPlainProps<I>): React_2.JSX.Element;
+
+declare type ComboboxStaticCreatableProps<T extends object> = ({
+    items: T[];
+} & CreatableProps<T> & Omit<ComboboxPropsSingle<T>, "mapItem">) | ({
+    items: T[];
+} & CreatableProps<T> & Omit<ComboboxPropsMultiple<T>, "mapItem">);
+
+/**
+ * @property items - Items to display. May be a flat array of `T` or an array of
+ * `ItemGroup<T>`. Items are identified as groups by the presence of
+ * `label: string` and `items: T[]` fields — avoid item types whose
+ * shape coincidentally matches this structure.
+ */
+declare type ComboboxStaticPlainProps<I> = ({
+    items: I[];
+} & ComboboxPropsSingle<ExtractItem<I>>) | ({
+    items: I[];
+} & ComboboxPropsMultiple<ExtractItem<I>>);
+
+declare function ComboboxStatus({ className, ...props }: React_2.ComponentProps<typeof Combobox_2.Status>): JSX.Element;
+
+declare namespace ComboboxStatus {
+    var displayName: string;
+}
+
+declare function ComboboxTrigger({ className, children, ...props }: React_2.ComponentProps<typeof Combobox_2.Trigger>): JSX.Element;
+
+declare namespace ComboboxTrigger {
+    var displayName: string;
+}
+
+declare function ComboboxValue({ ...props }: React_2.ComponentProps<typeof Combobox_2.Value>): JSX.Element;
+
+declare namespace ComboboxValue {
+    var displayName: string;
+}
+
 /**
  * CommandPalette component that uses navigation items with access control.
  * Renders a searchable command palette UI triggered by Cmd+K / Ctrl+K.
@@ -379,6 +894,44 @@ declare type CommonProps = {
     guards?: Guard[];
 };
 
+/** The main dialog panel that contains the dialog content. Automatically includes a close button and overlay. */
+declare function Content({ className, children, ...props }: React_2.ComponentProps<typeof Dialog_2.Popup>): JSX.Element;
+
+declare namespace Content {
+    var displayName: string;
+}
+
+/** The menu popup that displays menu items. */
+declare function Content_2({ className, position, children, ...restProps }: React_2.ComponentProps<typeof Menu_2.Popup> & {
+    position?: PositionProps;
+}): JSX.Element;
+
+declare namespace Content_2 {
+    var displayName: string;
+}
+
+/** The main sheet panel. The `side` is inherited from `Sheet.Root` via context. */
+declare function Content_3({ className, children, ...props }: React_2.ComponentProps<typeof Drawer.Popup>): JSX.Element;
+
+declare namespace Content_3 {
+    var displayName: string;
+}
+
+/** The tooltip popup that displays additional information. */
+declare function Content_4({ className, position, side: _side, align: _align, sideOffset: _sideOffset, children, ...restProps }: React_2.ComponentProps<typeof Tooltip_2.Popup> & {
+    position?: PositionProps;
+    /** @deprecated Use `position={{ side }}` instead. */
+    side?: PositionProps["side"];
+    /** @deprecated Use `position={{ align }}` instead. */
+    align?: PositionProps["align"];
+    /** @deprecated Use `position={{ sideOffset }}` instead. */
+    sideOffset?: PositionProps["sideOffset"];
+}): JSX.Element;
+
+declare namespace Content_4 {
+    var displayName: string;
+}
+
 /**
  * Context data type inferred from AppShellRegister.
  * Falls back to Record<string, unknown> if not augmented.
@@ -387,6 +940,32 @@ export declare type ContextData = AppShellRegister extends {
     contextData: infer T;
 } ? T : Record<string, unknown>;
 
+/**
+ * Creatable opt-in props. When `onCreateItem` is provided, the combobox allows
+ * users to create new items on-the-fly.
+ *
+ * `T` must be an object type because the creatable mechanism uses a sentinel
+ * object for identity comparison — primitive types (string, number) would
+ * collide with real items.
+ */
+declare interface CreatableProps<T extends object> {
+    /**
+     * Called when the user selects the "create" option.
+     *
+     * Return values control what happens next:
+     * - `T` — accept the item and add it to the selection
+     * - `false` — cancel the creation (item is NOT selected)
+     *
+     * May return a `Promise` for async workflows.
+     * A rejected promise also cancels the creation.
+     */
+    onCreateItem: (value: string) => T | false | Promise<T | false>;
+    /** Map each item to its label, key, and optional custom render. Required when creatable. */
+    mapItem: (item: T) => MappedItem;
+    /** Format the label for the "create" option. @default (v) => `Create "${v}"` */
+    formatCreateLabel?: (value: string) => string;
+}
+
 /**
  * Create an enhanced authentication client.
  *
@@ -709,6 +1288,20 @@ declare type DefineResourceProps = CommonProps & ErrorBoundaryProps & {
     subResources?: Array<Resource>;
 };
 
+/** A description that provides additional context for the dialog. */
+declare function Description({ className, ...props }: React_2.ComponentProps<typeof Dialog_2.Description>): JSX.Element;
+
+declare namespace Description {
+    var displayName: string;
+}
+
+/** A description that provides additional context for the sheet. */
+declare function Description_2({ className, ...props }: React_2.ComponentProps<typeof Drawer.Description>): JSX.Element;
+
+declare namespace Description_2 {
+    var displayName: string;
+}
+
 /**
  * DescriptionCard - ERP document display component
  *
@@ -729,7 +1322,7 @@ declare type DefineResourceProps = CommonProps & ErrorBoundaryProps & {
  * />
  * ```
  */
-export declare function DescriptionCard({ data, title, fields, columns, className, headerAction, }: DescriptionCardProps): JSX.Element;
+export declare function DescriptionCard({ data, title, fields, columns, className, style, headerAction, }: DescriptionCardProps): JSX.Element;
 
 /**
  * Props for the DescriptionCard component
@@ -745,10 +1338,27 @@ export declare interface DescriptionCardProps {
     columns?: Columns;
     /** Additional CSS classes */
     className?: string;
+    /** Inline styles */
+    style?: CSSProperties;
     /** Header action slot (e.g., edit button) */
-    headerAction?: React.ReactNode;
+    headerAction?: ReactNode;
 }
 
+export declare const Dialog: {
+    Root: typeof Root_2;
+    Close: typeof Close;
+    Content: typeof Content;
+    Description: typeof Description;
+    Footer: typeof Footer_2;
+    Header: typeof Header_3;
+    Title: typeof Title;
+    Trigger: typeof Trigger;
+};
+
+declare type DialogRootProps = Pick<React_2.ComponentProps<typeof Dialog_2.Root>, "open" | "defaultOpen" | "onOpenChange" | "modal"> & {
+    children: React_2.ReactNode;
+};
+
 declare type DynamicLocales<Def extends Record<string, LabelValue>> = {
     [locale: string]: Partial<LabelDefinition<Def>> | undefined;
 };
@@ -835,6 +1445,9 @@ declare type ErrorBoundaryProps = {
  */
 declare type ExtractBasePath<T extends string> = T extends `${infer Base}?${string}` ? Base : T;
 
+/** Extracts the item type from a possibly-grouped items array element. */
+declare type ExtractItem<I> = I extends ItemGroup<infer T> ? T : I;
+
 /**
  * A field configuration - either a divider or a field definition
  */
@@ -894,6 +1507,41 @@ declare interface FieldMeta {
  */
 declare type FieldType = "text" | "badge" | "money" | "date" | "link" | "address" | "reference";
 
+/** The table footer section (`<tfoot>`). */
+declare function Footer({ className, ...props }: React_2.ComponentProps<"tfoot">): JSX.Element;
+
+declare namespace Footer {
+    var displayName: string;
+}
+
+/** A layout wrapper for dialog action buttons, typically placed at the bottom. */
+declare function Footer_2({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+declare namespace Footer_2 {
+    var displayName: string;
+}
+
+/** A layout wrapper for sheet action buttons, typically placed at the bottom. */
+declare function Footer_3({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+declare namespace Footer_3 {
+    var displayName: string;
+}
+
+/** Groups related menu items with the corresponding label. */
+declare function Group({ ...props }: React_2.ComponentProps<typeof Menu_2.Group>): JSX.Element;
+
+declare namespace Group {
+    var displayName: string;
+}
+
+/** An accessible label that is automatically associated with its parent group. */
+declare function GroupLabel({ className, ...props }: React_2.ComponentProps<typeof Menu_2.GroupLabel>): JSX.Element;
+
+declare namespace GroupLabel {
+    var displayName: string;
+}
+
 /**
  * Guard function type.
  * Guards are executed in order and stop on the first non-pass result.
@@ -926,6 +1574,13 @@ export declare type GuardResult =
     to: string;
 };
 
+/** A table header cell (`<th>`). */
+declare function Head({ className, ...props }: React_2.ComponentProps<"th">): JSX.Element;
+
+declare namespace Head {
+    var displayName: string;
+}
+
 /**
  * Layout.Header — Page-level header with title, actions, and an optional
  * full-width slot.
@@ -971,6 +1626,27 @@ declare namespace Header {
     var displayName: string;
 }
 
+/** The table header section (`<thead>`). */
+declare function Header_2({ className, ...props }: React_2.ComponentProps<"thead">): JSX.Element;
+
+declare namespace Header_2 {
+    var displayName: string;
+}
+
+/** A layout wrapper for the dialog title and description. */
+declare function Header_3({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+declare namespace Header_3 {
+    var displayName: string;
+}
+
+/** A layout wrapper for the sheet title and description. */
+declare function Header_4({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+declare namespace Header_4 {
+    var displayName: string;
+}
+
 /**
  * Deny access and show 404 Not Found.
  *
@@ -992,11 +1668,45 @@ export declare type I18nLabels<Def extends Record<string, LabelValue> = Record<s
     [K in L]: LabelDefinition<Def>;
 } & DynamicLocales<Def>;
 
+/**
+ * A styled input component.
+ *
+ * @example
+ * ```tsx
+ * import { Input } from "@tailor-platform/app-shell";
+ *
+ * <Input type="text" placeholder="Enter your name" />
+ * <Input type="email" disabled />
+ * ```
+ */
+export declare function Input({ className, type, ...props }: InputProps): JSX.Element;
+
+export declare type InputProps = React_2.ComponentProps<"input">;
+
 /**
  * Check if an object type has no keys.
  */
 declare type IsEmptyObject<T> = keyof T extends never ? true : false;
 
+/** An individual interactive item in the menu. */
+declare function Item({ className, ...props }: React_2.ComponentProps<typeof Menu_2.Item>): JSX.Element;
+
+declare namespace Item {
+    var displayName: string;
+}
+
+/**
+ * A group of items with a label, used by Select, Combobox, and Autocomplete standalone components.
+ *
+ * Items are identified as groups by the presence of `label: string` and `items: T[]` fields.
+ * Avoid item types whose shape coincidentally matches this structure, as they will be
+ * silently treated as group containers at both the type level and runtime.
+ */
+export declare interface ItemGroup<T> {
+    label: string;
+    items: T[];
+}
+
 /**
  * Ensures that other locales have the same label structure as the base definition.
  * For dynamic labels (functions), the props type must match.
@@ -1049,7 +1759,7 @@ declare type LabelValue = string | ((props: any) => string);
  * </Layout>
  * ```
  */
-export declare function Layout({ columns, className, gap, title, actions, children }: LayoutProps): JSX.Element;
+export declare function Layout({ columns, className, style, gap, title, actions, children }: LayoutProps): JSX.Element;
 
 export declare namespace Layout {
     var Column: React_2.ForwardRefExoticComponent<ColumnProps & React_2.RefAttributes<HTMLDivElement>>;
@@ -1080,6 +1790,8 @@ export declare interface LayoutProps {
     columns?: ColumnCount;
     /** Additional CSS classes */
     className?: string;
+    /** Inline styles */
+    style?: CSSProperties;
     /**
      * Gap between columns (default: 4 = 16px)
      *
@@ -1104,10 +1816,56 @@ export declare interface LayoutProps {
 
 export { Link }
 
+/** A link item in the menu that can be used to navigate to a different page. */
+declare function LinkItem({ className, ...props }: React_2.ComponentProps<typeof Menu_2.LinkItem>): JSX.Element;
+
+declare namespace LinkItem {
+    var displayName: string;
+}
+
 declare type LoaderHandler = (args: LoaderFunctionArgs) => Promise<unknown> | unknown;
 
 declare type LocalizedString = string | ((locale: string) => string);
 
+/** Shape returned by `mapItem` to describe how an item appears in the dropdown. */
+export declare interface MappedItem {
+    /** Display text — used for filtering, a11y, and fallback display. */
+    label: string;
+    /** React key for list reconciliation. Defaults to `label`. */
+    key?: string;
+    /** Custom JSX to render in the dropdown. Defaults to `label`. */
+    render?: React_2.ReactNode;
+}
+
+export declare const Menu: {
+    Root: typeof Root_3;
+    Trigger: typeof Trigger_2;
+    Content: typeof Content_2;
+    Item: typeof Item;
+    LinkItem: typeof LinkItem;
+    CheckboxItem: typeof CheckboxItem;
+    CheckboxItemIndicator: typeof CheckboxItemIndicator;
+    RadioItem: typeof RadioItem;
+    RadioItemIndicator: typeof RadioItemIndicator;
+    RadioGroup: typeof RadioGroup;
+    Group: typeof Group;
+    GroupLabel: typeof GroupLabel;
+    Separator: typeof MenuSeparator;
+    SubmenuRoot: typeof SubmenuRoot;
+    SubmenuTrigger: typeof SubmenuTrigger;
+};
+
+declare type MenuRootProps = Pick<React_2.ComponentProps<typeof Menu_2.Root>, "open" | "defaultOpen" | "onOpenChange" | "modal" | "disabled"> & {
+    children: React_2.ReactNode;
+};
+
+/** A visual separator between menu items. */
+declare function MenuSeparator({ className, ...props }: React_2.ComponentProps<typeof Menu_2.Separator>): JSX.Element;
+
+declare namespace MenuSeparator {
+    var displayName: string;
+}
+
 /**
  * A resource that can be included in the root-level content in the navigation.
  */
@@ -1170,6 +1928,40 @@ export declare type PageMeta = {
  */
 export declare const pass: () => GuardResult;
 
+/* Excluded from this release type: PositionProps */
+
+/** Provides shared delay configuration for nested tooltips. */
+declare function Provider({ delay, children, ...props }: ProviderProps): JSX.Element;
+
+declare namespace Provider {
+    var displayName: string;
+}
+
+declare type ProviderProps = Pick<React_2.ComponentProps<typeof Tooltip_2.Provider>, "delay" | "closeDelay" | "timeout"> & {
+    children: React_2.ReactNode;
+};
+
+/** Groups related radio items. */
+declare function RadioGroup({ ...props }: React_2.ComponentProps<typeof Menu_2.RadioGroup>): JSX.Element;
+
+declare namespace RadioGroup {
+    var displayName: string;
+}
+
+/** A menu item that works like a radio button in a given group. */
+declare function RadioItem({ className, ...props }: React_2.ComponentProps<typeof Menu_2.RadioItem>): JSX.Element;
+
+declare namespace RadioItem {
+    var displayName: string;
+}
+
+/** Indicates whether the radio item is selected. */
+declare function RadioItemIndicator({ className, ...props }: React_2.ComponentProps<typeof Menu_2.RadioItemIndicator>): JSX.Element;
+
+declare namespace RadioItemIndicator {
+    var displayName: string;
+}
+
 /**
  * Redirect to another path.
  *
@@ -1221,6 +2013,128 @@ declare type ResourceMeta = {
     breadcrumbTitle?: string | ((segment: string) => string);
 };
 
+/**
+ * The root table element with a horizontally scrollable container.
+ *
+ * Note: `className` targets the inner `<table>` element, while `containerClassName` targets the outer scrollable `<div>` wrapper.
+ *
+ * @example
+ * ```tsx
+ * <Table.Root>
+ *   <Table.Header>
+ *     <Table.Row>
+ *       <Table.Head>Name</Table.Head>
+ *       <Table.Head>Status</Table.Head>
+ *     </Table.Row>
+ *   </Table.Header>
+ *   <Table.Body>
+ *     <Table.Row>
+ *       <Table.Cell>Item 1</Table.Cell>
+ *       <Table.Cell>Active</Table.Cell>
+ *     </Table.Row>
+ *   </Table.Body>
+ * </Table.Root>
+ * ```
+ */
+declare function Root({ className, containerClassName, ...props }: RootProps): JSX.Element;
+
+declare namespace Root {
+    var displayName: string;
+}
+
+/**
+ * The root component that manages dialog open/close state.
+ *
+ * @example
+ * ```tsx
+ * <Dialog.Root>
+ *   <Dialog.Trigger render={<Button />}>Open</Dialog.Trigger>
+ *   <Dialog.Content>
+ *     <Dialog.Header>
+ *       <Dialog.Title>Are you sure?</Dialog.Title>
+ *       <Dialog.Description>This action cannot be undone.</Dialog.Description>
+ *     </Dialog.Header>
+ *     <Dialog.Footer>
+ *       <Button variant="outline">Cancel</Button>
+ *       <Button>Confirm</Button>
+ *     </Dialog.Footer>
+ *   </Dialog.Content>
+ * </Dialog.Root>
+ * ```
+ */
+declare function Root_2({ ...props }: DialogRootProps): JSX.Element;
+
+declare namespace Root_2 {
+    var displayName: string;
+}
+
+/**
+ * The root component that manages menu open/close state.
+ *
+ * @example
+ * ```tsx
+ * <Menu.Root>
+ *   <Menu.Trigger>Open menu</Menu.Trigger>
+ *   <Menu.Content>
+ *     <Menu.Item>Edit</Menu.Item>
+ *     <Menu.Item>Duplicate</Menu.Item>
+ *     <Menu.Separator />
+ *     <Menu.Item>Delete</Menu.Item>
+ *   </Menu.Content>
+ * </Menu.Root>
+ * ```
+ */
+declare function Root_3({ children, ...props }: MenuRootProps): JSX.Element;
+
+declare namespace Root_3 {
+    var displayName: string;
+}
+
+/**
+ * The root component that manages sheet open/close state.
+ * The `side` prop controls which edge of the screen the sheet slides in from.
+ *
+ * @example
+ * ```tsx
+ * <Sheet.Root side="right">
+ *   <Sheet.Trigger render={<Button />}>Open</Sheet.Trigger>
+ *   <Sheet.Content>
+ *     <Sheet.Header>
+ *       <Sheet.Title>Settings</Sheet.Title>
+ *       <Sheet.Description>Manage your preferences.</Sheet.Description>
+ *     </Sheet.Header>
+ *     <Sheet.Footer>
+ *       <Button>Save</Button>
+ *     </Sheet.Footer>
+ *   </Sheet.Content>
+ * </Sheet.Root>
+ * ```
+ */
+declare function Root_4({ side, ...props }: SheetRootProps): JSX.Element;
+
+declare namespace Root_4 {
+    var displayName: string;
+}
+
+/**
+ * The root component that manages tooltip open/close state.
+ *
+ * @example
+ * ```tsx
+ * <Tooltip.Root>
+ *   <Tooltip.Trigger render={<Button variant="outline" />}>
+ *     Hover me
+ *   </Tooltip.Trigger>
+ *   <Tooltip.Content>Helpful information</Tooltip.Content>
+ * </Tooltip.Root>
+ * ```
+ */
+declare function Root_5({ children, ...props }: TooltipRootProps): JSX.Element;
+
+declare namespace Root_5 {
+    var displayName: string;
+}
+
 declare type RootConfiguration = {
     modules: Modules;
     settingsResources: Resource[];
@@ -1229,6 +2143,11 @@ declare type RootConfiguration = {
     locale: string;
 };
 
+declare type RootProps = React_2.ComponentProps<"table"> & {
+    /** Additional CSS classes for the outer scrollable `<div>` container. Use this to control height, overflow, or container-level layout. */
+    containerClassName?: string;
+};
+
 /**
  * Route parameters type inferred from AppShellRegister.
  * Falls back to Record<string, Record<string, string>> if not augmented.
@@ -1238,6 +2157,163 @@ export declare type RouteParams = AppShellRegister extends {
     routeParams: infer T;
 } ? T : Record<string, Record<string, string>>;
 
+/** A table row (`<tr>`). */
+declare function Row({ className, ...props }: React_2.ComponentProps<"tr">): JSX.Element;
+
+declare namespace Row {
+    var displayName: string;
+}
+
+export declare const Select: typeof SelectStandalone & {
+    Async: typeof SelectAsyncStandalone;
+    Parts: {
+        Root: typeof SelectRoot;
+        Trigger: typeof SelectTrigger;
+        Value: typeof SelectValue;
+        Content: typeof SelectContent;
+        Item: typeof SelectItem;
+        Group: typeof SelectGroup;
+        GroupLabel: typeof SelectGroupLabel;
+        Separator: SelectSeparator;
+    };
+};
+
+/**
+ * Fetcher type for `Select.Async`.
+ *
+ * Unlike `ComboboxAsyncFetcher` and `AutocompleteAsyncFetcher`, this fetcher
+ * does **not** receive a `query` string — Select has no search input.
+ * It is called each time the dropdown is opened (not per-keystroke).
+ *
+ * Receives an `AbortSignal` so in-flight requests are cancelled
+ * when the component unmounts or the dropdown is re-opened before
+ * the previous request completes.
+ *
+ * Note: `Select.Async` does not support `ItemGroup<T>[]` — the fetcher
+ * must return a flat array.
+ *
+ * If caching or deduplication is needed, implement it in the fetcher
+ * (e.g. via a query library or a simple cache layer).
+ *
+ * **Error handling:** Errors should be handled inside the fetcher.
+ * If the fetcher throws, the component silently falls back to an empty
+ * item list — there is no `onError` callback. Catch errors in the
+ * fetcher to show toasts, log to error tracking, or return fallback data.
+ */
+export declare type SelectAsyncFetcher<T> = (options: {
+    signal: AbortSignal;
+}) => Promise<T[]>;
+
+declare interface SelectAsyncOwnProps<T> {
+    /** Fetcher for async item loading. Called each time the dropdown is opened. */
+    fetcher: SelectAsyncFetcher<T>;
+    /** Text shown while loading. @default "Loading..." */
+    loadingText?: string;
+}
+
+declare type SelectAsyncProps<T> = (SelectAsyncOwnProps<T> & SelectPropsSingle<T>) | (SelectAsyncOwnProps<T> & SelectPropsMultiple<T>);
+
+declare function SelectAsyncStandalone<T>(props: SelectAsyncProps<T>): JSX.Element;
+
+declare function SelectContent({ className, ...props }: React_2.ComponentProps<typeof Select_2.Popup>): JSX.Element;
+
+declare namespace SelectContent {
+    var displayName: string;
+}
+
+declare function SelectGroup({ ...props }: React_2.ComponentProps<typeof Select_2.Group>): JSX.Element;
+
+declare namespace SelectGroup {
+    var displayName: string;
+}
+
+declare function SelectGroupLabel({ className, ...props }: React_2.ComponentProps<typeof Select_2.GroupLabel>): JSX.Element;
+
+declare namespace SelectGroupLabel {
+    var displayName: string;
+}
+
+declare function SelectItem({ className, children, ...props }: React_2.ComponentProps<typeof Select_2.Item>): JSX.Element;
+
+declare namespace SelectItem {
+    var displayName: string;
+}
+
+declare interface SelectPropsBase<T> {
+    /** Placeholder text shown when no value is selected */
+    placeholder?: string;
+    /** Map each item to its label, key, and optional custom render. */
+    mapItem?: (item: T) => MappedItem;
+    /** Additional className for the root container */
+    className?: string;
+    /** Whether the select is disabled */
+    disabled?: boolean;
+}
+
+declare interface SelectPropsMultiple<T> extends SelectPropsBase<T> {
+    multiple: true;
+    /** Current value (controlled) */
+    value?: T[];
+    /** Default value (uncontrolled) */
+    defaultValue?: T[];
+    /** Called when the selected values change */
+    onValueChange?: (value: T[]) => void;
+    /** Custom render function for the selected values display */
+    renderValue?: (value: T[]) => React_2.ReactNode;
+}
+
+declare interface SelectPropsSingle<T> extends SelectPropsBase<T> {
+    multiple?: false | undefined;
+    /** Current value (controlled) */
+    value?: T | null;
+    /** Default value (uncontrolled) */
+    defaultValue?: T | null;
+    /** Called when the selected value changes */
+    onValueChange?: (value: T | null) => void;
+    /** Custom render function for the selected value display */
+    renderValue?: (value: T | null) => React_2.ReactNode;
+}
+
+declare function SelectRoot<Value, Multiple extends boolean | undefined = false>(props: SelectRootProps<Value, Multiple>): JSX.Element;
+
+declare namespace SelectRoot {
+    var displayName: string;
+}
+
+declare type SelectRootProps<Value, Multiple extends boolean | undefined = false> = Pick<React_2.ComponentProps<typeof Select_2.Root<Value, Multiple>>, "value" | "defaultValue" | "onValueChange" | "open" | "onOpenChange" | "multiple" | "itemToStringLabel" | "disabled" | "children">;
+
+declare function SelectSeparator({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+declare namespace SelectSeparator {
+    var displayName: string;
+}
+
+declare function SelectStandalone<I>(props: SelectStandaloneProps<I>): JSX.Element;
+
+/**
+ * @property items - Items to display. May be a flat array of `T` or an array of
+ * `ItemGroup<T>`. Items are identified as groups by the presence of
+ * `label: string` and `items: T[]` fields — avoid item types whose
+ * shape coincidentally matches this structure.
+ */
+declare type SelectStandaloneProps<I> = ({
+    items: I[];
+} & SelectPropsSingle<ExtractItem<I>>) | ({
+    items: I[];
+} & SelectPropsMultiple<ExtractItem<I>>);
+
+declare function SelectTrigger({ className, children, ...props }: React_2.ComponentProps<typeof Select_2.Trigger>): JSX.Element;
+
+declare namespace SelectTrigger {
+    var displayName: string;
+}
+
+declare function SelectValue({ ...props }: React_2.ComponentProps<typeof Select_2.Value>): JSX.Element;
+
+declare namespace SelectValue {
+    var displayName: string;
+}
+
 declare type SharedAppShellProps = React.PropsWithChildren<{
     /**
      * App shell title
@@ -1327,6 +2403,24 @@ declare type SharedAppShellProps = React.PropsWithChildren<{
     contextData?: ContextData;
 }>;
 
+export declare const Sheet: {
+    Root: typeof Root_4;
+    Trigger: typeof Trigger_3;
+    Close: typeof Close_2;
+    Content: typeof Content_3;
+    Header: typeof Header_4;
+    Footer: typeof Footer_3;
+    Title: typeof Title_2;
+    Description: typeof Description_2;
+};
+
+declare type SheetRootProps = Pick<React_2.ComponentProps<typeof Drawer.Root>, "open" | "defaultOpen" | "onOpenChange" | "modal"> & {
+    children: React_2.ReactNode;
+    side?: Side;
+};
+
+declare type Side = "top" | "right" | "bottom" | "left";
+
 /**
  * A collapsible group for sidebar navigation.
  *
@@ -1507,6 +2601,35 @@ export declare type SidebarLayoutProps = {
  */
 export declare const SidebarSeparator: () => JSX.Element;
 
+/** Groups all parts of a submenu. */
+declare function SubmenuRoot({ children, ...props }: SubmenuRootProps): JSX.Element;
+
+declare namespace SubmenuRoot {
+    var displayName: string;
+}
+
+declare type SubmenuRootProps = Pick<React_2.ComponentProps<typeof Menu_2.SubmenuRoot>, "open" | "defaultOpen" | "onOpenChange" | "disabled"> & {
+    children: React_2.ReactNode;
+};
+
+/** A menu item that opens a submenu. */
+declare function SubmenuTrigger({ className, ...props }: React_2.ComponentProps<typeof Menu_2.SubmenuTrigger>): JSX.Element;
+
+declare namespace SubmenuTrigger {
+    var displayName: string;
+}
+
+export declare const Table: {
+    Root: typeof Root;
+    Header: typeof Header_2;
+    Body: typeof Body_2;
+    Footer: typeof Footer;
+    Row: typeof Row;
+    Head: typeof Head;
+    Cell: typeof Cell;
+    Caption: typeof Caption;
+};
+
 declare type Theme = "dark" | "light" | "system";
 
 declare type ThemeProviderState = {
@@ -1515,6 +2638,59 @@ declare type ThemeProviderState = {
     setTheme: (theme: Theme) => void;
 };
 
+/** The title of the dialog, announced by screen readers. */
+declare function Title({ className, ...props }: React_2.ComponentProps<typeof Dialog_2.Title>): JSX.Element;
+
+declare namespace Title {
+    var displayName: string;
+}
+
+/** The title of the sheet, announced by screen readers. */
+declare function Title_2({ className, ...props }: React_2.ComponentProps<typeof Drawer.Title>): JSX.Element;
+
+declare namespace Title_2 {
+    var displayName: string;
+}
+
+export declare const Tooltip: {
+    Root: typeof Root_5;
+    Trigger: typeof Trigger_4;
+    Content: typeof Content_4;
+    Provider: typeof Provider;
+};
+
+declare type TooltipRootProps = Pick<React_2.ComponentProps<typeof Tooltip_2.Root>, "open" | "defaultOpen" | "onOpenChange"> & {
+    children: React_2.ReactNode;
+};
+
+/** The element that opens the dialog when clicked. */
+declare function Trigger({ ...props }: React_2.ComponentProps<typeof Dialog_2.Trigger>): JSX.Element;
+
+declare namespace Trigger {
+    var displayName: string;
+}
+
+/** The element that opens the menu when clicked. */
+declare function Trigger_2({ ...props }: React_2.ComponentProps<typeof Menu_2.Trigger>): JSX.Element;
+
+declare namespace Trigger_2 {
+    var displayName: string;
+}
+
+/** The element that opens the sheet when clicked. */
+declare function Trigger_3({ ...props }: React_2.ComponentProps<typeof Drawer.Trigger>): JSX.Element;
+
+declare namespace Trigger_3 {
+    var displayName: string;
+}
+
+/** The element that triggers the tooltip on hover or focus. */
+declare function Trigger_4({ ...props }: React_2.ComponentProps<typeof Tooltip_2.Trigger>): JSX.Element;
+
+declare namespace Trigger_4 {
+    var displayName: string;
+}
+
 /**
  * Type-safe path builder interface.
  *
@@ -1567,6 +2743,130 @@ export declare const useAppShellConfig: () => AppShellConfigContextType;
  */
 export declare const useAppShellData: () => AppShellDataContextType;
 
+/**
+ * Hook that encapsulates the async combobox pattern — debounced fetching,
+ * request cancellation via `AbortController`, and loading state.
+ *
+ * Pass `filter={null}` to `<Combobox.Root>` to disable internal filtering
+ * since items are already filtered by the remote source.
+ *
+ * @example
+ * ```tsx
+ * const countries = Combobox.useAsync({
+ *   fetcher: async (query, { signal }) => {
+ *     const res = await fetch(
+ *       `https://restcountries.com/v3.1/name/${query}`,
+ *       { signal },
+ *     );
+ *     if (!res.ok) return [];
+ *     return res.json();
+ *   },
+ * });
+ *
+ * // Or with custom debounce:
+ * const countries = Combobox.useAsync({
+ *   fetcher: {
+ *     fn: async (query, { signal }) => { ... },
+ *     debounceMs: 500,
+ *   },
+ * });
+ *
+ * <Combobox.Root
+ *   items={countries.items}
+ *   filter={null}
+ *   onInputValueChange={countries.onInputValueChange}
+ * >
+ *   ...
+ *   <Combobox.Empty>
+ *     {countries.loading ? "Loading..." : "No results."}
+ *   </Combobox.Empty>
+ * </Combobox.Root>
+ * ```
+ */
+declare function useAsync<T>(options: UseAsyncItemsOptions<T>): UseAsyncItemsReturn<T>;
+
+/**
+ * Hook that encapsulates the async autocomplete pattern — debounced fetching,
+ * request cancellation via `AbortController`, and loading state.
+ *
+ * Pass `filter={null}` to `<Autocomplete.Root>` to disable internal filtering
+ * since items are already filtered by the remote source.
+ *
+ * Unlike `Combobox.useAsync`, Autocomplete's value is always the input text
+ * (there is no separate `inputValue` prop), so you must pass `value` and
+ * `onValueChange` instead of `onInputValueChange`.
+ *
+ * @example
+ * ```tsx
+ * const movies = Autocomplete.useAsync({
+ *   fetcher: async (query, { signal }) => {
+ *     const res = await fetch(`/api/movies?q=${query}`, { signal });
+ *     if (!res.ok) return [];
+ *     return res.json();
+ *   },
+ * });
+ *
+ * // Or with custom debounce:
+ * const movies = Autocomplete.useAsync({
+ *   fetcher: {
+ *     fn: async (query, { signal }) => { ... },
+ *     debounceMs: 500,
+ *   },
+ * });
+ *
+ * <Autocomplete.Root
+ *   items={movies.items}
+ *   value={movies.value}
+ *   onValueChange={movies.onValueChange}
+ *   filter={null}
+ * >
+ *   ...
+ *   <Autocomplete.Empty>
+ *     {movies.loading ? "Loading..." : "No results."}
+ *   </Autocomplete.Empty>
+ * </Autocomplete.Root>
+ * ```
+ */
+declare function useAsync_2<T>(options: UseAsyncItemsOptions<T>): AutocompleteUseAsyncReturn<T>;
+
+declare interface UseAsyncItemsOptions<T> {
+    /**
+     * Fetcher for async item loading.
+     *
+     * Pass a plain function to use the default debounce delay (300ms),
+     * or an object `{ fn, debounceMs }` to control the debounce timing.
+     *
+     * @example
+     * ```tsx
+     * // Plain function
+     * fetcher: async (query, { signal }) => {
+     *   const res = await fetch(`/api/search?q=${query}`, { signal });
+     *   return res.json();
+     * }
+     *
+     * // With custom debounce
+     * fetcher: {
+     *   fn: async (query, { signal }) => { ... },
+     *   debounceMs: 500,
+     * }
+     * ```
+     */
+    fetcher: AsyncFetcher<T>;
+}
+
+declare interface UseAsyncItemsReturn<T> {
+    /** Fetched items — pass to the Root `items` prop */
+    items: T[];
+    /** Whether a fetch is currently in-flight */
+    loading: boolean;
+    /** Current input query string */
+    query: string;
+    /** The error thrown by the last fetch, if any */
+    error: unknown;
+    /** Input change handler — pass to the Root `onInputValueChange` prop */
+    onInputValueChange: (value: string) => void;
+}
+
 /**
  * Authentication hook.
  *
@@ -1654,6 +2954,153 @@ export declare const useAuthSuspense: () => {
     checkAuthStatus: () => Promise<AuthState>;
 };
 
+/**
+ * Hook that encapsulates the "creatable" combobox pattern — allowing users
+ * to create new items on-the-fly from the dropdown.
+ *
+ * Manages selected value, input query, and sentinel item injection internally.
+ * Supports both single and multiple select.
+ *
+ * @example
+ * ```tsx
+ * // Sync
+ * onItemCreated: (item) => {
+ *   setItems((prev) => [...prev, item]);
+ * }
+ *
+ * // Async — return server-assigned item to use as selected value
+ * onItemCreated: async (item) => {
+ *   const saved = await api.create(item);
+ *   setItems((prev) => [...prev, saved]);
+ *   return saved;
+ * }
+ *
+ * // Cancel via return false
+ * onItemCreated: async (item) => {
+ *   const ok = await confirm("Create?");
+ *   if (!ok) return false;
+ *   setItems((prev) => [...prev, item]);
+ * }
+ * ```
+ */
+declare function useCreatable<T extends object>(options: UseCreatableOptionsMultiple<T>): UseCreatableReturnMultiple<T>;
+
+declare function useCreatable<T extends object>(options: UseCreatableOptionsSingle<T>): UseCreatableReturnSingle<T>;
+
+declare function useCreatable<T extends object>(options: UseCreatableOptionsCombined<T>): UseCreatableReturnMultiple<T> | UseCreatableReturnSingle<T>;
+
+declare interface UseCreatableOptionsBase<T extends object> {
+    /** Current items list (managed externally since items may come from API) */
+    items: T[];
+    /** Extract display label from an item */
+    getLabel: (item: T) => string;
+    /** Factory to create a new item from user input string */
+    createItem: (value: string) => T;
+    /**
+     * Called when a new item is created via the "create" option.
+     *
+     * Return values control what happens next:
+     * - `void` / `undefined` — accept the item produced by `createItem` as-is
+     * - `T` — accept, but use the returned item instead (e.g. item with server-assigned ID)
+     * - `false` — cancel the creation (item is NOT selected)
+     *
+     * May return a `Promise` for async workflows (API calls, confirmation dialogs, etc.).
+     * A rejected promise also cancels the creation.
+     *
+     * If not provided, created items are added to the selection immediately.
+     *
+     * @example
+     * ```tsx
+     * // Sync
+     * onItemCreated: (item) => {
+     *   setItems(prev => [...prev, item]);
+     * }
+     *
+     * // Async — return server-assigned item
+     * onItemCreated: async (item) => {
+     *   const saved = await api.create(item);
+     *   setItems(prev => [...prev, saved]);
+     *   return saved;
+     * }
+     *
+     * // Cancel
+     * onItemCreated: async (item) => {
+     *   const ok = await confirm("Create?");
+     *   if (!ok) return false;
+     *   setItems(prev => [...prev, item]);
+     * }
+     * ```
+     */
+    onItemCreated?: (item: T) => void | false | T | Promise<void | false | T>;
+    /**
+     * Format the label for the "create" option in the dropdown.
+     * Useful for i18n (e.g. Japanese: `(v) => \`「${v}」を作成\``).
+     * @default (value) => \`Create "${value}"\`
+     */
+    formatCreateLabel?: (value: string) => string;
+}
+
+/**
+ * Combined options type for callers that don't know single vs multiple at compile time.
+ * Accepts the union of both value shapes.
+ */
+declare interface UseCreatableOptionsCombined<T extends object> extends UseCreatableOptionsBase<T> {
+    multiple?: boolean;
+    defaultValue?: T[] | T | null;
+    onValueChange?: ((value: T[]) => void) | ((value: T | null) => void);
+}
+
+declare interface UseCreatableOptionsMultiple<T extends object> extends UseCreatableOptionsBase<T> {
+    multiple: true;
+    defaultValue?: T[];
+    /** Called when selection changes (sentinel items are already excluded) */
+    onValueChange?: (value: T[]) => void;
+}
+
+declare interface UseCreatableOptionsSingle<T extends object> extends UseCreatableOptionsBase<T> {
+    multiple?: false | undefined;
+    defaultValue?: T | null;
+    /** Called when selection changes */
+    onValueChange?: (value: T | null) => void;
+}
+
+declare interface UseCreatableReturnBase<T> {
+    /** Items list with "create" sentinel appended when query has no exact match */
+    items: T[];
+    /** Current input query — pass to `Combobox.Root inputValue` */
+    inputValue: string;
+    /** Input change handler — pass to `Combobox.Root onInputValueChange` */
+    onInputValueChange: (value: string) => void;
+    /** Converts item to display label — pass to `Combobox.Root itemToStringLabel` */
+    itemToStringLabel: (item: T) => string;
+    /** Converts item to form value — pass to `Combobox.Root itemToStringValue` */
+    itemToStringValue: (item: T) => string;
+    /** Check if an item is the "create" sentinel */
+    isCreateItem: (item: T) => boolean;
+    /** Get the original input value from a sentinel item */
+    getCreateLabel: (item: T) => string | undefined;
+    /** The active formatCreateLabel function */
+    formatCreateLabel: (value: string) => string;
+    /** `true` while an async `onItemCreated` callback is in-flight */
+    creating: boolean;
+}
+
+declare interface UseCreatableReturnMultiple<T> extends UseCreatableReturnBase<T> {
+    /** Current selected values */
+    value: T[];
+    /** Value change handler — pass to `Combobox.Root onValueChange` */
+    onValueChange: (value: T[]) => void;
+    multiple: true;
+}
+
+declare interface UseCreatableReturnSingle<T> extends UseCreatableReturnBase<T> {
+    /** Current selected value */
+    value: T | null;
+    /** Value change handler — pass to `Combobox.Root onValueChange` */
+    onValueChange: (value: T | null) => void;
+    multiple: false;
+}
+
 export { useLocation }
 
 export { useNavigate }