prime-ui-kit 0.7.13 → 0.9.1

package/dist/components/tag-select/TagSelect.d.ts

@@ -1,60 +1,76 @@
-import * as React from "react";
-import { type BadgeColor } from "@/components/badge/Badge";
-import type { SelectSize } from "@/internal/states";
+import { type FieldFrameProps, type FieldRootDomProps } from "@/internal/FieldFrame";
+import { type ControlSize, type PaletteColor } from "@/internal/states";
 export type TagSelectOption = {
     value: string;
     label: string;
-    color?: BadgeColor;
+    color?: PaletteColor;
     disabled?: boolean;
 };
-export type TagSelectOptionManagement = {
-    /** Обновить подпись и/или цвет; `value` опции не меняется. */
-    onUpdate: (value: string, updates: {
-        label?: string;
-        color?: BadgeColor;
-    }) => void;
-    /** Удалить тег из справочника; выбранное значение с `value` снимается автоматически. */
-    onDelete: (value: string) => void;
-    /** Подпись секции палитры (по умолчанию «Colors»). */
-    colorsSectionLabel?: string;
-    /** Подпись кнопки удаления (по умолчанию «Delete»). */
-    deleteLabel?: string;
-    /** `aria-label` кнопки меню «⋯» (по умолчанию «Edit tag» + подпись тега). */
-    editMenuAriaLabelPrefix?: string;
+export type TagSelectOptionUpdate = {
+    label?: string;
+    color?: PaletteColor;
 };
-export type TagSelectRootProps = {
-    /** Доступные теги (значение + подпись + цвет Badge `filled`). */
+export type TagSelectLabels = {
+    /** Line above the list; `""` hides it. */
+    panelHint: string;
+    /** Action text before the preview of a new tag (`creatable`). */
+    create: string;
+    /** Accessible name of a chip's remove button; `{label}` is the tag text. */
+    remove: string;
+    /** Accessible name of the «+N» chip; `{count}` is the number of hidden tags. */
+    more: string;
+    /** Screen-reader announcement after a tag is removed; `{label}` is the tag text. */
+    removed: string;
+    /** Accessible name of a row's «⋯» menu; `{label}` is the tag text. */
+    edit: string;
+    /** Accessible name of the tag name field in the menu. */
+    name: string;
+    /** Delete button in the menu. */
+    delete: string;
+    /** Heading of the color list in the menu. */
+    colors: string;
+    /** Names of the palette colors in the menu. */
+    colorNames: Record<PaletteColor, string>;
+    /** Muted marker after the label when `optional`. */
+    optional: string;
+};
+export type TagSelectProps = FieldRootDomProps & FieldFrameProps & {
+    /** Available tags: value, label and chip color. */
     options: TagSelectOption[];
     value?: string[];
     defaultValue?: string[];
-    onValueChange?: (next: string[]) => void;
-    /** Разрешить ввод нового значения, если его нет в списке. */
+    onValueChange?: (value: string[]) => void;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Allow adding a value that is not in `options`. */
     creatable?: boolean;
-    /** Только для creatable: значение добавлено через Create / Enter, не выбрано из `options` (сохранение в БД и т.п.). */
-    onCreated?: (value: string) => void;
-    /** Цвет чипа для созданных вручную значений (если нет в `options`). */
-    defaultTagColor?: BadgeColor;
-    /** Текст над списком. */
-    hint?: React.ReactNode;
-    /** Подпись действия создания (перед превью тега). */
-    createActionLabel?: string;
+    /** A new value was created (Create row or Enter), not picked from `options`. */
+    onCreate?: (value: string) => void;
+    /** Chip color of values without an option color, including created ones. */
+    defaultColor?: PaletteColor;
+    /** Enables the «⋯» row menu: tag name and color. `value` never changes. */
+    onOptionUpdate?: (value: string, updates: TagSelectOptionUpdate) => void;
+    /** Enables «Удалить» in the row menu; the value is also removed from the selection. */
+    onOptionDelete?: (value: string) => void;
     disabled?: boolean;
     placeholder?: string;
-    hasError?: boolean;
-    /** Как у `Select`: одна ось для поля (`data-size` на контроле) и панели списка; `Badge` без своего `size` берёт размер из этого контекста. */
-    size?: SelectSize;
-    /** Редактирование опций в списке: имя, цвет, удаление (меню «⋯» у строки). */
-    optionManagement?: TagSelectOptionManagement;
+    /** Danger ring and `aria-invalid`; a non-empty `error` implies it. */
+    invalid?: boolean;
+    /** Field tier; the list uses the same tier, chips one tier down. */
+    size?: ControlSize;
+    /** Id of the text input; generated when omitted. */
     id?: string;
+    labels?: Partial<TagSelectLabels>;
     className?: string;
     "aria-label"?: string;
     "aria-labelledby"?: string;
 };
-export declare function TagSelectRoot({ options, value: valueProp, defaultValue, onValueChange, creatable, onCreated, defaultTagColor, hint, createActionLabel, disabled, placeholder, hasError, size, optionManagement, id: idProp, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }: TagSelectRootProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace TagSelectRoot {
+/**
+ * A multi-value field shown as tag chips: pick from a list, type to filter, create new values.
+ * At rest one row (extra chips fold into «+N»); focused or open it shows every chip.
+ */
+export declare function TagSelect({ options, value: valueProp, defaultValue, onValueChange, open: openProp, defaultOpen, onOpenChange, creatable, onCreate, defaultColor, onOptionUpdate, onOptionDelete, disabled, placeholder, invalid: invalidProp, focusRing, size, label, required, optional, hint, error, id: idProp, labels: labelsProp, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...rest }: TagSelectProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace TagSelect {
     var displayName: string;
 }
-export declare const TagSelect: {
-    Root: typeof TagSelectRoot;
-};
-//# sourceMappingURL=TagSelect.d.ts.map

package/dist/components/tag-select/useChipOverflow.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+type ChipOverflowOptions = {
+    /** The visible chip row (its width and column gap). */
+    rowRef: React.RefObject<HTMLElement | null>;
+    /** An invisible row of every chip followed by a «+N» sample: the widths to fit. */
+    measureRef: React.RefObject<HTMLElement | null>;
+    /** The text input sharing the row; its min width is reserved unless it is collapsed. */
+    inputRef: React.RefObject<HTMLInputElement | null>;
+    /** The chips (a new array when one is added, removed, renamed or recolored). */
+    chips: readonly unknown[];
+    inputCollapsed: boolean;
+};
+/**
+ * How many chips fit on one row of the field; the rest collapse into a «+N» chip. At least one
+ * chip stays visible (it shrinks with an ellipsis, «+N» never does). Recounts when the chips
+ * change and when the row or the measured chips change size (fonts, a renamed tag).
+ */
+export declare function useChipOverflow({ rowRef, measureRef, inputRef, chips, inputCollapsed, }: ChipOverflowOptions): number;
+export {};

package/dist/components/textarea/Textarea.d.ts

@@ -1,43 +1,60 @@
 import * as React from "react";
-import type { TextareaSize, TextareaVariant } from "@/internal/states";
-export type TextareaCharCounterProps = {
-    current: number;
-    max: number;
+import type { ControlSize } from "@/internal/states";
+export type TextareaLabels = {
+    /** Muted marker after the label when `optional`. */
+    optional: string;
+    /** Screen-reader text of `Textarea.Counter`; `{current}` and `{max}` are replaced. */
+    counter: string;
 };
-declare function TextareaCharCounter({ current, max }: TextareaCharCounterProps): import("react/jsx-runtime").JSX.Element;
-declare namespace TextareaCharCounter {
-    var displayName: string;
-}
-export type TextareaRootProps = Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "size"> & {
-    variant?: TextareaVariant;
-    size?: TextareaSize;
+export type TextareaRootProps = Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "size" | "children"> & {
+    /** Tier. Default: the tier of the surrounding control (a form, a panel), else `m`. */
+    size?: ControlSize;
+    /** Invalid state: danger ring and `aria-invalid`. A non-empty `error` implies it. */
+    invalid?: boolean;
+    /**
+     * Draws the focus ring on the field box (default). `false` hides only the visual ring — focus,
+     * keyboard and ARIA are unchanged, the error ring still shows. Turn it off only where focus is
+     * otherwise obvious (a single composer field with a caret); WCAG 2.4.7.
+     */
+    focusRing?: boolean;
+    label?: React.ReactNode;
+    /** Shows the muted optional marker after the label text (`labels.optional`). */
+    optional?: boolean;
+    hint?: React.ReactNode;
+    /** Error message; replaces the hint in the same slot and implies `invalid`. */
+    error?: React.ReactNode;
+    /** Right-aligned slot of the support row, e.g. `<Textarea.Counter current={n} max={500} />`. */
+    counter?: React.ReactNode;
+    /** Always render the support row so an appearing error does not shift the layout. */
+    reserveSupportRow?: boolean;
+    /** Height follows the content. `false` → fixed height with native vertical resize. */
     autoResize?: boolean;
+    /** Called with the new string value; native `onChange` still fires. */
+    onValueChange?: (value: string) => void;
+    labels?: Partial<TextareaLabels>;
+    /** The native `<textarea>`. */
+    ref?: React.Ref<HTMLTextAreaElement>;
 };
-export type TextareaHintProps = {
-    children: React.ReactNode;
-    className?: string;
-} & Omit<React.HTMLAttributes<HTMLParagraphElement>, "id">;
-declare function TextareaHint({ children, className, ...rest }: TextareaHintProps): import("react/jsx-runtime").JSX.Element;
-declare namespace TextareaHint {
+/**
+ * A multi-line field. `className` goes to the field frame, `id`, `ref` and the native attributes
+ * to the `<textarea>` (it has no `Field` part).
+ */
+declare function TextareaRoot({ id, className, size: sizeProp, invalid, focusRing, label, required, optional, hint, error, counter, reserveSupportRow, autoResize, disabled, readOnly, value, onInput, onChange, onValueChange, labels: labelsProp, "aria-describedby": ariaDescribedBy, ref, ...rest }: TextareaRootProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TextareaRoot {
     var displayName: string;
 }
-export type TextareaErrorProps = {
-    children: React.ReactNode;
-    className?: string;
-} & Omit<React.HTMLAttributes<HTMLParagraphElement>, "id">;
-declare function TextareaError({ children, className, ...rest }: TextareaErrorProps): import("react/jsx-runtime").JSX.Element;
-declare namespace TextareaError {
+export type TextareaCounterProps = Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> & {
+    current: number;
+    max: number;
+    ref?: React.Ref<HTMLSpanElement>;
+};
+/** Character counter for the `counter` slot; turns danger when `current > max`. */
+declare function TextareaCounter(props: TextareaCounterProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TextareaCounter {
     var displayName: string;
 }
 export declare const Textarea: {
-    Root: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "size"> & {
-        variant?: TextareaVariant;
-        size?: TextareaSize;
-        autoResize?: boolean;
-    } & React.RefAttributes<HTMLTextAreaElement>>;
-    CharCounter: typeof TextareaCharCounter;
-    Hint: typeof TextareaHint;
-    Error: typeof TextareaError;
+    Root: typeof TextareaRoot;
+    Counter: typeof TextareaCounter;
 };
 export {};
-//# sourceMappingURL=Textarea.d.ts.map

package/dist/components/thumbnail/Thumbnail.d.ts

@@ -0,0 +1,41 @@
+import type * as React from "react";
+import { type ImageSlotFallbackProps, type ImageSlotImageProps } from "@/internal/imageSlot";
+import type { ControlSize, PaletteColor } from "@/internal/states";
+/** Width ÷ height. `1:1` square · `4:3` / `3:2` photo · `16:9` wide cover · `3:4` portrait. */
+export type ThumbnailRatio = "1:1" | "4:3" | "3:2" | "16:9" | "3:4";
+export type ThumbnailRootProps = React.HTMLAttributes<HTMLDivElement> & {
+    /** Height tier: 24 · 32 · 40 · 48 · 64; width follows `ratio`. Default `m`. */
+    size?: ControlSize;
+    /** Aspect ratio, width ÷ height. Default `1:1`. */
+    ratio?: ThumbnailRatio;
+    /** Fallback fill and icon color (`--prime-color-palette-<hue>-*`). Default `gray`. */
+    color?: PaletteColor;
+    /** Fallback fill: `soft` tint with a hue icon, or `solid` hue with a contrasting icon. */
+    variant?: "soft" | "solid";
+    /** Fills the container width (cards, galleries); the height follows `ratio`. */
+    fullWidth?: boolean;
+    /** A faint inner ring around the frame, for photos with a white background on a light surface. */
+    ring?: boolean;
+    ref?: React.Ref<HTMLDivElement>;
+};
+/** A preview of an object (product, vehicle, file, cover) at a fixed aspect ratio. People use Avatar. */
+declare function ThumbnailRoot({ size, ratio, color, variant, fullWidth, ring, className, children, ...rest }: ThumbnailRootProps): import("react/jsx-runtime").JSX.Element;
+declare namespace ThumbnailRoot {
+    var displayName: string;
+}
+export type ThumbnailImageProps = ImageSlotImageProps & {
+    /** `cover` (default) crops to fill; `contain` shows the whole image on the fallback fill. */
+    fit?: "cover" | "contain";
+};
+/** The picture; while it loads or after an error the Fallback shows through. */
+declare function ThumbnailImage({ fit, ...rest }: ThumbnailImageProps): import("react/jsx-runtime").JSX.Element;
+declare namespace ThumbnailImage {
+    var displayName: string;
+}
+export type ThumbnailFallbackProps = ImageSlotFallbackProps;
+export declare const Thumbnail: {
+    Root: typeof ThumbnailRoot;
+    Image: typeof ThumbnailImage;
+    Fallback: (props: ImageSlotFallbackProps) => React.ReactElement;
+};
+export {};

package/dist/components/timeline/Timeline.d.ts

@@ -0,0 +1,140 @@
+import * as React from "react";
+import type { ControlSize, PaletteColor, Tone } from "@/internal/states";
+export type TimelineRootProps = {
+    /** Tier of text, dots and row rhythm. Default `m` (rows 64px). */
+    size?: ControlSize;
+    /** `Timeline.Group` elements. */
+    children: React.ReactNode;
+    className?: string;
+    ref?: React.Ref<HTMLDivElement>;
+} & Omit<React.HTMLAttributes<HTMLDivElement>, "children">;
+declare function TimelineRoot({ size, children, className, ...rest }: TimelineRootProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineRoot {
+    var displayName: string;
+}
+export type TimelineGroupProps = {
+    /** Group heading (e.g. «Недавно»); labels the list via `aria-labelledby`. */
+    label?: React.ReactNode;
+    /** `Timeline.Item` and `Timeline.Gap` elements. */
+    children: React.ReactNode;
+    className?: string;
+    ref?: React.Ref<HTMLOListElement>;
+} & Omit<React.OlHTMLAttributes<HTMLOListElement>, "children">;
+/** One labelled `<ol>` of events. The connecting line runs from its first dot to its last. */
+declare function TimelineGroup({ label, children, className, ...rest }: TimelineGroupProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineGroup {
+    var displayName: string;
+}
+export type TimelineItemProps = {
+    /** Decorative dot hue (categorization). Default `blue`, shown at reduced emphasis. */
+    color?: PaletteColor;
+    /** Semantic dot color (status). Wins over `color`; shown at full emphasis. */
+    tone?: Tone;
+    /** Renders the row as a link. */
+    href?: string;
+    /** Renders the row as the single child element (router link etc.); the dot is prepended to its children. */
+    asChild?: boolean;
+    /** Renders the row as a `button` (unless `href` / `asChild`). */
+    onClick?: React.MouseEventHandler<HTMLElement>;
+    /** `Timeline.Title`, `Timeline.Meta`, `Timeline.Value`. */
+    children: React.ReactNode;
+    className?: string;
+    /** The row element (`a`, `button`, `div` or the `asChild` element). */
+    ref?: React.Ref<HTMLElement>;
+} & Omit<React.HTMLAttributes<HTMLElement>, "children" | "color" | "onClick"> & Pick<React.AnchorHTMLAttributes<HTMLAnchorElement>, "target" | "rel" | "download">;
+declare function TimelineItem({ color, tone, href, asChild, onClick, children, className, ref, ...rest }: TimelineItemProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineItem {
+    var displayName: string;
+}
+export type TimelineTitleProps = {
+    children: React.ReactNode;
+    className?: string;
+    ref?: React.Ref<HTMLSpanElement>;
+} & Omit<React.HTMLAttributes<HTMLSpanElement>, "children">;
+/** First line: the event. Medium, primary (accent on the highlighted row); wraps when narrow. */
+declare function TimelineTitle({ children, className, ...rest }: TimelineTitleProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineTitle {
+    var displayName: string;
+}
+export type TimelineMetaProps = {
+    children: React.ReactNode;
+    className?: string;
+    ref?: React.Ref<HTMLSpanElement>;
+} & Omit<React.HTMLAttributes<HTMLSpanElement>, "children">;
+/** Second line: date and relative time, muted, tabular numbers. Emphasize a part with `Timeline.MetaPrimary` or `<strong>`. */
+declare function TimelineMeta({ children, className, ...rest }: TimelineMetaProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineMeta {
+    var displayName: string;
+}
+export type TimelineMetaPrimaryProps = {
+    children: React.ReactNode;
+    className?: string;
+    ref?: React.Ref<HTMLSpanElement>;
+} & Omit<React.HTMLAttributes<HTMLSpanElement>, "children">;
+/** Emphasized part of the meta line (the date): primary, medium. */
+declare function TimelineMetaPrimary({ children, className, ...rest }: TimelineMetaPrimaryProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineMetaPrimary {
+    var displayName: string;
+}
+export type TimelineValueProps = {
+    /** Text color. Default `neutral` (primary text). */
+    tone?: Tone;
+    children: React.ReactNode;
+    className?: string;
+    ref?: React.Ref<HTMLSpanElement>;
+} & Omit<React.HTMLAttributes<HTMLSpanElement>, "children">;
+/**
+ * Trailing amount: right-aligned, vertically centered, tabular numbers. Add `Timeline.ValueMeta` for a
+ * muted second line. Moves under the meta below 20rem.
+ */
+declare function TimelineValue({ tone, children, className, ...rest }: TimelineValueProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineValue {
+    var displayName: string;
+}
+export type TimelineValueMetaProps = {
+    children: React.ReactNode;
+    className?: string;
+    ref?: React.Ref<HTMLSpanElement>;
+} & Omit<React.HTMLAttributes<HTMLSpanElement>, "children">;
+/** Second line inside `Timeline.Value` (category, unit): meta size, muted, right-aligned under the value. */
+declare function TimelineValueMeta({ children, className, ...rest }: TimelineValueMetaProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineValueMeta {
+    var displayName: string;
+}
+export type TimelineGapMetaProps = React.HTMLAttributes<HTMLSpanElement> & {
+    ref?: React.Ref<HTMLSpanElement>;
+};
+/** A caption on the right of a gap (e.g. «сейчас»). */
+declare function TimelineGapMeta({ className, ...rest }: TimelineGapMetaProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineGapMeta {
+    var displayName: string;
+}
+export type TimelineGapProps = {
+    /** Caption color and hollow dot. Default `neutral` (muted); `warning` / `danger` flag a long interval. */
+    tone?: Tone;
+    /** Interval caption, e.g. «40 дней · 2 200 км без обслуживания», and an optional `Timeline.GapMeta`. */
+    children: React.ReactNode;
+    className?: string;
+    ref?: React.Ref<HTMLDivElement>;
+} & Omit<React.HTMLAttributes<HTMLDivElement>, "children">;
+/**
+ * Interval between two events: a shorter row with a small hollow dot on a dashed segment and a
+ * muted caption. Renders an `li`, so it goes inside `Timeline.Group` between items.
+ */
+declare function TimelineGap({ tone, children, className, ...rest }: TimelineGapProps): import("react/jsx-runtime").JSX.Element;
+declare namespace TimelineGap {
+    var displayName: string;
+}
+export declare const Timeline: {
+    Root: typeof TimelineRoot;
+    Group: typeof TimelineGroup;
+    Item: typeof TimelineItem;
+    Title: typeof TimelineTitle;
+    Meta: typeof TimelineMeta;
+    MetaPrimary: typeof TimelineMetaPrimary;
+    Value: typeof TimelineValue;
+    ValueMeta: typeof TimelineValueMeta;
+    Gap: typeof TimelineGap;
+    GapMeta: typeof TimelineGapMeta;
+};
+export {};

package/dist/components/tooltip/Tooltip.d.ts

@@ -1,11 +1,16 @@
 import * as React from "react";
-export type TooltipSize = "s" | "m" | "l" | "xl";
-export type TooltipSide = "top" | "bottom" | "left" | "right";
+import { type PositionAlign, type PositionSide } from "@/hooks/usePosition";
+import type { ControlSize } from "@/internal/states";
+export type TooltipSide = PositionSide;
+export type TooltipAlign = PositionAlign;
 export type TooltipProviderProps = {
+    /** Show delay in ms for every Tooltip.Root inside. */
     delayDuration?: number;
+    /** Window in ms after a tooltip closes during which the next one opens instantly. */
+    skipDelayDuration?: number;
     children: React.ReactNode;
 };
-declare function TooltipProvider({ delayDuration, children }: TooltipProviderProps): import("react/jsx-runtime").JSX.Element;
+declare function TooltipProvider({ delayDuration, skipDelayDuration, children, }: TooltipProviderProps): import("react/jsx-runtime").JSX.Element;
 declare namespace TooltipProvider {
     var displayName: string;
 }
@@ -14,26 +19,35 @@ export type TooltipRootProps = {
     open?: boolean;
     defaultOpen?: boolean;
     onOpenChange?: (open: boolean) => void;
+    /** Show delay in ms for this tooltip; defaults to the Provider's (400). */
+    delayDuration?: number;
 };
-declare function TooltipRoot({ children, open, defaultOpen, onOpenChange }: TooltipRootProps): import("react/jsx-runtime").JSX.Element;
+declare function TooltipRoot({ children, open, defaultOpen, onOpenChange, delayDuration: delayProp, }: TooltipRootProps): import("react/jsx-runtime").JSX.Element;
 declare namespace TooltipRoot {
     var displayName: string;
 }
 export type TooltipTriggerProps = {
+    /** One focusable element: a Button, or a `tabIndex={0}` wrapper around a disabled control. */
     children: React.ReactElement;
-    className?: string;
-};
-declare function TooltipTrigger({ children, className }: TooltipTriggerProps): React.ReactElement<React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>, string | React.JSXElementConstructor<any>>;
+    ref?: React.Ref<HTMLElement>;
+} & Omit<React.HTMLAttributes<HTMLElement>, "children">;
+/**
+ * The tooltip id joins the child's own `aria-describedby`; the child's handlers run first. Other
+ * props (handlers, ARIA, `ref`) are forwarded to the child.
+ */
+declare function TooltipTrigger({ children, ...forwarded }: TooltipTriggerProps): import("react/jsx-runtime").JSX.Element;
 declare namespace TooltipTrigger {
     var displayName: string;
 }
-export type TooltipContentProps = {
+export type TooltipContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, "id" | "role" | "onPointerEnter" | "onPointerLeave"> & {
     children: React.ReactNode;
-    size?: TooltipSize;
+    /** Text and padding tier; also the size context of controls inside (a Kbd). */
+    size?: ControlSize;
     side?: TooltipSide;
-    className?: string;
+    align?: TooltipAlign;
+    ref?: React.Ref<HTMLDivElement>;
 };
-declare function TooltipContent({ children, size, side, className }: TooltipContentProps): import("react/jsx-runtime").JSX.Element | null;
+declare function TooltipContent({ children, size, side, align, className, ...rest }: TooltipContentProps): import("react/jsx-runtime").JSX.Element;
 declare namespace TooltipContent {
     var displayName: string;
 }
@@ -44,4 +58,3 @@ export declare const Tooltip: {
     Content: typeof TooltipContent;
 };
 export {};
-//# sourceMappingURL=Tooltip.d.ts.map

package/dist/components/typography/Typography.d.ts

@@ -1,30 +1,26 @@
-import * as React from "react";
-/** Семантические роли чтения; соответствуют `typography.role` в `tokens/semantic.ts`. */
-export type TypographyVariant = "display" | "headline" | "heading-page" | "heading-section" | "heading-subsection" | "heading-group" | "body-large" | "body-default" | "body-small" | "body-compact" | "caption" | "caption-micro";
+import type * as React from "react";
+import type { TextTone } from "@/internal/states";
+/** Text roles from the foundation (`--prime-text-<role>-*`). */
+export type TypographyRole = "caption" | "body-s" | "body-m" | "body-l" | "title-s" | "title-m" | "title-l" | "heading-s" | "heading-m" | "heading-l" | "display-s" | "display-m" | "display-l" | "code";
 export type TypographyWeight = "regular" | "medium" | "semibold";
 export type TypographyTracking = "normal" | "tight" | "tighter" | "wide";
-export type TypographyTone = "default" | "muted";
 export type TypographyAs = "p" | "span" | "div" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "small" | "blockquote" | "article" | "section" | "header" | "footer" | "aside" | "nav" | "main";
-export type TypographyRootProps = {
+export type TypographyProps = {
     as?: TypographyAs;
-    variant: TypographyVariant;
+    /** Text role (`--prime-text-<role>-*`). */
+    variant: TypographyRole;
+    /** Overrides the role's weight. Omit to use the role's own weight. */
     weight?: TypographyWeight;
+    /** Overrides the role's tracking. Omit to use the role's own tracking. */
     tracking?: TypographyTracking;
+    /** Clamp to one line with an ellipsis (set `title` when the full text matters). */
+    truncate?: boolean;
     italic?: boolean;
-    tone?: TypographyTone;
+    /** Text color. Default `default` (primary text). */
+    tone?: TextTone;
     children?: React.ReactNode;
     className?: string;
+    ref?: React.Ref<HTMLElement>;
 } & React.HTMLAttributes<HTMLElement>;
-export declare const Typography: {
-    Root: React.ForwardRefExoticComponent<{
-        as?: TypographyAs;
-        variant: TypographyVariant;
-        weight?: TypographyWeight;
-        tracking?: TypographyTracking;
-        italic?: boolean;
-        tone?: TypographyTone;
-        children?: React.ReactNode;
-        className?: string;
-    } & React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
-};
-//# sourceMappingURL=Typography.d.ts.map
+/** Any text element styled by one text role; state goes to `data-*`. */
+export declare function Typography({ as: Tag, variant, weight, tracking, truncate, italic, tone, className, children, ref, ...rest }: TypographyProps): import("react/jsx-runtime").JSX.Element;

package/dist/hooks/useControllableState.d.ts

@@ -5,4 +5,3 @@ type UseControllableStateParams<T> = {
 };
 export declare function useControllableState<T>({ value, defaultValue, onChange, }: UseControllableStateParams<T>): readonly [T, (nextValue: T | ((prev: T) => T)) => void];
 export {};
-//# sourceMappingURL=useControllableState.d.ts.map

package/dist/hooks/useEnterConfirm.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+export type UseEnterConfirmOptions = {
+    enabled: boolean;
+    containerRef: React.RefObject<HTMLElement | null>;
+    /** Replaces the default (a `click()` on `confirmRef`). */
+    onEnterConfirm?: (event: KeyboardEvent) => void;
+    /** The confirm target (the primary button wrapped in `Modal.Confirm`). */
+    confirmRef: React.RefObject<HTMLElement | null>;
+};
+/**
+ * Enter inside a dialog clicks its confirm action — from a text field or the dialog itself. Enter on
+ * a button, link or `role="button"` activates that element instead (Enter on Cancel cancels), and
+ * the header (close button) is left alone.
+ */
+export declare function useEnterConfirm({ enabled, containerRef, onEnterConfirm, confirmRef, }: UseEnterConfirmOptions): void;

package/dist/hooks/useImageStatus.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+/** Load status of an image part as its root sees it; `idle` = no image part mounted. */
+export type ImageStatus = "idle" | "loading" | "loaded" | "error";
+type ImageHandlers = {
+    onLoad?: React.ReactEventHandler<HTMLImageElement>;
+    onError?: React.ReactEventHandler<HTMLImageElement>;
+};
+/**
+ * Image side of an image-with-fallback component (Avatar, Thumbnail): tracks the `<img>` load and
+ * reports it to the root through `report`, so the root's Fallback shows while loading and after an
+ * error. Key the image element by `src`: a new source remounts it and starts again at `loading`.
+ * Unmounting the image reports `idle`.
+ */
+export declare function useImageStatus(report: (status: ImageStatus) => void, { onLoad, onError }?: ImageHandlers): {
+    status: "loading" | "error" | "loaded";
+    onLoad: (event: React.SyntheticEvent<HTMLImageElement>) => void;
+    onError: (event: React.SyntheticEvent<HTMLImageElement>) => void;
+};
+export {};

package/dist/hooks/useInertSiblings.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+/** Body children that stay usable under a modal layer: live regions (the toast viewport). */
+export declare const LIVE_REGION_ATTR = "data-prime-live-region";
+/**
+ * While `enabled`, makes every `<body>` child inert except the one that holds `ref` (its portal)
+ * and live regions, then restores the previous values. `inert` already removes the content from
+ * the accessibility tree, so no `aria-hidden` is added. Part of `useModalLayer`.
+ */
+export declare function useInertSiblings(enabled: boolean, ref: React.RefObject<HTMLElement | null>): void;

package/dist/hooks/useMergedRefs.d.ts

@@ -1,3 +1,7 @@
 import * as React from "react";
-export declare function useMergedRefs<T>(...refs: Array<React.Ref<T> | undefined>): (value: T) => void;
-//# sourceMappingURL=useMergedRefs.d.ts.map
+/**
+ * One stable callback ref that writes to every given ref (callback or object). The identity changes
+ * only when one of the refs does, so the node is not detached and reattached on every render. The
+ * single way to merge refs in components; the number of refs at a call site must not change.
+ */
+export declare function useMergedRefs<T>(...refs: Array<React.Ref<T> | undefined>): React.RefCallback<T>;

package/dist/hooks/useModalLayer.d.ts

@@ -0,0 +1,22 @@
+import * as React from "react";
+import { type DismissReason, type LayerEntry } from "@/internal/overlay/layerStack";
+export type UseModalLayerOptions = {
+    open: boolean;
+    /** Escape (`escape`) or a click on the scrim (`scrim`); the owner applies its `closeOn*` props. */
+    onDismiss: (reason: DismissReason) => void;
+};
+export type ModalLayer<T extends HTMLElement> = {
+    /** Attach to the panel (`role="dialog"`): the trap container and the inside of the layer. */
+    ref: React.RefObject<T | null>;
+    /** Pass to `<LayerProvider value={layer}>` around the content: nested layers stack above. */
+    layer: LayerEntry;
+};
+/**
+ * The mechanics of a modal layer — Modal, Drawer, CommandMenu, the off-canvas Sidebar — in one
+ * fixed order: the rest of the page becomes inert, focus moves in and Tab is trapped, document
+ * scroll locks, and the layer joins the stack with scrim (`click`) dismissal. On close the page is
+ * restored first, then focus returns to the opener, captured at the open transition. Focus always
+ * returns, also after a scrim click: the page behind was inert, so the opener is the only place to
+ * continue from (foundation §8).
+ */
+export declare function useModalLayer<T extends HTMLElement = HTMLElement>({ open, onDismiss, }: UseModalLayerOptions): ModalLayer<T>;