@feugene/granularity 0.12.0 → 0.16.0

package/dist/types/src/components/GrDialogService/store.d.ts

@@ -1,8 +1,11 @@
+import type { AppContext, Raw } from 'vue';
+import type { GrConfigContext } from '../GrConfigProvider/context';
+import type { GranularityI18nLike } from '../../internal/granularityI18n';
 import type { DialogBaseOptions, DialogKind, DialogOnConfirm, DialogResult } from './types';
 /**
  * Внутреннее описание одного запроса диалога в очереди. Создаётся методами
  * сервиса (`confirm`/`alert`/`prompt`/`open`) и потребляется хостом
- * (`GrDialogServiceHost`), который рендерит «голову» очереди (FIFO).
+ * (`GrDialogServiceHost`), который рендерит видимую часть очереди.
  */
 export interface DialogRequest {
     id: string;
@@ -10,13 +13,99 @@ export interface DialogRequest {
     message: string;
     options: DialogBaseOptions;
     onConfirm?: DialogOnConfirm<any>;
+    /** Позиция среди ожидающих: больше — раньше. При равенстве порядок FIFO. */
+    priority: number;
+    /**
+     * Заявка создана из `onConfirm` уже открытого диалога и показывается **поверх**
+     * него, а не за ним. Без этого вложенный вызов вставал бы в очередь за тем,
+     * кто его ждёт: внешнее окно висело бы в загрузке, а промис не резолвился бы
+     * никогда.
+     */
+    nested: boolean;
+    /**
+     * Заявка уже завершена. Флаг живёт на самой заявке, а не на хосте: завершить
+     * её могут трое (кнопка в окне, `close()` промиса, `closeAll()`), и общее
+     * состояние на хосте означало бы, что второй и третий путь про первый не
+     * знают.
+     */
+    settled: boolean;
     /** Резолвит промис вызова детальным результатом `{ action, value }`. */
     resolve: (result: DialogResult<any>) => void;
+    /**
+     * Конфиг и i18n, захваченные в месте вызова сервиса (в `setup`, где вызывающий
+     * компонент ещё находится внутри дерева провайдера). Хост монтируется в
+     * `document.body` вне дерева, поэтому сам их не увидит — см.
+     * `SPEC-GrConfig-resolver.md`.
+     *
+     * Лежат в запросе, а не в состоянии сервиса: два поддерева с разными
+     * провайдерами должны получать каждое свой конфиг.
+     *
+     * `Raw<…>` обязателен: очередь — `reactive`, а он разворачивает вложенные рефы.
+     * Без `markRaw` контекст превратился бы в объект значений, `size.value` стало
+     * бы `undefined`, и мост молча перестал бы работать.
+     */
+    config?: Raw<GrConfigContext> | null;
+    i18n?: Raw<GranularityI18nLike> | null;
+}
+/** Контекст, захваченный вызовом `useDialogService()` внутри `setup`. */
+export interface CapturedDialogContext {
+    config: Raw<GrConfigContext> | null;
+    i18n: Raw<GranularityI18nLike> | null;
 }
 /**
- * Модульный синглтон очереди диалогов: единый источник правды для всех
- * вызовов сервиса. Хост-компонент рендерит только `queue[0]` — это
- * сериализует диалоги (FIFO) и исключает конкуренцию за фокус-трап.
+ * Состояние одного инстанса сервиса: очередь, смонтированный хост и захваченный
+ * контекст приложения. Живёт либо в приложении (через
+ * `granularityDialogServicePlugin`), либо в ленивом модульном фолбэке для
+ * простых SPA — см. `useDialogService.ts`.
  */
-export declare const dialogQueue: import("vue").Reactive<DialogRequest[]>;
+export interface DialogServiceState {
+    /** Очередь заявок. Видимую часть выбирает хост, остальные ждут. */
+    queue: DialogRequest[];
+    mounted: boolean;
+    container: HTMLElement | null;
+    appContext: AppContext | null;
+    lastCapturedContext: CapturedDialogContext | null;
+    contextlessWarned: boolean;
+    /**
+     * Заявки, чей `onConfirm` сейчас в полёте, от внешней к самой глубокой.
+     * По ним определяется вложенность нового вызова.
+     */
+    inFlight: DialogRequest[];
+}
+export declare function createDialogServiceState(): DialogServiceState;
 export declare function makeDialogId(): string;
+/**
+ * Видимая часть очереди: голова и непрерывный хвост вложенных заявок за ней.
+ * Всё остальное ждёт — обычные вызовы по-прежнему идут по одному, чтобы три
+ * алерта из цикла не легли стопкой.
+ */
+export declare function visibleDialogRequests(state: DialogServiceState): DialogRequest[];
+/**
+ * Ставит заявку в очередь. Единственное место, где решается её позиция:
+ *
+ * - вложенная (создана, пока `onConfirm` другой заявки в полёте) встаёт сразу
+ *   за своим родителем и показывается поверх него;
+ * - обычная — перед всеми ожидающими с меньшим приоритетом; показанные окна не
+ *   трогаются, выдёргивать фокус-ловушку из-под пользователя нельзя.
+ */
+export declare function enqueueDialogRequest(state: DialogServiceState, request: DialogRequest): void;
+/**
+ * Заявка входит в «полёт»: пока её `onConfirm` не вернулся, новые вызовы
+ * считаются вложенными в неё.
+ */
+export declare function startDialogInFlight(state: DialogServiceState, request: DialogRequest): void;
+/** Заявка вышла из полёта (колбэк вернулся или окно размонтировано). */
+export declare function finishDialogInFlight(state: DialogServiceState, request: DialogRequest): void;
+/**
+ * Единственный способ завершить заявку: идемпотентно резолвит промис и снимает
+ * её из очереди.
+ *
+ * `removeFromQueue: false` нужен окну: оно гасит себя и даёт анимации закрытия
+ * доиграть, прежде чем заявка исчезнет из очереди. Корректность от этой
+ * отсрочки не зависит: повторное завершение отсекается флагом на заявке.
+ */
+export declare function settleDialogRequest(state: DialogServiceState, request: DialogRequest, result: DialogResult<any>, { removeFromQueue }?: {
+    removeFromQueue?: boolean;
+}): boolean;
+/** Снимает заявку из очереди, если она ещё там. */
+export declare function removeDialogRequest(state: DialogServiceState, request: DialogRequest): void;

package/dist/types/src/components/GrDialogService/types.d.ts

@@ -1,6 +1,8 @@
-import type { AppContext } from 'vue';
+import type { AppContext, InputHTMLAttributes } from 'vue';
 import type { GrButtonSize, GrButtonTone, GrButtonVariant } from '../GrButton';
 import type { GrDialogSectionConfig, GrDialogSize } from '../GrDialog';
+import type { GrFormRule } from '../GrForm';
+import type { GrPromptDialogProps } from '../GrPromptDialog';
 import type { ResponseErrorInfo, ResponseErrorParser, ResponseErrorParserPresets, ResponseErrorTexts } from '../GrResponseErrorBanner';
 /** Действие, которым был закрыт диалог. */
 export type DialogCloseAction = 'confirm' | 'cancel' | 'close';
@@ -85,6 +87,12 @@ export interface DialogBaseOptions extends DialogErrorOptions {
     confirmTone?: GrButtonTone;
     /** Внешний `AbortSignal`: при abort диалог закрывается с `action: 'close'`. */
     signal?: AbortSignal;
+    /**
+     * Место в очереди среди **ожидающих**: больше — раньше, по умолчанию `0`, при
+     * равенстве порядок FIFO. Уже показанное окно не прерывается — выдёргивать
+     * фокус-ловушку из-под пользователя хуже, чем задержка на одно окно.
+     */
+    priority?: number;
     /** Наследование контекста приложения (i18n / тема / `granular-provider`). */
     appContext?: AppContext | null;
 }
@@ -103,6 +111,19 @@ export interface DialogPromptOptions extends DialogBaseOptions {
     placeholder?: string;
     required?: boolean;
     requiredErrorText?: string;
+    /** Тип однострочного поля (`email`, `password`, …). */
+    inputType?: GrPromptDialogProps['inputType'];
+    /** Программная клавиатура на мобильных. */
+    inputmode?: InputHTMLAttributes['inputmode'];
+    /** Ограничение длины; со `showCount` рисуется счётчик. */
+    maxlength?: number;
+    showCount?: boolean;
+    /** Многострочный ввод вместо однострочного. */
+    multiline?: boolean;
+    rows?: number;
+    autosize?: boolean;
+    /** Правила проверки значения — те же, что у `GrForm`. */
+    rules?: GrFormRule | GrFormRule[];
     onConfirm?: DialogOnConfirm<string>;
 }
 /** Результат низкоуровневого `open()`. */

package/dist/types/src/components/GrDialogService/useDialogService.d.ts

@@ -1,5 +1,35 @@
+import type { App, InjectionKey } from 'vue';
+import type { DialogServiceState } from './store';
 import type { DialogService, DialogServiceDefaults } from './types';
-/** Тестовая/служебная очистка смонтированного хоста. */
+/**
+ * `useDialogService` — императивный сервис диалогов (в духе Element Plus
+ * `ElMessageBox`). Позволяет вызывать `confirm`/`alert`/`prompt` из `<script>`
+ * или `.ts` без вставки компонента в шаблон.
+ *
+ * Поверх существующих `GrConfirmDialog`/`GrPromptDialog`: лениво монтирует
+ * единый хост (`GrDialogServiceHost`) в `document.body`, наследуя контекст
+ * приложения (i18n / тема / `granular-provider`).
+ */
+/** Ключ provide/inject для app-scoped состояния сервиса (устанавливает плагин ниже). */
+export declare const GRANULARITY_DIALOG_SERVICE_STATE: InjectionKey<DialogServiceState>;
+/**
+ * Vue-плагин: даёт каждому приложению собственное состояние сервиса и снимает
+ * его хост вместе с приложением. Обязателен для нескольких Vue-приложений на
+ * одной странице (микрофронтенды — иначе они делят одну очередь и один хост) и
+ * для HMR, где контейнер прошлого приложения иначе остаётся в `document.body`.
+ *
+ * ```ts
+ * app.use(granularityDialogServicePlugin)
+ * ```
+ */
+export declare const granularityDialogServicePlugin: {
+    install(app: App): void;
+};
+/**
+ * Тестовая/служебная очистка смонтированного хоста. Работает над тем же
+ * состоянием, что и сам сервис: app-scoped при вызове из `setup` или при
+ * единственном зарегистрированном приложении, иначе — модульным.
+ */
 export declare function teardownDialogService(): void;
 /**
  * Создаёт сервис диалогов. Опциональные `defaults` применяются ко всем

package/dist/types/src/components/GrDivider/GrDivider.vue.d.ts

@@ -3,32 +3,67 @@
  *
  * - `orientation="horizontal"` (по умолчанию) — линия на всю ширину; с `label`
  *   или default-слотом рисует текст по центру/краю между отрезками линии.
- * - `orientation="vertical"` — тонкая вертикальная линия (для inline-разделения,
- *   например в тулбарах).
+ * - `orientation="vertical"` — тонкая вертикальная линия. Растягивается по
+ *   высоте flex-родителя; вне flex-контекста высоту задаёт `length`.
+ *
+ * A11y: `role="separator"` делает потомков презентационными, поэтому подпись
+ * скринридеру не достаётся — имя разделителя приходит через `aria-label`.
  */
-export type GrDividerOrientation = 'horizontal' | 'vertical';
-export type GrDividerAlign = 'start' | 'center' | 'end';
-type __VLS_Props = {
+import { type GrDividerAlign, type GrDividerOrientation, type GrDividerSpacing, type GrDividerVariant } from './grDividerStyles';
+export interface GrDividerProps {
     orientation?: GrDividerOrientation;
     label?: string;
     align?: GrDividerAlign;
-};
+    /** Начертание линии. Не задано — берётся из `GrConfigProvider`, иначе `solid`. */
+    variant?: GrDividerVariant;
+    /** Отступы вокруг разделителя. Не задано — из `GrConfigProvider`, иначе `none`. */
+    spacing?: GrDividerSpacing;
+    /** Толщина линии. Число трактуется как пиксели. */
+    thickness?: number | string;
+    /**
+     * Длина линии: высота вертикального разделителя, ширина горизонтального.
+     * Нужна вертикальному вне flex-родителя — там ему не от чего растянуться.
+     */
+    length?: number | string;
+    /**
+     * Имя разделителя для скринридера. Подпись из слота строкой не выразить,
+     * поэтому имя задаётся отдельно; при `label` оно берётся из него.
+     */
+    ariaLabel?: string;
+}
+import './defaults';
+export type { GrDividerAlign, GrDividerOrientation, GrDividerSpacing, GrDividerVariant };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<__VLS_Props>, {
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrDividerProps>, {
     orientation: string;
     label: undefined;
     align: string;
-}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<__VLS_Props>, {
+    variant: undefined;
+    spacing: undefined;
+    thickness: undefined;
+    length: undefined;
+    ariaLabel: undefined;
+}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrDividerProps>, {
     orientation: string;
     label: undefined;
     align: string;
+    variant: undefined;
+    spacing: undefined;
+    thickness: undefined;
+    length: undefined;
+    ariaLabel: undefined;
 }>>> & Readonly<{}>, {
+    variant: GrDividerVariant;
+    spacing: GrDividerSpacing;
+    orientation: GrDividerOrientation;
+    length: number | string;
     label: string;
+    ariaLabel: string;
     align: GrDividerAlign;
-    orientation: GrDividerOrientation;
+    thickness: number | string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/types/src/components/GrDivider/config.d.ts

@@ -1 +1 @@
-export declare const grDividerConfig: import("@feugene/unocss-preset-granular").GranularComponentDescriptor<"GrDivider">;
+export declare const grDividerConfig: import("@feugene/unocss-preset-granular/contract").GranularComponentDescriptor<"GrDivider">;

package/dist/types/src/components/GrDivider/defaults.d.ts

@@ -0,0 +1,15 @@
+import type { GrDividerSpacing, GrDividerVariant } from './grDividerStyles';
+/**
+ * Пропы `GrDivider`, настраиваемые глобально через
+ * `<GrConfigProvider :component-defaults="{ GrDivider: { … } }">`.
+ * Только оформление — см. `GrButton/defaults.ts`.
+ */
+export interface GrDividerConfigurableProps {
+    variant: GrDividerVariant;
+    spacing: GrDividerSpacing;
+}
+declare module '../GrConfigProvider/context' {
+    interface GrComponentDefaultsRegistry {
+        GrDivider: GrDividerConfigurableProps;
+    }
+}

package/dist/types/src/components/GrDivider/grDividerStyles.d.ts

@@ -0,0 +1,19 @@
+import type { GrComponentSize } from '../shared/sizes';
+export type GrDividerOrientation = 'horizontal' | 'vertical';
+export type GrDividerAlign = 'start' | 'center' | 'end';
+export type GrDividerVariant = 'solid' | 'dashed' | 'dotted';
+/** Отступы вокруг разделителя. `none` — вплотную, как было до появления пропа. */
+export type GrDividerSpacing = 'none' | GrComponentSize;
+/**
+ * Линия рисуется бордюром, а не фоном: `dashed` и `dotted` фоном не выразить,
+ * а два разных механизма на три варианта одного и того же — путь к расхождению.
+ * Толщину задаёт `--gr-divider-thickness`, поэтому классы про неё не знают.
+ */
+export declare const lineVariantClass: Record<GrDividerVariant, string>;
+export declare const horizontalLineClass = "border-0 border-t-[length:var(--gr-divider-thickness,1px)] border-[var(--gr-brd)]";
+export declare const verticalLineClass = "border-0 border-l-[length:var(--gr-divider-thickness,1px)] border-[var(--gr-brd)]";
+export declare const horizontalSpacingClass: Record<GrDividerSpacing, string>;
+export declare const verticalSpacingClass: Record<GrDividerSpacing, string>;
+export declare const labelRootClass = "flex w-full items-center gap-3 text-[length:var(--gr-text-xs)] leading-[var(--gr-leading-xs)] text-[var(--gr-muted-fg)]";
+/** Отрезок линии рядом с подписью: тянется по остатку ширины. */
+export declare const labelLineClass = "flex-1";

package/dist/types/src/components/GrDivider/index.d.ts

@@ -1,4 +1,7 @@
 export { default } from './GrDivider.vue';
 export { default as GrDivider } from './GrDivider.vue';
-export type { GrDividerAlign, GrDividerOrientation } from './GrDivider.vue';
+export type { GrDividerAlign, GrDividerOrientation, GrDividerSpacing, GrDividerVariant, } from './GrDivider.vue';
+export type { GrDividerConfigurableProps } from './defaults';
 export { grDividerConfig } from './config';
+export { grDividerSafelist } from './safelist';
+export type { GrDividerProps } from './GrDivider.vue';

package/dist/types/src/components/GrDivider/safelist.d.ts

@@ -0,0 +1 @@
+export declare const grDividerSafelist: string[];

package/dist/types/src/components/GrDrawer/GrDrawer.vue.d.ts

@@ -1,53 +1,129 @@
-import { type GrDrawerSide, type GrDrawerSize } from './grDrawerStyles';
+import { type GrDrawerSectionConfig, type GrDrawerSide, type GrDrawerSize } from './grDrawerStyles';
+import './defaults';
 export interface GrDrawerProps {
     /** Контроль открытия через v-model. */
     modelValue: boolean;
     /** Заголовок; если передан — покажется в хедере. Можно переопределить слотом `#title`. */
     title?: string;
-    /** Закрывать при клике по бэкдропу / через HeadlessUI close. */
+    /**
+     * Модальная панель: подложка, блокировка скролла, `inert` остальной странице
+     * и ловушка фокуса. `false` — панель живёт рядом со страницей: с ней работают,
+     * не закрывая, а Tab уходит наружу.
+     */
+    modal?: boolean;
+    /** Закрывать при клике по бэкдропу. В немодальном режиме подложки нет. */
     closeOnBackdrop?: boolean;
     /** Закрывать по Esc. */
     closeOnEsc?: boolean;
+    /**
+     * Запрет закрытия «мягкими» способами (бэкдроп, Esc) — на время операции,
+     * которую нельзя бросить на полпути. Кнопка закрытия при этом остаётся:
+     * панель без единого выхода — ловушка.
+     */
+    persistent?: boolean;
     /** Сторона, с которой выезжает панель. */
     side?: GrDrawerSide;
-    /** Размер панели. */
+    /** Размер панели по её оси: ширина у боковых, высота у верхней и нижней. */
     size?: GrDrawerSize;
+    /** Произвольная ширина боковой панели. Число трактуется как пиксели; сильнее `size`. */
+    width?: string | number;
+    /** Произвольная высота верхней или нижней панели. Число трактуется как пиксели. */
+    height?: string | number;
+    /** Рендерить ли хедер (заголовок + кнопка закрытия). */
+    showHeader?: boolean;
+    /** Рендерить ли кнопку закрытия в хедере. */
+    showCloseButton?: boolean;
+    /** Паддинги и рамка секций — как у `GrDialog`. */
+    headerConfig?: GrDrawerSectionConfig;
+    bodyConfig?: GrDrawerSectionConfig;
+    footerConfig?: GrDrawerSectionConfig;
+    /** Элемент, получающий фокус при открытии. По умолчанию — сама панель. */
+    initialFocus?: HTMLElement | null;
     /** i18n-friendly aria-label для кнопки закрытия. */
     closeLabel?: string;
 }
-declare var __VLS_46: {}, __VLS_67: {}, __VLS_69: {};
-type __VLS_Slots = {} & {
-    title?: (props: typeof __VLS_46) => any;
-} & {
-    default?: (props: typeof __VLS_67) => any;
-} & {
-    footer?: (props: typeof __VLS_69) => any;
+export interface GrDrawerEmits {
+    (e: 'update:modelValue', value: boolean): void;
+    /** Панель выехала и анимация закончилась. */
+    (e: 'opened'): void;
+    /** Панель уехала и анимация закончилась. */
+    (e: 'closed'): void;
+}
+type __VLS_Slots = {
+    default?: () => any;
+    title?: () => any;
+    /** Своя шапка целиком: заголовок, кнопка закрытия и всё, что нужно рядом. */
+    header?: (props: {
+        title?: string;
+        close: () => void;
+    }) => any;
+    footer?: () => any;
 };
+declare function close(): void;
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrDrawerProps>, {
     title: undefined;
+    modal: boolean;
     closeOnBackdrop: boolean;
     closeOnEsc: boolean;
-    side: string;
-    size: string;
+    persistent: boolean;
+    side: undefined;
+    size: undefined;
+    width: undefined;
+    height: undefined;
+    showHeader: boolean;
+    showCloseButton: boolean;
+    headerConfig: undefined;
+    bodyConfig: undefined;
+    footerConfig: undefined;
+    initialFocus: null;
     closeLabel: undefined;
-}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+}>>, {
+    /** Закрыть панель (эквивалент `v-model = false`), минуя `persistent`. */
+    close: typeof close;
+    /** Вернуть фокус на панель — например после операции, уведшей его наружу. */
+    focus: () => void | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => void;
+    opened: () => void;
+    closed: () => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrDrawerProps>, {
     title: undefined;
+    modal: boolean;
     closeOnBackdrop: boolean;
     closeOnEsc: boolean;
-    side: string;
-    size: string;
+    persistent: boolean;
+    side: undefined;
+    size: undefined;
+    width: undefined;
+    height: undefined;
+    showHeader: boolean;
+    showCloseButton: boolean;
+    headerConfig: undefined;
+    bodyConfig: undefined;
+    footerConfig: undefined;
+    initialFocus: null;
     closeLabel: undefined;
 }>>> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+    onOpened?: (() => any) | undefined;
+    onClosed?: (() => any) | undefined;
 }>, {
-    title: string;
     size: GrDrawerSize;
-    closeOnBackdrop: boolean;
+    side: GrDrawerSide;
+    title: string;
+    height: string | number;
+    width: string | number;
+    modal: boolean;
+    initialFocus: HTMLElement | null;
     closeOnEsc: boolean;
+    closeOnBackdrop: boolean;
+    showCloseButton: boolean;
     closeLabel: string;
-    side: GrDrawerSide;
+    showHeader: boolean;
+    headerConfig: GrDrawerSectionConfig;
+    footerConfig: GrDrawerSectionConfig;
+    bodyConfig: GrDrawerSectionConfig;
+    persistent: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/types/src/components/GrDrawer/config.d.ts

@@ -1 +1 @@
-export declare const grDrawerConfig: import("@feugene/unocss-preset-granular").GranularComponentDescriptor<"GrDrawer">;
+export declare const grDrawerConfig: import("@feugene/unocss-preset-granular/contract").GranularComponentDescriptor<"GrDrawer">;

package/dist/types/src/components/GrDrawer/defaults.d.ts

@@ -0,0 +1,19 @@
+import type { GrDrawerSide, GrDrawerSize } from './grDrawerStyles';
+/**
+ * Пропы `GrDrawer`, настраиваемые глобально через
+ * `<GrConfigProvider :component-defaults="{ GrDrawer: { … } }">`.
+ *
+ * `size` здесь — шкала оверлея (`sm…full`), а не шкала контролов, поэтому
+ * глобальный `size` провайдера к нему не применяется: `<GrConfigProvider
+ * size="xs">` про кегль кнопок, а не про ширину выезжающей панели. Канал один —
+ * точечный `componentDefaults`.
+ */
+export interface GrDrawerConfigurableProps {
+    size: GrDrawerSize;
+    side: GrDrawerSide;
+}
+declare module '../GrConfigProvider/context' {
+    interface GrComponentDefaultsRegistry {
+        GrDrawer: GrDrawerConfigurableProps;
+    }
+}

package/dist/types/src/components/GrDrawer/grDrawerStyles.d.ts

@@ -1,10 +1,56 @@
-export type GrDrawerSide = 'left' | 'right';
-export type GrDrawerSize = 'sm' | 'md' | 'lg' | 'full';
+import type { GrOverlaySize } from '../shared/sizes';
+export type GrDrawerSide = 'left' | 'right' | 'top' | 'bottom';
+export type GrDrawerSize = GrOverlaySize;
+/** Ось, по которой панель выезжает и по которой считается её размер. */
+export type GrDrawerAxis = 'horizontal' | 'vertical';
+export declare function grDrawerAxis(side: GrDrawerSide): GrDrawerAxis;
+/**
+ * Настройка паддингов и рамки секции. Структурно совпадает с
+ * `GrDialogSectionConfig` намеренно: потребитель не должен переучиваться при
+ * переходе между двумя оверлеями библиотеки. Свой тип, а не импорт из
+ * `GrDialog`, — чтобы не тянуть чужой чанк ради двух полей.
+ */
+export interface GrDrawerSectionConfig {
+    paddingX?: string;
+    paddingY?: string;
+    bordered?: boolean;
+}
+export declare const DEFAULT_GR_DRAWER_HEADER_CONFIG: Required<GrDrawerSectionConfig>;
+export declare const DEFAULT_GR_DRAWER_BODY_CONFIG: Required<GrDrawerSectionConfig>;
+export declare const DEFAULT_GR_DRAWER_FOOTER_CONFIG: Required<GrDrawerSectionConfig>;
+export declare function resolveGrDrawerSectionConfig(config: GrDrawerSectionConfig | undefined, defaults: Required<GrDrawerSectionConfig>): Required<GrDrawerSectionConfig>;
+/** Слой модального класса — тот же, что у `GrModal`: бэкдроп, фокус, scroll-lock. */
+export declare const rootClass = "fixed inset-0 z-[var(--gr-z-modal)]";
+/**
+ * Немодальная панель обязана пропускать клики мимо себя: корень растянут на весь
+ * экран ради позиционирования, и без этого «немодальный» режим гасил бы всю
+ * страницу — ровно то, чего он должен избегать. Панель кликабельность себе
+ * возвращает.
+ */
+export declare const rootPassThroughClass = "pointer-events-none";
+export declare const panelInteractiveClass = "pointer-events-auto";
+export declare const overlayClass = "fixed inset-0 bg-[var(--gr-overlay-bg)]";
+/** Ширина панели для боковых сторон. */
 export declare const panelWidthBySize: Record<GrDrawerSize, string>;
+/** Высота панели для верхней и нижней сторон — та же шкала, но по своей оси. */
+export declare const panelHeightBySize: Record<GrDrawerSize, string>;
+export declare const panelSizeByAxis: Record<GrDrawerAxis, Record<GrDrawerSize, string>>;
+/**
+ * Позиция панели. Растяжка по поперечной оси живёт здесь же: у боковой панели
+ * это `inset-y-0`, у верхней и нижней — `inset-x-0`, и держать их в разметке
+ * значило бы иметь в шаблоне половину стороны.
+ */
 export declare const panelSideClass: Record<GrDrawerSide, string>;
 export declare const panelTransitionClass: Record<GrDrawerSide, string>;
+export declare const panelBaseClass = "fixed flex flex-col border-[var(--gr-brd)] bg-[var(--gr-card)] text-[var(--gr-card-fg)] shadow-[var(--gr-shadow-2)] outline-none";
+export declare const headerBorderClass = "border-b border-[var(--gr-brd)]";
+export declare const footerBorderClass = "border-t border-[var(--gr-brd)]";
+export declare const titleClass = "text-[length:var(--gr-text-sm)] font-700 min-w-0 truncate";
+/** Скрытый заголовок: имя слоя есть даже там, где шапки на экране нет. */
+export declare const srOnlyTitleClass = "sr-only";
 export declare function grDrawerPanelClass(options: {
     side: GrDrawerSide;
     size: GrDrawerSize;
+    hasCustomLength: boolean;
 }): string;
 export declare function grDrawerPanelEnterFrom(side: GrDrawerSide): string;

package/dist/types/src/components/GrDrawer/index.d.ts

@@ -1,6 +1,11 @@
+import type { ComponentExposed } from '../shared/instance';
+import type GrDrawerComponent from './GrDrawer.vue';
 export { default } from './GrDrawer.vue';
 export { default as GrDrawer } from './GrDrawer.vue';
 export { grDrawerConfig } from './config';
+export type { GrDrawerConfigurableProps } from './defaults';
 export { grDrawerSafelist } from './safelist';
 export type { GrDrawerProps } from './GrDrawer.vue';
-export type { GrDrawerSide, GrDrawerSize } from './grDrawerStyles';
+export type { GrDrawerSectionConfig, GrDrawerSide, GrDrawerSize } from './grDrawerStyles';
+export type { GrDrawerEmits } from './GrDrawer.vue';
+export type GrDrawerInstance = ComponentExposed<typeof GrDrawerComponent>;