@feugene/granularity 0.20.0 → 0.22.0

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

@@ -9,6 +9,14 @@ export type GrDataColumnKey<TRow extends Record<string, unknown> = Record<string
 export type GrDataColumn<TRow extends Record<string, unknown> = Record<string, unknown>> = {
     key: GrDataColumnKey<TRow>;
     label: string;
+    /**
+     * Заголовок колонки сортирует.
+     *
+     * Сортируется **переданный массив `rows`**, и только он. Над серверной
+     * пагинацией это врёт: «максимальное списание» покажет максимум по текущей
+     * странице, а прочитается как максимум по журналу. Данные приходят
+     * постранично — включайте `externalSort` и сортируйте запросом.
+     */
     sortable?: boolean;
     align?: 'left' | 'center' | 'right';
     /**
@@ -27,6 +35,14 @@ export type GrDataColumn<TRow extends Record<string, unknown> = Record<string, u
      */
     pinned?: 'left' | 'right';
 };
+/**
+ * Значения итоговой строки по ключам колонок.
+ *
+ * Не строка набора: у итога нет ключа, он не сортируется и не выбирается.
+ * Колонка, для которой значения нет, остаётся пустой ячейкой — заполнять все
+ * колонки итог не обязан.
+ */
+export type GrDataTableSummary<TRow extends Record<string, unknown> = Record<string, unknown>> = Partial<Record<GrDataColumnKey<TRow>, unknown>>;
 export type GrDataTableRowKey<TRow extends Record<string, unknown> = Record<string, unknown>> = string | ((row: TRow) => string | number);
 /** Порядок обхода состояний сортировки по клику на заголовок. */
 export type GrDataTableSortCycle = 'asc-desc' | 'asc-desc-none';
@@ -73,6 +89,21 @@ export interface GrDataTableProps<TRow extends Record<string, unknown> = Record<
     rowClass?: string | ((row: TRow, index: number) => string | undefined);
     /** Произвольные атрибуты строки (`data-*`, `title`, …). */
     rowProps?: (row: TRow, index: number) => Record<string, unknown> | undefined;
+    /**
+     * Итоговая строка в `<tfoot>`: значения по ключам колонок.
+     *
+     * Встаёт по той же колоночной сетке, что и тело, — с теми же паддингами,
+     * выравниванием, ширинами и закреплением. Собранная руками в `#footer`, она
+     * этих классов не получает (`GrTable` их принципиально не даёт) и разъезжается
+     * с телом на первой же смене `size`.
+     *
+     * Итог не суммируется компонентом: что считать итогом — знает приложение.
+     * Оформление ячейки — слот `#summary-<key>`.
+     *
+     * `null` равнозначен отсутствию: `totals ?? null` — обычная запись там, где
+     * итог считается не всегда.
+     */
+    summaryRow?: GrDataTableSummary<TRow> | null;
     /**
      * Размер таблицы: кегль, паддинги ячеек, стрелки сортировки и чекбоксы.
      * Прокидывается в `GrTable`.
@@ -191,6 +222,9 @@ declare const __VLS_export: <TRow extends Record<string, unknown> = Record<strin
     }) => any) | undefined; } & { [K_2 in NonNullable<`cell-${string & {}}` | `cell-${Extract<keyof TRow, string>}`>]?: ((props: {
         row: TRow;
         index: number;
+    }) => any) | undefined; } & { [K_3 in NonNullable<`summary-${string & {}}` | `summary-${Extract<keyof TRow, string>}`>]?: ((props: {
+        value: unknown;
+        column: GrDataColumn<TRow>;
     }) => any) | undefined; } & {
         caption?: (props: {}) => any;
     } & {
@@ -198,7 +232,10 @@ declare const __VLS_export: <TRow extends Record<string, unknown> = Record<strin
     } & {
         empty?: (props: {}) => any;
     } & {
-        footer?: (props: {}) => any;
+        footer?: (props: {
+            columns: GrDataColumn<TRow>[];
+            totalColumns: number;
+        }) => any;
     };
     emit: GrDataTableEmits<TRow>;
 }>) => import("vue").VNode & {

package/dist/types/components/GrDataTable/grDataTableStyles.d.ts

@@ -32,6 +32,13 @@ export declare const columnDropAfterClass = "after:absolute after:inset-y-0 afte
  * сквозь него не видна.
  */
 export declare const rowSelectedClass = "bg-[color-mix(in_srgb,var(--gr-primary)_8%,transparent)]";
+/**
+ * Итоговая строка. Отбивка та же, что между строками тела, плюс вес: итог —
+ * вывод из набора, а не ещё одна его запись, и читатель должен видеть это до
+ * того, как разберёт цифры. Тон оставлен потребителю: «возвраты» и «прибыль» —
+ * разные сообщения, и выбирать за него компонент не должен.
+ */
+export declare const summaryRowClass = "border-t border-[var(--gr-brd)] font-600";
 /**
  * Ручка ширины — полоса у правого края заголовка. Видима она узкой линией, а
  * ловится широкой зоной: попасть в двухпиксельную границу мышью тяжело.

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

@@ -2,7 +2,7 @@ import type { ComponentExposed } from '../shared/instance';
 import type GrDataTableComponent from './GrDataTable.vue';
 export { default } from './GrDataTable.vue';
 export { default as GrDataTable } from './GrDataTable.vue';
-export type { GrDataColumn, GrDataColumnKey, GrDataTableProps, GrDataTableRowKey, GrDataTableSortCycle, } from './GrDataTable.vue';
+export type { GrDataColumn, GrDataColumnKey, GrDataTableProps, GrDataTableRowKey, GrDataTableSortCycle, GrDataTableSummary, } from './GrDataTable.vue';
 export type { GrDataTableSortDir } from './grDataTableSort';
 export { grDataTableConfig } from './config';
 export type { GrDataTableConfigurableProps } from './defaults';

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

@@ -0,0 +1,84 @@
+import { type GrDeltaPolarity } from './deltaTone';
+import type { GrComponentSize } from '../shared/sizes';
+export type { GrDeltaPolarity, GrDeltaTone } from './deltaTone';
+/**
+ * Величина со знаком и тоном **внутри строки текста**: «Дельта: +$0.004».
+ *
+ * Компонент презентационный: дельту не считает и периоды не сравнивает —
+ * «к чему сравнивать» знает приложение. Блочная плитка показателя — `GrStatistic`.
+ */
+export interface GrDeltaProps {
+    /** Величина. `null` — её нет; это не ноль. */
+    value: number | null;
+    /** Знаков после запятой. Не задано — как отдаст локаль. */
+    precision?: number;
+    /** Приписка перед числом: валюта, единица. */
+    prefix?: string;
+    /** Приписка после числа: `%`, `мс`. */
+    suffix?: string;
+    /**
+     * Что считать хорошим. Для выручки рост — успех, для себестоимости и времени
+     * отклика — наоборот; без этого компонент врал бы в половине случаев.
+     */
+    polarity?: GrDeltaPolarity;
+    /** Ставить `+` у положительных. Минус подставляет `Intl` сам. */
+    showSign?: boolean;
+    /** Стрелка направления. Декоративна: направление уже в знаке. */
+    showArrow?: boolean;
+    /** Чем печатать отсутствующую величину. */
+    emptyText?: string;
+    /** Локаль форматирования. Не задана — локаль i18n-адаптера. */
+    locale?: string;
+    size?: GrComponentSize;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrDeltaProps>, {
+    precision: undefined;
+    prefix: undefined;
+    suffix: undefined;
+    polarity: undefined;
+    showSign: undefined;
+    showArrow: undefined;
+    emptyText: undefined;
+    locale: undefined;
+    size: undefined;
+}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrDeltaProps>, {
+    precision: undefined;
+    prefix: undefined;
+    suffix: undefined;
+    polarity: undefined;
+    showSign: undefined;
+    showArrow: undefined;
+    emptyText: undefined;
+    locale: undefined;
+    size: undefined;
+}>>> & Readonly<{}>, {
+    size: GrComponentSize;
+    polarity: GrDeltaPolarity;
+    showSign: boolean;
+    showArrow: boolean;
+    emptyText: string;
+    prefix: string;
+    suffix: string;
+    locale: string;
+    precision: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+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_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

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

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

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

@@ -0,0 +1,22 @@
+import type { GrComponentSize } from '../shared/sizes';
+import type { GrDeltaPolarity } from './deltaTone';
+/**
+ * Пропы `GrDelta`, настраиваемые глобально через
+ * `<GrConfigProvider :component-defaults="{ GrDelta: { … } }">`.
+ *
+ * `polarity` здесь наравне с оформлением не случайно: в отчёте по расходам
+ * «рост — плохо» верно для всех величин сразу, и повторять это на каждой
+ * значит однажды забыть.
+ */
+export interface GrDeltaConfigurableProps {
+    size: GrComponentSize;
+    polarity: GrDeltaPolarity;
+    showSign: boolean;
+    showArrow: boolean;
+    emptyText: string;
+}
+declare module '../../composables/useGrComponentConfig' {
+    interface GrComponentDefaultsRegistry {
+        GrDelta: GrDeltaConfigurableProps;
+    }
+}

package/dist/types/components/GrDelta/deltaTone.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Выбор тона для величины со знаком.
+ *
+ * Чистая функция, а не `switch` внутри компонента: ровно этот `switch`
+ * расходился по приложениям копиями, и в одной из них нулевое движение
+ * красилось зелёным — как поступление.
+ */
+/** Что считать хорошим ростом. */
+export type GrDeltaPolarity = 'positive-good'
+/** Рост — проблема: себестоимость, время отклика, отток. */
+ | 'negative-good'
+/** Знак ничего не говорит о качестве: сальдо, смещение, разница координат. */
+ | 'none';
+export type GrDeltaTone = 'success' | 'danger' | 'neutral';
+/**
+ * Тон величины по её знаку и полярности.
+ *
+ * Ноль нейтрален при любой полярности: «не изменилось» — третье состояние, и
+ * двумя цветами его не выразить. `null` величины нет вовсе — тона у неё тоже
+ * нет, это решает вызывающий.
+ */
+export declare function deltaTone(value: number, polarity?: GrDeltaPolarity): GrDeltaTone;
+/** Направление стрелки. Ноль стрелки не получает: двигаться было некуда. */
+export declare function deltaDirection(value: number): 'up' | 'down' | 'flat';

package/dist/types/components/GrDelta/grDeltaStyles.d.ts

@@ -0,0 +1,38 @@
+import type { GrComponentSize } from '../shared/sizes';
+import type { GrDeltaTone } from './deltaTone';
+/**
+ * Классы `GrDelta`.
+ *
+ * Тон перечислен целиком по одному литералу на ветку: UnoCSS сканирует исходный
+ * текст файла, и собранное шаблонной строкой имя (`text-[var(--gr-${tone}-text)]`)
+ * уехало бы в CSS литералом.
+ */
+/**
+ * Величина стоит в строке текста, поэтому наследует её кегль и выравнивание.
+ *
+ * Общего `gap` нет намеренно: префикс — это валюта, и «$ 12,50» с зазором
+ * читается как опечатка. Отбивку получают только стрелка и суффикс.
+ */
+export declare const deltaRootClass = "inline-flex items-baseline tabular-nums";
+/** Суффикс — единица измерения, и от числа он отбивается: «−15 %», «120 мс». */
+export declare const deltaSuffixClass = "ml-1";
+/**
+ * Стрелка выравнивается по строке, а не по базовой линии: у svg её нет.
+ *
+ * Размер — в `em`, потому что на ступени `md` кегля у величины нет вовсе:
+ * пиксельная лестница оставила бы стрелку 14-пиксельной внутри заголовка.
+ * Чуть меньше единицы: стрелка декоративна, и равный вес спорил бы с самим
+ * числом.
+ */
+export declare const deltaArrowClass = "mr-0.5 self-center shrink-0 h-[0.875em] w-[0.875em]";
+export declare const deltaToneClass: Record<GrDeltaTone, string>;
+/** Прочерк вместо величины: тона у него нет, но и цвет основного текста ему не нужен. */
+export declare const deltaEmptyClass = "text-[var(--gr-muted-fg)]";
+/**
+ * `md` пуст намеренно: на ступени по умолчанию величина набирается кеглем той
+ * строки, в которой стоит. Фиксированные 13 px разъезжаются и вверх, и вниз —
+ * внутри заголовка величина оставалась бы мелкой, в подписи под графиком
+ * крупной. Ступени по краям остаются явными: они нужны, когда величина стоит
+ * не в предложении, а в ряду с контролами.
+ */
+export declare const deltaSizeClass: Record<GrComponentSize, string>;

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

@@ -0,0 +1,6 @@
+export { default } from './GrDelta.vue';
+export { default as GrDelta } from './GrDelta.vue';
+export { grDeltaConfig } from './config';
+export type { GrDeltaPolarity, GrDeltaProps, GrDeltaTone } from './GrDelta.vue';
+export type { GrDeltaConfigurableProps } from './defaults';
+export { grDeltaSafelist } from './safelist';

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

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

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

@@ -0,0 +1,107 @@
+import { type GrDescriptionColumns, type GrDescriptionDensity, type GrDescriptionLayout } from './grDescriptionListStyles';
+import type { GrComponentSize } from '../shared/sizes';
+import type { GrTone } from '../shared/tones';
+export type { GrDescriptionColumns, GrDescriptionDensity, GrDescriptionLayout, } from './grDescriptionListStyles';
+export interface GrDescriptionItem {
+    label: string;
+    /** Значение. `null` и `''` печатаются прочерком — строка не исчезает. */
+    value?: string | number | null;
+    /** Ключ слотов `#value-<name>` и `#label-<name>`. */
+    name?: string;
+    /** Тон значения. Подпись остаётся нейтральной всегда. */
+    tone?: GrTone;
+}
+/**
+ * Список пар «характеристика → значение»: настоящий `<dl>` с выравниванием
+ * значений в колонку.
+ *
+ * В отличие от `GrList`, где пункт — это «заголовок с подзаголовком», здесь
+ * два разных по роли элемента: термин и его значение.
+ */
+export interface GrDescriptionListProps {
+    items: readonly GrDescriptionItem[];
+    /** `inline` — подпись слева колонкой; `stacked` — над значением. */
+    layout?: GrDescriptionLayout;
+    /** Ширина колонки подписей при `inline`. */
+    labelWidth?: string;
+    /**
+     * Ниже какой ширины контейнера (px) `inline` переключается на `stacked`.
+     * В узкой колонке фиксированная подпись выжимает значение в букву на строку.
+     */
+    stackBelow?: number;
+    density?: GrDescriptionDensity;
+    /** Отбивать пары линиями. */
+    divided?: boolean;
+    columns?: GrDescriptionColumns;
+    /** Чем печатать пустое значение. */
+    emptyText?: string;
+    size?: GrComponentSize;
+}
+declare var __VLS_2: `label-${string}`, __VLS_3: {
+    item: GrDescriptionItem;
+}, __VLS_6: `value-${string}`, __VLS_7: {
+    item: GrDescriptionItem;
+}, __VLS_9: {
+    item: GrDescriptionItem;
+};
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_2>]?: (props: typeof __VLS_3) => any;
+} & {
+    [K in NonNullable<typeof __VLS_6>]?: (props: typeof __VLS_7) => any;
+} & {
+    empty?: (props: typeof __VLS_9) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrDescriptionListProps>, {
+    layout: undefined;
+    labelWidth: undefined;
+    stackBelow: undefined;
+    density: undefined;
+    divided: undefined;
+    columns: undefined;
+    emptyText: undefined;
+    size: undefined;
+}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrDescriptionListProps>, {
+    layout: undefined;
+    labelWidth: undefined;
+    stackBelow: undefined;
+    density: undefined;
+    divided: undefined;
+    columns: undefined;
+    emptyText: undefined;
+    size: undefined;
+}>>> & Readonly<{}>, {
+    size: GrComponentSize;
+    divided: boolean;
+    emptyText: string;
+    layout: GrDescriptionLayout;
+    labelWidth: string;
+    density: GrDescriptionDensity;
+    columns: GrDescriptionColumns;
+    stackBelow: number;
+}, {}, {}, {}, 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/GrDescriptionList/config.d.ts

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

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

@@ -0,0 +1,21 @@
+import type { GrComponentSize } from '../shared/sizes';
+import type { GrDescriptionColumns, GrDescriptionDensity, GrDescriptionLayout } from './grDescriptionListStyles';
+/**
+ * Пропы `GrDescriptionList`, настраиваемые глобально через
+ * `<GrConfigProvider :component-defaults="{ GrDescriptionList: { … } }">`.
+ * Только оформление — данные принадлежат экземпляру.
+ */
+export interface GrDescriptionListConfigurableProps {
+    size: GrComponentSize;
+    layout: GrDescriptionLayout;
+    labelWidth: string;
+    density: GrDescriptionDensity;
+    divided: boolean;
+    columns: GrDescriptionColumns;
+    emptyText: string;
+}
+declare module '../../composables/useGrComponentConfig' {
+    interface GrComponentDefaultsRegistry {
+        GrDescriptionList: GrDescriptionListConfigurableProps;
+    }
+}

package/dist/types/components/GrDescriptionList/grDescriptionListStyles.d.ts

@@ -0,0 +1,25 @@
+import type { GrComponentSize } from '../shared/sizes';
+import type { GrTone } from '../shared/tones';
+/**
+ * Классы `GrDescriptionList`.
+ *
+ * Тон перечислен целиком по одному литералу на ветку: UnoCSS сканирует исходный
+ * текст файла, и собранное шаблонной строкой имя уехало бы в CSS литералом.
+ */
+/** `inline` — подпись колонкой слева; `stacked` — над значением. */
+export type GrDescriptionLayout = 'inline' | 'stacked';
+export type GrDescriptionDensity = 'regular' | 'compact';
+/** Сколько колонок пар. Длинный список читается в две. */
+export type GrDescriptionColumns = 1 | 2;
+export declare const descriptionRootClass = "m-0 grid gap-x-4 [row-gap:var(--gr-description-list-row-gap,0.375rem)]";
+export declare const descriptionColumnsClass: Record<GrDescriptionColumns, string>;
+export declare const descriptionPairInlineClass = "flex min-w-0 items-baseline gap-2";
+export declare const descriptionPairStackedClass = "min-w-0";
+export declare const descriptionDividedClass = "border-b border-[var(--gr-description-list-divider,var(--gr-brd))] pb-1 last:border-b-0 last:pb-0";
+export declare const descriptionLabelInlineClass = "shrink-0 text-[var(--gr-description-list-label-color,var(--gr-muted-fg))]";
+export declare const descriptionLabelStackedClass = "text-[var(--gr-description-list-label-color,var(--gr-muted-fg))]";
+export declare const descriptionValueClass = "m-0 min-w-0 break-words";
+/** Тон — только у значения: красная подпись читается как «поле сломано». */
+export declare const descriptionValueToneClass: Record<GrTone, string>;
+export declare const descriptionSizeClass: Record<GrComponentSize, string>;
+export declare const descriptionDensityClass: Record<GrDescriptionDensity, string>;

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

@@ -0,0 +1,6 @@
+export { default } from './GrDescriptionList.vue';
+export { default as GrDescriptionList } from './GrDescriptionList.vue';
+export { grDescriptionListConfig } from './config';
+export type { GrDescriptionColumns, GrDescriptionDensity, GrDescriptionItem, GrDescriptionLayout, GrDescriptionListProps, } from './GrDescriptionList.vue';
+export type { GrDescriptionListConfigurableProps } from './defaults';
+export { grDescriptionListSafelist } from './safelist';

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

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

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

@@ -22,7 +22,7 @@ export interface GrDropdownMenuProps {
     teleportTo?: string | HTMLElement;
     /** Закрывать по клику внутри content. */
     closeOnContentClick?: boolean;
-    /** Дополнительные классы content-контейнера; по умолчанию `p-0`. */
+    /** Дополнительные классы content-контейнера. */
     contentClass?: string;
     /**
      * Декларативное меню: пункты, группы и разделители массивом. Слот по

package/dist/types/components/GrDropdownMenu/grDropdownMenuStyles.d.ts

@@ -6,7 +6,16 @@ export type GrDropdownMenuColumnsCount = 2 | 3 | 4;
 export declare const alignClass: Record<GrDropdownMenuItemAlign, string>;
 export declare const textAlignClass: Record<GrDropdownMenuHeaderAlign, string>;
 export declare const colsClass: Record<GrDropdownMenuColumnsCount, string>;
-export declare const itemBaseClass = "w-full min-h-10 px-4 py-2.5 flex items-center gap-2 text-[length:var(--gr-text-sm)] transition-colors duration-[var(--gr-duration-fast)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)]";
+/**
+ * Радиус здесь не украшение: фон подсветки лежит на самом пункте, а панель
+ * `GrDropdown` скруглена на 16 px и содержимое не обрезает. Прямоугольник во всю
+ * ширину заливал бы угловые сегменты, вырезанные этим радиусом. Восемь
+ * пикселей — та же ступень, что у опций `GrSelect` и `GrAutocomplete`; внутренний
+ * угол панели после рамки и поля ≈ 11 px, так что подсветка до скругления не
+ * достаёт. Радиус в базовом классе, а не отдельной константой: hover, disabled и
+ * кольцо фокуса висят на одном элементе.
+ */
+export declare const itemBaseClass = "w-full min-h-10 px-4 py-2.5 rounded-[var(--gr-radius-md)] flex items-center gap-2 text-[length:var(--gr-text-sm)] transition-colors duration-[var(--gr-duration-fast)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)]";
 export declare const itemVariantClass: Record<GrDropdownMenuItemVariant, string>;
 export declare const itemInteractiveClass = "cursor-pointer hover:bg-[var(--gr-accent)] hover:text-[var(--gr-accent-fg)]";
 export declare const itemDisabledClass = "cursor-not-allowed pointer-events-none bg-[var(--gr-muted)] text-[var(--gr-muted-fg)]";

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

@@ -0,0 +1,100 @@
+import { type Component } from 'vue';
+import type { GrSizeWithPx } from '../shared/sizes';
+import { type GrFilePreviewRatio } from './grFilePreviewStyles';
+export type { GrFileKind } from './fileKindOf';
+export type { GrFilePreviewRatio } from './grFilePreviewStyles';
+/**
+ * Плитка превью файла с фолбэком по типу.
+ *
+ * Показывает **сохранённый** файл, а не отправляет новый: отправка — это
+ * `GrFormFile` и `GrFileUpload`. Просмотрщик во весь экран открывает
+ * потребитель по событию `click`.
+ */
+export interface GrFilePreviewProps {
+    /** Адрес превью. Пусто — сразу заглушка по типу. */
+    src?: string | null;
+    /** MIME-тип. Он решает, картинка это или файл. */
+    mime?: string | null;
+    /** Имя файла: доступное имя картинки и подпись заглушки. */
+    name?: string | null;
+    /**
+     * Ступень канонической шкалы либо произвольная ширина в пикселях. Число —
+     * escape-hatch, как диаметр у GrAvatar: плитка 96px в ленте вложений в
+     * четыре ступени не укладывается.
+     */
+    tileSize?: GrSizeWithPx;
+    ratio?: GrFilePreviewRatio;
+    /** Ссылка на оригинал — для не-картинок и для перехода мимо просмотрщика. */
+    href?: string;
+    /** Свой корневой тег (`RouterLink`, `Link` от Inertia). Сильнее `href`. */
+    as?: string | Component;
+    /** Плитка кликабельна и эмитит `click` — обычно чтобы открыть просмотрщик. */
+    clickable?: boolean;
+    loading?: 'lazy' | 'eager';
+    /**
+     * Доступное имя интерактивной плитки. Не задано — имя приходит из содержимого:
+     * `alt` картинки или подписи заглушки.
+     */
+    ariaLabel?: string;
+}
+export interface GrFilePreviewEmits {
+    (e: 'click', event: MouseEvent): void;
+}
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrFilePreviewProps>, {
+    src: undefined;
+    mime: undefined;
+    name: undefined;
+    tileSize: undefined;
+    ratio: undefined;
+    href: undefined;
+    as: undefined;
+    clickable: boolean;
+    loading: undefined;
+    ariaLabel: undefined;
+}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    click: (event: MouseEvent) => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<GrFilePreviewProps>, {
+    src: undefined;
+    mime: undefined;
+    name: undefined;
+    tileSize: undefined;
+    ratio: undefined;
+    href: undefined;
+    as: undefined;
+    clickable: boolean;
+    loading: undefined;
+    ariaLabel: undefined;
+}>>> & Readonly<{
+    onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    tileSize: GrSizeWithPx;
+    ratio: GrFilePreviewRatio;
+    loading: "lazy" | "eager";
+    name: string | null;
+    href: string;
+    ariaLabel: string;
+    src: string | null;
+    as: string | Component;
+    clickable: boolean;
+    mime: string | null;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+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_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

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

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

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

@@ -0,0 +1,20 @@
+import type { GrSizeWithPx } from '../shared/sizes';
+import type { GrFilePreviewRatio } from './grFilePreviewStyles';
+/**
+ * Пропы `GrFilePreview`, настраиваемые глобально через
+ * `<GrConfigProvider :component-defaults="{ GrFilePreview: { … } }">`.
+ *
+ * Только оформление: `src`, `mime` и `name` принадлежат файлу. Размер и
+ * пропорции здесь потому, что лента вложений выглядит одинаково на всех
+ * страницах, и повторять решение у каждой плитки значит однажды разойтись.
+ */
+export interface GrFilePreviewConfigurableProps {
+    tileSize: GrSizeWithPx;
+    ratio: GrFilePreviewRatio;
+    loading: 'lazy' | 'eager';
+}
+declare module '../../composables/useGrComponentConfig' {
+    interface GrComponentDefaultsRegistry {
+        GrFilePreview: GrFilePreviewConfigurableProps;
+    }
+}

package/dist/types/components/GrFilePreview/fileKindOf.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Вид файла по MIME-типу.
+ *
+ * Тип решает **`mime`, а не расширение**: расширение врёт (`.dat` у выгрузки,
+ * `.pdf` у переименованного архива), а бэкенд отдаёт настоящий тип — брать надо
+ * его. От вида зависит единственное решение компонента: рисовать `<img>` или
+ * иконку.
+ */
+export type GrFileKind = 'image' | 'pdf' | 'document' | 'spreadsheet' | 'archive'
+/** Тип не опознан, пуст или это `application/octet-stream`. */
+ | 'unknown';
+export declare function fileKindOf(mime: string | null | undefined): GrFileKind;
+/** Картинку показываем, остальное — подписываем иконкой. */
+export declare function isPreviewableKind(kind: GrFileKind): boolean;