@feugene/granularity 0.48.0 → 0.50.0

package/dist/types/components/GrNavbar/grNavbarStyles.d.ts

@@ -19,5 +19,14 @@ export declare const navbarSideClass = "flex min-w-0 items-center gap-3";
 export declare const navbarSideGrowClass = "flex-1";
 export declare const navbarRightAlignClass = "justify-end";
 export declare const navbarCenterClass = "flex min-w-0 flex-1 items-center justify-center gap-3";
-export declare const navbarTitleClass = "text-[length:var(--gr-text-sm)] leading-[var(--gr-leading-sm)] font-700";
+/**
+ * Уровни заголовка шапки.
+ *
+ * Единица разрешена, в отличие от `GrCard`, где шкала начинается с двойки:
+ * карточка никогда не бывает заголовком страницы, а шапка раздела — бывает, и
+ * имя раздела в ней и есть `h1`.
+ */
+export declare const GR_NAVBAR_HEADING_LEVELS: readonly [1, 2, 3, 4, 5, 6];
+export type GrNavbarHeadingLevel = typeof GR_NAVBAR_HEADING_LEVELS[number];
+export declare const navbarTitleClass = "m-0 text-[length:var(--gr-text-sm)] leading-[var(--gr-leading-sm)] font-700";
 export declare function grNavbarRootClass(sticky: boolean): string;

package/dist/types/components/GrNavbar/index.d.ts

@@ -1,6 +1,7 @@
 export { default } from './GrNavbar.vue';
 export { default as GrNavbar } from './GrNavbar.vue';
 export type { GrNavbarProps } from './GrNavbar.vue';
+export type { GrNavbarHeadingLevel } from './grNavbarStyles';
 export type { GrNavbarConfigurableProps } from './defaults';
 export { grNavbarConfig } from './config';
 export { grNavbarSafelist } from './safelist';

package/dist/types/components/GrOtpInput/GrOtpInput.vue.d.ts

@@ -0,0 +1,164 @@
+import { type GrOtpInputSize } from './grOtpInputStyles';
+import { type GrOtpInputType } from './otpValue';
+export type { GrOtpInputSize } from './grOtpInputStyles';
+export type { GrOtpInputType } from './otpValue';
+export interface GrOtpInputProps {
+    /** Код целиком, без разделителей. */
+    modelValue?: string;
+    /** Число ячеек. */
+    length?: number;
+    /** Допустимый алфавит и раскладка мобильной клавиатуры. */
+    type?: GrOtpInputType;
+    /** Свой алфавит регуляркой на **один символ**. Перекрывает `type`. */
+    pattern?: string;
+    /** Разбивка на группы: `[3, 3]` рисует `123 – 456`. Сумма обязана равняться `length`. */
+    groups?: number[];
+    /** Точки вместо символов — сценарий PIN. На `modelValue` не влияет. */
+    masked?: boolean;
+    /** Знак в пустой ячейке. */
+    placeholder?: string;
+    size?: GrOtpInputSize;
+    autofocus?: boolean;
+    /** `autocomplete="one-time-code"`: код из SMS подставляется на iOS и macOS. */
+    oneTimeCode?: boolean;
+    /**
+     * Приём кода из SMS на Android через WebOTP. Выключен: требует HTTPS и
+     * особого хвоста в тексте сообщения, который добавляет бэкенд.
+     */
+    webOtp?: boolean;
+    /** Имя поля для нативной отправки формы. */
+    name?: string;
+    /** `id` формы, если поле лежит вне неё. */
+    form?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    invalid?: boolean;
+    required?: boolean;
+    ariaLabel?: string;
+}
+export interface GrOtpInputEmits {
+    (e: 'update:modelValue', value: string): void;
+    (e: 'change', value: string): void;
+    (e: 'focus', event: FocusEvent): void;
+    (e: 'blur', event: FocusEvent): void;
+    /** Код набран целиком. Точка автосабмита. */
+    (e: 'complete', value: string): void;
+}
+type __VLS_Slots = {
+    /** Своё оформление ячейки. Размер и рамку по-прежнему держит компонент. */
+    cell?: (props: {
+        char: string;
+        index: number;
+        active: boolean;
+        filled: boolean;
+        masked: boolean;
+    }) => any;
+    /** Знак между группами. По умолчанию — тире. */
+    separator?: (props: {
+        index: number;
+    }) => any;
+};
+declare function focus(): void;
+declare function blur(): void;
+/** Штатный сценарий: сервер отверг код, поле чистится и снова ждёт ввода. */
+declare function clear(): void;
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrOtpInputProps>, {
+    modelValue: string;
+    length: undefined;
+    type: string;
+    pattern: undefined;
+    groups: undefined;
+    masked: undefined;
+    placeholder: string;
+    size: undefined;
+    autofocus: boolean;
+    oneTimeCode: boolean;
+    webOtp: boolean;
+    name: undefined;
+    form: undefined;
+    disabled: boolean;
+    readonly: boolean;
+    invalid: boolean;
+    required: boolean;
+    ariaLabel: undefined;
+}>>, {
+    focus: typeof focus;
+    blur: typeof blur;
+    clear: typeof clear;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => void;
+    change: (value: string) => void;
+    focus: (event: FocusEvent) => void;
+    blur: (event: FocusEvent) => void;
+    complete: (value: string) => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrOtpInputProps>, {
+    modelValue: string;
+    length: undefined;
+    type: string;
+    pattern: undefined;
+    groups: undefined;
+    masked: undefined;
+    placeholder: string;
+    size: undefined;
+    autofocus: boolean;
+    oneTimeCode: boolean;
+    webOtp: boolean;
+    name: undefined;
+    form: undefined;
+    disabled: boolean;
+    readonly: boolean;
+    invalid: boolean;
+    required: boolean;
+    ariaLabel: undefined;
+}>>> & Readonly<{
+    onBlur?: ((event: FocusEvent) => any) | undefined;
+    onChange?: ((value: string) => any) | undefined;
+    onFocus?: ((event: FocusEvent) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onComplete?: ((value: string) => any) | undefined;
+}>, {
+    length: number;
+    disabled: boolean;
+    readonly: boolean;
+    form: string;
+    pattern: string;
+    type: GrOtpInputType;
+    size: GrOtpInputSize;
+    masked: boolean;
+    name: string;
+    invalid: boolean;
+    ariaLabel: string;
+    modelValue: string;
+    required: boolean;
+    placeholder: string;
+    groups: number[];
+    autofocus: boolean;
+    oneTimeCode: boolean;
+    webOtp: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<Required<T>[K]>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_PrettifyLocal<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/types/components/GrOtpInput/config.d.ts

@@ -0,0 +1 @@
+export declare const grOtpInputConfig: import("@feugene/unocss-preset-granular/contract").GranularComponentDescriptor<"GrOtpInput">;

package/dist/types/components/GrOtpInput/defaults.d.ts

@@ -0,0 +1,15 @@
+import type { GrComponentSize } from '../GrConfigProvider/context';
+/**
+ * Пропы `GrOtpInput`, настраиваемые глобально через `componentDefaults`.
+ * Только оформление и поведение по умолчанию — см. `GrButton/defaults.ts`.
+ */
+export interface GrOtpInputConfigurableProps {
+    size: GrComponentSize;
+    length: number;
+    masked: boolean;
+}
+declare module '../../composables/useGrComponentConfig' {
+    interface GrComponentDefaultsRegistry {
+        GrOtpInput: GrOtpInputConfigurableProps;
+    }
+}

package/dist/types/components/GrOtpInput/grOtpInputStyles.d.ts

@@ -0,0 +1,62 @@
+import type { GrComponentSize } from '../shared/sizes';
+export type GrOtpInputSize = GrComponentSize;
+/**
+ * `w-fit` тут не украшение. Гридовый или флексовый родитель **блокифицирует**
+ * `inline-flex`, и ряд растягивался на всю колонку: сами ячейки оставались на
+ * месте, а невидимое поле поверх них ловило клики далеко справа от кода.
+ */
+export declare const rootBaseClass = "relative inline-flex w-fit items-center";
+export declare const rootGaps: Record<GrOtpInputSize, string>;
+/**
+ * Настоящее поле лежит **поверх** ряда ячеек и невидимо: текст, каретка и
+ * подсветка выделения прозрачны, всё видимое рисуют ячейки.
+ *
+ * Оно остаётся полноценным `<input>`, и потому даром достаются вставка,
+ * автозаполнение кода из SMS, отмена, выделение и вся каретка со стрелками —
+ * см. `docs/components/GrOtpInput.md`.
+ *
+ * `z-index` не нужен: поле позиционировано, ячейки — нет, а позиционированный
+ * элемент и так красится поверх статичных соседей. Литерал слоя тут был бы
+ * лишней записью в шкале `docs/z-index.md`.
+ */
+export declare const fieldClass = "absolute inset-0 w-full cursor-text bg-transparent text-transparent [caret-color:transparent] outline-none selection:bg-transparent disabled:cursor-not-allowed";
+export declare const cellBaseClass = "relative inline-flex shrink-0 items-center justify-center rounded-[var(--gr-radius-control)] border [font-variant-numeric:tabular-nums] transition-colors duration-[var(--gr-duration-fast)]";
+/**
+ * Сторона ячейки повторяет высоту `GrInput` на той же ступени: код стоит в
+ * форме рядом с полями, и ряд обязан садиться с ними в одну линию.
+ *
+ * Через хук, а не классом-числом: квадратная ячейка — решение оформления, и
+ * макет вправе сделать её шире.
+ */
+export declare const cellSizes: Record<GrOtpInputSize, string>;
+export declare const cellIdleClass = "border-[var(--gr-brd)] bg-[var(--gr-bg)] text-[var(--gr-fg)]";
+/** Активная ячейка — та, в которой стоит каретка, и только пока поле в фокусе. */
+export declare const cellActiveClass = "border-[var(--gr-otp-input-active-brd,var(--gr-primary))] ring-2 ring-[var(--gr-ring)]";
+/**
+ * Вердикт валидации красится своей ролью, а не декоративным `danger`: тема
+ * вправе развести подсветку по решению разработчика и ошибку формы.
+ */
+export declare const cellInvalidClass = "border-[var(--gr-invalid-brd)] bg-[var(--gr-bg)] text-[var(--gr-fg)]";
+export declare const cellInvalidActiveClass = "ring-2 ring-[var(--gr-invalid-ring)]";
+/**
+ * Недоступность гасится фоном, а не `opacity`: прозрачность разбавляет
+ * выверенные на AA токены текста и роняет контраст кода.
+ */
+export declare const cellDisabledClass = "border-[var(--gr-disabled-brd)] bg-[var(--gr-disabled-bg)] text-[var(--gr-disabled-fg)]";
+export declare const placeholderClass = "text-[var(--gr-muted-fg)]";
+/**
+ * Каретка рисуется своей, потому что настоящая скрыта вместе с текстом.
+ * Мигание — CSS-анимация, значит подчиняется глобальному клампу движения
+ * пакета (`docs/motion.md`), а не собственному таймеру.
+ */
+export declare const caretClass = "pointer-events-none absolute h-[1em] w-px bg-[var(--gr-otp-input-caret,var(--gr-primary))]";
+export declare const separatorClass = "select-none px-0.5 text-[var(--gr-muted-fg)]";
+export declare function grOtpInputRootClass(size: GrOtpInputSize): string;
+type GrOtpInputCellClassOptions = {
+    size: GrOtpInputSize;
+    active: boolean;
+    invalid: boolean;
+    disabled: boolean;
+};
+export declare function grOtpInputCellClass(options: GrOtpInputCellClassOptions): string;
+export {};

package/dist/types/components/GrOtpInput/index.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentExposed } from '../shared/instance';
+import type GrOtpInputComponent from './GrOtpInput.vue';
+export { default } from './GrOtpInput.vue';
+export { default as GrOtpInput } from './GrOtpInput.vue';
+export { grOtpInputConfig } from './config';
+export type { GrOtpInputConfigurableProps } from './defaults';
+export { grOtpInputSafelist } from './safelist';
+export type { GrOtpInputEmits, GrOtpInputProps, GrOtpInputSize, GrOtpInputType } from './GrOtpInput.vue';
+export type GrOtpInputInstance = ComponentExposed<typeof GrOtpInputComponent>;

package/dist/types/components/GrOtpInput/otpValue.d.ts

@@ -0,0 +1,71 @@
+/**
+ * Чистая логика значения OTP-поля: алфавит, нормализация ввода и разбивка на
+ * группы. Без Vue и без DOM — здесь дёшево перебрать края, а края тут и есть
+ * весь риск.
+ */
+export declare const GR_OTP_INPUT_TYPES: readonly ["numeric", "alphanumeric", "text"];
+export type GrOtpInputType = typeof GR_OTP_INPUT_TYPES[number];
+/**
+ * Алфавиты по типу. `text` — любой непробельный символ: пробел в коде не несёт
+ * смысла, а при вставке из мессенджера приходит вместе с ним.
+ */
+export declare const OTP_TYPE_PATTERNS: Record<GrOtpInputType, string>;
+/** Раскладка клавиатуры на мобильном: цифровой блок только там, где он уместен. */
+export declare const OTP_TYPE_INPUT_MODES: Record<GrOtpInputType, 'numeric' | 'text'>;
+export type OtpMatcher = (char: string) => boolean;
+/**
+ * Матчер алфавита. Своя регулярка потребителя перекрывает тип; сломанная —
+ * повод сказать об этом в dev и вернуться к типу, а не уронить рендер.
+ */
+export declare function createOtpMatcher(type: GrOtpInputType, pattern?: string): OtpMatcher;
+export interface NormalizeOtpOptions {
+    /** Значение до правки: по нему считается, сколько символов вставлено. */
+    previous: string;
+    /** Сырое содержимое поля после события `input`. */
+    raw: string;
+    /** Каретка в координатах **сырой** строки. */
+    caret: number;
+    length: number;
+    matcher: OtpMatcher;
+    /** Приводить ли к верхнему регистру: коды печатают капсом. */
+    uppercase: boolean;
+}
+export interface NormalizedOtp {
+    value: string;
+    caret: number;
+}
+/**
+ * Свести сырое содержимое поля к коду фиксированной длины.
+ *
+ * Одна функция на все источники ввода — символ с клавиатуры, вставка из буфера,
+ * подстановка кода из SMS, — потому что различить их по событию нельзя:
+ * мобильные клавиатуры и автозаполнение присылают целую строку одним `input`.
+ *
+ * Три шага, и каждый закрывает свой отказ:
+ *
+ * 1. **Отсев чужих символов с переносом каретки.** Индексы после отсева
+ *    съезжают, и каретку надо считать в новых координатах, иначе вставка
+ *    `123-456` поставит её на два символа правее конца.
+ * 2. **Печать заменяет, а не сдвигает.** Ячейка держит ровно один символ, и
+ *    напечатанное в неё занимает её место, а хвост кода остаётся где стоял.
+ *    Правило безусловное, а не «когда поле заполнено»: иначе одно и то же
+ *    нажатие в начале кода то заменяло бы символ, то двигало весь остаток —
+ *    в зависимости от того, сколько ячеек занято.
+ * 3. **Обрезка по длине.** Вставка длиннее поля режется со стороны каретки:
+ *    выкусывать за ней уже нечего, а сдвигать набранное нельзя.
+ */
+export declare function normalizeOtpInput(options: NormalizeOtpOptions): NormalizedOtp;
+/** Отсев без каретки — для значения, пришедшего из `v-model`. */
+export declare function sanitizeOtpValue(value: string, options: {
+    length: number;
+    matcher: OtpMatcher;
+    uppercase: boolean;
+}): string;
+/**
+ * Индексы ячеек, **перед** которыми стоит разделитель.
+ *
+ * Разбивка, не сходящаяся с длиной, — ошибка потребителя, а не повод рисовать
+ * половину: группы игнорируются целиком, о чём говорит предупреждение в вызове.
+ */
+export declare function otpSeparatorIndexes(length: number, groups?: number[]): Set<number>;
+export declare function isOtpGroupsValid(length: number, groups?: number[]): boolean;

package/dist/types/components/GrOtpInput/safelist.d.ts

@@ -0,0 +1,7 @@
+export declare const grOtpInputClassTokens: {
+    readonly root: readonly string[];
+    readonly field: string[];
+    readonly cell: readonly string[];
+    readonly decoration: readonly string[];
+};
+export declare const grOtpInputSafelist: string[];

package/dist/types/components/GrSelect/composables/useSelectPanelItems.d.ts

@@ -1,42 +1,16 @@
 import type { ComputedRef } from 'vue';
+import type { OptionPanelItem, OptionPanelOptionRow, OptionPanelRow } from '../../shared/optionPanel';
 import type { GrSelectOption, GrSelectOptionGroup, GrSelectOptionOrGroup, GrSelectValue } from '../grSelectStyles';
 /**
  * Элемент рендера панели: либо заголовок группы, либо опция.
- * Группировка сохраняется, фильтрация по запросу скрывает пустые группы.
+ *
+ * Типы — алиасы общей машинерии (`shared/optionPanel`): алгоритм у панели
+ * `GrSelect` и `GrAutocomplete` один, и копия разошлась бы с оригиналом молча.
+ * Имена остаются своими, потому что они публичные.
  */
-export type GrSelectPanelItem<TValue extends GrSelectValue> = {
-    kind: 'group';
-    label: string;
-    key: string;
-}
-/** `groupKey` связывает опцию с заголовком её группы для скринридера. */
- | {
-    kind: 'option';
-    option: GrSelectOption<TValue>;
-    key: string;
-    groupKey?: string;
-};
-export type GrSelectPanelOptionRow<TValue extends GrSelectValue> = {
-    option: GrSelectOption<TValue>;
-    key: string;
-    index: number;
-};
-export type GrSelectPanelRow<TValue extends GrSelectValue> = {
-    kind: 'group';
-    label: string;
-    key: string;
-    options: GrSelectPanelOptionRow<TValue>[];
-    /**
-     * Есть ли в этой отрисовке видимый заголовок. При виртуализации окно может
-     * начаться серединой группы: обёртка нужна всё равно, а заголовка нет —
-     * имя тогда идёт в `aria-label`.
-     */
-    labelVisible?: boolean;
-    /** Позиция заголовка в `panelItems` — по ней его замеряет виртуализатор. */
-    labelIndex?: number;
-} | ({
-    kind: 'option';
-} & GrSelectPanelOptionRow<TValue>);
+export type GrSelectPanelItem<TValue extends GrSelectValue> = OptionPanelItem<GrSelectOption<TValue>>;
+export type GrSelectPanelOptionRow<TValue extends GrSelectValue> = OptionPanelOptionRow<GrSelectOption<TValue>>;
+export type GrSelectPanelRow<TValue extends GrSelectValue> = OptionPanelRow<GrSelectOption<TValue>>;
 /**
  * Состав панели `GrSelect`: плоский набор строк, их группировка и признак
  * «набранное можно добавить».

package/dist/types/components/GrSelect/composables/useSelectVirtualization.d.ts

@@ -1,6 +1,13 @@
 import type { ComputedRef, Ref } from 'vue';
 import type { GrSelectValue } from '../grSelectStyles';
 import type { GrSelectPanelItem, GrSelectPanelRow } from './useSelectPanelItems';
+/**
+ * Виртуализация панели `GrSelect` — тонкая обёртка над общей машинерией
+ * (`shared/optionPanel`): алгоритм тот же, что у `GrAutocomplete`, и держать
+ * его в двух местах значило бы разойтись молча.
+ *
+ * Своё здесь только имя ведущей строки: у селекта это «Add …».
+ */
 export interface UseSelectVirtualizationOptions<TValue extends GrSelectValue> {
     panelItems: ComputedRef<GrSelectPanelItem<TValue>[]>;
     panelRows: ComputedRef<GrSelectPanelRow<TValue>[]>;

package/dist/types/components/GrSelect/grSelectStyles.d.ts

@@ -122,7 +122,7 @@ export declare function grSelectTriggerClass(options: {
     state?: GrSelectState;
     invalid?: boolean;
 }): string;
-export declare const grSelectPanelClasses = "rounded-[var(--gr-radius-xl)] border border-[var(--gr-brd)] bg-[var(--gr-popover)] text-[var(--gr-popover-fg)] shadow-[var(--gr-shadow-2)] overflow-hidden";
+export declare const grSelectPanelClasses = "rounded-[var(--gr-radius-xl)] border border-[var(--gr-brd)] bg-[var(--gr-popover)] text-[var(--gr-popover-fg)] shadow-[var(--gr-shadow-2)] flex flex-col max-h-[var(--gr-floating-available-height,100vh)] overflow-hidden";
 export declare const selectOptionBaseClass = "rounded-[var(--gr-radius-md)] px-3 py-2 text-left text-[length:var(--gr-text-sm)] leading-[var(--gr-leading-sm)]";
 export declare const selectOptionLinkWidthClass = "block min-w-full w-max whitespace-nowrap";
 export declare const selectOptionWidthClass = "w-full";

package/dist/types/components/GrSidebar/GrSidebar.vue.d.ts

@@ -24,9 +24,21 @@ export interface GrSidebarProps {
     landmark?: GrSidebarLandmark;
     /** Имя лендмарка: без него две панели на странице неразличимы. */
     ariaLabel?: string;
+    /**
+     * Панель как модальный слой поверх страницы: подложка, `Esc`, ловушка фокуса,
+     * блокировка прокрутки. Для узкого экрана, где колонке места нет.
+     *
+     * Когда включать — решает приложение: своей системы брейкпоинтов у пакета нет,
+     * а спрашивать среду в `setup` нельзя — первый клиентский рендер разошёлся бы
+     * с серверным и сломал гидрацию.
+     */
+    overlay?: boolean;
+    /** Открыт ли слой. Поддерживает `v-model:open`; без `overlay` не значит ничего. */
+    open?: boolean;
 }
 export interface GrSidebarEmits {
     (e: 'update:collapsed', value: boolean): void;
+    (e: 'update:open', value: boolean): void;
 }
 type __VLS_Slots = {
     /** Содержимое панели: навигация, группы, произвольная разметка. */
@@ -47,8 +59,11 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     position: string;
     landmark: string;
     ariaLabel: undefined;
+    overlay: boolean;
+    open: boolean;
 }>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:collapsed": (value: boolean) => void;
+    "update:open": (value: boolean) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrSidebarProps>, {
     title: undefined;
     subtitle: undefined;
@@ -60,12 +75,17 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     position: string;
     landmark: string;
     ariaLabel: undefined;
+    overlay: boolean;
+    open: boolean;
 }>>> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
     "onUpdate:collapsed"?: ((value: boolean) => any) | undefined;
 }>, {
+    overlay: boolean;
     title: string;
     width: string;
     position: GrSidebarPosition;
+    open: boolean;
     ariaLabel: string;
     landmark: GrSidebarLandmark;
     subtitle: string;

package/dist/types/components/GrSidebar/GrSidebarItem.vue.d.ts

@@ -4,8 +4,9 @@
  * Контракт:
  * - развёрнутая панель — `[иконка] метка [бейдж]`;
  * - свёрнутая панель — только иконка; если иконки нет, показывается ПЕРВАЯ БУКВА
- *   метки (uppercase). В свёрнутом виде метка уходит в `title`/`aria-label` для
- *   доступности и tooltip.
+ *   метки (uppercase). Имя пункту даёт `aria-label`, а подпись показывает
+ *   `GrTooltip`: нативный `title` появлялся только по наведению, то есть с
+ *   клавиатуры свёрнутую панель было не прочесть.
  *
  * Корневой тег: `as` → `<a href>` → `<button>` (в этом порядке).
  */
@@ -19,29 +20,57 @@ export interface GrSidebarItemProps {
     active?: boolean;
     disabled?: boolean;
     badge?: string | number;
+    /**
+     * Раскрыто ли поддерево. Поддерживает `v-model:expanded`; без пропа пункт
+     * ведёт себя сам.
+     */
+    expanded?: boolean;
+    /** Начальное состояние поддерева, когда `expanded` не контролируется. */
+    defaultExpanded?: boolean;
 }
-declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrSidebarItemProps>, {
+export interface GrSidebarItemEmits {
+    (e: 'update:expanded', value: boolean): void;
+}
+type __VLS_Slots = {
+    /**
+     * Вложенные пункты. Их наличие превращает пункт в раскрывающийся: он теряет
+     * роль ссылки и становится переключателем поддерева.
+     */
+    default?: () => unknown;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrSidebarItemProps>, {
     icon: undefined;
     href: undefined;
     as: undefined;
     active: boolean;
     disabled: boolean;
     badge: undefined;
-}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrSidebarItemProps>, {
+    expanded: undefined;
+    defaultExpanded: boolean;
+}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:expanded": (value: boolean) => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrSidebarItemProps>, {
     icon: undefined;
     href: undefined;
     as: undefined;
     active: boolean;
     disabled: boolean;
     badge: undefined;
-}>>> & Readonly<{}>, {
+    expanded: undefined;
+    defaultExpanded: boolean;
+}>>> & Readonly<{
+    "onUpdate:expanded"?: ((value: boolean) => any) | undefined;
+}>, {
     disabled: boolean;
     icon: string | Component;
     href: string;
+    expanded: boolean;
     active: boolean;
     as: string | Component;
     badge: string | number;
+    defaultExpanded: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
 type __VLS_TypePropsToOption<T> = {
@@ -57,6 +86,11 @@ type __VLS_WithDefaults<P, D> = {
         default: D[K];
     }> : P[K];
 };
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];
 } : {

package/dist/types/components/GrSidebar/grSidebarStyles.d.ts

@@ -46,3 +46,35 @@ export declare function grSidebarItemClass(options: {
     disabled: boolean;
     active: boolean;
 }): string;
+/**
+ * Гнездо вложенного пункта: сам пункт плюс поддерево под ним. Обёртка нужна
+ * потому, что двух корней у компонента быть не может — при них ломается проброс
+ * атрибутов.
+ */
+export declare const itemNestClass = "flex flex-col";
+/** Поддерево подпунктов. Отступ уровня задаётся строкам, а не контейнеру. */
+export declare const itemChildrenClass = "flex flex-col";
+/**
+ * Шеврон раскрытия. Поворотом показывает состояние, но смысла не несёт: его
+ * сообщает `aria-expanded` на самом пункте, поэтому от диктора шеврон скрыт.
+ */
+export declare const itemChevronClass = "ml-auto h-4 w-4 shrink-0 text-[var(--gr-muted-fg)] transition-transform duration-[var(--gr-duration-fast)]";
+export declare const itemChevronExpandedClass = "rotate-90";
+/**
+ * Отступ уровня вложенности. Считается от базового `px-3` пункта: своим
+ * `padding` строка отодвигается целиком, вместе с подсветкой и кольцом фокуса,
+ * — сдвинь мы только текст, активный фон уезжал бы под соседний уровень.
+ */
+export declare function itemNestIndent(level: number): string | undefined;
+/**
+ * Корень модального слоя. В обычном режиме обёртка остаётся в разметке, но
+ * `display: contents` убирает её из раскладки — так панель и её шапка описаны
+ * один раз на оба режима, а не продублированы.
+ */
+export declare const layerRootClass = "fixed inset-0";
+export declare const layerPassThroughClass = "contents";
+export declare const layerBackdropClass = "fixed inset-0 bg-[var(--gr-overlay-bg)]";
+/** Панель слоя прижата к своему краю и тянется на всю высоту экрана. */
+export declare const layerPanelPositions: Record<GrSidebarPosition, string>;
+/** Откуда выезжает панель: из-за своего края, а не из глубины экрана. */
+export declare const layerPanelEnterFrom: Record<GrSidebarPosition, string>;

package/dist/types/components/GrSidebar/index.d.ts

@@ -6,4 +6,4 @@ export { grSidebarConfig } from './config';
 export type { GrSidebarLandmark, GrSidebarPosition } from './grSidebarStyles';
 export { grSidebarSafelist } from './safelist';
 export type { GrSidebarEmits } from './GrSidebar.vue';
-export type { GrSidebarItemProps } from './GrSidebarItem.vue';
+export type { GrSidebarItemEmits, GrSidebarItemProps } from './GrSidebarItem.vue';