@feugene/granularity 0.20.0 → 0.22.0

package/dist/components/GrStatistic/chunks/GrStatistic-DkzWUAw1.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrStatistic-DkzWUAw1.js","names":["$slots"],"sources":["../../../../src/components/GrStatistic/countUp.ts","../../../../src/components/GrStatistic/formatStatisticValue.ts","../../../../src/components/GrStatistic/GrStatistic.vue","../../../../src/components/GrStatistic/GrStatistic.vue"],"sourcesContent":["/**\n * Перебор чисел для `GrStatistic`: чистая арифметика кадра без Vue и таймеров.\n *\n * Вынесено отдельным модулем по той же причине, что и `formatStatisticValue`:\n * кривая и округление проверяются напрямую, без монтирования и подмены `rAF`.\n */\n\n/** Быстрый старт, мягкая остановка — та же форма, что у `--gr-ease-out`. */\nexport function easeOutCubic(t: number): number {\n  const clamped = Math.min(Math.max(t, 0), 1)\n  return 1 - (1 - clamped) ** 3\n}\n\n/**\n * Значение кадра на `elapsed` миллисекунде перехода `from → to`.\n *\n * Округление до `precision` обязательно: без него кадры показывали бы\n * `1283.6666666666667` там, где показатель целый, и ширина строки прыгала бы\n * даже при `tabular-nums`. Последний кадр возвращает ровно `to` — приближение\n * не должно оставлять показатель в 1283.9999.\n */\nexport function countUpFrame(\n  from: number,\n  to: number,\n  elapsed: number,\n  duration: number,\n  precision?: number,\n): number {\n  if (!(duration > 0) || elapsed >= duration) return to\n\n  const digits = Math.min(Math.max(precision ?? 0, 0), 20)\n  const value = from + (to - from) * easeOutCubic(elapsed / duration)\n\n  return Number(value.toFixed(digits))\n}\n","export type GrStatisticFormatOptions = {\n  /** Число знаков после запятой. `undefined` — оставить как есть. */\n  precision?: number\n  /** Разделитель групп разрядов. Сильнее локали. */\n  groupSeparator?: string\n  /** Десятичный разделитель. Сильнее локали. */\n  decimalSeparator?: string\n  /** BCP-47 локаль: разделители берутся из `Intl.NumberFormat`. */\n  locale?: string\n}\n\nconst DEFAULT_GROUP_SEPARATOR = ' '\nconst DEFAULT_DECIMAL_SEPARATOR = '.'\n\n/**\n * Форматирует значение показателя: фиксирует точность и расставляет разделители.\n *\n * Нечисловые значения возвращаются без изменений — это позволяет показывать в\n * `GrStatistic` уже готовые строки («2 ч 15 мин», «—») без обходных пропов.\n * Вынесено из SFC отдельным модулем, чтобы тестировалось без монтирования.\n *\n * Порядок разрешения разделителей: явный проп → локаль → встроенный дефолт.\n */\nexport function formatStatisticValue(\n  value: number | string,\n  options: GrStatisticFormatOptions = {},\n): string {\n  const { precision, groupSeparator, decimalSeparator, locale } = options\n\n  const numeric = typeof value === 'number' ? value : Number(value)\n  if (typeof value === 'string' && (value.trim() === '' || !Number.isFinite(numeric))) {\n    return value\n  }\n  if (!Number.isFinite(numeric)) return String(value)\n\n  if (locale) {\n    return formatByLocale(numeric, locale, { precision, groupSeparator, decimalSeparator })\n  }\n\n  const fixed = precision === undefined ? String(numeric) : numeric.toFixed(precision)\n  // `toFixed` не даёт экспоненциальной записи, а `String(число)` — может (1e21+).\n  // В таком случае группировать нечего: возвращаем как есть.\n  if (fixed.includes('e') || fixed.includes('E')) return fixed\n\n  const negative = fixed.startsWith('-')\n  const [intPart, fracPart] = (negative ? fixed.slice(1) : fixed).split('.')\n\n  const separator = groupSeparator ?? DEFAULT_GROUP_SEPARATOR\n  const grouped = separator\n    ? intPart.replace(/\\B(?=(\\d{3})+(?!\\d))/g, separator)\n    : intPart\n\n  return [\n    negative ? '-' : '',\n    grouped,\n    fracPart ? `${decimalSeparator ?? DEFAULT_DECIMAL_SEPARATOR}${fracPart}` : '',\n  ].join('')\n}\n\n/**\n * `formatToParts` вместо `format`: даёт заменить отдельные разделители, оставив\n * остальные правила локали (индийская группировка, знак минуса, порядок частей).\n */\nfunction formatByLocale(\n  value: number,\n  locale: string,\n  options: Pick<GrStatisticFormatOptions, 'precision' | 'groupSeparator' | 'decimalSeparator'>,\n): string {\n  const { precision, groupSeparator, decimalSeparator } = options\n  // `Intl` принимает не больше 20 знаков и падает `RangeError` на большем,\n  // тогда как ручная ветка через `toFixed` пережила бы до 100.\n  const digits = precision === undefined ? undefined : Math.min(Math.max(precision, 0), 20)\n\n  return new Intl.NumberFormat(locale, {\n    useGrouping: true,\n    minimumFractionDigits: digits,\n    maximumFractionDigits: digits ?? 20,\n  })\n    .formatToParts(value)\n    .map((part) => {\n      if (part.type === 'group' && groupSeparator !== undefined) return groupSeparator\n      if (part.type === 'decimal' && decimalSeparator !== undefined) return decimalSeparator\n      return part.value\n    })\n    .join('')\n}\n","<script setup lang=\"ts\">\nimport { useGrComponentSize } from '../GrConfigProvider/context'\nimport { computed, markRaw, onBeforeUnmount, onMounted, ref, useSlots, watch, type Component } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { iconClass, iconTag } from '../shared/icon'\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\n\nimport IconMinus from '~icons/lucide/minus'\nimport IconTrendingDown from '~icons/lucide/trending-down'\nimport IconTrendingUp from '~icons/lucide/trending-up'\n\nimport { countUpFrame } from './countUp'\nimport { formatStatisticValue } from './formatStatisticValue'\n\nimport {\n  statisticAffixSizeBySize,\n  statisticPlaceholderHeightBySize,\n  statisticRootClass,\n  statisticTitleClass,\n  statisticTitleSizeBySize,\n  statisticTrendClassByTrend,\n  statisticTrendSizeBySize,\n  statisticValueClass,\n  type GrStatisticSize,\n  type GrStatisticTone,\n  type GrStatisticTrend,\n} from './grStatisticStyles'\n\nexport type {\n  GrStatisticSize,\n  GrStatisticTone,\n  GrStatisticTrend,\n} from './grStatisticStyles'\nexport type { GrStatisticFormatOptions } from './formatStatisticValue'\n\n/**\n * Публичный GR-примитив «Statistic» — крупный числовой показатель с подписью,\n * префиксом/суффиксом и строкой динамики.\n *\n * Компонент презентационный: не грузит данные и не считает дельту, только\n * форматирует и подаёт. Форматирование — чистая функция `formatStatisticValue`.\n */\nexport interface GrStatisticProps {\n  /** Значение показателя. Нечисловая строка выводится как есть. */\n  value: number | string\n  /** Подпись над значением. */\n  title?: string\n  /** Число знаков после запятой. */\n  precision?: number\n  /** Разделитель разрядов. Сильнее локали; без него и без локали — узкий пробел. */\n  groupSeparator?: string\n  /** Десятичный разделитель. Сильнее локали; без него и без локали — точка. */\n  decimalSeparator?: string\n  /**\n   * BCP-47 локаль форматирования. Не задана — берётся из i18n-адаптера; нет и\n   * адаптера — работают ручные разделители.\n   */\n  locale?: string\n  /** Приписка перед значением (валюта, знак). */\n  prefix?: string\n  /** Приписка после значения (единица измерения, `%`). */\n  suffix?: string\n  /**\n   * Иконка слева от блока: Vue-компонент либо класс иконки вашей UnoCSS-сборки\n   * (`'i-lucide-users'` — тогда нужен ваш `presetIcons`, см. `docs/installation.md`).\n   */\n  icon?: string | Component\n  size?: GrStatisticSize\n  /** Тон значения; точечно перекрывается `--gr-statistic-value-color`. */\n  tone?: GrStatisticTone\n  /** Направление динамики — задаёт цвет и иконку строки под значением. */\n  trend?: GrStatisticTrend\n  /** Текст динамики (например `+12,5% к прошлой неделе`). */\n  trendText?: string\n  /** Состояние загрузки: вместо значения — плейсхолдер. */\n  loading?: boolean\n  /**\n   * Перебирать числа при появлении и при смене значения. Нечисловое значение\n   * ставится сразу, под `prefers-reduced-motion: reduce` — тоже.\n   */\n  animate?: boolean\n  /**\n   * Длительность перебора в миллисекундах. Не токеном: шкала `--gr-duration-*`\n   * заканчивается на 300 мс и описывает смену состояния, а перебор чисел —\n   * другой жанр, и его число живёт там же, где твин.\n   */\n  animateDuration?: number\n  /** Свой корневой тег (`RouterLink`, `Link` от Inertia). Сильнее `href`. */\n  as?: string | Component\n  /** Показатель-ссылка: переход к деталям. */\n  href?: string\n  /** Показатель-кнопка: интерактивна вся плитка. */\n  clickable?: boolean\n}\n\nexport interface GrStatisticEmits {\n  (e: 'click', event: MouseEvent): void\n}\n\nconst props = withDefaults(\n  defineProps<GrStatisticProps>(),\n  {\n    title: undefined,\n    precision: undefined,\n    // Дефолты живут в `formatStatisticValue`: иначе «пользователь задал пробел»\n    // было бы неотличимо от «сработал дефолт», и локаль не смогла бы победить.\n    groupSeparator: undefined,\n    decimalSeparator: undefined,\n    locale: undefined,\n    prefix: undefined,\n    suffix: undefined,\n    icon: undefined,\n    size: undefined,\n    tone: 'neutral',\n    trend: undefined,\n    trendText: undefined,\n    loading: false,\n    animate: false,\n    animateDuration: 600,\n    as: undefined,\n    href: undefined,\n    clickable: false,\n  },\n)\n\nconst emit = defineEmits<GrStatisticEmits>()\n\nconst slots = useSlots()\n\nconst { t, locale } = useGranularityTranslations()\n\nconst resolvedLocale = computed(() => props.locale ?? locale.value)\n\n/**\n * Число текущего кадра перебора. `null` — перебора нет, показываем сам проп:\n * так значение остаётся конечным и на сервере, и до первого твина.\n */\nconst frameValue = ref<number | null>(null)\n\nconst formatted = computed(() => formatStatisticValue(frameValue.value ?? props.value, {\n  precision: props.precision,\n  groupSeparator: props.groupSeparator,\n  decimalSeparator: props.decimalSeparator,\n  locale: resolvedLocale.value,\n}))\n\n/** Конечное значение — то, что читает диктор, пока на экране идёт перебор. */\nconst finalFormatted = computed(() => formatStatisticValue(props.value, {\n  precision: props.precision,\n  groupSeparator: props.groupSeparator,\n  decimalSeparator: props.decimalSeparator,\n  locale: resolvedLocale.value,\n}))\n\nconst isCounting = computed(() => frameValue.value !== null)\n\nconst hasTitle = computed(() => Boolean(props.title || slots.title))\n\nconst isInteractive = computed(() => Boolean(props.as || props.href || props.clickable))\n\nconst rootTag = computed<string | Component>(() => {\n  if (props.as)\n    return typeof props.as === 'string' ? props.as : markRaw(props.as)\n\n  if (props.href)\n    return 'a'\n\n  return props.clickable ? 'button' : 'div'\n})\n\n/**\n * Компонент-ссылка (`Link` от Inertia, `RouterLink`) рендерит `<a>` сам, и без\n * `href` он ведёт в никуда. Строковый тег, кроме `a`, атрибут не понимает —\n * там он и гасится.\n */\nconst rootHref = computed(() => (\n  typeof rootTag.value === 'string' && rootTag.value !== 'a' ? undefined : props.href\n))\n\nconst rootClass = computed(() => statisticRootClass({ interactive: isInteractive.value }))\n\nfunction toNumber(value: number | string): number | null {\n  const numeric = typeof value === 'number' ? value : Number(value)\n  return Number.isFinite(numeric) ? numeric : null\n}\n\nlet frameHandle: number | null = null\n\nfunction stopCounting(): void {\n  if (frameHandle !== null) cancelAnimationFrame(frameHandle)\n  frameHandle = null\n}\n\n/**\n * Перебор чисел ведёт JS, а глобальный кламп в `base.css` гасит только CSS —\n * значит уважать «уменьшить движение» обязан сам компонент (`docs/motion.md`).\n * Читается в момент старта, а не в теле `setup`: `matchMedia` на сервере нет, и\n * первый клиентский рендер разошёлся бы с серверным.\n */\nfunction prefersReducedMotion(): boolean {\n  return typeof window !== 'undefined'\n    && window.matchMedia?.('(prefers-reduced-motion: reduce)')?.matches === true\n}\n\nfunction runCountUp(from: number, to: number): void {\n  stopCounting()\n\n  const duration = props.animateDuration\n  if (!(duration > 0) || from === to || prefersReducedMotion()) {\n    frameValue.value = null\n    return\n  }\n\n  const started = performance.now()\n  frameValue.value = from\n\n  const step = (now: number): void => {\n    const elapsed = now - started\n    const value = countUpFrame(from, to, elapsed, duration, props.precision)\n\n    if (elapsed >= duration) {\n      // Конец перебора снимает и подмену значения, и подмену для диктора.\n      frameValue.value = null\n      frameHandle = null\n      return\n    }\n\n    frameValue.value = value\n    frameHandle = requestAnimationFrame(step)\n  }\n\n  frameHandle = requestAnimationFrame(step)\n}\n\n/** Перебирать можно только числа: «2 ч 15 мин» и «—» ставятся сразу. */\nfunction startIfNumeric(from: number | string, to: number | string): void {\n  if (!props.animate || props.loading) {\n    stopCounting()\n    frameValue.value = null\n    return\n  }\n\n  const target = toNumber(to)\n  const source = toNumber(from)\n\n  if (target === null || source === null) {\n    stopCounting()\n    frameValue.value = null\n    return\n  }\n\n  runCountUp(source, target)\n}\n\n// Появление плитки считается переходом от нуля: ради этого эффекта проп и нужен.\nonMounted(() => startIfNumeric(0, props.value))\n\nwatch(() => props.value, (next, prev) => startIfNumeric(prev, next))\n\nonBeforeUnmount(stopCounting)\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrStatistic' })\n\nconst trendIconByTrend: Record<GrStatisticTrend, Component> = {\n  up: IconTrendingUp,\n  down: IconTrendingDown,\n  flat: IconMinus,\n}\n\n// Иконка направления `aria-hidden`, а «+12,5 %» само по себе рост от падения не\n// отличает: направление доносит скрытая подпись.\nconst trendLabel = computed(() => {\n  if (!props.trend) return undefined\n\n  const labels = {\n    up: () => t('gr.statistic.trendUp', 'Increase'),\n    down: () => t('gr.statistic.trendDown', 'Decrease'),\n    flat: () => t('gr.statistic.trendFlat', 'No change'),\n  }\n\n  return labels[props.trend]()\n})\n</script>\n\n<template>\n  <component\n    :is=\"rootTag\"\n    data-gr-statistic\n    :type=\"rootTag === 'button' ? 'button' : undefined\"\n    :href=\"rootHref\"\n    :class=\"rootClass\"\n    @click=\"emit('click', $event)\"\n  >\n    <span\n      v-if=\"icon || $slots.icon\"\n      data-gr-statistic-icon\n      class=\"mt-0.5 inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-[var(--gr-radius-lg)] bg-[var(--gr-muted)] text-[var(--gr-muted-fg)]\"\n    >\n      <slot name=\"icon\">\n        <component :is=\"iconTag(icon)\" class=\"block h-4 w-4\" :class=\"iconClass(icon)\" aria-hidden=\"true\" />\n      </slot>\n    </span>\n\n    <div class=\"min-w-0\">\n      <!--\n        Подпись и значение — пара «термин — значение», а не два соседних блока.\n        `<dl>` появляется только вместе с подписью: список определений без `<dt>`\n        — та же бессвязность, только с претензией на семантику. Поля обнуляются\n        руками: preflight пакета сбрасывает их лишь у `body`.\n      -->\n      <component :is=\"hasTitle ? 'dl' : 'div'\" class=\"m-0\">\n        <dt\n          v-if=\"hasTitle\"\n          data-gr-statistic-title\n          :class=\"[statisticTitleClass, statisticTitleSizeBySize[resolvedSize]]\"\n        >\n          <slot name=\"title\">\n            {{ title }}\n          </slot>\n        </dt>\n\n        <!-- Плейсхолдер загрузки повторяет высоту строки значения, чтобы блок не прыгал. -->\n        <component\n          :is=\"hasTitle ? 'dd' : 'div'\"\n          v-if=\"loading\"\n          data-gr-statistic-placeholder\n          data-testid=\"gr-statistic-placeholder\"\n          class=\"m-0 mt-1\"\n          role=\"status\"\n          aria-busy=\"true\"\n        >\n          <GrSkeleton\n            width=\"6rem\"\n            :height=\"statisticPlaceholderHeightBySize[resolvedSize]\"\n            rounded=\"var(--gr-radius-md)\"\n          />\n          <span class=\"sr-only\">{{ t('gr.loading.defaultText', 'Loading...') }}</span>\n        </component>\n\n        <component\n          :is=\"hasTitle ? 'dd' : 'div'\"\n          v-else\n          data-gr-statistic-value\n          data-testid=\"gr-statistic-value\"\n          class=\"m-0 mt-0.5 flex items-baseline gap-1\"\n        >\n          <span\n            v-if=\"prefix || $slots.prefix\"\n            data-gr-statistic-prefix\n            class=\"text-[var(--gr-muted-fg)]\"\n            :class=\"statisticAffixSizeBySize[resolvedSize]\"\n          >\n            <slot name=\"prefix\">{{ prefix }}</slot>\n          </span>\n\n          <span\n            data-gr-statistic-number\n            :class=\"statisticValueClass({ size: resolvedSize, tone })\"\n            :aria-hidden=\"isCounting ? 'true' : undefined\"\n          >\n            <slot>{{ formatted }}</slot>\n          </span>\n\n          <!--\n            Пока идёт перебор, на экране промежуточное число. Диктору отдаётся\n            конечное: «1 284» глазами и «743» в ушах — не шум, а неверные данные.\n          -->\n          <span v-if=\"isCounting\" data-gr-statistic-final class=\"sr-only\">{{ finalFormatted }}</span>\n\n          <span\n            v-if=\"suffix || $slots.suffix\"\n            data-gr-statistic-suffix\n            class=\"text-[var(--gr-muted-fg)]\"\n            :class=\"statisticAffixSizeBySize[resolvedSize]\"\n          >\n            <slot name=\"suffix\">{{ suffix }}</slot>\n          </span>\n        </component>\n      </component>\n\n      <div\n        v-if=\"trend || trendText || $slots.trend\"\n        data-gr-statistic-trend\n        data-testid=\"gr-statistic-trend\"\n        class=\"mt-1 inline-flex items-center gap-1\"\n        :class=\"[statisticTrendSizeBySize[resolvedSize], statisticTrendClassByTrend[trend ?? 'flat']]\"\n      >\n        <span v-if=\"trendLabel\" data-gr-statistic-trend-label class=\"sr-only\">{{ trendLabel }}</span>\n\n        <slot name=\"trend\">\n          <component\n            :is=\"trendIconByTrend[trend]\"\n            v-if=\"trend\"\n            class=\"block h-3.5 w-3.5\"\n            aria-hidden=\"true\"\n          />\n          <span>{{ trendText }}</span>\n        </slot>\n      </div>\n    </div>\n  </component>\n</template>\n","<script setup lang=\"ts\">\nimport { useGrComponentSize } from '../GrConfigProvider/context'\nimport { computed, markRaw, onBeforeUnmount, onMounted, ref, useSlots, watch, type Component } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { iconClass, iconTag } from '../shared/icon'\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\n\nimport IconMinus from '~icons/lucide/minus'\nimport IconTrendingDown from '~icons/lucide/trending-down'\nimport IconTrendingUp from '~icons/lucide/trending-up'\n\nimport { countUpFrame } from './countUp'\nimport { formatStatisticValue } from './formatStatisticValue'\n\nimport {\n  statisticAffixSizeBySize,\n  statisticPlaceholderHeightBySize,\n  statisticRootClass,\n  statisticTitleClass,\n  statisticTitleSizeBySize,\n  statisticTrendClassByTrend,\n  statisticTrendSizeBySize,\n  statisticValueClass,\n  type GrStatisticSize,\n  type GrStatisticTone,\n  type GrStatisticTrend,\n} from './grStatisticStyles'\n\nexport type {\n  GrStatisticSize,\n  GrStatisticTone,\n  GrStatisticTrend,\n} from './grStatisticStyles'\nexport type { GrStatisticFormatOptions } from './formatStatisticValue'\n\n/**\n * Публичный GR-примитив «Statistic» — крупный числовой показатель с подписью,\n * префиксом/суффиксом и строкой динамики.\n *\n * Компонент презентационный: не грузит данные и не считает дельту, только\n * форматирует и подаёт. Форматирование — чистая функция `formatStatisticValue`.\n */\nexport interface GrStatisticProps {\n  /** Значение показателя. Нечисловая строка выводится как есть. */\n  value: number | string\n  /** Подпись над значением. */\n  title?: string\n  /** Число знаков после запятой. */\n  precision?: number\n  /** Разделитель разрядов. Сильнее локали; без него и без локали — узкий пробел. */\n  groupSeparator?: string\n  /** Десятичный разделитель. Сильнее локали; без него и без локали — точка. */\n  decimalSeparator?: string\n  /**\n   * BCP-47 локаль форматирования. Не задана — берётся из i18n-адаптера; нет и\n   * адаптера — работают ручные разделители.\n   */\n  locale?: string\n  /** Приписка перед значением (валюта, знак). */\n  prefix?: string\n  /** Приписка после значения (единица измерения, `%`). */\n  suffix?: string\n  /**\n   * Иконка слева от блока: Vue-компонент либо класс иконки вашей UnoCSS-сборки\n   * (`'i-lucide-users'` — тогда нужен ваш `presetIcons`, см. `docs/installation.md`).\n   */\n  icon?: string | Component\n  size?: GrStatisticSize\n  /** Тон значения; точечно перекрывается `--gr-statistic-value-color`. */\n  tone?: GrStatisticTone\n  /** Направление динамики — задаёт цвет и иконку строки под значением. */\n  trend?: GrStatisticTrend\n  /** Текст динамики (например `+12,5% к прошлой неделе`). */\n  trendText?: string\n  /** Состояние загрузки: вместо значения — плейсхолдер. */\n  loading?: boolean\n  /**\n   * Перебирать числа при появлении и при смене значения. Нечисловое значение\n   * ставится сразу, под `prefers-reduced-motion: reduce` — тоже.\n   */\n  animate?: boolean\n  /**\n   * Длительность перебора в миллисекундах. Не токеном: шкала `--gr-duration-*`\n   * заканчивается на 300 мс и описывает смену состояния, а перебор чисел —\n   * другой жанр, и его число живёт там же, где твин.\n   */\n  animateDuration?: number\n  /** Свой корневой тег (`RouterLink`, `Link` от Inertia). Сильнее `href`. */\n  as?: string | Component\n  /** Показатель-ссылка: переход к деталям. */\n  href?: string\n  /** Показатель-кнопка: интерактивна вся плитка. */\n  clickable?: boolean\n}\n\nexport interface GrStatisticEmits {\n  (e: 'click', event: MouseEvent): void\n}\n\nconst props = withDefaults(\n  defineProps<GrStatisticProps>(),\n  {\n    title: undefined,\n    precision: undefined,\n    // Дефолты живут в `formatStatisticValue`: иначе «пользователь задал пробел»\n    // было бы неотличимо от «сработал дефолт», и локаль не смогла бы победить.\n    groupSeparator: undefined,\n    decimalSeparator: undefined,\n    locale: undefined,\n    prefix: undefined,\n    suffix: undefined,\n    icon: undefined,\n    size: undefined,\n    tone: 'neutral',\n    trend: undefined,\n    trendText: undefined,\n    loading: false,\n    animate: false,\n    animateDuration: 600,\n    as: undefined,\n    href: undefined,\n    clickable: false,\n  },\n)\n\nconst emit = defineEmits<GrStatisticEmits>()\n\nconst slots = useSlots()\n\nconst { t, locale } = useGranularityTranslations()\n\nconst resolvedLocale = computed(() => props.locale ?? locale.value)\n\n/**\n * Число текущего кадра перебора. `null` — перебора нет, показываем сам проп:\n * так значение остаётся конечным и на сервере, и до первого твина.\n */\nconst frameValue = ref<number | null>(null)\n\nconst formatted = computed(() => formatStatisticValue(frameValue.value ?? props.value, {\n  precision: props.precision,\n  groupSeparator: props.groupSeparator,\n  decimalSeparator: props.decimalSeparator,\n  locale: resolvedLocale.value,\n}))\n\n/** Конечное значение — то, что читает диктор, пока на экране идёт перебор. */\nconst finalFormatted = computed(() => formatStatisticValue(props.value, {\n  precision: props.precision,\n  groupSeparator: props.groupSeparator,\n  decimalSeparator: props.decimalSeparator,\n  locale: resolvedLocale.value,\n}))\n\nconst isCounting = computed(() => frameValue.value !== null)\n\nconst hasTitle = computed(() => Boolean(props.title || slots.title))\n\nconst isInteractive = computed(() => Boolean(props.as || props.href || props.clickable))\n\nconst rootTag = computed<string | Component>(() => {\n  if (props.as)\n    return typeof props.as === 'string' ? props.as : markRaw(props.as)\n\n  if (props.href)\n    return 'a'\n\n  return props.clickable ? 'button' : 'div'\n})\n\n/**\n * Компонент-ссылка (`Link` от Inertia, `RouterLink`) рендерит `<a>` сам, и без\n * `href` он ведёт в никуда. Строковый тег, кроме `a`, атрибут не понимает —\n * там он и гасится.\n */\nconst rootHref = computed(() => (\n  typeof rootTag.value === 'string' && rootTag.value !== 'a' ? undefined : props.href\n))\n\nconst rootClass = computed(() => statisticRootClass({ interactive: isInteractive.value }))\n\nfunction toNumber(value: number | string): number | null {\n  const numeric = typeof value === 'number' ? value : Number(value)\n  return Number.isFinite(numeric) ? numeric : null\n}\n\nlet frameHandle: number | null = null\n\nfunction stopCounting(): void {\n  if (frameHandle !== null) cancelAnimationFrame(frameHandle)\n  frameHandle = null\n}\n\n/**\n * Перебор чисел ведёт JS, а глобальный кламп в `base.css` гасит только CSS —\n * значит уважать «уменьшить движение» обязан сам компонент (`docs/motion.md`).\n * Читается в момент старта, а не в теле `setup`: `matchMedia` на сервере нет, и\n * первый клиентский рендер разошёлся бы с серверным.\n */\nfunction prefersReducedMotion(): boolean {\n  return typeof window !== 'undefined'\n    && window.matchMedia?.('(prefers-reduced-motion: reduce)')?.matches === true\n}\n\nfunction runCountUp(from: number, to: number): void {\n  stopCounting()\n\n  const duration = props.animateDuration\n  if (!(duration > 0) || from === to || prefersReducedMotion()) {\n    frameValue.value = null\n    return\n  }\n\n  const started = performance.now()\n  frameValue.value = from\n\n  const step = (now: number): void => {\n    const elapsed = now - started\n    const value = countUpFrame(from, to, elapsed, duration, props.precision)\n\n    if (elapsed >= duration) {\n      // Конец перебора снимает и подмену значения, и подмену для диктора.\n      frameValue.value = null\n      frameHandle = null\n      return\n    }\n\n    frameValue.value = value\n    frameHandle = requestAnimationFrame(step)\n  }\n\n  frameHandle = requestAnimationFrame(step)\n}\n\n/** Перебирать можно только числа: «2 ч 15 мин» и «—» ставятся сразу. */\nfunction startIfNumeric(from: number | string, to: number | string): void {\n  if (!props.animate || props.loading) {\n    stopCounting()\n    frameValue.value = null\n    return\n  }\n\n  const target = toNumber(to)\n  const source = toNumber(from)\n\n  if (target === null || source === null) {\n    stopCounting()\n    frameValue.value = null\n    return\n  }\n\n  runCountUp(source, target)\n}\n\n// Появление плитки считается переходом от нуля: ради этого эффекта проп и нужен.\nonMounted(() => startIfNumeric(0, props.value))\n\nwatch(() => props.value, (next, prev) => startIfNumeric(prev, next))\n\nonBeforeUnmount(stopCounting)\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrStatistic' })\n\nconst trendIconByTrend: Record<GrStatisticTrend, Component> = {\n  up: IconTrendingUp,\n  down: IconTrendingDown,\n  flat: IconMinus,\n}\n\n// Иконка направления `aria-hidden`, а «+12,5 %» само по себе рост от падения не\n// отличает: направление доносит скрытая подпись.\nconst trendLabel = computed(() => {\n  if (!props.trend) return undefined\n\n  const labels = {\n    up: () => t('gr.statistic.trendUp', 'Increase'),\n    down: () => t('gr.statistic.trendDown', 'Decrease'),\n    flat: () => t('gr.statistic.trendFlat', 'No change'),\n  }\n\n  return labels[props.trend]()\n})\n</script>\n\n<template>\n  <component\n    :is=\"rootTag\"\n    data-gr-statistic\n    :type=\"rootTag === 'button' ? 'button' : undefined\"\n    :href=\"rootHref\"\n    :class=\"rootClass\"\n    @click=\"emit('click', $event)\"\n  >\n    <span\n      v-if=\"icon || $slots.icon\"\n      data-gr-statistic-icon\n      class=\"mt-0.5 inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-[var(--gr-radius-lg)] bg-[var(--gr-muted)] text-[var(--gr-muted-fg)]\"\n    >\n      <slot name=\"icon\">\n        <component :is=\"iconTag(icon)\" class=\"block h-4 w-4\" :class=\"iconClass(icon)\" aria-hidden=\"true\" />\n      </slot>\n    </span>\n\n    <div class=\"min-w-0\">\n      <!--\n        Подпись и значение — пара «термин — значение», а не два соседних блока.\n        `<dl>` появляется только вместе с подписью: список определений без `<dt>`\n        — та же бессвязность, только с претензией на семантику. Поля обнуляются\n        руками: preflight пакета сбрасывает их лишь у `body`.\n      -->\n      <component :is=\"hasTitle ? 'dl' : 'div'\" class=\"m-0\">\n        <dt\n          v-if=\"hasTitle\"\n          data-gr-statistic-title\n          :class=\"[statisticTitleClass, statisticTitleSizeBySize[resolvedSize]]\"\n        >\n          <slot name=\"title\">\n            {{ title }}\n          </slot>\n        </dt>\n\n        <!-- Плейсхолдер загрузки повторяет высоту строки значения, чтобы блок не прыгал. -->\n        <component\n          :is=\"hasTitle ? 'dd' : 'div'\"\n          v-if=\"loading\"\n          data-gr-statistic-placeholder\n          data-testid=\"gr-statistic-placeholder\"\n          class=\"m-0 mt-1\"\n          role=\"status\"\n          aria-busy=\"true\"\n        >\n          <GrSkeleton\n            width=\"6rem\"\n            :height=\"statisticPlaceholderHeightBySize[resolvedSize]\"\n            rounded=\"var(--gr-radius-md)\"\n          />\n          <span class=\"sr-only\">{{ t('gr.loading.defaultText', 'Loading...') }}</span>\n        </component>\n\n        <component\n          :is=\"hasTitle ? 'dd' : 'div'\"\n          v-else\n          data-gr-statistic-value\n          data-testid=\"gr-statistic-value\"\n          class=\"m-0 mt-0.5 flex items-baseline gap-1\"\n        >\n          <span\n            v-if=\"prefix || $slots.prefix\"\n            data-gr-statistic-prefix\n            class=\"text-[var(--gr-muted-fg)]\"\n            :class=\"statisticAffixSizeBySize[resolvedSize]\"\n          >\n            <slot name=\"prefix\">{{ prefix }}</slot>\n          </span>\n\n          <span\n            data-gr-statistic-number\n            :class=\"statisticValueClass({ size: resolvedSize, tone })\"\n            :aria-hidden=\"isCounting ? 'true' : undefined\"\n          >\n            <slot>{{ formatted }}</slot>\n          </span>\n\n          <!--\n            Пока идёт перебор, на экране промежуточное число. Диктору отдаётся\n            конечное: «1 284» глазами и «743» в ушах — не шум, а неверные данные.\n          -->\n          <span v-if=\"isCounting\" data-gr-statistic-final class=\"sr-only\">{{ finalFormatted }}</span>\n\n          <span\n            v-if=\"suffix || $slots.suffix\"\n            data-gr-statistic-suffix\n            class=\"text-[var(--gr-muted-fg)]\"\n            :class=\"statisticAffixSizeBySize[resolvedSize]\"\n          >\n            <slot name=\"suffix\">{{ suffix }}</slot>\n          </span>\n        </component>\n      </component>\n\n      <div\n        v-if=\"trend || trendText || $slots.trend\"\n        data-gr-statistic-trend\n        data-testid=\"gr-statistic-trend\"\n        class=\"mt-1 inline-flex items-center gap-1\"\n        :class=\"[statisticTrendSizeBySize[resolvedSize], statisticTrendClassByTrend[trend ?? 'flat']]\"\n      >\n        <span v-if=\"trendLabel\" data-gr-statistic-trend-label class=\"sr-only\">{{ trendLabel }}</span>\n\n        <slot name=\"trend\">\n          <component\n            :is=\"trendIconByTrend[trend]\"\n            v-if=\"trend\"\n            class=\"block h-3.5 w-3.5\"\n            aria-hidden=\"true\"\n          />\n          <span>{{ trendText }}</span>\n        </slot>\n      </div>\n    </div>\n  </component>\n</template>\n"],"mappings":"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"}

package/dist/components/GrStatistic/index.js

@@ -1,3 +1,3 @@
-import { n as formatStatisticValue, t as GrStatistic_default } from "./chunks/GrStatistic-C3VpykHo.js";
+import { n as formatStatisticValue, t as GrStatistic_default } from "./chunks/GrStatistic-DkzWUAw1.js";
 import { n as grStatisticSafelist, t as grStatisticConfig } from "../../chunks/config-Be9k9bOf.js";
 export { GrStatistic_default as GrStatistic, GrStatistic_default as default, formatStatisticValue, grStatisticConfig, grStatisticSafelist };

package/dist/components/GrTabPanels/index.js

@@ -1,3 +1,3 @@
 import { n as GrTabPanels_default, t as GrTabPanel_default } from "./chunks/GrTabPanels-AJt1w1XC.js";
-import { t as grTabPanelsConfig } from "../../chunks/config-eXB87DOi2.js";
+import { t as grTabPanelsConfig } from "../../chunks/config-eXB87DOi.js";
 export { GrTabPanel_default as GrTabPanel, GrTabPanels_default as GrTabPanels, GrTabPanels_default as default, grTabPanelsConfig };

package/dist/components/GrTextarea/index.js

@@ -1,3 +1,3 @@
 import { t as GrTextarea_default } from "./chunks/GrTextarea-CNnkcIG1.js";
-import { n as grTextareaSafelist, t as grTextareaConfig } from "../../chunks/config-BDfTXHo12.js";
+import { n as grTextareaSafelist, t as grTextareaConfig } from "../../chunks/config-BDfTXHo1.js";
 export { GrTextarea_default as GrTextarea, GrTextarea_default as default, grTextareaConfig, grTextareaSafelist };

package/dist/components/GrTimeline/chunks/{GrTimeline-DlTraRn5.js → GrTimeline-Ch9sHzwL.js}

@@ -2,7 +2,7 @@ import { i as useGrComponentProp } from "../../../chunks/context-CTbuwcYs.js";
 import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
 import { t as GrSkeleton_default } from "../../GrSkeleton/chunks/GrSkeleton-CgfXxPQ2.js";
 import { n as hasMeaningfulSlotContent } from "../../../chunks/slotNodes-DxNXpC7v.js";
-import { a as grTimelineDensityClass, c as loadingRowClass, i as emptyClass, l as timeClass, o as grTimelineMarkerClass, r as descriptionClass, s as groupTitleClass, u as titleClass } from "../../../chunks/config-COpuWGr_2.js";
+import { a as grTimelineDensityClass, c as loadingRowClass, i as emptyClass, l as timeClass, o as grTimelineMarkerClass, r as descriptionClass, s as groupTitleClass, u as titleClass } from "../../../chunks/config-COpuWGr_.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, normalizeClass, openBlock, provide, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, withCtx } from "vue";
 import '../styles.css';//#region src/components/GrTimeline/grTimelineContext.ts
 var GR_TIMELINE_CONTEXT = Symbol("GR_TIMELINE_CONTEXT");

package/dist/components/GrTimeline/chunks/GrTimeline-Ch9sHzwL.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrTimeline-Ch9sHzwL.js","names":["$slots"],"sources":["../../../../src/components/GrTimeline/grTimelineContext.ts","../../../../src/components/GrTimeline/timelineGroups.ts","../../../../src/components/GrTimeline/GrTimeline.vue","../../../../src/components/GrTimeline/GrTimeline.vue","../../../../src/components/GrTimeline/GrTimelineItem.vue","../../../../src/components/GrTimeline/GrTimelineItem.vue"],"sourcesContent":["import type { ComputedRef, InjectionKey } from 'vue'\n\nimport type { GrTimelineDensity, GrTimelineLayout, GrTimelineOrientation } from './grTimelineStyles'\n\n/**\n * Уровень заголовка группы. Тот же довод, что у `GrCollapse`: лента в разделе\n * `<h4>` с захардкоженным `<h3>` рвёт навигацию по заголовкам.\n */\nexport const GR_TIMELINE_HEADING_LEVELS = [2, 3, 4, 5, 6] as const\n\nexport type GrTimelineHeadingLevel = typeof GR_TIMELINE_HEADING_LEVELS[number]\n\n/**\n * Пункт читает раскладку из контейнера, а не получает её пропом: иначе\n * `layout` пришлось бы дублировать на каждом `GrTimelineItem`.\n */\nexport interface GrTimelineContext {\n  layout: ComputedRef<GrTimelineLayout>\n  orientation: ComputedRef<GrTimelineOrientation>\n  density: ComputedRef<GrTimelineDensity>\n}\n\nexport const GR_TIMELINE_CONTEXT: InjectionKey<GrTimelineContext> = Symbol('GR_TIMELINE_CONTEXT')\n","/**\n * Группировка ленты событий. Без Vue — чтобы проверялась без монтирования.\n */\n\nexport type GrTimelineGroupBy<T> = string | ((item: T, index: number) => string)\n\n/** Пункт вместе с его позицией в исходном наборе: ключи `v-for` считаются от неё. */\nexport interface GrTimelineEntry<T> {\n  item: T\n  index: number\n}\n\nexport interface GrTimelineGroup<T> {\n  /** Ключ группы. Пустая строка — заголовка у группы нет. */\n  key: string\n  entries: GrTimelineEntry<T>[]\n}\n\nfunction keyOf<T>(item: T, index: number, groupBy: GrTimelineGroupBy<T>): string {\n  if (typeof groupBy === 'function')\n    return String(groupBy(item, index) ?? '')\n\n  const value = (item as Record<string, unknown> | null | undefined)?.[groupBy]\n\n  // `undefined` в поле — это «группы нет», а не группа с надписью «undefined».\n  return value == null ? '' : String(value)\n}\n\n/**\n * Режет набор на группы, **не меняя порядок**: лента хронологична, и\n * пересортировать её компонент не вправе. Порядок групп — порядок первого\n * вхождения ключа; разорванная группа (`A B A`) собирается в одну.\n *\n * Без `groupBy` — одна безымянная группа: плоская лента остаётся частным\n * случаем, и второй ветки рендера у компонента не появляется.\n */\nexport function groupTimelineItems<T>(\n  items: readonly T[],\n  groupBy?: GrTimelineGroupBy<T>,\n): GrTimelineGroup<T>[] {\n  const entries = items.map((item, index) => ({ item, index }))\n\n  if (groupBy === undefined)\n    return entries.length === 0 ? [] : [{ key: '', entries }]\n\n  const byKey = new Map<string, GrTimelineGroup<T>>()\n\n  for (const entry of entries) {\n    const key = keyOf(entry.item, entry.index, groupBy)\n    const group = byKey.get(key)\n\n    if (group)\n      group.entries.push(entry)\n    else\n      byKey.set(key, { key, entries: [entry] })\n  }\n\n  return [...byKey.values()]\n}\n","<script setup lang=\"ts\" generic=\"T = unknown\">\nimport { computed, provide, useSlots, watch } from 'vue'\n\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { useGrComponentProp } from '../GrConfigProvider/context'\nimport { hasMeaningfulSlotContent } from '../shared/slotNodes'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport { GR_TIMELINE_CONTEXT, type GrTimelineHeadingLevel } from './grTimelineContext'\nimport {\n  emptyClass,\n  groupTitleClass,\n  loadingRowClass,\n  type GrTimelineDensity,\n  type GrTimelineLayout,\n  type GrTimelineOrientation,\n} from './grTimelineStyles'\nimport { groupTimelineItems, type GrTimelineGroupBy } from './timelineGroups'\n\nexport type {\n  GrTimelineDensity,\n  GrTimelineLayout,\n  GrTimelineOrientation,\n} from './grTimelineStyles'\nexport type { GrTimelineGroupBy } from './timelineGroups'\n\nexport interface GrTimelineProps<TItem = unknown> {\n  /**\n   * Данные ленты. С ними пункты рисует слот `#item` — и только так лента знает\n   * состав набора, то есть может его группировать.\n   */\n  items?: TItem[]\n  /** Ключ пункта для `v-for`: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Группировка: имя поля или функция от пункта. Заголовок группы — слот `#group`. */\n  groupBy?: GrTimelineGroupBy<TItem>\n  /** Уровень заголовка группы: лента обязана вписаться в структуру заголовков страницы. */\n  groupHeadingLevel?: GrTimelineHeadingLevel\n  /** Раскладка: одна ось, колонка времени слева или чередование сторон. */\n  layout?: GrTimelineLayout\n  /** Направление оси. Горизонтальная лента — скроллер. */\n  orientation?: GrTimelineOrientation\n  /** Плотность вертикальных отступов пункта. */\n  density?: GrTimelineDensity\n  /** Идёт загрузка: вместо пунктов — заглушки, контейнер помечен `aria-busy`. */\n  loading?: boolean\n  /** Сколько строк-заглушек показать при `loading`. */\n  loadingRows?: number\n  /**\n   * Лента пуста. По умолчанию определяется сама — по данным или по слоту; проп\n   * нужен там, где потребитель знает лучше.\n   */\n  empty?: boolean\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n}\n\nconst props = withDefaults(defineProps<GrTimelineProps<T>>(), {\n  items: undefined,\n  itemKey: undefined,\n  groupBy: undefined,\n  // Настоящие дефолты живут в резолверах `useGrComponentProp`: объявленный здесь\n  // дефолт неотличим от значения, переданного потребителем, и перебивал бы конфиг.\n  groupHeadingLevel: undefined,\n  layout: undefined,\n  orientation: undefined,\n  density: undefined,\n  loading: false,\n  loadingRows: 3,\n  empty: undefined,\n  emptyText: undefined,\n})\n\ndefineSlots<{\n  /** Пункты ленты (`GrTimelineItem`), когда данные не переданы пропом. */\n  default?: () => any\n  /** Пункт в data-режиме. */\n  item?: (props: { item: T, index: number }) => any\n  /** Заголовок группы. По умолчанию — сам ключ. */\n  group?: (props: { group: string, items: T[] }) => any\n  /** Содержимое пустого состояния вместо текста по умолчанию. */\n  empty?: () => any\n  /** Заглушки загрузки вместо строк по умолчанию. */\n  loading?: () => any\n}>()\n\nconst slots = useSlots()\nconst { t } = useGranularityTranslations()\n\nconst density = useGrComponentProp('GrTimeline', 'density', () => props.density, 'regular')\nconst orientation = useGrComponentProp('GrTimeline', 'orientation', () => props.orientation, 'vertical')\nconst headingLevel = useGrComponentProp('GrTimeline', 'groupHeadingLevel', () => props.groupHeadingLevel, 3)\nconst requestedLayout = useGrComponentProp('GrTimeline', 'layout', () => props.layout, 'stacked')\n\n/**\n * Горизонтальная лента знает одну раскладку: колонка времени и чередование\n * сторон — это вертикальные приёмы, у горизонтальной оси сторон нет.\n */\nconst layout = computed<GrTimelineLayout>(() => (\n  orientation.value === 'horizontal' ? 'stacked' : requestedLayout.value\n))\n\nconst headingTag = computed(() => `h${headingLevel.value}`)\n\nconst dataMode = computed(() => props.items !== undefined)\n\nconst grouped = computed(() => dataMode.value && props.groupBy !== undefined)\n\nconst groups = computed(() => groupTimelineItems(props.items ?? [], props.groupBy))\n\n/** Единственная группа плоской ленты: тот же набор, что и в data-режиме без группировки. */\nconst entries = computed(() => groups.value[0]?.entries ?? [])\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.timeline.empty', 'Nothing here yet'))\n\nconst isEmpty = computed(() => {\n  if (props.empty !== undefined) return props.empty\n\n  if (dataMode.value) return props.items!.length === 0\n\n  // `v-for` по пустому массиву оставляет фрагмент без узлов, `v-if` — комментарий,\n  // и ни то ни другое пунктом ленты не является.\n  return !hasMeaningfulSlotContent(slots.default?.() ?? [])\n})\n\nconst loadingRowCount = computed(() => Math.max(1, Math.trunc(props.loadingRows)))\n\nfunction keyOf(item: T, index: number): string | number {\n  const key = props.itemKey\n  if (typeof key === 'function') return key(item, index)\n  if (typeof key === 'string') return (item as Record<string, unknown>)[key] as string | number\n\n  return index\n}\n\nfunction itemsOf(group: { entries: { item: T }[] }): T[] {\n  return group.entries.map(entry => entry.item)\n}\n\nprovide(GR_TIMELINE_CONTEXT, { layout, orientation, density })\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [dataMode.value, Boolean(slots.item)] as const,\n    ([hasItems, hasSlot]) => {\n      if (hasItems && !hasSlot) {\n        console.warn(\n          '[granularity] GrTimeline: с `items` пункты рисует слот `#item` — без него лента пуста.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  watch(\n    () => [dataMode.value, props.groupBy !== undefined] as const,\n    ([hasItems, hasGroupBy]) => {\n      if (hasGroupBy && !hasItems) {\n        console.warn(\n          '[granularity] GrTimeline: `groupBy` работает только с `items` — пункты из слота по '\n          + 'умолчанию лента не разбирает и сгруппировать их ей не из чего.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  watch(\n    () => [orientation.value, requestedLayout.value] as const,\n    ([axis, requested]) => {\n      if (axis === 'horizontal' && requested !== 'stacked') {\n        console.warn(\n          `[granularity] GrTimeline: layout=\"${requested}\" — вертикальная раскладка, `\n          + 'в горизонтальной ленте она игнорируется.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n}\n</script>\n\n<template>\n  <div\n    data-gr-timeline\n    :data-layout=\"layout\"\n    :data-orientation=\"orientation\"\n    :aria-busy=\"loading ? 'true' : undefined\"\n  >\n    <template v-if=\"loading\">\n      <slot name=\"loading\">\n        <div\n          v-for=\"row in loadingRowCount\"\n          :key=\"row\"\n          data-gr-timeline-loading-row\n          :class=\"loadingRowClass\"\n        >\n          <GrSkeleton variant=\"circle\" width=\"var(--gr-timeline-marker-size, 10px)\" />\n          <GrSkeleton />\n        </div>\n      </slot>\n    </template>\n\n    <div\n      v-else-if=\"isEmpty\"\n      data-gr-timeline-empty\n      :class=\"emptyClass\"\n    >\n      <slot name=\"empty\">\n        {{ resolvedEmptyText }}\n      </slot>\n    </div>\n\n    <template v-else-if=\"grouped\">\n      <!--\n        Группа — секция с заголовком, а не пункт-заголовок внутри списка:\n        `<li>` с датой попал бы в набор событий и был бы объявлен как одно из них.\n      -->\n      <section\n        v-for=\"group in groups\"\n        :key=\"group.key\"\n        data-gr-timeline-group\n      >\n        <div\n          v-if=\"group.key\"\n          data-gr-timeline-group-header\n        >\n          <div data-gr-timeline-rail aria-hidden=\"true\">\n            <span data-gr-timeline-line />\n          </div>\n\n          <component\n            :is=\"headingTag\"\n            data-gr-timeline-group-title\n            :class=\"groupTitleClass\"\n          >\n            <slot name=\"group\" :group=\"group.key\" :items=\"itemsOf(group)\">\n              {{ group.key }}\n            </slot>\n          </component>\n        </div>\n\n        <ol\n          data-gr-timeline-list\n          :tabindex=\"orientation === 'horizontal' ? 0 : undefined\"\n        >\n          <template\n            v-for=\"entry in group.entries\"\n            :key=\"keyOf(entry.item, entry.index)\"\n          >\n            <slot name=\"item\" :item=\"entry.item\" :index=\"entry.index\" />\n          </template>\n        </ol>\n      </section>\n    </template>\n\n    <ol\n      v-else\n      data-gr-timeline-list\n      :tabindex=\"orientation === 'horizontal' ? 0 : undefined\"\n    >\n      <template v-if=\"dataMode\">\n        <template\n          v-for=\"entry in entries\"\n          :key=\"keyOf(entry.item, entry.index)\"\n        >\n          <slot name=\"item\" :item=\"entry.item\" :index=\"entry.index\" />\n        </template>\n      </template>\n\n      <slot v-else />\n    </ol>\n  </div>\n</template>\n\n<style>\n/*\n * Геометрия ленты живёт здесь, а не в утилитах, по одной причине: сторона\n * пункта в `alternate` — это `nth-child`, а обрыв оси — `last-child`, и оба\n * вопроса утилитами не выражаются. Альтернатива — регистрация пунктов в\n * контексте на `onMounted` — дала бы порядок, зависящий от порядка монтирования,\n * и разъезжалась бы на `v-if` посреди ленты.\n */\n\n[data-gr-timeline] {\n  --gr-timeline-columns: auto 1fr;\n}\n\n[data-gr-timeline][data-layout='time'] {\n  --gr-timeline-columns: var(--gr-timeline-time-width, 5.5rem) auto 1fr;\n}\n\n[data-gr-timeline][data-layout='alternate'] {\n  --gr-timeline-columns: 1fr auto 1fr;\n}\n\n[data-gr-timeline-list] {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n[data-gr-timeline-item],\n[data-gr-timeline-group-header] {\n  display: grid;\n  grid-template-columns: var(--gr-timeline-columns);\n  column-gap: var(--gr-timeline-gap, 0.75rem);\n  align-items: start;\n}\n\n[data-gr-timeline-aside] {\n  text-align: end;\n}\n\n/*\n * Ось — отрезок у каждого пункта, а не одна длинная линия: соседние отрезки\n * смыкаются сами, и мерить высоту списка не приходится.\n */\n[data-gr-timeline-rail] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  align-self: stretch;\n  padding-top: var(--gr-timeline-marker-top, 0.35rem);\n  min-width: var(--gr-timeline-marker-size, 10px);\n}\n\n[data-gr-timeline-rail] > :not([data-gr-timeline-line]) {\n  flex: none;\n}\n\n[data-gr-timeline-marker] {\n  box-sizing: border-box;\n  width: var(--gr-timeline-marker-size, 10px);\n  height: var(--gr-timeline-marker-size, 10px);\n  border-width: var(--gr-timeline-marker-ring, 2px);\n  border-style: solid;\n  border-color: transparent;\n}\n\n[data-gr-timeline-line] {\n  flex: 1 1 auto;\n  width: var(--gr-timeline-axis-width, 2px);\n  min-height: var(--gr-timeline-line-min, 0.75rem);\n  margin-top: 0.25rem;\n  /* Ровно на столько следующая точка отступает от верха своей строки: без этого\n     отрезок не доходит до неё, и ось выглядит пунктиром из длинных штрихов. */\n  margin-bottom: calc(-1 * var(--gr-timeline-marker-top, 0.35rem));\n  background-color: var(--gr-timeline-axis-color, var(--gr-brd));\n}\n\n/*\n * Пунктиром идёт участок, ведущий **к** незавершённому событию, и всё, что за\n * ним: непройденный путь. Отрезок после точки для этого не годится — обычно\n * незавершённое событие последнее, и его отрезка не видно вовсе.\n */\n[data-gr-timeline-item]:has(+ [data-gr-timeline-item][data-pending]) [data-gr-timeline-line],\n[data-gr-timeline-item][data-pending] [data-gr-timeline-line] {\n  background-color: transparent;\n  background-image: repeating-linear-gradient(\n    to bottom,\n    var(--gr-timeline-axis-color, var(--gr-brd)) 0 var(--gr-timeline-dash, 4px),\n    transparent var(--gr-timeline-dash, 4px) calc(var(--gr-timeline-dash, 4px) * 2)\n  );\n}\n\n/* Хвост после последнего события — линия в никуда. */\n[data-gr-timeline-item]:last-child [data-gr-timeline-line] {\n  visibility: hidden;\n}\n\n/* Между группами ось не рвётся: разрыв читался бы как две разные ленты. */\n[data-gr-timeline-group]:not(:last-of-type) [data-gr-timeline-item]:last-child [data-gr-timeline-line] {\n  visibility: visible;\n}\n\n[data-gr-timeline-group-header] [data-gr-timeline-rail] {\n  padding-top: 0;\n}\n\n[data-gr-timeline-group] + [data-gr-timeline-group] [data-gr-timeline-group-title] {\n  padding-top: 0.5rem;\n}\n\n[data-gr-timeline-group-header] [data-gr-timeline-line] {\n  margin-top: 0;\n}\n\n/* Над первым заголовком оси ещё нет — линия висела бы в воздухе. */\n[data-gr-timeline-group]:first-of-type [data-gr-timeline-group-header] [data-gr-timeline-line] {\n  visibility: hidden;\n}\n\n[data-gr-timeline][data-layout='time'] [data-gr-timeline-group-header] [data-gr-timeline-rail],\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-group-header] [data-gr-timeline-rail] {\n  grid-column: 2;\n}\n\n[data-gr-timeline][data-layout='time'] [data-gr-timeline-group-title],\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-group-title] {\n  grid-column: 3;\n}\n\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-rail] {\n  grid-column: 2;\n}\n\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-content] {\n  grid-column: 3;\n}\n\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-item]:nth-child(even) [data-gr-timeline-content] {\n  grid-column: 1;\n  grid-row: 1;\n  text-align: end;\n}\n\n/* Двухсторонняя лента в узкой колонке нечитаема — там она односторонняя. */\n@media (max-width: 640px) {\n  [data-gr-timeline][data-layout='alternate'] {\n    --gr-timeline-columns: auto 1fr;\n  }\n\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-rail],\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-group-header] [data-gr-timeline-rail] {\n    grid-column: 1;\n  }\n\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-content],\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-item]:nth-child(even) [data-gr-timeline-content],\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-group-title] {\n    grid-column: 2;\n    text-align: start;\n  }\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-list] {\n  display: flex;\n  flex-direction: row;\n  overflow-x: auto;\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-item] {\n  grid-template-columns: 1fr;\n  min-width: var(--gr-timeline-item-min-width, 12rem);\n  padding-inline-end: var(--gr-timeline-gap, 0.75rem);\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-content] {\n  padding-bottom: 0;\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-rail] {\n  flex-direction: row;\n  align-items: center;\n  align-self: auto;\n  padding-top: 0;\n  padding-bottom: 0.25rem;\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-line] {\n  width: auto;\n  height: var(--gr-timeline-axis-width, 2px);\n  min-width: var(--gr-timeline-line-min, 0.75rem);\n  min-height: 0;\n  margin-top: 0;\n  margin-inline-start: 0.25rem;\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-item]:has(+ [data-gr-timeline-item][data-pending]) [data-gr-timeline-line],\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-item][data-pending] [data-gr-timeline-line] {\n  background-image: repeating-linear-gradient(\n    to right,\n    var(--gr-timeline-axis-color, var(--gr-brd)) 0 var(--gr-timeline-dash, 4px),\n    transparent var(--gr-timeline-dash, 4px) calc(var(--gr-timeline-dash, 4px) * 2)\n  );\n}\n</style>\n","<script setup lang=\"ts\" generic=\"T = unknown\">\nimport { computed, provide, useSlots, watch } from 'vue'\n\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { useGrComponentProp } from '../GrConfigProvider/context'\nimport { hasMeaningfulSlotContent } from '../shared/slotNodes'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport { GR_TIMELINE_CONTEXT, type GrTimelineHeadingLevel } from './grTimelineContext'\nimport {\n  emptyClass,\n  groupTitleClass,\n  loadingRowClass,\n  type GrTimelineDensity,\n  type GrTimelineLayout,\n  type GrTimelineOrientation,\n} from './grTimelineStyles'\nimport { groupTimelineItems, type GrTimelineGroupBy } from './timelineGroups'\n\nexport type {\n  GrTimelineDensity,\n  GrTimelineLayout,\n  GrTimelineOrientation,\n} from './grTimelineStyles'\nexport type { GrTimelineGroupBy } from './timelineGroups'\n\nexport interface GrTimelineProps<TItem = unknown> {\n  /**\n   * Данные ленты. С ними пункты рисует слот `#item` — и только так лента знает\n   * состав набора, то есть может его группировать.\n   */\n  items?: TItem[]\n  /** Ключ пункта для `v-for`: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Группировка: имя поля или функция от пункта. Заголовок группы — слот `#group`. */\n  groupBy?: GrTimelineGroupBy<TItem>\n  /** Уровень заголовка группы: лента обязана вписаться в структуру заголовков страницы. */\n  groupHeadingLevel?: GrTimelineHeadingLevel\n  /** Раскладка: одна ось, колонка времени слева или чередование сторон. */\n  layout?: GrTimelineLayout\n  /** Направление оси. Горизонтальная лента — скроллер. */\n  orientation?: GrTimelineOrientation\n  /** Плотность вертикальных отступов пункта. */\n  density?: GrTimelineDensity\n  /** Идёт загрузка: вместо пунктов — заглушки, контейнер помечен `aria-busy`. */\n  loading?: boolean\n  /** Сколько строк-заглушек показать при `loading`. */\n  loadingRows?: number\n  /**\n   * Лента пуста. По умолчанию определяется сама — по данным или по слоту; проп\n   * нужен там, где потребитель знает лучше.\n   */\n  empty?: boolean\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n}\n\nconst props = withDefaults(defineProps<GrTimelineProps<T>>(), {\n  items: undefined,\n  itemKey: undefined,\n  groupBy: undefined,\n  // Настоящие дефолты живут в резолверах `useGrComponentProp`: объявленный здесь\n  // дефолт неотличим от значения, переданного потребителем, и перебивал бы конфиг.\n  groupHeadingLevel: undefined,\n  layout: undefined,\n  orientation: undefined,\n  density: undefined,\n  loading: false,\n  loadingRows: 3,\n  empty: undefined,\n  emptyText: undefined,\n})\n\ndefineSlots<{\n  /** Пункты ленты (`GrTimelineItem`), когда данные не переданы пропом. */\n  default?: () => any\n  /** Пункт в data-режиме. */\n  item?: (props: { item: T, index: number }) => any\n  /** Заголовок группы. По умолчанию — сам ключ. */\n  group?: (props: { group: string, items: T[] }) => any\n  /** Содержимое пустого состояния вместо текста по умолчанию. */\n  empty?: () => any\n  /** Заглушки загрузки вместо строк по умолчанию. */\n  loading?: () => any\n}>()\n\nconst slots = useSlots()\nconst { t } = useGranularityTranslations()\n\nconst density = useGrComponentProp('GrTimeline', 'density', () => props.density, 'regular')\nconst orientation = useGrComponentProp('GrTimeline', 'orientation', () => props.orientation, 'vertical')\nconst headingLevel = useGrComponentProp('GrTimeline', 'groupHeadingLevel', () => props.groupHeadingLevel, 3)\nconst requestedLayout = useGrComponentProp('GrTimeline', 'layout', () => props.layout, 'stacked')\n\n/**\n * Горизонтальная лента знает одну раскладку: колонка времени и чередование\n * сторон — это вертикальные приёмы, у горизонтальной оси сторон нет.\n */\nconst layout = computed<GrTimelineLayout>(() => (\n  orientation.value === 'horizontal' ? 'stacked' : requestedLayout.value\n))\n\nconst headingTag = computed(() => `h${headingLevel.value}`)\n\nconst dataMode = computed(() => props.items !== undefined)\n\nconst grouped = computed(() => dataMode.value && props.groupBy !== undefined)\n\nconst groups = computed(() => groupTimelineItems(props.items ?? [], props.groupBy))\n\n/** Единственная группа плоской ленты: тот же набор, что и в data-режиме без группировки. */\nconst entries = computed(() => groups.value[0]?.entries ?? [])\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.timeline.empty', 'Nothing here yet'))\n\nconst isEmpty = computed(() => {\n  if (props.empty !== undefined) return props.empty\n\n  if (dataMode.value) return props.items!.length === 0\n\n  // `v-for` по пустому массиву оставляет фрагмент без узлов, `v-if` — комментарий,\n  // и ни то ни другое пунктом ленты не является.\n  return !hasMeaningfulSlotContent(slots.default?.() ?? [])\n})\n\nconst loadingRowCount = computed(() => Math.max(1, Math.trunc(props.loadingRows)))\n\nfunction keyOf(item: T, index: number): string | number {\n  const key = props.itemKey\n  if (typeof key === 'function') return key(item, index)\n  if (typeof key === 'string') return (item as Record<string, unknown>)[key] as string | number\n\n  return index\n}\n\nfunction itemsOf(group: { entries: { item: T }[] }): T[] {\n  return group.entries.map(entry => entry.item)\n}\n\nprovide(GR_TIMELINE_CONTEXT, { layout, orientation, density })\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [dataMode.value, Boolean(slots.item)] as const,\n    ([hasItems, hasSlot]) => {\n      if (hasItems && !hasSlot) {\n        console.warn(\n          '[granularity] GrTimeline: с `items` пункты рисует слот `#item` — без него лента пуста.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  watch(\n    () => [dataMode.value, props.groupBy !== undefined] as const,\n    ([hasItems, hasGroupBy]) => {\n      if (hasGroupBy && !hasItems) {\n        console.warn(\n          '[granularity] GrTimeline: `groupBy` работает только с `items` — пункты из слота по '\n          + 'умолчанию лента не разбирает и сгруппировать их ей не из чего.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  watch(\n    () => [orientation.value, requestedLayout.value] as const,\n    ([axis, requested]) => {\n      if (axis === 'horizontal' && requested !== 'stacked') {\n        console.warn(\n          `[granularity] GrTimeline: layout=\"${requested}\" — вертикальная раскладка, `\n          + 'в горизонтальной ленте она игнорируется.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n}\n</script>\n\n<template>\n  <div\n    data-gr-timeline\n    :data-layout=\"layout\"\n    :data-orientation=\"orientation\"\n    :aria-busy=\"loading ? 'true' : undefined\"\n  >\n    <template v-if=\"loading\">\n      <slot name=\"loading\">\n        <div\n          v-for=\"row in loadingRowCount\"\n          :key=\"row\"\n          data-gr-timeline-loading-row\n          :class=\"loadingRowClass\"\n        >\n          <GrSkeleton variant=\"circle\" width=\"var(--gr-timeline-marker-size, 10px)\" />\n          <GrSkeleton />\n        </div>\n      </slot>\n    </template>\n\n    <div\n      v-else-if=\"isEmpty\"\n      data-gr-timeline-empty\n      :class=\"emptyClass\"\n    >\n      <slot name=\"empty\">\n        {{ resolvedEmptyText }}\n      </slot>\n    </div>\n\n    <template v-else-if=\"grouped\">\n      <!--\n        Группа — секция с заголовком, а не пункт-заголовок внутри списка:\n        `<li>` с датой попал бы в набор событий и был бы объявлен как одно из них.\n      -->\n      <section\n        v-for=\"group in groups\"\n        :key=\"group.key\"\n        data-gr-timeline-group\n      >\n        <div\n          v-if=\"group.key\"\n          data-gr-timeline-group-header\n        >\n          <div data-gr-timeline-rail aria-hidden=\"true\">\n            <span data-gr-timeline-line />\n          </div>\n\n          <component\n            :is=\"headingTag\"\n            data-gr-timeline-group-title\n            :class=\"groupTitleClass\"\n          >\n            <slot name=\"group\" :group=\"group.key\" :items=\"itemsOf(group)\">\n              {{ group.key }}\n            </slot>\n          </component>\n        </div>\n\n        <ol\n          data-gr-timeline-list\n          :tabindex=\"orientation === 'horizontal' ? 0 : undefined\"\n        >\n          <template\n            v-for=\"entry in group.entries\"\n            :key=\"keyOf(entry.item, entry.index)\"\n          >\n            <slot name=\"item\" :item=\"entry.item\" :index=\"entry.index\" />\n          </template>\n        </ol>\n      </section>\n    </template>\n\n    <ol\n      v-else\n      data-gr-timeline-list\n      :tabindex=\"orientation === 'horizontal' ? 0 : undefined\"\n    >\n      <template v-if=\"dataMode\">\n        <template\n          v-for=\"entry in entries\"\n          :key=\"keyOf(entry.item, entry.index)\"\n        >\n          <slot name=\"item\" :item=\"entry.item\" :index=\"entry.index\" />\n        </template>\n      </template>\n\n      <slot v-else />\n    </ol>\n  </div>\n</template>\n\n<style>\n/*\n * Геометрия ленты живёт здесь, а не в утилитах, по одной причине: сторона\n * пункта в `alternate` — это `nth-child`, а обрыв оси — `last-child`, и оба\n * вопроса утилитами не выражаются. Альтернатива — регистрация пунктов в\n * контексте на `onMounted` — дала бы порядок, зависящий от порядка монтирования,\n * и разъезжалась бы на `v-if` посреди ленты.\n */\n\n[data-gr-timeline] {\n  --gr-timeline-columns: auto 1fr;\n}\n\n[data-gr-timeline][data-layout='time'] {\n  --gr-timeline-columns: var(--gr-timeline-time-width, 5.5rem) auto 1fr;\n}\n\n[data-gr-timeline][data-layout='alternate'] {\n  --gr-timeline-columns: 1fr auto 1fr;\n}\n\n[data-gr-timeline-list] {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n[data-gr-timeline-item],\n[data-gr-timeline-group-header] {\n  display: grid;\n  grid-template-columns: var(--gr-timeline-columns);\n  column-gap: var(--gr-timeline-gap, 0.75rem);\n  align-items: start;\n}\n\n[data-gr-timeline-aside] {\n  text-align: end;\n}\n\n/*\n * Ось — отрезок у каждого пункта, а не одна длинная линия: соседние отрезки\n * смыкаются сами, и мерить высоту списка не приходится.\n */\n[data-gr-timeline-rail] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  align-self: stretch;\n  padding-top: var(--gr-timeline-marker-top, 0.35rem);\n  min-width: var(--gr-timeline-marker-size, 10px);\n}\n\n[data-gr-timeline-rail] > :not([data-gr-timeline-line]) {\n  flex: none;\n}\n\n[data-gr-timeline-marker] {\n  box-sizing: border-box;\n  width: var(--gr-timeline-marker-size, 10px);\n  height: var(--gr-timeline-marker-size, 10px);\n  border-width: var(--gr-timeline-marker-ring, 2px);\n  border-style: solid;\n  border-color: transparent;\n}\n\n[data-gr-timeline-line] {\n  flex: 1 1 auto;\n  width: var(--gr-timeline-axis-width, 2px);\n  min-height: var(--gr-timeline-line-min, 0.75rem);\n  margin-top: 0.25rem;\n  /* Ровно на столько следующая точка отступает от верха своей строки: без этого\n     отрезок не доходит до неё, и ось выглядит пунктиром из длинных штрихов. */\n  margin-bottom: calc(-1 * var(--gr-timeline-marker-top, 0.35rem));\n  background-color: var(--gr-timeline-axis-color, var(--gr-brd));\n}\n\n/*\n * Пунктиром идёт участок, ведущий **к** незавершённому событию, и всё, что за\n * ним: непройденный путь. Отрезок после точки для этого не годится — обычно\n * незавершённое событие последнее, и его отрезка не видно вовсе.\n */\n[data-gr-timeline-item]:has(+ [data-gr-timeline-item][data-pending]) [data-gr-timeline-line],\n[data-gr-timeline-item][data-pending] [data-gr-timeline-line] {\n  background-color: transparent;\n  background-image: repeating-linear-gradient(\n    to bottom,\n    var(--gr-timeline-axis-color, var(--gr-brd)) 0 var(--gr-timeline-dash, 4px),\n    transparent var(--gr-timeline-dash, 4px) calc(var(--gr-timeline-dash, 4px) * 2)\n  );\n}\n\n/* Хвост после последнего события — линия в никуда. */\n[data-gr-timeline-item]:last-child [data-gr-timeline-line] {\n  visibility: hidden;\n}\n\n/* Между группами ось не рвётся: разрыв читался бы как две разные ленты. */\n[data-gr-timeline-group]:not(:last-of-type) [data-gr-timeline-item]:last-child [data-gr-timeline-line] {\n  visibility: visible;\n}\n\n[data-gr-timeline-group-header] [data-gr-timeline-rail] {\n  padding-top: 0;\n}\n\n[data-gr-timeline-group] + [data-gr-timeline-group] [data-gr-timeline-group-title] {\n  padding-top: 0.5rem;\n}\n\n[data-gr-timeline-group-header] [data-gr-timeline-line] {\n  margin-top: 0;\n}\n\n/* Над первым заголовком оси ещё нет — линия висела бы в воздухе. */\n[data-gr-timeline-group]:first-of-type [data-gr-timeline-group-header] [data-gr-timeline-line] {\n  visibility: hidden;\n}\n\n[data-gr-timeline][data-layout='time'] [data-gr-timeline-group-header] [data-gr-timeline-rail],\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-group-header] [data-gr-timeline-rail] {\n  grid-column: 2;\n}\n\n[data-gr-timeline][data-layout='time'] [data-gr-timeline-group-title],\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-group-title] {\n  grid-column: 3;\n}\n\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-rail] {\n  grid-column: 2;\n}\n\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-content] {\n  grid-column: 3;\n}\n\n[data-gr-timeline][data-layout='alternate'] [data-gr-timeline-item]:nth-child(even) [data-gr-timeline-content] {\n  grid-column: 1;\n  grid-row: 1;\n  text-align: end;\n}\n\n/* Двухсторонняя лента в узкой колонке нечитаема — там она односторонняя. */\n@media (max-width: 640px) {\n  [data-gr-timeline][data-layout='alternate'] {\n    --gr-timeline-columns: auto 1fr;\n  }\n\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-rail],\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-group-header] [data-gr-timeline-rail] {\n    grid-column: 1;\n  }\n\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-content],\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-item]:nth-child(even) [data-gr-timeline-content],\n  [data-gr-timeline][data-layout='alternate'] [data-gr-timeline-group-title] {\n    grid-column: 2;\n    text-align: start;\n  }\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-list] {\n  display: flex;\n  flex-direction: row;\n  overflow-x: auto;\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-item] {\n  grid-template-columns: 1fr;\n  min-width: var(--gr-timeline-item-min-width, 12rem);\n  padding-inline-end: var(--gr-timeline-gap, 0.75rem);\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-content] {\n  padding-bottom: 0;\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-rail] {\n  flex-direction: row;\n  align-items: center;\n  align-self: auto;\n  padding-top: 0;\n  padding-bottom: 0.25rem;\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-line] {\n  width: auto;\n  height: var(--gr-timeline-axis-width, 2px);\n  min-width: var(--gr-timeline-line-min, 0.75rem);\n  min-height: 0;\n  margin-top: 0;\n  margin-inline-start: 0.25rem;\n}\n\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-item]:has(+ [data-gr-timeline-item][data-pending]) [data-gr-timeline-line],\n[data-gr-timeline][data-orientation='horizontal'] [data-gr-timeline-item][data-pending] [data-gr-timeline-line] {\n  background-image: repeating-linear-gradient(\n    to right,\n    var(--gr-timeline-axis-color, var(--gr-brd)) 0 var(--gr-timeline-dash, 4px),\n    transparent var(--gr-timeline-dash, 4px) calc(var(--gr-timeline-dash, 4px) * 2)\n  );\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, inject, useSlots } from 'vue'\n\nimport { GR_TIMELINE_CONTEXT } from './grTimelineContext'\nimport {\n  descriptionClass,\n  grTimelineDensityClass,\n  grTimelineMarkerClass,\n  timeClass,\n  titleClass,\n  type GrTimelineMarkerVariant,\n  type GrTimelineTone,\n} from './grTimelineStyles'\n\nexport type { GrTimelineMarkerVariant, GrTimelineTone } from './grTimelineStyles'\n\nexport interface GrTimelineItemProps {\n  /** Метка времени. Слот `#time` сильнее. */\n  time?: string\n  /** Машиночитаемое значение метки: попадает в `datetime` тега `<time>`. */\n  datetime?: string\n  /** Заголовок события. Слот `#title` сильнее. */\n  title?: string\n  /** Пояснение под заголовком. Слот `#description` сильнее. */\n  description?: string\n  /** Цвет маркера из палитры пакета. */\n  tone?: GrTimelineTone\n  /** Заполненная точка — событие случилось, полая — запланировано. */\n  variant?: GrTimelineMarkerVariant\n  /**\n   * Событие ещё не произошло: точка полая, а ось пунктирна начиная с участка,\n   * **ведущего** к нему, — непройденный путь. Перебивает `variant`.\n   */\n  pending?: boolean\n}\n\nconst props = withDefaults(defineProps<GrTimelineItemProps>(), {\n  time: undefined,\n  datetime: undefined,\n  title: undefined,\n  description: undefined,\n  tone: 'neutral',\n  variant: 'filled',\n  pending: false,\n})\n\ndefineSlots<{\n  /** Содержимое события под заголовком и описанием. */\n  default?: () => any\n  /** Маркер вместо точки: иконка статуса, аватар автора, номер шага. */\n  marker?: () => any\n  /** Метка времени. */\n  time?: () => any\n  /** Заголовок события. */\n  title?: () => any\n  /** Пояснение под заголовком. */\n  description?: () => any\n}>()\n\nconst slots = useSlots()\n\n/**\n * Раскладку пункт читает из контейнера. Вне `GrTimeline` — дефолты: пункт\n * остаётся рабочей строкой, а не падает.\n */\nconst timeline = inject(GR_TIMELINE_CONTEXT, null)\n\nconst layout = computed(() => timeline?.layout.value ?? 'stacked')\nconst density = computed(() => timeline?.density.value ?? 'regular')\n\nconst markerClass = computed(() => grTimelineMarkerClass(\n  props.tone,\n  props.pending ? 'outlined' : props.variant,\n))\n\nconst hasTime = computed(() => !!slots.time || !!props.time)\nconst hasTitle = computed(() => !!slots.title || !!props.title)\nconst hasDescription = computed(() => !!slots.description || !!props.description)\n\n/** В `layout=\"time\"` метка уезжает в свою колонку, во всех остальных — в содержимое. */\nconst timeInAside = computed(() => layout.value === 'time')\n</script>\n\n<template>\n  <li\n    data-gr-timeline-item\n    :data-tone=\"tone\"\n    :data-pending=\"pending ? '' : undefined\"\n  >\n    <div\n      v-if=\"timeInAside\"\n      data-gr-timeline-aside\n    >\n      <time\n        v-if=\"hasTime\"\n        :datetime=\"datetime\"\n        :class=\"timeClass\"\n      >\n        <slot name=\"time\">{{ time }}</slot>\n      </time>\n    </div>\n\n    <!-- Ось и точка декоративны: смысл события несёт текст рядом. -->\n    <div\n      data-gr-timeline-rail\n      aria-hidden=\"true\"\n    >\n      <slot name=\"marker\">\n        <span data-gr-timeline-marker :class=\"markerClass\" />\n      </slot>\n      <span data-gr-timeline-line />\n    </div>\n\n    <!--\n      Вертикальный отступ живёт на содержимом, а не на строке: ось растянута по\n      строке грид-ячейкой, и её поля в высоту ячейки не входят — линия обрывалась\n      бы, не доходя до следующей точки.\n    -->\n    <div data-gr-timeline-content :class=\"grTimelineDensityClass(density)\">\n      <time\n        v-if=\"hasTime && !timeInAside\"\n        data-gr-timeline-time\n        :datetime=\"datetime\"\n        :class=\"timeClass\"\n      >\n        <slot name=\"time\">{{ time }}</slot>\n      </time>\n\n      <div v-if=\"hasTitle\" data-gr-timeline-title :class=\"titleClass\">\n        <slot name=\"title\">\n{{ title }}\n</slot>\n      </div>\n\n      <div v-if=\"hasDescription\" :class=\"descriptionClass\">\n        <slot name=\"description\">\n{{ description }}\n</slot>\n      </div>\n\n      <div v-if=\"$slots.default\" data-gr-timeline-body>\n        <slot />\n      </div>\n    </div>\n  </li>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject, useSlots } from 'vue'\n\nimport { GR_TIMELINE_CONTEXT } from './grTimelineContext'\nimport {\n  descriptionClass,\n  grTimelineDensityClass,\n  grTimelineMarkerClass,\n  timeClass,\n  titleClass,\n  type GrTimelineMarkerVariant,\n  type GrTimelineTone,\n} from './grTimelineStyles'\n\nexport type { GrTimelineMarkerVariant, GrTimelineTone } from './grTimelineStyles'\n\nexport interface GrTimelineItemProps {\n  /** Метка времени. Слот `#time` сильнее. */\n  time?: string\n  /** Машиночитаемое значение метки: попадает в `datetime` тега `<time>`. */\n  datetime?: string\n  /** Заголовок события. Слот `#title` сильнее. */\n  title?: string\n  /** Пояснение под заголовком. Слот `#description` сильнее. */\n  description?: string\n  /** Цвет маркера из палитры пакета. */\n  tone?: GrTimelineTone\n  /** Заполненная точка — событие случилось, полая — запланировано. */\n  variant?: GrTimelineMarkerVariant\n  /**\n   * Событие ещё не произошло: точка полая, а ось пунктирна начиная с участка,\n   * **ведущего** к нему, — непройденный путь. Перебивает `variant`.\n   */\n  pending?: boolean\n}\n\nconst props = withDefaults(defineProps<GrTimelineItemProps>(), {\n  time: undefined,\n  datetime: undefined,\n  title: undefined,\n  description: undefined,\n  tone: 'neutral',\n  variant: 'filled',\n  pending: false,\n})\n\ndefineSlots<{\n  /** Содержимое события под заголовком и описанием. */\n  default?: () => any\n  /** Маркер вместо точки: иконка статуса, аватар автора, номер шага. */\n  marker?: () => any\n  /** Метка времени. */\n  time?: () => any\n  /** Заголовок события. */\n  title?: () => any\n  /** Пояснение под заголовком. */\n  description?: () => any\n}>()\n\nconst slots = useSlots()\n\n/**\n * Раскладку пункт читает из контейнера. Вне `GrTimeline` — дефолты: пункт\n * остаётся рабочей строкой, а не падает.\n */\nconst timeline = inject(GR_TIMELINE_CONTEXT, null)\n\nconst layout = computed(() => timeline?.layout.value ?? 'stacked')\nconst density = computed(() => timeline?.density.value ?? 'regular')\n\nconst markerClass = computed(() => grTimelineMarkerClass(\n  props.tone,\n  props.pending ? 'outlined' : props.variant,\n))\n\nconst hasTime = computed(() => !!slots.time || !!props.time)\nconst hasTitle = computed(() => !!slots.title || !!props.title)\nconst hasDescription = computed(() => !!slots.description || !!props.description)\n\n/** В `layout=\"time\"` метка уезжает в свою колонку, во всех остальных — в содержимое. */\nconst timeInAside = computed(() => layout.value === 'time')\n</script>\n\n<template>\n  <li\n    data-gr-timeline-item\n    :data-tone=\"tone\"\n    :data-pending=\"pending ? '' : undefined\"\n  >\n    <div\n      v-if=\"timeInAside\"\n      data-gr-timeline-aside\n    >\n      <time\n        v-if=\"hasTime\"\n        :datetime=\"datetime\"\n        :class=\"timeClass\"\n      >\n        <slot name=\"time\">{{ time }}</slot>\n      </time>\n    </div>\n\n    <!-- Ось и точка декоративны: смысл события несёт текст рядом. -->\n    <div\n      data-gr-timeline-rail\n      aria-hidden=\"true\"\n    >\n      <slot name=\"marker\">\n        <span data-gr-timeline-marker :class=\"markerClass\" />\n      </slot>\n      <span data-gr-timeline-line />\n    </div>\n\n    <!--\n      Вертикальный отступ живёт на содержимом, а не на строке: ось растянута по\n      строке грид-ячейкой, и её поля в высоту ячейки не входят — линия обрывалась\n      бы, не доходя до следующей точки.\n    -->\n    <div data-gr-timeline-content :class=\"grTimelineDensityClass(density)\">\n      <time\n        v-if=\"hasTime && !timeInAside\"\n        data-gr-timeline-time\n        :datetime=\"datetime\"\n        :class=\"timeClass\"\n      >\n        <slot name=\"time\">{{ time }}</slot>\n      </time>\n\n      <div v-if=\"hasTitle\" data-gr-timeline-title :class=\"titleClass\">\n        <slot name=\"title\">\n{{ title }}\n</slot>\n      </div>\n\n      <div v-if=\"hasDescription\" :class=\"descriptionClass\">\n        <slot name=\"description\">\n{{ description }}\n</slot>\n      </div>\n\n      <div v-if=\"$slots.default\" data-gr-timeline-body>\n        <slot />\n      </div>\n    </div>\n  </li>\n</template>\n"],"mappings":"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"}

package/dist/components/GrTimeline/index.js

@@ -1,3 +1,3 @@
-import { n as GrTimeline_default, t as GrTimelineItem_default } from "./chunks/GrTimeline-DlTraRn5.js";
-import { n as grTimelineSafelist, t as grTimelineConfig } from "../../chunks/config-COpuWGr_2.js";
+import { n as GrTimeline_default, t as GrTimelineItem_default } from "./chunks/GrTimeline-Ch9sHzwL.js";
+import { n as grTimelineSafelist, t as grTimelineConfig } from "../../chunks/config-COpuWGr_.js";
 export { GrTimeline_default as GrTimeline, GrTimeline_default as default, GrTimelineItem_default as GrTimelineItem, grTimelineConfig, grTimelineSafelist };

package/dist/components/GrTimeline/styles.css

@@ -1 +1 @@
-[data-gr-timeline]{--gr-timeline-columns:auto 1fr}[data-gr-timeline][data-layout=time]{--gr-timeline-columns:var(--gr-timeline-time-width,5.5rem) auto 1fr}[data-gr-timeline][data-layout=alternate]{--gr-timeline-columns:1fr auto 1fr}[data-gr-timeline-list]{margin:0;padding:0;list-style:none}[data-gr-timeline-item],[data-gr-timeline-group-header]{grid-template-columns:var(--gr-timeline-columns);column-gap:var(--gr-timeline-gap,.75rem);align-items:start;display:grid}[data-gr-timeline-aside]{text-align:end}[data-gr-timeline-rail]{padding-top:var(--gr-timeline-marker-top,.35rem);flex-direction:column;align-self:stretch;align-items:center;display:flex}[data-gr-timeline-rail]>:first-child{flex:none}[data-gr-timeline-marker]{box-sizing:border-box;width:var(--gr-timeline-marker-size,10px);height:var(--gr-timeline-marker-size,10px);border-width:var(--gr-timeline-marker-ring,2px);border-style:solid;border-color:#0000}[data-gr-timeline-line]{width:var(--gr-timeline-axis-width,2px);min-height:var(--gr-timeline-line-min,.75rem);margin-top:.25rem;margin-bottom:calc(-1 * var(--gr-timeline-marker-top,.35rem));background-color:var(--gr-timeline-axis-color,var(--gr-brd));flex:auto}[data-gr-timeline-item]:has(+[data-gr-timeline-item][data-pending]) [data-gr-timeline-line],[data-gr-timeline-item][data-pending] [data-gr-timeline-line]{background-color:#0000;background-image:repeating-linear-gradient(to bottom, var(--gr-timeline-axis-color,var(--gr-brd)) 0 var(--gr-timeline-dash,4px), transparent var(--gr-timeline-dash,4px) calc(var(--gr-timeline-dash,4px) * 2))}[data-gr-timeline-item]:last-child [data-gr-timeline-line]{visibility:hidden}[data-gr-timeline-group]:not(:last-of-type) [data-gr-timeline-item]:last-child [data-gr-timeline-line]{visibility:visible}[data-gr-timeline-group-header] [data-gr-timeline-rail]{padding-top:0}[data-gr-timeline-group]+[data-gr-timeline-group] [data-gr-timeline-group-header]{padding-top:.5rem}[data-gr-timeline-group-header] [data-gr-timeline-line]{margin-top:0}[data-gr-timeline-group]:first-of-type [data-gr-timeline-group-header] [data-gr-timeline-line]{visibility:hidden}[data-gr-timeline][data-layout=time] [data-gr-timeline-group-header] [data-gr-timeline-rail],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-group-header] [data-gr-timeline-rail]{grid-column:2}[data-gr-timeline][data-layout=time] [data-gr-timeline-group-title],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-group-title]{grid-column:3}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-rail]{grid-column:2}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-content]{grid-column:3}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-item]:nth-child(2n) [data-gr-timeline-content]{text-align:end;grid-area:1/1}@media (width<=640px){[data-gr-timeline][data-layout=alternate]{--gr-timeline-columns:auto 1fr}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-rail],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-group-header] [data-gr-timeline-rail]{grid-column:1}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-content],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-item]:nth-child(2n) [data-gr-timeline-content],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-group-title]{text-align:start;grid-column:2}}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-list]{flex-direction:row;display:flex;overflow-x:auto}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-item]{min-width:var(--gr-timeline-item-min-width,12rem);grid-template-columns:1fr;padding-inline-end:var(--gr-timeline-gap,.75rem)}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-content]{padding-bottom:0}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-rail]{flex-direction:row;align-self:auto;align-items:center;padding-top:0;padding-bottom:.25rem}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-line]{width:auto;height:var(--gr-timeline-axis-width,2px);min-width:var(--gr-timeline-line-min,.75rem);margin-top:0;min-height:0;margin-inline-start:.25rem}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-item]:has(+[data-gr-timeline-item][data-pending]) [data-gr-timeline-line],[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-item][data-pending] [data-gr-timeline-line]{background-image:repeating-linear-gradient(to right, var(--gr-timeline-axis-color,var(--gr-brd)) 0 var(--gr-timeline-dash,4px), transparent var(--gr-timeline-dash,4px) calc(var(--gr-timeline-dash,4px) * 2))}
+[data-gr-timeline]{--gr-timeline-columns:auto 1fr}[data-gr-timeline][data-layout=time]{--gr-timeline-columns:var(--gr-timeline-time-width,5.5rem) auto 1fr}[data-gr-timeline][data-layout=alternate]{--gr-timeline-columns:1fr auto 1fr}[data-gr-timeline-list]{margin:0;padding:0;list-style:none}[data-gr-timeline-item],[data-gr-timeline-group-header]{grid-template-columns:var(--gr-timeline-columns);column-gap:var(--gr-timeline-gap,.75rem);align-items:start;display:grid}[data-gr-timeline-aside]{text-align:end}[data-gr-timeline-rail]{padding-top:var(--gr-timeline-marker-top,.35rem);min-width:var(--gr-timeline-marker-size,10px);flex-direction:column;align-self:stretch;align-items:center;display:flex}[data-gr-timeline-rail]>:not([data-gr-timeline-line]){flex:none}[data-gr-timeline-marker]{box-sizing:border-box;width:var(--gr-timeline-marker-size,10px);height:var(--gr-timeline-marker-size,10px);border-width:var(--gr-timeline-marker-ring,2px);border-style:solid;border-color:#0000}[data-gr-timeline-line]{width:var(--gr-timeline-axis-width,2px);min-height:var(--gr-timeline-line-min,.75rem);margin-top:.25rem;margin-bottom:calc(-1 * var(--gr-timeline-marker-top,.35rem));background-color:var(--gr-timeline-axis-color,var(--gr-brd));flex:auto}[data-gr-timeline-item]:has(+[data-gr-timeline-item][data-pending]) [data-gr-timeline-line],[data-gr-timeline-item][data-pending] [data-gr-timeline-line]{background-color:#0000;background-image:repeating-linear-gradient(to bottom, var(--gr-timeline-axis-color,var(--gr-brd)) 0 var(--gr-timeline-dash,4px), transparent var(--gr-timeline-dash,4px) calc(var(--gr-timeline-dash,4px) * 2))}[data-gr-timeline-item]:last-child [data-gr-timeline-line]{visibility:hidden}[data-gr-timeline-group]:not(:last-of-type) [data-gr-timeline-item]:last-child [data-gr-timeline-line]{visibility:visible}[data-gr-timeline-group-header] [data-gr-timeline-rail]{padding-top:0}[data-gr-timeline-group]+[data-gr-timeline-group] [data-gr-timeline-group-title]{padding-top:.5rem}[data-gr-timeline-group-header] [data-gr-timeline-line]{margin-top:0}[data-gr-timeline-group]:first-of-type [data-gr-timeline-group-header] [data-gr-timeline-line]{visibility:hidden}[data-gr-timeline][data-layout=time] [data-gr-timeline-group-header] [data-gr-timeline-rail],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-group-header] [data-gr-timeline-rail]{grid-column:2}[data-gr-timeline][data-layout=time] [data-gr-timeline-group-title],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-group-title]{grid-column:3}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-rail]{grid-column:2}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-content]{grid-column:3}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-item]:nth-child(2n) [data-gr-timeline-content]{text-align:end;grid-area:1/1}@media (width<=640px){[data-gr-timeline][data-layout=alternate]{--gr-timeline-columns:auto 1fr}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-rail],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-group-header] [data-gr-timeline-rail]{grid-column:1}[data-gr-timeline][data-layout=alternate] [data-gr-timeline-content],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-item]:nth-child(2n) [data-gr-timeline-content],[data-gr-timeline][data-layout=alternate] [data-gr-timeline-group-title]{text-align:start;grid-column:2}}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-list]{flex-direction:row;display:flex;overflow-x:auto}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-item]{min-width:var(--gr-timeline-item-min-width,12rem);grid-template-columns:1fr;padding-inline-end:var(--gr-timeline-gap,.75rem)}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-content]{padding-bottom:0}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-rail]{flex-direction:row;align-self:auto;align-items:center;padding-top:0;padding-bottom:.25rem}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-line]{width:auto;height:var(--gr-timeline-axis-width,2px);min-width:var(--gr-timeline-line-min,.75rem);margin-top:0;min-height:0;margin-inline-start:.25rem}[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-item]:has(+[data-gr-timeline-item][data-pending]) [data-gr-timeline-line],[data-gr-timeline][data-orientation=horizontal] [data-gr-timeline-item][data-pending] [data-gr-timeline-line]{background-image:repeating-linear-gradient(to right, var(--gr-timeline-axis-color,var(--gr-brd)) 0 var(--gr-timeline-dash,4px), transparent var(--gr-timeline-dash,4px) calc(var(--gr-timeline-dash,4px) * 2))}

package/dist/components/GrToaster/chunks/{GrToaster-Db2NgrXu.js → GrToaster-DJUzx3sR.js}

@@ -10,7 +10,7 @@ import { t as _plugin_vue_export_helper_default } from "../../../chunks/_plugin-
 import { t as GrButton_default } from "../../GrButton/chunks/GrButton-Bw2AH4uX.js";
 import { useDragGesture } from "../../../composables/useDragGesture.js";
 import { useToast } from "../../../composables/useToast.js";
-import { a as SWIPE_THRESHOLD_RATIO, i as SWIPE_DIRECTION, o as swipeOpacity, r as PLACEMENT_CLASS } from "../../../chunks/config-ScuvHw6k2.js";
+import { a as SWIPE_THRESHOLD_RATIO, i as SWIPE_DIRECTION, o as swipeOpacity, r as PLACEMENT_CLASS } from "../../../chunks/config-ScuvHw6k.js";
 import { Fragment, Teleport, TransitionGroup, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeProps, nextTick, normalizeClass, normalizeStyle, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, watchEffect, withCtx, withDirectives } from "vue";
 import '../styles.css';//#region src/components/GrToaster/GrToaster.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["aria-label"];