prime-ui-kit 0.16.0 → 0.18.0

package/dist/components/pagination/Pagination.d.ts

@@ -42,9 +42,13 @@ export type PaginationProps = Omit<React.HTMLAttributes<HTMLElement>, "defaultVa
      * Always arrows + «current / total» instead of numbers. Without it the nav fills its parent and shows that view only below 22rem of its width.
      */
     compact?: boolean;
+    /**
+     * Where the page numbers sit in the width the nav fills: centred under a list, `end` beside a range line (the DataTable footer). The compact view keeps its arrows at the edges.
+     */
+    align?: "start" | "center" | "end";
     /**
      * Built-in strings, see Labels.
      */
     labels?: Partial<PaginationLabels>;
 };
-export declare function Pagination({ value, defaultValue, onValueChange, totalPages, siblingCount, size: sizeProp, compact, labels: labelsProp, className, ...rest }: PaginationProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null;
+export declare function Pagination({ value, defaultValue, onValueChange, totalPages, siblingCount, size: sizeProp, compact, align, labels: labelsProp, className, ...rest }: PaginationProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null;

package/dist/components/popover/Popover.d.ts

@@ -81,7 +81,7 @@ export type PopoverContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, "ro
      */
     size?: ControlSize;
     /**
-     * `auto`: by content, from the panel minimum to twice that. `trigger`: exactly the trigger's width, below the minimum too. `content`: what the content needs, within the viewport. A sheet is full width.
+     * `auto`: by content, panel minimum to twice that. `trigger`: exactly the trigger. `min-trigger`: `auto`, never narrower than the trigger. `content`: what the content needs. A sheet is full width.
      */
     width?: FloatingWidth;
     /**

package/dist/components/radio/Radio.d.ts

@@ -1,4 +1,5 @@
 import * as React from "react";
+import type { HintTone } from "../hint/Hint";
 import { type ChoiceLabelProps } from "../../internal/ChoiceField";
 import { type FieldRootDomProps } from "../../internal/FieldFrame";
 import type { ControlSize } from "../../internal/states";
@@ -48,6 +49,10 @@ export type RadioGroupProps = Omit<FieldRootDomProps, "dir"> & {
      * Help text under the options. Hidden while `error` is shown.
      */
     hint?: React.ReactNode;
+    /**
+     * Status color of `hint` («Осталось 12 дней» in `warning`). The words carry the status, the color repeats it; an `error` replaces the hint and its tone. A validation error is `error`, never a `danger` hint.
+     */
+    hintTone?: HintTone;
     /**
      * Error message under the options; implies `invalid`.
      */
@@ -77,7 +82,7 @@ export type RadioGroupProps = Omit<FieldRootDomProps, "dir"> & {
  * The field: label · radiogroup · hint or error. `className`, `ref` and the rest go to the frame,
  * `id` and the `aria-label*` / `aria-describedby` names to the radiogroup.
  */
-declare function RadioGroup({ id, value: valueProp, defaultValue, onValueChange, name: nameProp, size: sizeProp, disabled: disabledProp, label, required, optional, hint, error, invalid, orientation, labels: labelsProp, className, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, "aria-labelledby": ariaLabelledBy, children, ...rest }: RadioGroupProps): import("react/jsx-runtime").JSX.Element;
+declare function RadioGroup({ id, value: valueProp, defaultValue, onValueChange, name: nameProp, size: sizeProp, disabled: disabledProp, label, required, optional, hint, hintTone, error, invalid, orientation, labels: labelsProp, className, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, "aria-labelledby": ariaLabelledBy, children, ...rest }: RadioGroupProps): import("react/jsx-runtime").JSX.Element;
 declare namespace RadioGroup {
     var displayName: string;
 }
@@ -90,13 +95,17 @@ export type RadioRootProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, "
      * Description under the option text, linked through `aria-describedby`.
      */
     hint?: React.ReactNode;
+    /**
+     * Status color of `hint` («Осталось 12 дней» in `warning`). The words carry the status, the color repeats it; an `error` replaces the hint and its tone. A validation error is `error`, never a `danger` hint.
+     */
+    hintTone?: HintTone;
     /**
      * `Radio.Label`. Without it only the circle renders — give the root an `aria-label`.
      */
     children?: React.ReactNode;
     ref?: React.Ref<HTMLInputElement>;
 };
-declare function RadioRoot({ id, value, hint, disabled: disabledProp, className, "aria-describedby": ariaDescribedBy, children, ref, ...inputRest }: RadioRootProps): import("react/jsx-runtime").JSX.Element;
+declare function RadioRoot({ id, value, hint, hintTone, disabled: disabledProp, className, "aria-describedby": ariaDescribedBy, children, ref, ...inputRest }: RadioRootProps): import("react/jsx-runtime").JSX.Element;
 declare namespace RadioRoot {
     var displayName: string;
 }

package/dist/components/rich-text/RichText.d.ts

@@ -0,0 +1,23 @@
+import type * as React from "react";
+export type RichTextLabels = {
+    /** The name of a masked `||spoiler||` until it is revealed. */
+    spoiler: string;
+};
+export declare const RICH_TEXT_LABELS: RichTextLabels;
+export type RichTextProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
+    /**
+     * The source: `**bold**`, `_italic_`, `~~strike~~`, `||spoiler||`, inline and fenced code, links (`[label]` then the address in parentheses), bare URLs, `> ` quotes; line breaks are kept.
+     */
+    children: string;
+    /**
+     * Built-in strings, see Labels.
+     */
+    labels?: Partial<RichTextLabels>;
+    ref?: React.Ref<HTMLDivElement>;
+};
+/**
+ * Text in the chat's Markdown subset outside a message (a bot's welcome text, a template, a
+ * comment): bold, italic, strike, spoiler, inline and fenced code, links, quotes, kept line breaks —
+ * the same rendering as `Message.Text`, as React elements, never HTML. Takes the type of its host.
+ */
+export declare function RichText({ children, labels: labelsProp, className, ...rest }: RichTextProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/scroll-container/ScrollContainer.d.ts

@@ -33,7 +33,7 @@ export type ScrollContainerProps = React.HTMLAttributes<HTMLElement> & {
      */
     lock?: boolean;
     /**
-     * Scrolling comes to rest on the start of a child: `true` near one (strips of tiles and cards), `"mandatory"` always on one (board columns, a carousel). A Dnd drag inside turns it off; not with `anchor="end"`.
+     * Once a scroll ends, the region glides to the start of a child: `true` near one (strips of tiles), `"mandatory"` always (board columns, a carousel). Native scrolling meanwhile; any input stops the glide.
      */
     snap?: boolean | "mandatory";
     /**

package/dist/components/scroll-container/scrollGlide.d.ts

@@ -0,0 +1,26 @@
+export type ScrollAxis = "x" | "y";
+/** Distance from the start along `axis`, whatever the direction (RTL `scrollLeft` is negative). */
+export declare function scrollPosition(node: HTMLElement, axis: ScrollAxis): number;
+export declare function scrollMax(node: HTMLElement, axis: ScrollAxis): number;
+/**
+ * The positions the region comes to rest at along `axis` (distance from its start): every element
+ * within `SNAP_DEPTH` levels that has a `scroll-snap-align` on that axis, clamped to the range and
+ * clear of the region's `scroll-padding`.
+ */
+export declare function restPoints(node: HTMLElement, axis: ScrollAxis): number[];
+export type Glide = {
+    /** Glides `axis` to `to` on the kit's frames (instant under reduced motion). */
+    to: (axis: ScrollAxis, to: number) => void;
+    /** Stops where it is: the person takes over. */
+    stop: () => void;
+    /** Where a glide on `axis` is heading; `null` when none is. */
+    target: (axis: ScrollAxis) => number | null;
+    /** Whether a scroll event at this moment is the glide's own. */
+    owns: () => boolean;
+};
+/**
+ * A scroll glide on animation frames, never a smooth `scrollTo`: an engine finishes that against
+ * the person's input, while this stops the moment they take over. A new target retargets from where
+ * the glide is.
+ */
+export declare function createGlide(node: HTMLElement): Glide;

package/dist/components/scroll-container/useScrollMotion.d.ts

@@ -0,0 +1,25 @@
+import * as React from "react";
+export type ScrollMotionOptions = {
+    axis: "vertical" | "horizontal" | "both";
+    /** Settle on a rest point once a scroll ends: near one, or always. */
+    snap: "proximity" | "mandatory" | null;
+    /** Nothing the person does moves the region: no wheel glide, no settling. */
+    lock: boolean;
+};
+/**
+ * How a ScrollContainer moves beyond the browser's own scrolling, which it never replaces: the
+ * trackpad, touch, the scrollbar and the keys scroll natively, momentum included.
+ *
+ * - Snapping (`snap`): once a scroll ends (no movement for a moment, nothing held), the region
+ *   glides to the nearest rest point — the start of a child with a `scroll-snap-align`. CSS scroll
+ *   snapping is not used: an engine snaps during the gesture, damps the trackpad's momentum and
+ *   pulls a scroll back to merged rest points at the end.
+ * - A mouse wheel over a strip that scrolls only sideways (`axis="horizontal"`) scrolls it — a
+ *   snapping strip a rest point per notch, a free one by the wheel's distance. A trackpad, Shift
+ *   + wheel, a gesture that began outside (it keeps scrolling the page) and a strip at its edge
+ *   (the wheel chains to the page) stay native.
+ * - Every glide runs on the kit's frames and stops the moment the person takes over (a wheel,
+ *   touch, press or key); each notch retargets from where the glide is heading, so a turn the
+ *   other way goes back mid-glide.
+ */
+export declare function useScrollMotion(ref: React.RefObject<HTMLElement | null>, { axis, snap, lock }: ScrollMotionOptions): void;

package/dist/components/segmented-control/SegmentedControl.d.ts

@@ -56,7 +56,7 @@ export type SegmentedControlRootProps = Omit<FieldRootDomProps, "dir"> & FieldFr
  * The field: label · radiogroup track · hint or error. `className`, `ref` and the rest go to the
  * frame; `id`, `onKeyDown` and the `aria-label*` / `aria-describedby` names to the radiogroup.
  */
-declare function SegmentedControlRoot({ value, defaultValue, onValueChange, disabled: disabledProp, size: sizeProp, fullWidth, label, required, optional, hint, error, invalid, reserveSupportRow, id, labels: labelsProp, children, className, onKeyDown, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, ...rest }: SegmentedControlRootProps): import("react/jsx-runtime").JSX.Element;
+declare function SegmentedControlRoot({ value, defaultValue, onValueChange, disabled: disabledProp, size: sizeProp, fullWidth, label, required, optional, hint, hintTone, error, invalid, reserveSupportRow, id, labels: labelsProp, children, className, onKeyDown, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, ...rest }: SegmentedControlRootProps): import("react/jsx-runtime").JSX.Element;
 declare namespace SegmentedControlRoot {
     var displayName: string;
 }

package/dist/components/select/selectContext.d.ts

@@ -58,5 +58,12 @@ export type SelectContextValue = {
     describedBy: string | undefined;
     triggerRef: React.RefObject<HTMLButtonElement | null>;
     labels: SelectLabels;
+    /**
+     * The select is the start segment of a field box (`Input.Wrapper`): its trigger is a segment
+     * named by the root's `aria-label` and the picked value.
+     */
+    segment: {
+        label: string | undefined;
+    } | null;
 };
 export declare const SelectProvider: React.Provider<SelectContextValue | null>, useSelectContext: (part?: string) => SelectContextValue;

package/dist/components/slider/Slider.d.ts

@@ -43,7 +43,7 @@ export type SliderProps = FieldRootDomProps & FieldFrameProps & {
      */
     disabled?: boolean;
     /**
-     * `aria-invalid` on the range input and a danger focus ring on the thumb. A non-empty `error` implies it.
+     * `aria-invalid` on the range input, a danger fill (over any `tone`) and a danger focus ring on the thumb. A non-empty `error` implies it.
      */
     invalid?: boolean;
     /**
@@ -88,4 +88,4 @@ export type SliderProps = FieldRootDomProps & FieldFrameProps & {
  * with a glass thumb, then hint or error. `className`, `ref` and the rest go to the frame, `id`
  * and `aria-label` to the range input.
  */
-export declare function Slider({ value: valueProp, defaultValue, onValueChange, onCommit, name, min, max, step, disabled: disabledProp, invalid, label, required, optional, hint, error, showValue, formatValue, size: sizeProp, tone, orientation, id, className, style, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, labels: labelsProp, ...rest }: SliderProps): import("react/jsx-runtime").JSX.Element;
+export declare function Slider({ value: valueProp, defaultValue, onValueChange, onCommit, name, min, max, step, disabled: disabledProp, invalid, label, required, optional, hint, hintTone, error, showValue, formatValue, size: sizeProp, tone, orientation, id, className, style, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, labels: labelsProp, ...rest }: SliderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/smart-filter/SmartFilter.d.ts

@@ -97,7 +97,7 @@ export type SmartFilterLabels = {
     rangeTo: string;
 };
 export declare const SMART_FILTER_LABELS: SmartFilterLabels;
-export type SmartFilterRootProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children" | "defaultValue" | "onChange"> & {
+export type SmartFilterRootProps = {
     /**
      * Fields of this screen, in display order; empty — only the search. Pass a stable reference.
      */
@@ -139,12 +139,11 @@ export type SmartFilterRootProps = Omit<React.HTMLAttributes<HTMLDivElement>, "c
      */
     labels?: Partial<SmartFilterLabels>;
     /**
-     * `SmartFilter.Toolbar` and `SmartFilter.Chips`, anywhere inside.
+     * `SmartFilter.Toolbar` and `SmartFilter.Chips`, anywhere inside — in a page bar the Root wraps `Page.Root`.
      */
     children: React.ReactNode;
-    ref?: React.Ref<HTMLDivElement>;
 };
-declare function SmartFilterRoot({ fields, value, defaultValue, onValueChange, search, defaultSearch, onSearchChange, size: sizeProp, collapsedLimit, labels, className, children, ref, ...rest }: SmartFilterRootProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+declare function SmartFilterRoot({ fields, value, defaultValue, onValueChange, search, defaultSearch, onSearchChange, size: sizeProp, collapsedLimit, labels, children, }: SmartFilterRootProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 declare namespace SmartFilterRoot {
     var displayName: string;
 }
@@ -155,7 +154,7 @@ export type SmartFilterToolbarProps = Omit<React.HTMLAttributes<HTMLDivElement>,
     searchable?: boolean;
     ref?: React.Ref<HTMLDivElement>;
 };
-declare function SmartFilterToolbar({ searchable, className, ...rest }: SmartFilterToolbarProps): import("react/jsx-runtime").JSX.Element;
+declare function SmartFilterToolbar({ searchable, className, ref, ...rest }: SmartFilterToolbarProps): import("react/jsx-runtime").JSX.Element;
 declare namespace SmartFilterToolbar {
     var displayName: string;
 }

package/dist/components/switch/Switch.d.ts

@@ -1,4 +1,5 @@
 import type * as React from "react";
+import type { HintTone } from "../hint/Hint";
 import { type ChoiceLabelProps } from "../../internal/ChoiceField";
 import type { ControlSize } from "../../internal/states";
 export type SwitchLabels = {
@@ -31,6 +32,10 @@ export type SwitchRootProps = Omit<React.InputHTMLAttributes<HTMLInputElement>,
      * Help text under the label text. Hidden while `error` is shown.
      */
     hint?: React.ReactNode;
+    /**
+     * Status color of `hint` («Осталось 12 дней» in `warning`). The words carry the status, the color repeats it; an `error` replaces the hint and its tone. A validation error is `error`, never a `danger` hint.
+     */
+    hintTone?: HintTone;
     /**
      * Error message in the hint slot; implies `invalid`.
      */
@@ -53,7 +58,7 @@ export type SwitchRootProps = Omit<React.InputHTMLAttributes<HTMLInputElement>,
     children?: React.ReactNode;
     ref?: React.Ref<HTMLInputElement>;
 };
-declare function SwitchRoot({ id, checked: checkedProp, defaultChecked, onCheckedChange, loading, invalid, hint, error, size: sizeProp, optional, labels: labelsProp, disabled: disabledProp, readOnly, className, "aria-describedby": ariaDescribedBy, children, ref, ...inputRest }: SwitchRootProps): import("react/jsx-runtime").JSX.Element;
+declare function SwitchRoot({ id, checked: checkedProp, defaultChecked, onCheckedChange, loading, invalid, hint, hintTone, error, size: sizeProp, optional, labels: labelsProp, disabled: disabledProp, readOnly, className, "aria-describedby": ariaDescribedBy, children, ref, ...inputRest }: SwitchRootProps): import("react/jsx-runtime").JSX.Element;
 declare namespace SwitchRoot {
     var displayName: string;
 }

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

@@ -142,7 +142,7 @@ export type TagSelectProps = FieldRootDomProps & FieldFrameProps & FieldFocusRin
  * 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, closeOnEscape, closeOnOutsideClick, creatable, onCreate, fallbackColor, onOptionUpdate, onOptionDelete, disabled: disabledProp, name, placeholder, invalid: invalidProp, focusRing, size: sizeProp, label, required, optional, hint, error, id: idProp, labels: labelsProp, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...rest }: TagSelectProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+export declare function TagSelect({ options, value: valueProp, defaultValue, onValueChange, open: openProp, defaultOpen, onOpenChange, closeOnEscape, closeOnOutsideClick, creatable, onCreate, fallbackColor, onOptionUpdate, onOptionDelete, disabled: disabledProp, name, placeholder, invalid: invalidProp, focusRing, size: sizeProp, label, required, optional, hint, hintTone, error, id: idProp, labels: labelsProp, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...rest }: TagSelectProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 export declare namespace TagSelect {
     var displayName: string;
 }

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

@@ -1,4 +1,5 @@
 import * as React from "react";
+import type { HintTone } from "../hint/Hint";
 import { type FieldActionButtonProps } from "../../internal/FieldAction";
 import { type FieldCommitHandler } from "../../internal/FieldCommit";
 import { type FieldFocusRingProps } from "../../internal/FieldFrame";
@@ -52,6 +53,10 @@ export type TextareaRootProps = Omit<React.TextareaHTMLAttributes<HTMLTextAreaEl
      * Help text under the field. Hidden while `error` is shown.
      */
     hint?: React.ReactNode;
+    /**
+     * Status color of `hint` («Осталось 12 дней» in `warning`). The words carry the status, the color repeats it; an `error` replaces the hint and its tone. A validation error is `error`, never a `danger` hint.
+     */
+    hintTone?: HintTone;
     /**
      * Error message in the hint slot; implies `invalid`.
      */
@@ -95,7 +100,7 @@ export type TextareaRootProps = Omit<React.TextareaHTMLAttributes<HTMLTextAreaEl
  * 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, rows, maxRows, disabled: disabledProp, readOnly, value, onInput, onChange, onValueChange, onFocus, onBlur, onKeyDown, onSelect, onCommit, formatting, labels: labelsProp, "aria-describedby": ariaDescribedBy, children, ref, ...rest }: TextareaRootProps): import("react/jsx-runtime").JSX.Element;
+declare function TextareaRoot({ id, className, size: sizeProp, invalid, focusRing, label, required, optional, hint, hintTone, error, counter, reserveSupportRow, autoResize, rows, maxRows, disabled: disabledProp, readOnly, value, onInput, onChange, onValueChange, onFocus, onBlur, onKeyDown, onSelect, onCommit, formatting, labels: labelsProp, "aria-describedby": ariaDescribedBy, children, ref, ...rest }: TextareaRootProps): import("react/jsx-runtime").JSX.Element;
 declare namespace TextareaRoot {
     var displayName: string;
 }

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

@@ -94,7 +94,7 @@ declare namespace TimelineItemTitle {
 export type TimelineItemMetaProps = SpanPartProps;
 /**
  * Secondary line of an event, muted, tabular numbers: under the title (date and relative time;
- * emphasize a part with `<strong>`), or inside `Timeline.ItemValue` the value's second line
+ * emphasize a part with `<strong>`; several lines stack under the title), or inside `Timeline.ItemValue` the value's second line
  * (category, unit), right-aligned under it.
  */
 declare function TimelineItemMeta({ children, className, ...rest }: TimelineItemMetaProps): import("react/jsx-runtime").JSX.Element;

package/dist/icon-set.js

@@ -410,7 +410,7 @@ import {
   Youtube,
   Zap,
   ZapOff
-} from "./chunks/chunk-A7OQWH6R.js";
+} from "./chunks/chunk-IVS3J7AS.js";
 import {
   Activity,
   ArrowDown,
@@ -527,7 +527,7 @@ import {
   X,
   ZoomIn,
   ZoomOut
-} from "./chunks/chunk-U3Q2I3MY.js";
+} from "./chunks/chunk-QFHE5GKW.js";
 export {
   AArrowDown as AArrowDownIcon,
   AArrowUp as AArrowUpIcon,