@feugene/granularity 0.35.0 → 0.37.0

package/dist/components/GrAutocomplete/index.js

@@ -1,3 +1,3 @@
 import { n as grAutocompleteSafelist, t as grAutocompleteConfig } from "../../chunks/config-CYthTVK2.js";
-import { t as GrAutocomplete_default } from "./chunks/GrAutocomplete-BQsSE7sj.js";
+import { t as GrAutocomplete_default } from "./chunks/GrAutocomplete-BpmFmpKs.js";
 export { GrAutocomplete_default as GrAutocomplete, GrAutocomplete_default as default, grAutocompleteConfig, grAutocompleteSafelist };

package/dist/components/GrAvatar/chunks/{GrAvatar-CNmLmgcr.js → GrAvatar-dWEXiCJG.js}

@@ -1,4 +1,4 @@
-import { a as useGrComponentSize, i as useGrComponentProp } from "../../../chunks/context-CTbuwcYs.js";
+import { a as useGrComponentSize, i as useGrComponentProp } from "../../../chunks/context-CPMRfwVr.js";
 import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
 import { t as GrSkeleton_default } from "../../GrSkeleton/chunks/GrSkeleton-CgfXxPQ2.js";
 import { a as groupBaseClass, c as initialsFrom, d as rootBaseClass, f as rootStatusClass, i as grAvatarClass, l as mediaClass, m as statusToneClass, o as groupItemClass, p as statusDotClass, r as avatarFontSizePx, s as groupOverflowClass, u as mediaClipClass } from "../../../chunks/config-B3J0alyY.js";

package/dist/components/GrAvatar/chunks/{GrAvatar-CNmLmgcr.js.map → GrAvatar-dWEXiCJG.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrAvatar-CNmLmgcr.js","names":[],"sources":["../../../../src/components/GrAvatar/avatarContext.ts","../../../../src/components/GrAvatar/GrAvatar.vue","../../../../src/components/GrAvatar/GrAvatar.vue","../../../../src/components/GrAvatar/GrAvatarGroup.vue","../../../../src/components/GrAvatar/GrAvatarGroup.vue"],"sourcesContent":["import type { InjectionKey } from 'vue'\n\nimport type { GrAvatarShape } from './grAvatarStyles'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\n/**\n * Контекст `GrAvatarGroup`: размер и форма задаются на группе, чтобы ряд\n * аватаров не расползался, когда потребитель забыл повторить пропы у каждого.\n */\nexport interface GrAvatarGroupContext {\n  size?: GrSizeWithPx\n  shape?: GrAvatarShape\n}\n\nexport const GR_AVATAR_GROUP_KEY: InjectionKey<GrAvatarGroupContext> = Symbol.for('@feugene/granularity/avatar-group')\n","<script setup lang=\"ts\">\nimport { computed, inject, ref, watch } from 'vue'\n\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\nimport { GR_AVATAR_GROUP_KEY } from './avatarContext'\nimport {\n  avatarFontSizePx,\n  grAvatarClass,\n  initialsFrom,\n  mediaClass,\n  mediaClipClass,\n  rootBaseClass,\n  rootStatusClass,\n  statusDotClass,\n  statusToneClass,\n  type GrAvatarShape,\n  type GrAvatarStatus,\n} from './grAvatarStyles'\n\nexport type { GrAvatarShape, GrAvatarStatus } from './grAvatarStyles'\n\n/** Диаметр аватара для каждой ступени канонической шкалы. */\nconst GR_AVATAR_SIZE_PX = {\n  xs: 24,\n  sm: 32,\n  md: 40,\n  lg: 56,\n} as const\n\nexport interface GrAvatarProps {\n  /**\n   * Размер по канонической шкале (`xs|sm|md|lg`) — тогда работает\n   * `GrConfigProvider`. Число — escape-hatch: аватар нужен произвольного\n   * диаметра (24px в строке списка, 96px в профиле), и четыре ступени шкалы\n   * этого не закрывают.\n   */\n  size?: GrSizeWithPx\n  src?: string\n  /** Резервная картинка: показывается, когда `src` не загрузился. */\n  fallbackSrc?: string\n  alt?: string\n  /** Имя участника: даёт инициалы и доступное имя аватара. */\n  name?: string\n  shape?: GrAvatarShape\n  /** Статус участника. Точка декоративна — рядом идёт скрытая подпись. */\n  status?: GrAvatarStatus\n}\n\nconst props = withDefaults(defineProps<GrAvatarProps>(), {\n  size: undefined,\n  src: undefined,\n  fallbackSrc: undefined,\n  alt: undefined,\n  name: undefined,\n  // Дефолт живёт в резолвере: Vue подставил бы свой раньше, чем компонент\n  // заглянет в `GrConfigProvider`.\n  shape: undefined,\n  status: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Содержимое вместо картинки и инициалов. */\n  default?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\nconst group = inject(GR_AVATAR_GROUP_KEY, null)\n\n// Размер и форма группы сильнее провайдера, но слабее собственного пропа.\nconst localSize = computed(() => props.size ?? group?.size)\n\nconst resolvedScaleSize = useGrComponentSize(\n  () => (typeof localSize.value === 'number' ? undefined : localSize.value),\n  { component: 'GrAvatar' },\n)\n\nconst resolvedShape = useGrComponentProp(\n  'GrAvatar',\n  'shape',\n  () => props.shape ?? group?.shape,\n  'circle',\n)\n\nconst sizePx = computed(() => (\n  typeof localSize.value === 'number' ? localSize.value : GR_AVATAR_SIZE_PX[resolvedScaleSize.value]\n))\n\nconst style = computed(() => {\n  const px = `${sizePx.value}px`\n  // Кегль на корне, а не на span инициалов: так он достаётся и слотовому тексту.\n  return { width: px, height: px, fontSize: `${avatarFontSizePx(sizePx.value)}px` }\n})\n\n/**\n * Состояние картинки. Без него битая ссылка оставляла `v-if=\"src\"` истинным:\n * браузер рисовал сломанное изображение, а запасной вариант не показывался\n * никогда.\n */\ntype ImageState = 'loading' | 'loaded' | 'error'\n\nconst primaryState = ref<ImageState>('loading')\nconst fallbackState = ref<ImageState>('loading')\n\n// Новая ссылка не должна наследовать ошибку прошлой.\nwatch(() => props.src, () => {\n  primaryState.value = 'loading'\n})\nwatch(() => props.fallbackSrc, () => {\n  fallbackState.value = 'loading'\n})\n\nconst activeSrc = computed(() => {\n  if (props.src && primaryState.value !== 'error')\n    return props.src\n  if (props.fallbackSrc && fallbackState.value !== 'error')\n    return props.fallbackSrc\n  return undefined\n})\n\nconst isFallbackActive = computed(() => Boolean(activeSrc.value) && activeSrc.value !== props.src)\n\n// Скелет держит место, пока картинка едет: иначе ряд аватаров мигает пустотой.\nconst showSkeleton = computed(() => {\n  if (!activeSrc.value)\n    return false\n  return (isFallbackActive.value ? fallbackState.value : primaryState.value) === 'loading'\n})\n\nconst initials = computed(() => (props.name ? initialsFrom(props.name) : ''))\n\n// Пусто — когда нет ни картинки, ни слота, ни имени.\nconst showInitials = computed(() => !activeSrc.value && !slots.default && Boolean(initials.value))\n\nconst statusLabel = computed(() => (props.status\n  ? t(`gr.avatar.status.${props.status}`, props.status)\n  : undefined))\n\n/**\n * Доступное имя: `alt` сильнее всего, иначе имя участника.\n *\n * Когда есть картинка, имя несёт её `alt` — так привычнее потребителю и не\n * возникает двойного объявления. Без картинки роль и имя берёт на себя корень:\n * иначе аватар с инициалами остался бы для диктора пустым.\n */\nconst accessibleName = computed(() => props.alt ?? props.name ?? '')\n\nconst rootIsImage = computed(() => !activeSrc.value && accessibleName.value !== '')\n\nconst rootClass = computed(() => [\n  rootBaseClass,\n  grAvatarClass(resolvedShape.value),\n  props.status ? rootStatusClass : '',\n])\n\nfunction onError(kind: 'primary' | 'fallback'): void {\n  if (kind === 'primary')\n    primaryState.value = 'error'\n  else fallbackState.value = 'error'\n}\n\nfunction onLoad(kind: 'primary' | 'fallback'): void {\n  if (kind === 'primary')\n    primaryState.value = 'loaded'\n  else fallbackState.value = 'loaded'\n}\n</script>\n\n<template>\n  <span\n    data-gr-avatar\n    :style=\"style\"\n    :class=\"rootClass\"\n    :role=\"rootIsImage ? 'img' : undefined\"\n    :aria-label=\"rootIsImage ? accessibleName : undefined\"\n  >\n    <span :class=\"[mediaClass, status ? [mediaClipClass, grAvatarClass(resolvedShape)] : '']\">\n      <GrSkeleton\n        v-if=\"showSkeleton\"\n        data-gr-avatar-skeleton\n        width=\"100%\"\n        height=\"100%\"\n        :rounded=\"resolvedShape === 'circle' ? 'var(--gr-radius-full)' : 'var(--gr-avatar-square-radius, 10px)'\"\n      />\n\n      <img\n        v-if=\"activeSrc\"\n        :key=\"activeSrc\"\n        data-gr-avatar-image\n        :src=\"activeSrc\"\n        :alt=\"accessibleName\"\n        class=\"h-full w-full object-cover\"\n        :class=\"showSkeleton ? 'invisible absolute' : ''\"\n        @error=\"onError(isFallbackActive ? 'fallback' : 'primary')\"\n        @load=\"onLoad(isFallbackActive ? 'fallback' : 'primary')\"\n      >\n\n      <span v-else-if=\"showInitials\" data-gr-avatar-initials>{{ initials }}</span>\n\n      <slot v-else />\n    </span>\n\n    <template v-if=\"status\">\n      <span\n        data-gr-avatar-status\n        :class=\"[statusDotClass, statusToneClass[status]]\"\n        aria-hidden=\"true\"\n      />\n      <!-- Цвет точки смысл не передаёт: статус объявляется словом (WCAG 1.4.1). -->\n      <span data-gr-avatar-status-label class=\"sr-only\">{{ statusLabel }}</span>\n    </template>\n  </span>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject, ref, watch } from 'vue'\n\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\nimport { GR_AVATAR_GROUP_KEY } from './avatarContext'\nimport {\n  avatarFontSizePx,\n  grAvatarClass,\n  initialsFrom,\n  mediaClass,\n  mediaClipClass,\n  rootBaseClass,\n  rootStatusClass,\n  statusDotClass,\n  statusToneClass,\n  type GrAvatarShape,\n  type GrAvatarStatus,\n} from './grAvatarStyles'\n\nexport type { GrAvatarShape, GrAvatarStatus } from './grAvatarStyles'\n\n/** Диаметр аватара для каждой ступени канонической шкалы. */\nconst GR_AVATAR_SIZE_PX = {\n  xs: 24,\n  sm: 32,\n  md: 40,\n  lg: 56,\n} as const\n\nexport interface GrAvatarProps {\n  /**\n   * Размер по канонической шкале (`xs|sm|md|lg`) — тогда работает\n   * `GrConfigProvider`. Число — escape-hatch: аватар нужен произвольного\n   * диаметра (24px в строке списка, 96px в профиле), и четыре ступени шкалы\n   * этого не закрывают.\n   */\n  size?: GrSizeWithPx\n  src?: string\n  /** Резервная картинка: показывается, когда `src` не загрузился. */\n  fallbackSrc?: string\n  alt?: string\n  /** Имя участника: даёт инициалы и доступное имя аватара. */\n  name?: string\n  shape?: GrAvatarShape\n  /** Статус участника. Точка декоративна — рядом идёт скрытая подпись. */\n  status?: GrAvatarStatus\n}\n\nconst props = withDefaults(defineProps<GrAvatarProps>(), {\n  size: undefined,\n  src: undefined,\n  fallbackSrc: undefined,\n  alt: undefined,\n  name: undefined,\n  // Дефолт живёт в резолвере: Vue подставил бы свой раньше, чем компонент\n  // заглянет в `GrConfigProvider`.\n  shape: undefined,\n  status: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Содержимое вместо картинки и инициалов. */\n  default?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\nconst group = inject(GR_AVATAR_GROUP_KEY, null)\n\n// Размер и форма группы сильнее провайдера, но слабее собственного пропа.\nconst localSize = computed(() => props.size ?? group?.size)\n\nconst resolvedScaleSize = useGrComponentSize(\n  () => (typeof localSize.value === 'number' ? undefined : localSize.value),\n  { component: 'GrAvatar' },\n)\n\nconst resolvedShape = useGrComponentProp(\n  'GrAvatar',\n  'shape',\n  () => props.shape ?? group?.shape,\n  'circle',\n)\n\nconst sizePx = computed(() => (\n  typeof localSize.value === 'number' ? localSize.value : GR_AVATAR_SIZE_PX[resolvedScaleSize.value]\n))\n\nconst style = computed(() => {\n  const px = `${sizePx.value}px`\n  // Кегль на корне, а не на span инициалов: так он достаётся и слотовому тексту.\n  return { width: px, height: px, fontSize: `${avatarFontSizePx(sizePx.value)}px` }\n})\n\n/**\n * Состояние картинки. Без него битая ссылка оставляла `v-if=\"src\"` истинным:\n * браузер рисовал сломанное изображение, а запасной вариант не показывался\n * никогда.\n */\ntype ImageState = 'loading' | 'loaded' | 'error'\n\nconst primaryState = ref<ImageState>('loading')\nconst fallbackState = ref<ImageState>('loading')\n\n// Новая ссылка не должна наследовать ошибку прошлой.\nwatch(() => props.src, () => {\n  primaryState.value = 'loading'\n})\nwatch(() => props.fallbackSrc, () => {\n  fallbackState.value = 'loading'\n})\n\nconst activeSrc = computed(() => {\n  if (props.src && primaryState.value !== 'error')\n    return props.src\n  if (props.fallbackSrc && fallbackState.value !== 'error')\n    return props.fallbackSrc\n  return undefined\n})\n\nconst isFallbackActive = computed(() => Boolean(activeSrc.value) && activeSrc.value !== props.src)\n\n// Скелет держит место, пока картинка едет: иначе ряд аватаров мигает пустотой.\nconst showSkeleton = computed(() => {\n  if (!activeSrc.value)\n    return false\n  return (isFallbackActive.value ? fallbackState.value : primaryState.value) === 'loading'\n})\n\nconst initials = computed(() => (props.name ? initialsFrom(props.name) : ''))\n\n// Пусто — когда нет ни картинки, ни слота, ни имени.\nconst showInitials = computed(() => !activeSrc.value && !slots.default && Boolean(initials.value))\n\nconst statusLabel = computed(() => (props.status\n  ? t(`gr.avatar.status.${props.status}`, props.status)\n  : undefined))\n\n/**\n * Доступное имя: `alt` сильнее всего, иначе имя участника.\n *\n * Когда есть картинка, имя несёт её `alt` — так привычнее потребителю и не\n * возникает двойного объявления. Без картинки роль и имя берёт на себя корень:\n * иначе аватар с инициалами остался бы для диктора пустым.\n */\nconst accessibleName = computed(() => props.alt ?? props.name ?? '')\n\nconst rootIsImage = computed(() => !activeSrc.value && accessibleName.value !== '')\n\nconst rootClass = computed(() => [\n  rootBaseClass,\n  grAvatarClass(resolvedShape.value),\n  props.status ? rootStatusClass : '',\n])\n\nfunction onError(kind: 'primary' | 'fallback'): void {\n  if (kind === 'primary')\n    primaryState.value = 'error'\n  else fallbackState.value = 'error'\n}\n\nfunction onLoad(kind: 'primary' | 'fallback'): void {\n  if (kind === 'primary')\n    primaryState.value = 'loaded'\n  else fallbackState.value = 'loaded'\n}\n</script>\n\n<template>\n  <span\n    data-gr-avatar\n    :style=\"style\"\n    :class=\"rootClass\"\n    :role=\"rootIsImage ? 'img' : undefined\"\n    :aria-label=\"rootIsImage ? accessibleName : undefined\"\n  >\n    <span :class=\"[mediaClass, status ? [mediaClipClass, grAvatarClass(resolvedShape)] : '']\">\n      <GrSkeleton\n        v-if=\"showSkeleton\"\n        data-gr-avatar-skeleton\n        width=\"100%\"\n        height=\"100%\"\n        :rounded=\"resolvedShape === 'circle' ? 'var(--gr-radius-full)' : 'var(--gr-avatar-square-radius, 10px)'\"\n      />\n\n      <img\n        v-if=\"activeSrc\"\n        :key=\"activeSrc\"\n        data-gr-avatar-image\n        :src=\"activeSrc\"\n        :alt=\"accessibleName\"\n        class=\"h-full w-full object-cover\"\n        :class=\"showSkeleton ? 'invisible absolute' : ''\"\n        @error=\"onError(isFallbackActive ? 'fallback' : 'primary')\"\n        @load=\"onLoad(isFallbackActive ? 'fallback' : 'primary')\"\n      >\n\n      <span v-else-if=\"showInitials\" data-gr-avatar-initials>{{ initials }}</span>\n\n      <slot v-else />\n    </span>\n\n    <template v-if=\"status\">\n      <span\n        data-gr-avatar-status\n        :class=\"[statusDotClass, statusToneClass[status]]\"\n        aria-hidden=\"true\"\n      />\n      <!-- Цвет точки смысл не передаёт: статус объявляется словом (WCAG 1.4.1). -->\n      <span data-gr-avatar-status-label class=\"sr-only\">{{ statusLabel }}</span>\n    </template>\n  </span>\n</template>\n","<script setup lang=\"ts\">\n/**\n * GrAvatarGroup — ряд аватаров со стекингом и счётчиком скрытых.\n *\n * Группа объявлена `role=\"group\"` с именем и числом участников: без этого\n * скринридер читает набор безымянных картинок и не понимает, что их больше,\n * чем видно.\n */\nimport { computed, provide, type VNode } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\nimport { GR_AVATAR_GROUP_KEY } from './avatarContext'\nimport {\n  avatarFontSizePx,\n  grAvatarClass,\n  groupBaseClass,\n  groupItemClass,\n  groupOverflowClass,\n  rootBaseClass,\n  type GrAvatarShape,\n} from './grAvatarStyles'\n\nconst GR_AVATAR_GROUP_SIZE_PX = {\n  xs: 24,\n  sm: 32,\n  md: 40,\n  lg: 56,\n} as const\n\nexport interface GrAvatarGroupProps {\n  /** Размер и форма ряда: дети берут их из контекста. */\n  size?: GrSizeWithPx\n  shape?: GrAvatarShape\n  /** Сколько аватаров показывать; остальные сворачиваются в «+N». */\n  max?: number\n  /** Сколько участников всего, если в слоте лежит лишь часть. */\n  total?: number\n  /** Имя группы. Не задано — берётся из локали. */\n  ariaLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrAvatarGroupProps>(), {\n  size: undefined,\n  shape: undefined,\n  max: undefined,\n  total: undefined,\n  ariaLabel: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Аватары ряда. */\n  default?: () => VNode[]\n}>()\n\nconst { t } = useGranularityTranslations()\n\nprovide(GR_AVATAR_GROUP_KEY, {\n  get size() {\n    return props.size\n  },\n  get shape() {\n    return props.shape\n  },\n})\n\nconst children = computed(() => slots.default?.() ?? [])\n\n// `v-for` внутри слота приходит фрагментом — считаем его детей, иначе весь\n// список выглядел бы одним аватаром.\nconst items = computed<VNode[]>(() => children.value.flatMap((node) => {\n  const nested = node.children\n  return Array.isArray(nested) && typeof node.type === 'symbol' ? (nested as VNode[]) : [node]\n}))\n\nconst visible = computed(() => (props.max === undefined ? items.value : items.value.slice(0, Math.max(0, props.max))))\n\nconst hiddenCount = computed(() => {\n  const total = props.total ?? items.value.length\n  return Math.max(0, total - visible.value.length)\n})\n\nconst overflowSizePx = computed(() => (\n  typeof props.size === 'number' ? props.size : GR_AVATAR_GROUP_SIZE_PX[props.size ?? 'md']\n))\n\nconst overflowStyle = computed(() => {\n  const px = `${overflowSizePx.value}px`\n  return { width: px, height: px, fontSize: `${avatarFontSizePx(overflowSizePx.value)}px` }\n})\n\nconst groupLabel = computed(() => props.ariaLabel ?? t('gr.avatar.group', 'People'))\n\nconst accessibleLabel = computed(() => (hiddenCount.value > 0\n  ? `${groupLabel.value}, ${t('gr.avatar.groupOverflow', 'and {count} more', { count: hiddenCount.value, n: hiddenCount.value })}`\n  : groupLabel.value))\n</script>\n\n<template>\n  <div\n    data-gr-avatar-group\n    role=\"group\"\n    :aria-label=\"accessibleLabel\"\n    :class=\"groupBaseClass\"\n  >\n    <component\n      :is=\"node\"\n      v-for=\"(node, index) in visible\"\n      :key=\"index\"\n      :class=\"groupItemClass\"\n    />\n\n    <span\n      v-if=\"hiddenCount > 0\"\n      data-gr-avatar-group-overflow\n      aria-hidden=\"true\"\n      :class=\"[rootBaseClass, groupOverflowClass, groupItemClass, grAvatarClass(shape ?? 'circle')]\"\n      :style=\"overflowStyle\"\n    >+{{ hiddenCount }}</span>\n  </div>\n</template>\n","<script setup lang=\"ts\">\n/**\n * GrAvatarGroup — ряд аватаров со стекингом и счётчиком скрытых.\n *\n * Группа объявлена `role=\"group\"` с именем и числом участников: без этого\n * скринридер читает набор безымянных картинок и не понимает, что их больше,\n * чем видно.\n */\nimport { computed, provide, type VNode } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\nimport { GR_AVATAR_GROUP_KEY } from './avatarContext'\nimport {\n  avatarFontSizePx,\n  grAvatarClass,\n  groupBaseClass,\n  groupItemClass,\n  groupOverflowClass,\n  rootBaseClass,\n  type GrAvatarShape,\n} from './grAvatarStyles'\n\nconst GR_AVATAR_GROUP_SIZE_PX = {\n  xs: 24,\n  sm: 32,\n  md: 40,\n  lg: 56,\n} as const\n\nexport interface GrAvatarGroupProps {\n  /** Размер и форма ряда: дети берут их из контекста. */\n  size?: GrSizeWithPx\n  shape?: GrAvatarShape\n  /** Сколько аватаров показывать; остальные сворачиваются в «+N». */\n  max?: number\n  /** Сколько участников всего, если в слоте лежит лишь часть. */\n  total?: number\n  /** Имя группы. Не задано — берётся из локали. */\n  ariaLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrAvatarGroupProps>(), {\n  size: undefined,\n  shape: undefined,\n  max: undefined,\n  total: undefined,\n  ariaLabel: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Аватары ряда. */\n  default?: () => VNode[]\n}>()\n\nconst { t } = useGranularityTranslations()\n\nprovide(GR_AVATAR_GROUP_KEY, {\n  get size() {\n    return props.size\n  },\n  get shape() {\n    return props.shape\n  },\n})\n\nconst children = computed(() => slots.default?.() ?? [])\n\n// `v-for` внутри слота приходит фрагментом — считаем его детей, иначе весь\n// список выглядел бы одним аватаром.\nconst items = computed<VNode[]>(() => children.value.flatMap((node) => {\n  const nested = node.children\n  return Array.isArray(nested) && typeof node.type === 'symbol' ? (nested as VNode[]) : [node]\n}))\n\nconst visible = computed(() => (props.max === undefined ? items.value : items.value.slice(0, Math.max(0, props.max))))\n\nconst hiddenCount = computed(() => {\n  const total = props.total ?? items.value.length\n  return Math.max(0, total - visible.value.length)\n})\n\nconst overflowSizePx = computed(() => (\n  typeof props.size === 'number' ? props.size : GR_AVATAR_GROUP_SIZE_PX[props.size ?? 'md']\n))\n\nconst overflowStyle = computed(() => {\n  const px = `${overflowSizePx.value}px`\n  return { width: px, height: px, fontSize: `${avatarFontSizePx(overflowSizePx.value)}px` }\n})\n\nconst groupLabel = computed(() => props.ariaLabel ?? t('gr.avatar.group', 'People'))\n\nconst accessibleLabel = computed(() => (hiddenCount.value > 0\n  ? `${groupLabel.value}, ${t('gr.avatar.groupOverflow', 'and {count} more', { count: hiddenCount.value, n: hiddenCount.value })}`\n  : groupLabel.value))\n</script>\n\n<template>\n  <div\n    data-gr-avatar-group\n    role=\"group\"\n    :aria-label=\"accessibleLabel\"\n    :class=\"groupBaseClass\"\n  >\n    <component\n      :is=\"node\"\n      v-for=\"(node, index) in visible\"\n      :key=\"index\"\n      :class=\"groupItemClass\"\n    />\n\n    <span\n      v-if=\"hiddenCount > 0\"\n      data-gr-avatar-group-overflow\n      aria-hidden=\"true\"\n      :class=\"[rootBaseClass, groupOverflowClass, groupItemClass, grAvatarClass(shape ?? 'circle')]\"\n      :style=\"overflowStyle\"\n    >+{{ hiddenCount }}</span>\n  </div>\n</template>\n"],"mappings":";;;;;;AAcA,IAAa,sBAA0D,OAAO,IAAI,mCAAmC;;;;;;;;;;;;;;;;;;;;;;;;;;;ECYrH,MAAM,oBAAoB;GACxB,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;EAqBA,MAAM,QAAQ;EAYd,MAAM,QAAQ,SAAA;EAKd,MAAM,EAAE,MAAM,2BAA2B;EACzC,MAAM,QAAQ,OAAO,qBAAqB,IAAI;EAG9C,MAAM,YAAY,eAAe,MAAM,QAAQ,OAAO,IAAI;EAE1D,MAAM,oBAAoB,yBACjB,OAAO,UAAU,UAAU,WAAW,KAAA,IAAY,UAAU,OACnE,EAAE,WAAW,WAAW,CAC1B;EAEA,MAAM,gBAAgB,mBACpB,YACA,eACM,MAAM,SAAS,OAAO,OAC5B,QACF;EAEA,MAAM,SAAS,eACb,OAAO,UAAU,UAAU,WAAW,UAAU,QAAQ,kBAAkB,kBAAkB,MAC7F;EAED,MAAM,QAAQ,eAAe;GAC3B,MAAM,KAAK,GAAG,OAAO,MAAM;GAE3B,OAAO;IAAE,OAAO;IAAI,QAAQ;IAAI,UAAU,GAAG,iBAAiB,OAAO,KAAK,EAAE;GAAI;EAClF,CAAC;;;;;;EASD,MAAM,eAAe,IAAgB,SAAS;EAC9C,MAAM,gBAAgB,IAAgB,SAAS;EAG/C,YAAY,MAAM,WAAW;GAC3B,aAAa,QAAQ;EACvB,CAAC;EACD,YAAY,MAAM,mBAAmB;GACnC,cAAc,QAAQ;EACxB,CAAC;EAED,MAAM,YAAY,eAAe;GAC/B,IAAI,MAAM,OAAO,aAAa,UAAU,SACtC,OAAO,MAAM;GACf,IAAI,MAAM,eAAe,cAAc,UAAU,SAC/C,OAAO,MAAM;EAEjB,CAAC;EAED,MAAM,mBAAmB,eAAe,QAAQ,UAAU,KAAK,KAAK,UAAU,UAAU,MAAM,GAAG;EAGjG,MAAM,eAAe,eAAe;GAClC,IAAI,CAAC,UAAU,OACb,OAAO;GACT,QAAQ,iBAAiB,QAAQ,cAAc,QAAQ,aAAa,WAAW;EACjF,CAAC;EAED,MAAM,WAAW,eAAgB,MAAM,OAAO,aAAa,MAAM,IAAI,IAAI,EAAG;EAG5E,MAAM,eAAe,eAAe,CAAC,UAAU,SAAS,CAAC,MAAM,WAAW,QAAQ,SAAS,KAAK,CAAC;EAEjG,MAAM,cAAc,eAAgB,MAAM,SACtC,EAAE,oBAAoB,MAAM,UAAU,MAAM,MAAM,IAClD,KAAA,CAAU;;;;;;;;EASd,MAAM,iBAAiB,eAAe,MAAM,OAAO,MAAM,QAAQ,EAAE;EAEnE,MAAM,cAAc,eAAe,CAAC,UAAU,SAAS,eAAe,UAAU,EAAE;EAElF,MAAM,YAAY,eAAe;GAC/B;GACA,cAAc,cAAc,KAAK;GACjC,MAAM,SAAS,kBAAkB;EACnC,CAAC;EAED,SAAS,QAAQ,MAAoC;GACnD,IAAI,SAAS,WACX,aAAa,QAAQ;QAClB,cAAc,QAAQ;EAC7B;EAEA,SAAS,OAAO,MAAoC;GAClD,IAAI,SAAS,WACX,aAAa,QAAQ;QAClB,cAAc,QAAQ;EAC7B;;uBAIE,mBA0CO,QAAA;IAzCL,kBAAA;IACC,OAAK,eAAE,MAAA,KAAK;IACZ,OAAK,eAAE,UAAA,KAAS;IAChB,MAAM,YAAA,QAAW,QAAW,KAAA;IAC5B,cAAY,YAAA,QAAc,eAAA,QAAiB,KAAA;OAE5C,mBAwBO,QAAA,EAxBA,OAAK,eAAA,CAAG,MAAA,UAAA,GAAY,QAAA,SAAM,CAAI,MAAA,cAAA,GAAgB,MAAA,aAAA,CAAa,CAAC,MAAA,aAAA,CAAa,CAAA,IAAA,EAAA,CAAA,EAAA,GAAA,CAEtE,aAAA,SAAA,UAAA,GADR,YAME,oBAAA;;IAJA,2BAAA;IACA,OAAM;IACN,QAAO;IACN,SAAS,MAAA,aAAA,MAAa,WAAA,0BAAA;6DAIjB,UAAA,SAAA,UAAA,GADR,mBAUC,OAAA;IARE,KAAK,UAAA;IACN,wBAAA;IACC,KAAK,UAAA;IACL,KAAK,eAAA;IACN,OAAK,eAAA,CAAC,8BACE,aAAA,QAAY,uBAAA,EAAA,CAAA;IACnB,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAQ,iBAAA,QAAgB,aAAA,SAAA;IAC/B,QAAI,OAAA,OAAA,OAAA,MAAA,WAAE,OAAO,iBAAA,QAAgB,aAAA,SAAA;+BAGf,aAAA,SAAA,UAAA,GAAjB,mBAA4E,QAA5E,YAA4E,gBAAlB,SAAA,KAAQ,GAAA,CAAA,KAElE,WAAe,KAAA,QAAA,WAAA,CAAA,GAAA,KAAA,GAAA,KAAA,GAAA,CAAA,CAAA,GAAA,CAAA,GAGD,QAAA,UAAA,UAAA,GAAhB,mBAQW,UAAA,EAAA,KAAA,EAAA,GAAA,CAPT,mBAIE,QAAA;IAHA,yBAAA;IACC,OAAK,eAAA,CAAG,MAAA,cAAA,GAAgB,MAAA,eAAA,CAAe,CAAC,QAAA,OAAM,CAAA;IAC/C,eAAY;gBAGd,mBAA0E,QAA1E,YAA0E,gBAArB,YAAA,KAAW,GAAA,CAAA,CAAA,GAAA,EAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,IAAA,YAAA;;;;;;;;;;;;;;;;;;;;;;;;;;EE5LtE,MAAM,0BAA0B;GAC9B,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;EAcA,MAAM,QAAQ;EAQd,MAAM,QAAQ,SAAA;EAKd,MAAM,EAAE,MAAM,2BAA2B;EAEzC,QAAQ,qBAAqB;GAC3B,IAAI,OAAO;IACT,OAAO,MAAM;GACf;GACA,IAAI,QAAQ;IACV,OAAO,MAAM;GACf;EACF,CAAC;EAED,MAAM,WAAW,eAAe,MAAM,UAAU,KAAK,CAAC,CAAC;EAIvD,MAAM,QAAQ,eAAwB,SAAS,MAAM,SAAS,SAAS;GACrE,MAAM,SAAS,KAAK;GACpB,OAAO,MAAM,QAAQ,MAAM,KAAK,OAAO,KAAK,SAAS,WAAY,SAAqB,CAAC,IAAI;EAC7F,CAAC,CAAC;EAEF,MAAM,UAAU,eAAgB,MAAM,QAAQ,KAAA,IAAY,MAAM,QAAQ,MAAM,MAAM,MAAM,GAAG,KAAK,IAAI,GAAG,MAAM,GAAG,CAAC,CAAE;EAErH,MAAM,cAAc,eAAe;GACjC,MAAM,QAAQ,MAAM,SAAS,MAAM,MAAM;GACzC,OAAO,KAAK,IAAI,GAAG,QAAQ,QAAQ,MAAM,MAAM;EACjD,CAAC;EAED,MAAM,iBAAiB,eACrB,OAAO,MAAM,SAAS,WAAW,MAAM,OAAO,wBAAwB,MAAM,QAAQ,KACrF;EAED,MAAM,gBAAgB,eAAe;GACnC,MAAM,KAAK,GAAG,eAAe,MAAM;GACnC,OAAO;IAAE,OAAO;IAAI,QAAQ;IAAI,UAAU,GAAG,iBAAiB,eAAe,KAAK,EAAE;GAAI;EAC1F,CAAC;EAED,MAAM,aAAa,eAAe,MAAM,aAAa,EAAE,mBAAmB,QAAQ,CAAC;EAEnF,MAAM,kBAAkB,eAAgB,YAAY,QAAQ,IACxD,GAAG,WAAW,MAAM,IAAI,EAAE,2BAA2B,oBAAoB;GAAE,OAAO,YAAY;GAAO,GAAG,YAAY;EAAM,CAAC,MAC3H,WAAW,KAAM;;uBAInB,mBAoBM,OAAA;IAnBJ,wBAAA;IACA,MAAK;IACJ,cAAY,gBAAA;IACZ,OAAK,eAAE,MAAA,cAAA,CAAc;yBAEtB,mBAKE,UAAA,MAAA,WAHwB,QAAA,QAAhB,MAAM,UAAK;wBAFrB,YAKE,wBAJK,IAAI,GAAA;KAER,KAAK;KACL,OAAK,eAAE,MAAA,cAAA,CAAc;;cAIhB,YAAA,QAAW,KAAA,UAAA,GADnB,mBAM0B,QAAA;;IAJxB,iCAAA;IACA,eAAY;IACX,OAAK,eAAA;KAAG,MAAA,aAAA;KAAe,MAAA,kBAAA;KAAoB,MAAA,cAAA;KAAgB,MAAA,aAAA,CAAa,CAAC,QAAA,SAAK,QAAA;IAAA,CAAA;IAC9E,OAAK,eAAE,cAAA,KAAa;MACtB,MAAC,gBAAG,YAAA,KAAW,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,IAAA,UAAA"}
+{"version":3,"file":"GrAvatar-dWEXiCJG.js","names":[],"sources":["../../../../src/components/GrAvatar/avatarContext.ts","../../../../src/components/GrAvatar/GrAvatar.vue","../../../../src/components/GrAvatar/GrAvatar.vue","../../../../src/components/GrAvatar/GrAvatarGroup.vue","../../../../src/components/GrAvatar/GrAvatarGroup.vue"],"sourcesContent":["import type { InjectionKey } from 'vue'\n\nimport type { GrAvatarShape } from './grAvatarStyles'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\n/**\n * Контекст `GrAvatarGroup`: размер и форма задаются на группе, чтобы ряд\n * аватаров не расползался, когда потребитель забыл повторить пропы у каждого.\n */\nexport interface GrAvatarGroupContext {\n  size?: GrSizeWithPx\n  shape?: GrAvatarShape\n}\n\nexport const GR_AVATAR_GROUP_KEY: InjectionKey<GrAvatarGroupContext> = Symbol.for('@feugene/granularity/avatar-group')\n","<script setup lang=\"ts\">\nimport { computed, inject, ref, watch } from 'vue'\n\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\nimport { GR_AVATAR_GROUP_KEY } from './avatarContext'\nimport {\n  avatarFontSizePx,\n  grAvatarClass,\n  initialsFrom,\n  mediaClass,\n  mediaClipClass,\n  rootBaseClass,\n  rootStatusClass,\n  statusDotClass,\n  statusToneClass,\n  type GrAvatarShape,\n  type GrAvatarStatus,\n} from './grAvatarStyles'\n\nexport type { GrAvatarShape, GrAvatarStatus } from './grAvatarStyles'\n\n/** Диаметр аватара для каждой ступени канонической шкалы. */\nconst GR_AVATAR_SIZE_PX = {\n  xs: 24,\n  sm: 32,\n  md: 40,\n  lg: 56,\n} as const\n\nexport interface GrAvatarProps {\n  /**\n   * Размер по канонической шкале (`xs|sm|md|lg`) — тогда работает\n   * `GrConfigProvider`. Число — escape-hatch: аватар нужен произвольного\n   * диаметра (24px в строке списка, 96px в профиле), и четыре ступени шкалы\n   * этого не закрывают.\n   */\n  size?: GrSizeWithPx\n  src?: string\n  /** Резервная картинка: показывается, когда `src` не загрузился. */\n  fallbackSrc?: string\n  alt?: string\n  /** Имя участника: даёт инициалы и доступное имя аватара. */\n  name?: string\n  shape?: GrAvatarShape\n  /** Статус участника. Точка декоративна — рядом идёт скрытая подпись. */\n  status?: GrAvatarStatus\n}\n\nconst props = withDefaults(defineProps<GrAvatarProps>(), {\n  size: undefined,\n  src: undefined,\n  fallbackSrc: undefined,\n  alt: undefined,\n  name: undefined,\n  // Дефолт живёт в резолвере: Vue подставил бы свой раньше, чем компонент\n  // заглянет в `GrConfigProvider`.\n  shape: undefined,\n  status: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Содержимое вместо картинки и инициалов. */\n  default?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\nconst group = inject(GR_AVATAR_GROUP_KEY, null)\n\n// Размер и форма группы сильнее провайдера, но слабее собственного пропа.\nconst localSize = computed(() => props.size ?? group?.size)\n\nconst resolvedScaleSize = useGrComponentSize(\n  () => (typeof localSize.value === 'number' ? undefined : localSize.value),\n  { component: 'GrAvatar' },\n)\n\nconst resolvedShape = useGrComponentProp(\n  'GrAvatar',\n  'shape',\n  () => props.shape ?? group?.shape,\n  'circle',\n)\n\nconst sizePx = computed(() => (\n  typeof localSize.value === 'number' ? localSize.value : GR_AVATAR_SIZE_PX[resolvedScaleSize.value]\n))\n\nconst style = computed(() => {\n  const px = `${sizePx.value}px`\n  // Кегль на корне, а не на span инициалов: так он достаётся и слотовому тексту.\n  return { width: px, height: px, fontSize: `${avatarFontSizePx(sizePx.value)}px` }\n})\n\n/**\n * Состояние картинки. Без него битая ссылка оставляла `v-if=\"src\"` истинным:\n * браузер рисовал сломанное изображение, а запасной вариант не показывался\n * никогда.\n */\ntype ImageState = 'loading' | 'loaded' | 'error'\n\nconst primaryState = ref<ImageState>('loading')\nconst fallbackState = ref<ImageState>('loading')\n\n// Новая ссылка не должна наследовать ошибку прошлой.\nwatch(() => props.src, () => {\n  primaryState.value = 'loading'\n})\nwatch(() => props.fallbackSrc, () => {\n  fallbackState.value = 'loading'\n})\n\nconst activeSrc = computed(() => {\n  if (props.src && primaryState.value !== 'error')\n    return props.src\n  if (props.fallbackSrc && fallbackState.value !== 'error')\n    return props.fallbackSrc\n  return undefined\n})\n\nconst isFallbackActive = computed(() => Boolean(activeSrc.value) && activeSrc.value !== props.src)\n\n// Скелет держит место, пока картинка едет: иначе ряд аватаров мигает пустотой.\nconst showSkeleton = computed(() => {\n  if (!activeSrc.value)\n    return false\n  return (isFallbackActive.value ? fallbackState.value : primaryState.value) === 'loading'\n})\n\nconst initials = computed(() => (props.name ? initialsFrom(props.name) : ''))\n\n// Пусто — когда нет ни картинки, ни слота, ни имени.\nconst showInitials = computed(() => !activeSrc.value && !slots.default && Boolean(initials.value))\n\nconst statusLabel = computed(() => (props.status\n  ? t(`gr.avatar.status.${props.status}`, props.status)\n  : undefined))\n\n/**\n * Доступное имя: `alt` сильнее всего, иначе имя участника.\n *\n * Когда есть картинка, имя несёт её `alt` — так привычнее потребителю и не\n * возникает двойного объявления. Без картинки роль и имя берёт на себя корень:\n * иначе аватар с инициалами остался бы для диктора пустым.\n */\nconst accessibleName = computed(() => props.alt ?? props.name ?? '')\n\nconst rootIsImage = computed(() => !activeSrc.value && accessibleName.value !== '')\n\nconst rootClass = computed(() => [\n  rootBaseClass,\n  grAvatarClass(resolvedShape.value),\n  props.status ? rootStatusClass : '',\n])\n\nfunction onError(kind: 'primary' | 'fallback'): void {\n  if (kind === 'primary')\n    primaryState.value = 'error'\n  else fallbackState.value = 'error'\n}\n\nfunction onLoad(kind: 'primary' | 'fallback'): void {\n  if (kind === 'primary')\n    primaryState.value = 'loaded'\n  else fallbackState.value = 'loaded'\n}\n</script>\n\n<template>\n  <span\n    data-gr-avatar\n    :style=\"style\"\n    :class=\"rootClass\"\n    :role=\"rootIsImage ? 'img' : undefined\"\n    :aria-label=\"rootIsImage ? accessibleName : undefined\"\n  >\n    <span :class=\"[mediaClass, status ? [mediaClipClass, grAvatarClass(resolvedShape)] : '']\">\n      <GrSkeleton\n        v-if=\"showSkeleton\"\n        data-gr-avatar-skeleton\n        width=\"100%\"\n        height=\"100%\"\n        :rounded=\"resolvedShape === 'circle' ? 'var(--gr-radius-full)' : 'var(--gr-avatar-square-radius, 10px)'\"\n      />\n\n      <img\n        v-if=\"activeSrc\"\n        :key=\"activeSrc\"\n        data-gr-avatar-image\n        :src=\"activeSrc\"\n        :alt=\"accessibleName\"\n        class=\"h-full w-full object-cover\"\n        :class=\"showSkeleton ? 'invisible absolute' : ''\"\n        @error=\"onError(isFallbackActive ? 'fallback' : 'primary')\"\n        @load=\"onLoad(isFallbackActive ? 'fallback' : 'primary')\"\n      >\n\n      <span v-else-if=\"showInitials\" data-gr-avatar-initials>{{ initials }}</span>\n\n      <slot v-else />\n    </span>\n\n    <template v-if=\"status\">\n      <span\n        data-gr-avatar-status\n        :class=\"[statusDotClass, statusToneClass[status]]\"\n        aria-hidden=\"true\"\n      />\n      <!-- Цвет точки смысл не передаёт: статус объявляется словом (WCAG 1.4.1). -->\n      <span data-gr-avatar-status-label class=\"sr-only\">{{ statusLabel }}</span>\n    </template>\n  </span>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject, ref, watch } from 'vue'\n\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\nimport { GR_AVATAR_GROUP_KEY } from './avatarContext'\nimport {\n  avatarFontSizePx,\n  grAvatarClass,\n  initialsFrom,\n  mediaClass,\n  mediaClipClass,\n  rootBaseClass,\n  rootStatusClass,\n  statusDotClass,\n  statusToneClass,\n  type GrAvatarShape,\n  type GrAvatarStatus,\n} from './grAvatarStyles'\n\nexport type { GrAvatarShape, GrAvatarStatus } from './grAvatarStyles'\n\n/** Диаметр аватара для каждой ступени канонической шкалы. */\nconst GR_AVATAR_SIZE_PX = {\n  xs: 24,\n  sm: 32,\n  md: 40,\n  lg: 56,\n} as const\n\nexport interface GrAvatarProps {\n  /**\n   * Размер по канонической шкале (`xs|sm|md|lg`) — тогда работает\n   * `GrConfigProvider`. Число — escape-hatch: аватар нужен произвольного\n   * диаметра (24px в строке списка, 96px в профиле), и четыре ступени шкалы\n   * этого не закрывают.\n   */\n  size?: GrSizeWithPx\n  src?: string\n  /** Резервная картинка: показывается, когда `src` не загрузился. */\n  fallbackSrc?: string\n  alt?: string\n  /** Имя участника: даёт инициалы и доступное имя аватара. */\n  name?: string\n  shape?: GrAvatarShape\n  /** Статус участника. Точка декоративна — рядом идёт скрытая подпись. */\n  status?: GrAvatarStatus\n}\n\nconst props = withDefaults(defineProps<GrAvatarProps>(), {\n  size: undefined,\n  src: undefined,\n  fallbackSrc: undefined,\n  alt: undefined,\n  name: undefined,\n  // Дефолт живёт в резолвере: Vue подставил бы свой раньше, чем компонент\n  // заглянет в `GrConfigProvider`.\n  shape: undefined,\n  status: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Содержимое вместо картинки и инициалов. */\n  default?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\nconst group = inject(GR_AVATAR_GROUP_KEY, null)\n\n// Размер и форма группы сильнее провайдера, но слабее собственного пропа.\nconst localSize = computed(() => props.size ?? group?.size)\n\nconst resolvedScaleSize = useGrComponentSize(\n  () => (typeof localSize.value === 'number' ? undefined : localSize.value),\n  { component: 'GrAvatar' },\n)\n\nconst resolvedShape = useGrComponentProp(\n  'GrAvatar',\n  'shape',\n  () => props.shape ?? group?.shape,\n  'circle',\n)\n\nconst sizePx = computed(() => (\n  typeof localSize.value === 'number' ? localSize.value : GR_AVATAR_SIZE_PX[resolvedScaleSize.value]\n))\n\nconst style = computed(() => {\n  const px = `${sizePx.value}px`\n  // Кегль на корне, а не на span инициалов: так он достаётся и слотовому тексту.\n  return { width: px, height: px, fontSize: `${avatarFontSizePx(sizePx.value)}px` }\n})\n\n/**\n * Состояние картинки. Без него битая ссылка оставляла `v-if=\"src\"` истинным:\n * браузер рисовал сломанное изображение, а запасной вариант не показывался\n * никогда.\n */\ntype ImageState = 'loading' | 'loaded' | 'error'\n\nconst primaryState = ref<ImageState>('loading')\nconst fallbackState = ref<ImageState>('loading')\n\n// Новая ссылка не должна наследовать ошибку прошлой.\nwatch(() => props.src, () => {\n  primaryState.value = 'loading'\n})\nwatch(() => props.fallbackSrc, () => {\n  fallbackState.value = 'loading'\n})\n\nconst activeSrc = computed(() => {\n  if (props.src && primaryState.value !== 'error')\n    return props.src\n  if (props.fallbackSrc && fallbackState.value !== 'error')\n    return props.fallbackSrc\n  return undefined\n})\n\nconst isFallbackActive = computed(() => Boolean(activeSrc.value) && activeSrc.value !== props.src)\n\n// Скелет держит место, пока картинка едет: иначе ряд аватаров мигает пустотой.\nconst showSkeleton = computed(() => {\n  if (!activeSrc.value)\n    return false\n  return (isFallbackActive.value ? fallbackState.value : primaryState.value) === 'loading'\n})\n\nconst initials = computed(() => (props.name ? initialsFrom(props.name) : ''))\n\n// Пусто — когда нет ни картинки, ни слота, ни имени.\nconst showInitials = computed(() => !activeSrc.value && !slots.default && Boolean(initials.value))\n\nconst statusLabel = computed(() => (props.status\n  ? t(`gr.avatar.status.${props.status}`, props.status)\n  : undefined))\n\n/**\n * Доступное имя: `alt` сильнее всего, иначе имя участника.\n *\n * Когда есть картинка, имя несёт её `alt` — так привычнее потребителю и не\n * возникает двойного объявления. Без картинки роль и имя берёт на себя корень:\n * иначе аватар с инициалами остался бы для диктора пустым.\n */\nconst accessibleName = computed(() => props.alt ?? props.name ?? '')\n\nconst rootIsImage = computed(() => !activeSrc.value && accessibleName.value !== '')\n\nconst rootClass = computed(() => [\n  rootBaseClass,\n  grAvatarClass(resolvedShape.value),\n  props.status ? rootStatusClass : '',\n])\n\nfunction onError(kind: 'primary' | 'fallback'): void {\n  if (kind === 'primary')\n    primaryState.value = 'error'\n  else fallbackState.value = 'error'\n}\n\nfunction onLoad(kind: 'primary' | 'fallback'): void {\n  if (kind === 'primary')\n    primaryState.value = 'loaded'\n  else fallbackState.value = 'loaded'\n}\n</script>\n\n<template>\n  <span\n    data-gr-avatar\n    :style=\"style\"\n    :class=\"rootClass\"\n    :role=\"rootIsImage ? 'img' : undefined\"\n    :aria-label=\"rootIsImage ? accessibleName : undefined\"\n  >\n    <span :class=\"[mediaClass, status ? [mediaClipClass, grAvatarClass(resolvedShape)] : '']\">\n      <GrSkeleton\n        v-if=\"showSkeleton\"\n        data-gr-avatar-skeleton\n        width=\"100%\"\n        height=\"100%\"\n        :rounded=\"resolvedShape === 'circle' ? 'var(--gr-radius-full)' : 'var(--gr-avatar-square-radius, 10px)'\"\n      />\n\n      <img\n        v-if=\"activeSrc\"\n        :key=\"activeSrc\"\n        data-gr-avatar-image\n        :src=\"activeSrc\"\n        :alt=\"accessibleName\"\n        class=\"h-full w-full object-cover\"\n        :class=\"showSkeleton ? 'invisible absolute' : ''\"\n        @error=\"onError(isFallbackActive ? 'fallback' : 'primary')\"\n        @load=\"onLoad(isFallbackActive ? 'fallback' : 'primary')\"\n      >\n\n      <span v-else-if=\"showInitials\" data-gr-avatar-initials>{{ initials }}</span>\n\n      <slot v-else />\n    </span>\n\n    <template v-if=\"status\">\n      <span\n        data-gr-avatar-status\n        :class=\"[statusDotClass, statusToneClass[status]]\"\n        aria-hidden=\"true\"\n      />\n      <!-- Цвет точки смысл не передаёт: статус объявляется словом (WCAG 1.4.1). -->\n      <span data-gr-avatar-status-label class=\"sr-only\">{{ statusLabel }}</span>\n    </template>\n  </span>\n</template>\n","<script setup lang=\"ts\">\n/**\n * GrAvatarGroup — ряд аватаров со стекингом и счётчиком скрытых.\n *\n * Группа объявлена `role=\"group\"` с именем и числом участников: без этого\n * скринридер читает набор безымянных картинок и не понимает, что их больше,\n * чем видно.\n */\nimport { computed, provide, type VNode } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\nimport { GR_AVATAR_GROUP_KEY } from './avatarContext'\nimport {\n  avatarFontSizePx,\n  grAvatarClass,\n  groupBaseClass,\n  groupItemClass,\n  groupOverflowClass,\n  rootBaseClass,\n  type GrAvatarShape,\n} from './grAvatarStyles'\n\nconst GR_AVATAR_GROUP_SIZE_PX = {\n  xs: 24,\n  sm: 32,\n  md: 40,\n  lg: 56,\n} as const\n\nexport interface GrAvatarGroupProps {\n  /** Размер и форма ряда: дети берут их из контекста. */\n  size?: GrSizeWithPx\n  shape?: GrAvatarShape\n  /** Сколько аватаров показывать; остальные сворачиваются в «+N». */\n  max?: number\n  /** Сколько участников всего, если в слоте лежит лишь часть. */\n  total?: number\n  /** Имя группы. Не задано — берётся из локали. */\n  ariaLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrAvatarGroupProps>(), {\n  size: undefined,\n  shape: undefined,\n  max: undefined,\n  total: undefined,\n  ariaLabel: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Аватары ряда. */\n  default?: () => VNode[]\n}>()\n\nconst { t } = useGranularityTranslations()\n\nprovide(GR_AVATAR_GROUP_KEY, {\n  get size() {\n    return props.size\n  },\n  get shape() {\n    return props.shape\n  },\n})\n\nconst children = computed(() => slots.default?.() ?? [])\n\n// `v-for` внутри слота приходит фрагментом — считаем его детей, иначе весь\n// список выглядел бы одним аватаром.\nconst items = computed<VNode[]>(() => children.value.flatMap((node) => {\n  const nested = node.children\n  return Array.isArray(nested) && typeof node.type === 'symbol' ? (nested as VNode[]) : [node]\n}))\n\nconst visible = computed(() => (props.max === undefined ? items.value : items.value.slice(0, Math.max(0, props.max))))\n\nconst hiddenCount = computed(() => {\n  const total = props.total ?? items.value.length\n  return Math.max(0, total - visible.value.length)\n})\n\nconst overflowSizePx = computed(() => (\n  typeof props.size === 'number' ? props.size : GR_AVATAR_GROUP_SIZE_PX[props.size ?? 'md']\n))\n\nconst overflowStyle = computed(() => {\n  const px = `${overflowSizePx.value}px`\n  return { width: px, height: px, fontSize: `${avatarFontSizePx(overflowSizePx.value)}px` }\n})\n\nconst groupLabel = computed(() => props.ariaLabel ?? t('gr.avatar.group', 'People'))\n\nconst accessibleLabel = computed(() => (hiddenCount.value > 0\n  ? `${groupLabel.value}, ${t('gr.avatar.groupOverflow', 'and {count} more', { count: hiddenCount.value, n: hiddenCount.value })}`\n  : groupLabel.value))\n</script>\n\n<template>\n  <div\n    data-gr-avatar-group\n    role=\"group\"\n    :aria-label=\"accessibleLabel\"\n    :class=\"groupBaseClass\"\n  >\n    <component\n      :is=\"node\"\n      v-for=\"(node, index) in visible\"\n      :key=\"index\"\n      :class=\"groupItemClass\"\n    />\n\n    <span\n      v-if=\"hiddenCount > 0\"\n      data-gr-avatar-group-overflow\n      aria-hidden=\"true\"\n      :class=\"[rootBaseClass, groupOverflowClass, groupItemClass, grAvatarClass(shape ?? 'circle')]\"\n      :style=\"overflowStyle\"\n    >+{{ hiddenCount }}</span>\n  </div>\n</template>\n","<script setup lang=\"ts\">\n/**\n * GrAvatarGroup — ряд аватаров со стекингом и счётчиком скрытых.\n *\n * Группа объявлена `role=\"group\"` с именем и числом участников: без этого\n * скринридер читает набор безымянных картинок и не понимает, что их больше,\n * чем видно.\n */\nimport { computed, provide, type VNode } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport type { GrSizeWithPx } from '../shared/sizes'\n\nimport { GR_AVATAR_GROUP_KEY } from './avatarContext'\nimport {\n  avatarFontSizePx,\n  grAvatarClass,\n  groupBaseClass,\n  groupItemClass,\n  groupOverflowClass,\n  rootBaseClass,\n  type GrAvatarShape,\n} from './grAvatarStyles'\n\nconst GR_AVATAR_GROUP_SIZE_PX = {\n  xs: 24,\n  sm: 32,\n  md: 40,\n  lg: 56,\n} as const\n\nexport interface GrAvatarGroupProps {\n  /** Размер и форма ряда: дети берут их из контекста. */\n  size?: GrSizeWithPx\n  shape?: GrAvatarShape\n  /** Сколько аватаров показывать; остальные сворачиваются в «+N». */\n  max?: number\n  /** Сколько участников всего, если в слоте лежит лишь часть. */\n  total?: number\n  /** Имя группы. Не задано — берётся из локали. */\n  ariaLabel?: string\n}\n\nconst props = withDefaults(defineProps<GrAvatarGroupProps>(), {\n  size: undefined,\n  shape: undefined,\n  max: undefined,\n  total: undefined,\n  ariaLabel: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Аватары ряда. */\n  default?: () => VNode[]\n}>()\n\nconst { t } = useGranularityTranslations()\n\nprovide(GR_AVATAR_GROUP_KEY, {\n  get size() {\n    return props.size\n  },\n  get shape() {\n    return props.shape\n  },\n})\n\nconst children = computed(() => slots.default?.() ?? [])\n\n// `v-for` внутри слота приходит фрагментом — считаем его детей, иначе весь\n// список выглядел бы одним аватаром.\nconst items = computed<VNode[]>(() => children.value.flatMap((node) => {\n  const nested = node.children\n  return Array.isArray(nested) && typeof node.type === 'symbol' ? (nested as VNode[]) : [node]\n}))\n\nconst visible = computed(() => (props.max === undefined ? items.value : items.value.slice(0, Math.max(0, props.max))))\n\nconst hiddenCount = computed(() => {\n  const total = props.total ?? items.value.length\n  return Math.max(0, total - visible.value.length)\n})\n\nconst overflowSizePx = computed(() => (\n  typeof props.size === 'number' ? props.size : GR_AVATAR_GROUP_SIZE_PX[props.size ?? 'md']\n))\n\nconst overflowStyle = computed(() => {\n  const px = `${overflowSizePx.value}px`\n  return { width: px, height: px, fontSize: `${avatarFontSizePx(overflowSizePx.value)}px` }\n})\n\nconst groupLabel = computed(() => props.ariaLabel ?? t('gr.avatar.group', 'People'))\n\nconst accessibleLabel = computed(() => (hiddenCount.value > 0\n  ? `${groupLabel.value}, ${t('gr.avatar.groupOverflow', 'and {count} more', { count: hiddenCount.value, n: hiddenCount.value })}`\n  : groupLabel.value))\n</script>\n\n<template>\n  <div\n    data-gr-avatar-group\n    role=\"group\"\n    :aria-label=\"accessibleLabel\"\n    :class=\"groupBaseClass\"\n  >\n    <component\n      :is=\"node\"\n      v-for=\"(node, index) in visible\"\n      :key=\"index\"\n      :class=\"groupItemClass\"\n    />\n\n    <span\n      v-if=\"hiddenCount > 0\"\n      data-gr-avatar-group-overflow\n      aria-hidden=\"true\"\n      :class=\"[rootBaseClass, groupOverflowClass, groupItemClass, grAvatarClass(shape ?? 'circle')]\"\n      :style=\"overflowStyle\"\n    >+{{ hiddenCount }}</span>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/GrAvatar/index.js

@@ -1,3 +1,3 @@
-import { n as GrAvatar_default, t as GrAvatarGroup_default } from "./chunks/GrAvatar-CNmLmgcr.js";
+import { n as GrAvatar_default, t as GrAvatarGroup_default } from "./chunks/GrAvatar-dWEXiCJG.js";
 import { c as initialsFrom, n as grAvatarSafelist, t as grAvatarConfig } from "../../chunks/config-B3J0alyY.js";
 export { GrAvatar_default as GrAvatar, GrAvatar_default as default, GrAvatarGroup_default as GrAvatarGroup, grAvatarConfig, grAvatarSafelist, initialsFrom };

package/dist/components/GrBadge/chunks/{GrBadge-DpUDXKbq.js → GrBadge-DBeQXEir.js}

@@ -1,5 +1,5 @@
-import { i as useGrComponentProp } from "../../../chunks/context-CTbuwcYs.js";
-import { t as warnRenamedProp } from "../../../chunks/renamedProp-BwcN-SJg.js";
+import { i as useGrComponentProp } from "../../../chunks/context-CPMRfwVr.js";
+import { t as warnRenamedProp } from "../../../chunks/renamedProp-Dy96tT-F.js";
 import { i as grBadgeClass, n as badgeIconSizeClassBySize, t as badgeIconClass } from "../../../chunks/grBadgeStyles-DV0DrAew.js";
 import { t as _plugin_vue_export_helper_default } from "../../../chunks/_plugin-vue_export-helper-BOaGB7Aw.js";
 import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, renderSlot, unref, useAttrs } from "vue";

package/dist/components/GrBadge/chunks/{GrBadge-DpUDXKbq.js.map → GrBadge-DBeQXEir.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrBadge-DpUDXKbq.js","names":["$slots"],"sources":["../../../../src/components/GrBadge/GrBadge.vue","../../../../src/components/GrBadge/GrBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, useAttrs } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\n\nexport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from './grBadgeStyles'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\n\nimport {\n  badgeIconClass,\n  badgeIconSizeClassBySize,\n  grBadgeClass,\n  type GrBadgeRadius,\n  type GrBadgeSize,\n  type GrBadgeTone,\n} from './grBadgeStyles'\n\nexport interface GrBadgeProps {\n  tone?: GrBadgeTone\n  dark?: boolean\n  size?: GrBadgeSize\n  radius?: GrBadgeRadius\n}\n\nconst props = withDefaults(\n  defineProps<GrBadgeProps>(),\n  {\n    // `tone`/`size`/`radius` настраиваются через `GrConfigProvider`, поэтому\n    // их дефолты живут в резолверах ниже, а не в `withDefaults`.\n    tone: undefined,\n    dark: false,\n    size: undefined,\n    radius: undefined,\n  },\n)\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\nconst resolvedTone = useGrComponentProp('GrBadge', 'tone', () => props.tone, 'neutral')\nconst resolvedSize = useGrComponentProp('GrBadge', 'size', () => props.size, 'sm')\nconst resolvedRadius = useGrComponentProp('GrBadge', 'radius', () => props.radius, 'round')\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrBadge', useAttrs(), { variant: 'tone' })\n\nconst className = computed(() => {\n  return grBadgeClass({\n    tone: resolvedTone.value,\n    dark: props.dark,\n    size: resolvedSize.value,\n    radius: resolvedRadius.value,\n  })\n})\n\nconst iconSizeClass = computed(() => badgeIconSizeClassBySize[resolvedSize.value])\n\ndefineSlots<{\n  /** Содержимое метки. */\n  default?: () => any\n  /**\n   * Иконка перед подписью: статус со спиннером, флаг, значок типа.\n   *\n   * Размер задаёт обёртка по ступени `size`, поэтому содержимое слота тянется\n   * до неё — `class=\"h-full w-full\"`, как у `GrChip`. Вращение спиннера —\n   * `animate-spin` на самой иконке.\n   *\n   * `GrProgressCircle` сюда не кладут: у кругового индикатора шкала виджетная,\n   * нижняя ступень — `2rem`, и в строку бейджа он не помещается.\n   */\n  icon?: () => any\n}>()\n</script>\n\n<template>\n  <span\n      class=\"gr-badge inline-block border whitespace-nowrap leading-none\"\n      :class=\"className\"\n  >\n    <span class=\"gr-badge__label\">\n      <span\n        v-if=\"$slots.icon\"\n        data-gr-badge-icon\n        :class=\"[badgeIconClass, iconSizeClass]\"\n      >\n        <slot name=\"icon\" />\n      </span>\n      <span class=\"gr-badge__text\">\n        <slot />\n      </span>\n    </span>\n  </span>\n</template>\n\n<style scoped>\n/*\n * Оптически центрируем текст по вертикали независимо от регистра,\n * не уменьшая высоту самого бейджа.\n *\n * Высоту держит обёртка `.gr-badge__label` (`min-height: 1lh` — высота\n * line-box при `leading-none`), а текст (`.gr-badge__text`) обрезается до\n * cap-height и центрируется внутри этой высоты через flex.\n *\n * Обрезка обязана жить на вложенном узле, а не на самом тексте: `text-box-trim`\n * уменьшает line-box, и повесь его прямо на текст — вместе с ним просядет\n * высота контента, а за ней и весь бейдж.\n *\n * `gap` задан в `em`, чтобы просвет перед иконкой шёл за кеглем ступени, а не\n * за корневым размером. Бейджа без иконки он не касается: у flex-контейнера с\n * единственным ребёнком просветов нет.\n */\n.gr-badge__label {\n  display: flex;\n  align-items: center;\n  gap: 0.25em;\n  min-height: 1lh;\n}\n\n.gr-badge__text {\n  display: block;\n  text-box-trim: trim-both;\n  text-box-edge: cap alphabetic;\n  /* Шорткат для браузеров с поддержкой нового синтаксиса. */\n  text-box: trim-both cap alphabetic;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, useAttrs } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\n\nexport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from './grBadgeStyles'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\n\nimport {\n  badgeIconClass,\n  badgeIconSizeClassBySize,\n  grBadgeClass,\n  type GrBadgeRadius,\n  type GrBadgeSize,\n  type GrBadgeTone,\n} from './grBadgeStyles'\n\nexport interface GrBadgeProps {\n  tone?: GrBadgeTone\n  dark?: boolean\n  size?: GrBadgeSize\n  radius?: GrBadgeRadius\n}\n\nconst props = withDefaults(\n  defineProps<GrBadgeProps>(),\n  {\n    // `tone`/`size`/`radius` настраиваются через `GrConfigProvider`, поэтому\n    // их дефолты живут в резолверах ниже, а не в `withDefaults`.\n    tone: undefined,\n    dark: false,\n    size: undefined,\n    radius: undefined,\n  },\n)\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\nconst resolvedTone = useGrComponentProp('GrBadge', 'tone', () => props.tone, 'neutral')\nconst resolvedSize = useGrComponentProp('GrBadge', 'size', () => props.size, 'sm')\nconst resolvedRadius = useGrComponentProp('GrBadge', 'radius', () => props.radius, 'round')\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrBadge', useAttrs(), { variant: 'tone' })\n\nconst className = computed(() => {\n  return grBadgeClass({\n    tone: resolvedTone.value,\n    dark: props.dark,\n    size: resolvedSize.value,\n    radius: resolvedRadius.value,\n  })\n})\n\nconst iconSizeClass = computed(() => badgeIconSizeClassBySize[resolvedSize.value])\n\ndefineSlots<{\n  /** Содержимое метки. */\n  default?: () => any\n  /**\n   * Иконка перед подписью: статус со спиннером, флаг, значок типа.\n   *\n   * Размер задаёт обёртка по ступени `size`, поэтому содержимое слота тянется\n   * до неё — `class=\"h-full w-full\"`, как у `GrChip`. Вращение спиннера —\n   * `animate-spin` на самой иконке.\n   *\n   * `GrProgressCircle` сюда не кладут: у кругового индикатора шкала виджетная,\n   * нижняя ступень — `2rem`, и в строку бейджа он не помещается.\n   */\n  icon?: () => any\n}>()\n</script>\n\n<template>\n  <span\n      class=\"gr-badge inline-block border whitespace-nowrap leading-none\"\n      :class=\"className\"\n  >\n    <span class=\"gr-badge__label\">\n      <span\n        v-if=\"$slots.icon\"\n        data-gr-badge-icon\n        :class=\"[badgeIconClass, iconSizeClass]\"\n      >\n        <slot name=\"icon\" />\n      </span>\n      <span class=\"gr-badge__text\">\n        <slot />\n      </span>\n    </span>\n  </span>\n</template>\n\n<style scoped>\n/*\n * Оптически центрируем текст по вертикали независимо от регистра,\n * не уменьшая высоту самого бейджа.\n *\n * Высоту держит обёртка `.gr-badge__label` (`min-height: 1lh` — высота\n * line-box при `leading-none`), а текст (`.gr-badge__text`) обрезается до\n * cap-height и центрируется внутри этой высоты через flex.\n *\n * Обрезка обязана жить на вложенном узле, а не на самом тексте: `text-box-trim`\n * уменьшает line-box, и повесь его прямо на текст — вместе с ним просядет\n * высота контента, а за ней и весь бейдж.\n *\n * `gap` задан в `em`, чтобы просвет перед иконкой шёл за кеглем ступени, а не\n * за корневым размером. Бейджа без иконки он не касается: у flex-контейнера с\n * единственным ребёнком просветов нет.\n */\n.gr-badge__label {\n  display: flex;\n  align-items: center;\n  gap: 0.25em;\n  min-height: 1lh;\n}\n\n.gr-badge__text {\n  display: block;\n  text-box-trim: trim-both;\n  text-box-edge: cap alphabetic;\n  /* Шорткат для браузеров с поддержкой нового синтаксиса. */\n  text-box: trim-both cap alphabetic;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAyBA,MAAM,QAAQ;EAad,MAAM,eAAe,mBAAmB,WAAW,cAAc,MAAM,MAAM,SAAS;EACtF,MAAM,eAAe,mBAAmB,WAAW,cAAc,MAAM,MAAM,IAAI;EACjF,MAAM,iBAAiB,mBAAmB,WAAW,gBAAgB,MAAM,QAAQ,OAAO;EAK1F,gBAAgB,WAAW,SAAS,GAAG,EAAE,SAAS,OAAO,CAAC;EAE1D,MAAM,YAAY,eAAe;GAC/B,OAAO,aAAa;IAClB,MAAM,aAAa;IACnB,MAAM,MAAM;IACZ,MAAM,aAAa;IACnB,QAAQ,eAAe;GACzB,CAAC;EACH,CAAC;EAED,MAAM,gBAAgB,eAAe,yBAAyB,aAAa,MAAM;;uBAoB/E,mBAgBO,QAAA,EAfH,OAAK,eAAA,CAAC,+DACE,UAAA,KAAS,CAAA,EAAA,GAAA,CAEnB,mBAWO,QAXP,YAWO,CATGA,KAAAA,OAAO,QAAA,UAAA,GADf,mBAMO,QAAA;;IAJL,sBAAA;IACC,OAAK,eAAA,CAAG,MAAA,cAAA,GAAgB,cAAA,KAAa,CAAA;OAEtC,WAAoB,KAAA,QAAA,QAAA,CAAA,GAAA,KAAA,GAAA,IAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAEtB,mBAEO,QAFP,YAEO,CADL,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,KAAA,GAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA"}
+{"version":3,"file":"GrBadge-DBeQXEir.js","names":["$slots"],"sources":["../../../../src/components/GrBadge/GrBadge.vue","../../../../src/components/GrBadge/GrBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, useAttrs } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\n\nexport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from './grBadgeStyles'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\n\nimport {\n  badgeIconClass,\n  badgeIconSizeClassBySize,\n  grBadgeClass,\n  type GrBadgeRadius,\n  type GrBadgeSize,\n  type GrBadgeTone,\n} from './grBadgeStyles'\n\nexport interface GrBadgeProps {\n  tone?: GrBadgeTone\n  dark?: boolean\n  size?: GrBadgeSize\n  radius?: GrBadgeRadius\n}\n\nconst props = withDefaults(\n  defineProps<GrBadgeProps>(),\n  {\n    // `tone`/`size`/`radius` настраиваются через `GrConfigProvider`, поэтому\n    // их дефолты живут в резолверах ниже, а не в `withDefaults`.\n    tone: undefined,\n    dark: false,\n    size: undefined,\n    radius: undefined,\n  },\n)\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\nconst resolvedTone = useGrComponentProp('GrBadge', 'tone', () => props.tone, 'neutral')\nconst resolvedSize = useGrComponentProp('GrBadge', 'size', () => props.size, 'sm')\nconst resolvedRadius = useGrComponentProp('GrBadge', 'radius', () => props.radius, 'round')\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrBadge', useAttrs(), { variant: 'tone' })\n\nconst className = computed(() => {\n  return grBadgeClass({\n    tone: resolvedTone.value,\n    dark: props.dark,\n    size: resolvedSize.value,\n    radius: resolvedRadius.value,\n  })\n})\n\nconst iconSizeClass = computed(() => badgeIconSizeClassBySize[resolvedSize.value])\n\ndefineSlots<{\n  /** Содержимое метки. */\n  default?: () => any\n  /**\n   * Иконка перед подписью: статус со спиннером, флаг, значок типа.\n   *\n   * Размер задаёт обёртка по ступени `size`, поэтому содержимое слота тянется\n   * до неё — `class=\"h-full w-full\"`, как у `GrChip`. Вращение спиннера —\n   * `animate-spin` на самой иконке.\n   *\n   * `GrProgressCircle` сюда не кладут: у кругового индикатора шкала виджетная,\n   * нижняя ступень — `2rem`, и в строку бейджа он не помещается.\n   */\n  icon?: () => any\n}>()\n</script>\n\n<template>\n  <span\n      class=\"gr-badge inline-block border whitespace-nowrap leading-none\"\n      :class=\"className\"\n  >\n    <span class=\"gr-badge__label\">\n      <span\n        v-if=\"$slots.icon\"\n        data-gr-badge-icon\n        :class=\"[badgeIconClass, iconSizeClass]\"\n      >\n        <slot name=\"icon\" />\n      </span>\n      <span class=\"gr-badge__text\">\n        <slot />\n      </span>\n    </span>\n  </span>\n</template>\n\n<style scoped>\n/*\n * Оптически центрируем текст по вертикали независимо от регистра,\n * не уменьшая высоту самого бейджа.\n *\n * Высоту держит обёртка `.gr-badge__label` (`min-height: 1lh` — высота\n * line-box при `leading-none`), а текст (`.gr-badge__text`) обрезается до\n * cap-height и центрируется внутри этой высоты через flex.\n *\n * Обрезка обязана жить на вложенном узле, а не на самом тексте: `text-box-trim`\n * уменьшает line-box, и повесь его прямо на текст — вместе с ним просядет\n * высота контента, а за ней и весь бейдж.\n *\n * `gap` задан в `em`, чтобы просвет перед иконкой шёл за кеглем ступени, а не\n * за корневым размером. Бейджа без иконки он не касается: у flex-контейнера с\n * единственным ребёнком просветов нет.\n */\n.gr-badge__label {\n  display: flex;\n  align-items: center;\n  gap: 0.25em;\n  min-height: 1lh;\n}\n\n.gr-badge__text {\n  display: block;\n  text-box-trim: trim-both;\n  text-box-edge: cap alphabetic;\n  /* Шорткат для браузеров с поддержкой нового синтаксиса. */\n  text-box: trim-both cap alphabetic;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, useAttrs } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\n\nexport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from './grBadgeStyles'\n\nimport { warnRenamedProp } from '../shared/renamedProp'\n\nimport {\n  badgeIconClass,\n  badgeIconSizeClassBySize,\n  grBadgeClass,\n  type GrBadgeRadius,\n  type GrBadgeSize,\n  type GrBadgeTone,\n} from './grBadgeStyles'\n\nexport interface GrBadgeProps {\n  tone?: GrBadgeTone\n  dark?: boolean\n  size?: GrBadgeSize\n  radius?: GrBadgeRadius\n}\n\nconst props = withDefaults(\n  defineProps<GrBadgeProps>(),\n  {\n    // `tone`/`size`/`radius` настраиваются через `GrConfigProvider`, поэтому\n    // их дефолты живут в резолверах ниже, а не в `withDefaults`.\n    tone: undefined,\n    dark: false,\n    size: undefined,\n    radius: undefined,\n  },\n)\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\nconst resolvedTone = useGrComponentProp('GrBadge', 'tone', () => props.tone, 'neutral')\nconst resolvedSize = useGrComponentProp('GrBadge', 'size', () => props.size, 'sm')\nconst resolvedRadius = useGrComponentProp('GrBadge', 'radius', () => props.radius, 'round')\n\n// `variant` переименован в `tone`: незнакомый атрибут Vue сажает на корневой\n// узел, поэтому старое имя не роняет ни типы, ни рантайм — компонент молча\n// рисуется дефолтным тоном.\nwarnRenamedProp('GrBadge', useAttrs(), { variant: 'tone' })\n\nconst className = computed(() => {\n  return grBadgeClass({\n    tone: resolvedTone.value,\n    dark: props.dark,\n    size: resolvedSize.value,\n    radius: resolvedRadius.value,\n  })\n})\n\nconst iconSizeClass = computed(() => badgeIconSizeClassBySize[resolvedSize.value])\n\ndefineSlots<{\n  /** Содержимое метки. */\n  default?: () => any\n  /**\n   * Иконка перед подписью: статус со спиннером, флаг, значок типа.\n   *\n   * Размер задаёт обёртка по ступени `size`, поэтому содержимое слота тянется\n   * до неё — `class=\"h-full w-full\"`, как у `GrChip`. Вращение спиннера —\n   * `animate-spin` на самой иконке.\n   *\n   * `GrProgressCircle` сюда не кладут: у кругового индикатора шкала виджетная,\n   * нижняя ступень — `2rem`, и в строку бейджа он не помещается.\n   */\n  icon?: () => any\n}>()\n</script>\n\n<template>\n  <span\n      class=\"gr-badge inline-block border whitespace-nowrap leading-none\"\n      :class=\"className\"\n  >\n    <span class=\"gr-badge__label\">\n      <span\n        v-if=\"$slots.icon\"\n        data-gr-badge-icon\n        :class=\"[badgeIconClass, iconSizeClass]\"\n      >\n        <slot name=\"icon\" />\n      </span>\n      <span class=\"gr-badge__text\">\n        <slot />\n      </span>\n    </span>\n  </span>\n</template>\n\n<style scoped>\n/*\n * Оптически центрируем текст по вертикали независимо от регистра,\n * не уменьшая высоту самого бейджа.\n *\n * Высоту держит обёртка `.gr-badge__label` (`min-height: 1lh` — высота\n * line-box при `leading-none`), а текст (`.gr-badge__text`) обрезается до\n * cap-height и центрируется внутри этой высоты через flex.\n *\n * Обрезка обязана жить на вложенном узле, а не на самом тексте: `text-box-trim`\n * уменьшает line-box, и повесь его прямо на текст — вместе с ним просядет\n * высота контента, а за ней и весь бейдж.\n *\n * `gap` задан в `em`, чтобы просвет перед иконкой шёл за кеглем ступени, а не\n * за корневым размером. Бейджа без иконки он не касается: у flex-контейнера с\n * единственным ребёнком просветов нет.\n */\n.gr-badge__label {\n  display: flex;\n  align-items: center;\n  gap: 0.25em;\n  min-height: 1lh;\n}\n\n.gr-badge__text {\n  display: block;\n  text-box-trim: trim-both;\n  text-box-edge: cap alphabetic;\n  /* Шорткат для браузеров с поддержкой нового синтаксиса. */\n  text-box: trim-both cap alphabetic;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAyBA,MAAM,QAAQ;EAad,MAAM,eAAe,mBAAmB,WAAW,cAAc,MAAM,MAAM,SAAS;EACtF,MAAM,eAAe,mBAAmB,WAAW,cAAc,MAAM,MAAM,IAAI;EACjF,MAAM,iBAAiB,mBAAmB,WAAW,gBAAgB,MAAM,QAAQ,OAAO;EAK1F,gBAAgB,WAAW,SAAS,GAAG,EAAE,SAAS,OAAO,CAAC;EAE1D,MAAM,YAAY,eAAe;GAC/B,OAAO,aAAa;IAClB,MAAM,aAAa;IACnB,MAAM,MAAM;IACZ,MAAM,aAAa;IACnB,QAAQ,eAAe;GACzB,CAAC;EACH,CAAC;EAED,MAAM,gBAAgB,eAAe,yBAAyB,aAAa,MAAM;;GAoB/E,OAAA,UAAA,GAAA,mBAgBO,QAAA,EAfH,OAAK,eAAA,CAAC,+DACE,UAAA,KAAS,CAAA,EAAA,GAAA,CAEnB,mBAWO,QAXP,YAWO,CATGA,KAAAA,OAAO,QADf,UAAA,GAAA,mBAMO,QAAA;;IAJL,sBAAA;IACC,OAAK,eAAA,CAAG,MAAA,cAAA,GAAgB,cAAA,KAAa,CAAA;GAEtC,GAAA,CAAA,WAAoB,KAAA,QAAA,QAAA,CAAA,GAAA,KAAA,GAAA,IAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAEtB,mBAEO,QAFP,YAEO,CADL,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,KAAA,GAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA"}

package/dist/components/GrBadge/index.js

@@ -1,4 +1,4 @@
-import { t as GrBadge_default } from "./chunks/GrBadge-DpUDXKbq.js";
+import { t as GrBadge_default } from "./chunks/GrBadge-DBeQXEir.js";
 import { t as grBadgeSafelist } from "../../chunks/safelist-x8USecK8.js";
 import { t as grBadgeConfig } from "../../chunks/config-BscVxZR3.js";
 export { GrBadge_default as GrBadge, GrBadge_default as default, grBadgeConfig, grBadgeSafelist };

package/dist/components/GrBadgeWrap/chunks/{GrBadgeWrap-B-A3PRkE.js → GrBadgeWrap-wdfxaXiu.js}

@@ -53,6 +53,8 @@ var GrBadgeWrap_default = /* @__PURE__ */ defineComponent({
 			n: props.value
 		}));
 		const pulsing = ref(false);
+		/** Значение на экране: скрытый счётчик — то же самое, что его отсутствие. */
+		const visibleValue = computed(() => showCount.value ? props.value : void 0);
 		/**
 		* Пока анимация играет, новое изменение её не перезапускает: счётчик меняется
 		* пачкой (пять писем за секунду), и «поп» на каждое превратился бы в мельтешение.
@@ -63,7 +65,7 @@ var GrBadgeWrap_default = /* @__PURE__ */ defineComponent({
 		* `prefers-reduced-motion` событие тоже приходит — глобальный кламп сжимает
 		* анимацию до `0.01ms`, а не выключает её (`docs/motion.md`).
 		*/
-		watch(computed(() => showCount.value ? props.value : void 0), (next, prev) => {
+		watch(visibleValue, (next, prev) => {
 			if (!props.animate || pulsing.value) return;
 			if (isBadgeWrapPulse(prev, next)) pulsing.value = true;
 		});

package/dist/components/GrBadgeWrap/chunks/{GrBadgeWrap-B-A3PRkE.js.map → GrBadgeWrap-wdfxaXiu.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrBadgeWrap-B-A3PRkE.js","names":[],"sources":["../../../../src/components/GrBadgeWrap/GrBadgeWrap.vue","../../../../src/components/GrBadgeWrap/GrBadgeWrap.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  countBaseClass,\n  dotBaseClass,\n  dotPlacementClass,\n  formatBadgeValue,\n  isBadgeWrapPulse,\n  placementClass,\n  rootClass,\n  toneClass,\n  type GrBadgeWrapPlacement,\n  type GrBadgeWrapTone,\n} from './grBadgeWrapStyles'\n\nexport type { GrBadgeWrapPlacement, GrBadgeWrapTone } from './grBadgeWrapStyles'\n\n/**\n * GrBadgeWrap — обёртка, вешающая на потомка счётчик или точку-индикатор.\n *\n * Число объявляется скринридеру: «3» без единицы измерения ничего не значит,\n * поэтому рядом с бейджем идёт визуально скрытая подпись.\n */\nexport interface GrBadgeWrapProps {\n  value?: string | number\n  /** Точка вместо числа: чистая декорация, если не задан `ariaLabel`. */\n  dot?: boolean\n  /** Порог: значения больше него рисуются как «{max}+». */\n  max?: number\n  /** Показывать ли нулевое значение. По умолчанию ноль скрыт. */\n  showZero?: boolean\n  tone?: GrBadgeWrapTone\n  placement?: GrBadgeWrapPlacement\n  /** Подпись счётчика для скринридера. Не задана — берётся из локали. */\n  ariaLabel?: string\n  /** Отмечать ли появление и рост **счётчика** анимацией. Точке анимировать нечего. */\n  animate?: boolean\n}\n\nconst props = withDefaults(defineProps<GrBadgeWrapProps>(), {\n  value: undefined,\n  dot: false,\n  max: undefined,\n  showZero: false,\n  tone: 'danger',\n  placement: 'top-right',\n  ariaLabel: undefined,\n  animate: false,\n})\n\nconst { t } = useGranularityTranslations()\n\nconst showCount = computed(() => {\n  if (props.dot || props.value === undefined)\n    return false\n  return props.value !== 0 || props.showZero\n})\n\n/** Видимый текст: «120» при `max=99` превращается в «99+». */\nconst displayValue = computed(() => formatBadgeValue(props.value ?? '', props.max))\n\n/**\n * Озвучивается настоящее значение, а не обрезанное: «99 плюс» пользователю\n * ничего не говорит, «120 непрочитанных» — говорит.\n */\nconst countLabel = computed(() => props.ariaLabel\n  ?? t('gr.badgeWrap.count', '{count} new', { count: props.value, n: props.value }))\n\nconst pulsing = ref(false)\n\n/** Значение на экране: скрытый счётчик — то же самое, что его отсутствие. */\nconst visibleValue = computed(() => showCount.value ? props.value : undefined)\n\n/**\n * Пока анимация играет, новое изменение её не перезапускает: счётчик меняется\n * пачкой (пять писем за секунду), и «поп» на каждое превратился бы в мельтешение.\n * Серия за время анимации даёт ровно один «поп».\n *\n * Флаг отпускает `animationend`, а не таймер: длительность живёт в CSS-токене,\n * и число в скрипте было бы вторым источником правды. Под\n * `prefers-reduced-motion` событие тоже приходит — глобальный кламп сжимает\n * анимацию до `0.01ms`, а не выключает её (`docs/motion.md`).\n */\nwatch(visibleValue, (next, prev) => {\n  if (!props.animate || pulsing.value)\n    return\n  if (isBadgeWrapPulse(prev, next))\n    pulsing.value = true\n})\n\n// Ушедший с экрана счётчик `animationend` уже не пришлёт, и без сброса\n// следующее его появление осталось бы без анимации навсегда.\nwatch(showCount, (visible) => {\n  if (!visible)\n    pulsing.value = false\n})\n\ndefineSlots<{\n  /** Элемент, к которому крепится метка. */\n  default?: () => any\n}>()\n</script>\n\n<template>\n  <span :class=\"rootClass\">\n    <slot />\n\n    <template v-if=\"dot\">\n      <span\n        data-gr-badge-wrap-dot\n        :class=\"[dotBaseClass, dotPlacementClass[placement], toneClass[tone]]\"\n        aria-hidden=\"true\"\n      />\n      <!-- Точка сама по себе смысла не несёт; подпись появляется только когда\n           потребитель объяснил, о чём она. -->\n      <span v-if=\"ariaLabel\" data-gr-badge-wrap-label class=\"sr-only\">{{ ariaLabel }}</span>\n    </template>\n\n    <template v-else-if=\"showCount\">\n      <span\n        data-gr-badge-wrap-count\n        :data-gr-badge-wrap-pop=\"pulsing || undefined\"\n        :class=\"[countBaseClass, placementClass[placement], toneClass[tone]]\"\n        aria-hidden=\"true\"\n        @animationend=\"pulsing = false\"\n      >{{ displayValue }}</span>\n      <span data-gr-badge-wrap-label class=\"sr-only\">{{ countLabel }}</span>\n    </template>\n  </span>\n</template>\n\n<style>\n@keyframes gr-badge-wrap-pop {\n  0% {\n    transform: scale(0.4);\n  }\n  60% {\n    transform: scale(1.12);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n/*\n * `animation-fill-mode` не задан намеренно: под `prefers-reduced-motion` анимация\n * доигрывает за `0.01ms` и возвращает элемент в исходный кадр — бейдж на месте\n * и в нужном размере. Именно поэтому компоненту хватает глобального клампа и не\n * нужен собственный reduce-блок (`docs/motion.md`).\n */\n[data-gr-badge-wrap-count][data-gr-badge-wrap-pop] {\n  animation: gr-badge-wrap-pop var(--gr-duration-base) var(--gr-ease-out);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  countBaseClass,\n  dotBaseClass,\n  dotPlacementClass,\n  formatBadgeValue,\n  isBadgeWrapPulse,\n  placementClass,\n  rootClass,\n  toneClass,\n  type GrBadgeWrapPlacement,\n  type GrBadgeWrapTone,\n} from './grBadgeWrapStyles'\n\nexport type { GrBadgeWrapPlacement, GrBadgeWrapTone } from './grBadgeWrapStyles'\n\n/**\n * GrBadgeWrap — обёртка, вешающая на потомка счётчик или точку-индикатор.\n *\n * Число объявляется скринридеру: «3» без единицы измерения ничего не значит,\n * поэтому рядом с бейджем идёт визуально скрытая подпись.\n */\nexport interface GrBadgeWrapProps {\n  value?: string | number\n  /** Точка вместо числа: чистая декорация, если не задан `ariaLabel`. */\n  dot?: boolean\n  /** Порог: значения больше него рисуются как «{max}+». */\n  max?: number\n  /** Показывать ли нулевое значение. По умолчанию ноль скрыт. */\n  showZero?: boolean\n  tone?: GrBadgeWrapTone\n  placement?: GrBadgeWrapPlacement\n  /** Подпись счётчика для скринридера. Не задана — берётся из локали. */\n  ariaLabel?: string\n  /** Отмечать ли появление и рост **счётчика** анимацией. Точке анимировать нечего. */\n  animate?: boolean\n}\n\nconst props = withDefaults(defineProps<GrBadgeWrapProps>(), {\n  value: undefined,\n  dot: false,\n  max: undefined,\n  showZero: false,\n  tone: 'danger',\n  placement: 'top-right',\n  ariaLabel: undefined,\n  animate: false,\n})\n\nconst { t } = useGranularityTranslations()\n\nconst showCount = computed(() => {\n  if (props.dot || props.value === undefined)\n    return false\n  return props.value !== 0 || props.showZero\n})\n\n/** Видимый текст: «120» при `max=99` превращается в «99+». */\nconst displayValue = computed(() => formatBadgeValue(props.value ?? '', props.max))\n\n/**\n * Озвучивается настоящее значение, а не обрезанное: «99 плюс» пользователю\n * ничего не говорит, «120 непрочитанных» — говорит.\n */\nconst countLabel = computed(() => props.ariaLabel\n  ?? t('gr.badgeWrap.count', '{count} new', { count: props.value, n: props.value }))\n\nconst pulsing = ref(false)\n\n/** Значение на экране: скрытый счётчик — то же самое, что его отсутствие. */\nconst visibleValue = computed(() => showCount.value ? props.value : undefined)\n\n/**\n * Пока анимация играет, новое изменение её не перезапускает: счётчик меняется\n * пачкой (пять писем за секунду), и «поп» на каждое превратился бы в мельтешение.\n * Серия за время анимации даёт ровно один «поп».\n *\n * Флаг отпускает `animationend`, а не таймер: длительность живёт в CSS-токене,\n * и число в скрипте было бы вторым источником правды. Под\n * `prefers-reduced-motion` событие тоже приходит — глобальный кламп сжимает\n * анимацию до `0.01ms`, а не выключает её (`docs/motion.md`).\n */\nwatch(visibleValue, (next, prev) => {\n  if (!props.animate || pulsing.value)\n    return\n  if (isBadgeWrapPulse(prev, next))\n    pulsing.value = true\n})\n\n// Ушедший с экрана счётчик `animationend` уже не пришлёт, и без сброса\n// следующее его появление осталось бы без анимации навсегда.\nwatch(showCount, (visible) => {\n  if (!visible)\n    pulsing.value = false\n})\n\ndefineSlots<{\n  /** Элемент, к которому крепится метка. */\n  default?: () => any\n}>()\n</script>\n\n<template>\n  <span :class=\"rootClass\">\n    <slot />\n\n    <template v-if=\"dot\">\n      <span\n        data-gr-badge-wrap-dot\n        :class=\"[dotBaseClass, dotPlacementClass[placement], toneClass[tone]]\"\n        aria-hidden=\"true\"\n      />\n      <!-- Точка сама по себе смысла не несёт; подпись появляется только когда\n           потребитель объяснил, о чём она. -->\n      <span v-if=\"ariaLabel\" data-gr-badge-wrap-label class=\"sr-only\">{{ ariaLabel }}</span>\n    </template>\n\n    <template v-else-if=\"showCount\">\n      <span\n        data-gr-badge-wrap-count\n        :data-gr-badge-wrap-pop=\"pulsing || undefined\"\n        :class=\"[countBaseClass, placementClass[placement], toneClass[tone]]\"\n        aria-hidden=\"true\"\n        @animationend=\"pulsing = false\"\n      >{{ displayValue }}</span>\n      <span data-gr-badge-wrap-label class=\"sr-only\">{{ countLabel }}</span>\n    </template>\n  </span>\n</template>\n\n<style>\n@keyframes gr-badge-wrap-pop {\n  0% {\n    transform: scale(0.4);\n  }\n  60% {\n    transform: scale(1.12);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n/*\n * `animation-fill-mode` не задан намеренно: под `prefers-reduced-motion` анимация\n * доигрывает за `0.01ms` и возвращает элемент в исходный кадр — бейдж на месте\n * и в нужном размере. Именно поэтому компоненту хватает глобального клампа и не\n * нужен собственный reduce-блок (`docs/motion.md`).\n */\n[data-gr-badge-wrap-count][data-gr-badge-wrap-pop] {\n  animation: gr-badge-wrap-pop var(--gr-duration-base) var(--gr-ease-out);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0CA,MAAM,QAAQ;EAWd,MAAM,EAAE,MAAM,2BAA2B;EAEzC,MAAM,YAAY,eAAe;GAC/B,IAAI,MAAM,OAAO,MAAM,UAAU,KAAA,GAC/B,OAAO;GACT,OAAO,MAAM,UAAU,KAAK,MAAM;EACpC,CAAC;;EAGD,MAAM,eAAe,eAAe,iBAAiB,MAAM,SAAS,IAAI,MAAM,GAAG,CAAC;;;;;EAMlF,MAAM,aAAa,eAAe,MAAM,aACnC,EAAE,sBAAsB,eAAe;GAAE,OAAO,MAAM;GAAO,GAAG,MAAM;EAAM,CAAC,CAAC;EAEnF,MAAM,UAAU,IAAI,KAAK;;;;;;;;;;;EAezB,MAZqB,eAAe,UAAU,QAAQ,MAAM,QAAQ,KAAA,CAY9D,IAAe,MAAM,SAAS;GAClC,IAAI,CAAC,MAAM,WAAW,QAAQ,OAC5B;GACF,IAAI,iBAAiB,MAAM,IAAI,GAC7B,QAAQ,QAAQ;EACpB,CAAC;EAID,MAAM,YAAY,YAAY;GAC5B,IAAI,CAAC,SACH,QAAQ,QAAQ;EACpB,CAAC;;uBASC,mBAwBO,QAAA,EAxBA,OAAK,eAAE,MAAA,SAAA,CAAS,EAAA,GAAA,CACrB,WAAQ,KAAA,QAAA,SAAA,GAEQ,QAAA,OAAA,UAAA,GAAhB,mBASW,UAAA,EAAA,KAAA,EAAA,GAAA,CART,mBAIE,QAAA;IAHA,0BAAA;IACC,OAAK,eAAA;KAAG,MAAA,YAAA;KAAc,MAAA,iBAAA,CAAiB,CAAC,QAAA;KAAY,MAAA,SAAA,CAAS,CAAC,QAAA;IAAI,CAAA;IACnE,eAAY;gBAIF,QAAA,aAAA,UAAA,GAAZ,mBAAsF,QAAtF,YAAsF,gBAAnB,QAAA,SAAS,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,EAAA,KAGzD,UAAA,SAAA,UAAA,GAArB,mBASW,UAAA,EAAA,KAAA,EAAA,GAAA,CART,mBAM0B,QAAA;IALxB,4BAAA;IACC,0BAAwB,QAAA,SAAW,KAAA;IACnC,OAAK,eAAA;KAAG,MAAA,cAAA;KAAgB,MAAA,cAAA,CAAc,CAAC,QAAA;KAAY,MAAA,SAAA,CAAS,CAAC,QAAA;IAAI,CAAA;IAClE,eAAY;IACX,gBAAY,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,QAAO;sBACpB,aAAA,KAAY,GAAA,IAAA,UAAA,GAChB,mBAAsE,QAAtE,YAAsE,gBAApB,WAAA,KAAU,GAAA,CAAA,CAAA,GAAA,EAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,CAAA"}
+{"version":3,"file":"GrBadgeWrap-wdfxaXiu.js","names":[],"sources":["../../../../src/components/GrBadgeWrap/GrBadgeWrap.vue","../../../../src/components/GrBadgeWrap/GrBadgeWrap.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  countBaseClass,\n  dotBaseClass,\n  dotPlacementClass,\n  formatBadgeValue,\n  isBadgeWrapPulse,\n  placementClass,\n  rootClass,\n  toneClass,\n  type GrBadgeWrapPlacement,\n  type GrBadgeWrapTone,\n} from './grBadgeWrapStyles'\n\nexport type { GrBadgeWrapPlacement, GrBadgeWrapTone } from './grBadgeWrapStyles'\n\n/**\n * GrBadgeWrap — обёртка, вешающая на потомка счётчик или точку-индикатор.\n *\n * Число объявляется скринридеру: «3» без единицы измерения ничего не значит,\n * поэтому рядом с бейджем идёт визуально скрытая подпись.\n */\nexport interface GrBadgeWrapProps {\n  value?: string | number\n  /** Точка вместо числа: чистая декорация, если не задан `ariaLabel`. */\n  dot?: boolean\n  /** Порог: значения больше него рисуются как «{max}+». */\n  max?: number\n  /** Показывать ли нулевое значение. По умолчанию ноль скрыт. */\n  showZero?: boolean\n  tone?: GrBadgeWrapTone\n  placement?: GrBadgeWrapPlacement\n  /** Подпись счётчика для скринридера. Не задана — берётся из локали. */\n  ariaLabel?: string\n  /** Отмечать ли появление и рост **счётчика** анимацией. Точке анимировать нечего. */\n  animate?: boolean\n}\n\nconst props = withDefaults(defineProps<GrBadgeWrapProps>(), {\n  value: undefined,\n  dot: false,\n  max: undefined,\n  showZero: false,\n  tone: 'danger',\n  placement: 'top-right',\n  ariaLabel: undefined,\n  animate: false,\n})\n\nconst { t } = useGranularityTranslations()\n\nconst showCount = computed(() => {\n  if (props.dot || props.value === undefined)\n    return false\n  return props.value !== 0 || props.showZero\n})\n\n/** Видимый текст: «120» при `max=99` превращается в «99+». */\nconst displayValue = computed(() => formatBadgeValue(props.value ?? '', props.max))\n\n/**\n * Озвучивается настоящее значение, а не обрезанное: «99 плюс» пользователю\n * ничего не говорит, «120 непрочитанных» — говорит.\n */\nconst countLabel = computed(() => props.ariaLabel\n  ?? t('gr.badgeWrap.count', '{count} new', { count: props.value, n: props.value }))\n\nconst pulsing = ref(false)\n\n/** Значение на экране: скрытый счётчик — то же самое, что его отсутствие. */\nconst visibleValue = computed(() => showCount.value ? props.value : undefined)\n\n/**\n * Пока анимация играет, новое изменение её не перезапускает: счётчик меняется\n * пачкой (пять писем за секунду), и «поп» на каждое превратился бы в мельтешение.\n * Серия за время анимации даёт ровно один «поп».\n *\n * Флаг отпускает `animationend`, а не таймер: длительность живёт в CSS-токене,\n * и число в скрипте было бы вторым источником правды. Под\n * `prefers-reduced-motion` событие тоже приходит — глобальный кламп сжимает\n * анимацию до `0.01ms`, а не выключает её (`docs/motion.md`).\n */\nwatch(visibleValue, (next, prev) => {\n  if (!props.animate || pulsing.value)\n    return\n  if (isBadgeWrapPulse(prev, next))\n    pulsing.value = true\n})\n\n// Ушедший с экрана счётчик `animationend` уже не пришлёт, и без сброса\n// следующее его появление осталось бы без анимации навсегда.\nwatch(showCount, (visible) => {\n  if (!visible)\n    pulsing.value = false\n})\n\ndefineSlots<{\n  /** Элемент, к которому крепится метка. */\n  default?: () => any\n}>()\n</script>\n\n<template>\n  <span :class=\"rootClass\">\n    <slot />\n\n    <template v-if=\"dot\">\n      <span\n        data-gr-badge-wrap-dot\n        :class=\"[dotBaseClass, dotPlacementClass[placement], toneClass[tone]]\"\n        aria-hidden=\"true\"\n      />\n      <!-- Точка сама по себе смысла не несёт; подпись появляется только когда\n           потребитель объяснил, о чём она. -->\n      <span v-if=\"ariaLabel\" data-gr-badge-wrap-label class=\"sr-only\">{{ ariaLabel }}</span>\n    </template>\n\n    <template v-else-if=\"showCount\">\n      <span\n        data-gr-badge-wrap-count\n        :data-gr-badge-wrap-pop=\"pulsing || undefined\"\n        :class=\"[countBaseClass, placementClass[placement], toneClass[tone]]\"\n        aria-hidden=\"true\"\n        @animationend=\"pulsing = false\"\n      >{{ displayValue }}</span>\n      <span data-gr-badge-wrap-label class=\"sr-only\">{{ countLabel }}</span>\n    </template>\n  </span>\n</template>\n\n<style>\n@keyframes gr-badge-wrap-pop {\n  0% {\n    transform: scale(0.4);\n  }\n  60% {\n    transform: scale(1.12);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n/*\n * `animation-fill-mode` не задан намеренно: под `prefers-reduced-motion` анимация\n * доигрывает за `0.01ms` и возвращает элемент в исходный кадр — бейдж на месте\n * и в нужном размере. Именно поэтому компоненту хватает глобального клампа и не\n * нужен собственный reduce-блок (`docs/motion.md`).\n */\n[data-gr-badge-wrap-count][data-gr-badge-wrap-pop] {\n  animation: gr-badge-wrap-pop var(--gr-duration-base) var(--gr-ease-out);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  countBaseClass,\n  dotBaseClass,\n  dotPlacementClass,\n  formatBadgeValue,\n  isBadgeWrapPulse,\n  placementClass,\n  rootClass,\n  toneClass,\n  type GrBadgeWrapPlacement,\n  type GrBadgeWrapTone,\n} from './grBadgeWrapStyles'\n\nexport type { GrBadgeWrapPlacement, GrBadgeWrapTone } from './grBadgeWrapStyles'\n\n/**\n * GrBadgeWrap — обёртка, вешающая на потомка счётчик или точку-индикатор.\n *\n * Число объявляется скринридеру: «3» без единицы измерения ничего не значит,\n * поэтому рядом с бейджем идёт визуально скрытая подпись.\n */\nexport interface GrBadgeWrapProps {\n  value?: string | number\n  /** Точка вместо числа: чистая декорация, если не задан `ariaLabel`. */\n  dot?: boolean\n  /** Порог: значения больше него рисуются как «{max}+». */\n  max?: number\n  /** Показывать ли нулевое значение. По умолчанию ноль скрыт. */\n  showZero?: boolean\n  tone?: GrBadgeWrapTone\n  placement?: GrBadgeWrapPlacement\n  /** Подпись счётчика для скринридера. Не задана — берётся из локали. */\n  ariaLabel?: string\n  /** Отмечать ли появление и рост **счётчика** анимацией. Точке анимировать нечего. */\n  animate?: boolean\n}\n\nconst props = withDefaults(defineProps<GrBadgeWrapProps>(), {\n  value: undefined,\n  dot: false,\n  max: undefined,\n  showZero: false,\n  tone: 'danger',\n  placement: 'top-right',\n  ariaLabel: undefined,\n  animate: false,\n})\n\nconst { t } = useGranularityTranslations()\n\nconst showCount = computed(() => {\n  if (props.dot || props.value === undefined)\n    return false\n  return props.value !== 0 || props.showZero\n})\n\n/** Видимый текст: «120» при `max=99` превращается в «99+». */\nconst displayValue = computed(() => formatBadgeValue(props.value ?? '', props.max))\n\n/**\n * Озвучивается настоящее значение, а не обрезанное: «99 плюс» пользователю\n * ничего не говорит, «120 непрочитанных» — говорит.\n */\nconst countLabel = computed(() => props.ariaLabel\n  ?? t('gr.badgeWrap.count', '{count} new', { count: props.value, n: props.value }))\n\nconst pulsing = ref(false)\n\n/** Значение на экране: скрытый счётчик — то же самое, что его отсутствие. */\nconst visibleValue = computed(() => showCount.value ? props.value : undefined)\n\n/**\n * Пока анимация играет, новое изменение её не перезапускает: счётчик меняется\n * пачкой (пять писем за секунду), и «поп» на каждое превратился бы в мельтешение.\n * Серия за время анимации даёт ровно один «поп».\n *\n * Флаг отпускает `animationend`, а не таймер: длительность живёт в CSS-токене,\n * и число в скрипте было бы вторым источником правды. Под\n * `prefers-reduced-motion` событие тоже приходит — глобальный кламп сжимает\n * анимацию до `0.01ms`, а не выключает её (`docs/motion.md`).\n */\nwatch(visibleValue, (next, prev) => {\n  if (!props.animate || pulsing.value)\n    return\n  if (isBadgeWrapPulse(prev, next))\n    pulsing.value = true\n})\n\n// Ушедший с экрана счётчик `animationend` уже не пришлёт, и без сброса\n// следующее его появление осталось бы без анимации навсегда.\nwatch(showCount, (visible) => {\n  if (!visible)\n    pulsing.value = false\n})\n\ndefineSlots<{\n  /** Элемент, к которому крепится метка. */\n  default?: () => any\n}>()\n</script>\n\n<template>\n  <span :class=\"rootClass\">\n    <slot />\n\n    <template v-if=\"dot\">\n      <span\n        data-gr-badge-wrap-dot\n        :class=\"[dotBaseClass, dotPlacementClass[placement], toneClass[tone]]\"\n        aria-hidden=\"true\"\n      />\n      <!-- Точка сама по себе смысла не несёт; подпись появляется только когда\n           потребитель объяснил, о чём она. -->\n      <span v-if=\"ariaLabel\" data-gr-badge-wrap-label class=\"sr-only\">{{ ariaLabel }}</span>\n    </template>\n\n    <template v-else-if=\"showCount\">\n      <span\n        data-gr-badge-wrap-count\n        :data-gr-badge-wrap-pop=\"pulsing || undefined\"\n        :class=\"[countBaseClass, placementClass[placement], toneClass[tone]]\"\n        aria-hidden=\"true\"\n        @animationend=\"pulsing = false\"\n      >{{ displayValue }}</span>\n      <span data-gr-badge-wrap-label class=\"sr-only\">{{ countLabel }}</span>\n    </template>\n  </span>\n</template>\n\n<style>\n@keyframes gr-badge-wrap-pop {\n  0% {\n    transform: scale(0.4);\n  }\n  60% {\n    transform: scale(1.12);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n/*\n * `animation-fill-mode` не задан намеренно: под `prefers-reduced-motion` анимация\n * доигрывает за `0.01ms` и возвращает элемент в исходный кадр — бейдж на месте\n * и в нужном размере. Именно поэтому компоненту хватает глобального клампа и не\n * нужен собственный reduce-блок (`docs/motion.md`).\n */\n[data-gr-badge-wrap-count][data-gr-badge-wrap-pop] {\n  animation: gr-badge-wrap-pop var(--gr-duration-base) var(--gr-ease-out);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0CA,MAAM,QAAQ;EAWd,MAAM,EAAE,MAAM,2BAA2B;EAEzC,MAAM,YAAY,eAAe;GAC/B,IAAI,MAAM,OAAO,MAAM,UAAU,KAAA,GAC/B,OAAO;GACT,OAAO,MAAM,UAAU,KAAK,MAAM;EACpC,CAAC;;EAGD,MAAM,eAAe,eAAe,iBAAiB,MAAM,SAAS,IAAI,MAAM,GAAG,CAAC;;;;;EAMlF,MAAM,aAAa,eAAe,MAAM,aACnC,EAAE,sBAAsB,eAAe;GAAE,OAAO,MAAM;GAAO,GAAG,MAAM;EAAM,CAAC,CAAC;EAEnF,MAAM,UAAU,IAAI,KAAK;;EAGzB,MAAM,eAAe,eAAe,UAAU,QAAQ,MAAM,QAAQ,KAAA,CAAS;;;;;;;;;;;EAY7E,MAAM,eAAe,MAAM,SAAS;GAClC,IAAI,CAAC,MAAM,WAAW,QAAQ,OAC5B;GACF,IAAI,iBAAiB,MAAM,IAAI,GAC7B,QAAQ,QAAQ;EACpB,CAAC;EAID,MAAM,YAAY,YAAY;GAC5B,IAAI,CAAC,SACH,QAAQ,QAAQ;EACpB,CAAC;;GASC,OAAA,UAAA,GAAA,mBAwBO,QAAA,EAxBA,OAAK,eAAE,MAAA,SAAA,CAAS,EAAA,GAAA,CACrB,WAAQ,KAAA,QAAA,SAAA,GAEQ,QAAA,OAAhB,UAAA,GAAA,mBASW,UAAA,EAAA,KAAA,EAAA,GAAA,CART,mBAIE,QAAA;IAHA,0BAAA;IACC,OAAK,eAAA;KAAG,MAAA,YAAA;KAAc,MAAA,iBAAA,CAAiB,CAAC,QAAA;KAAY,MAAA,SAAA,CAAS,CAAC,QAAA;IAAI,CAAA;IACnE,eAAY;GAIF,GAAA,MAAA,CAAA,GAAA,QAAA,aAAZ,UAAA,GAAA,mBAAsF,QAAtF,YAAsF,gBAAnB,QAAA,SAAS,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,EAAA,KAGzD,UAAA,SAArB,UAAA,GAAA,mBASW,UAAA,EAAA,KAAA,EAAA,GAAA,CART,mBAM0B,QAAA;IALxB,4BAAA;IACC,0BAAwB,QAAA,SAAW,KAAA;IACnC,OAAK,eAAA;KAAG,MAAA,cAAA;KAAgB,MAAA,cAAA,CAAc,CAAC,QAAA;KAAY,MAAA,SAAA,CAAS,CAAC,QAAA;IAAI,CAAA;IAClE,eAAY;IACX,gBAAY,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,QAAO;GACpB,GAAA,gBAAA,aAAA,KAAY,GAAA,IAAA,UAAA,GAChB,mBAAsE,QAAtE,YAAsE,gBAApB,WAAA,KAAU,GAAA,CAAA,CAAA,GAAA,EAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,CAAA"}

package/dist/components/GrBadgeWrap/index.js

@@ -1,3 +1,3 @@
 import { n as grBadgeWrapSafelist, o as formatBadgeValue, t as grBadgeWrapConfig } from "../../chunks/config-DwABJHEo.js";
-import { t as GrBadgeWrap_default } from "./chunks/GrBadgeWrap-B-A3PRkE.js";
+import { t as GrBadgeWrap_default } from "./chunks/GrBadgeWrap-wdfxaXiu.js";
 export { GrBadgeWrap_default as GrBadgeWrap, GrBadgeWrap_default as default, formatBadgeValue, grBadgeWrapConfig, grBadgeWrapSafelist };

package/dist/components/GrBottomNav/chunks/{GrBottomNav-wtFatLjB.js → GrBottomNav-nE08pVUJ.js}

@@ -1,4 +1,4 @@
-import { a as useGrComponentSize } from "../../../chunks/context-CTbuwcYs.js";
+import { a as useGrComponentSize } from "../../../chunks/context-CPMRfwVr.js";
 import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
 import { a as grBottomNavListClass, c as itemLabelClass, i as grBottomNavItemClass, o as grBottomNavRootClass, r as grBottomNavIconClass, s as itemBadgeClass } from "../../../chunks/config-DM0lsduD.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, markRaw, normalizeClass, openBlock, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, withCtx } from "vue";

package/dist/components/GrBottomNav/chunks/{GrBottomNav-wtFatLjB.js.map → GrBottomNav-nE08pVUJ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrBottomNav-wtFatLjB.js","names":[],"sources":["../../../../src/components/GrBottomNav/GrBottomNav.vue","../../../../src/components/GrBottomNav/GrBottomNav.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, markRaw, type Component } from 'vue'\n\nimport type { GrComponentSize } from '../shared/sizes'\n\nimport { useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  grBottomNavIconClass,\n  grBottomNavItemClass,\n  grBottomNavListClass,\n  grBottomNavRootClass,\n  itemBadgeClass,\n  itemLabelClass,\n  type GrBottomNavHideAbove,\n  type GrBottomNavPosition,\n} from './grBottomNavStyles'\n\nimport './defaults'\n\nexport type { GrBottomNavHideAbove, GrBottomNavPosition } from './grBottomNavStyles'\n\n/** Пункт нижней навигации. Кроме подписи и значения всё опционально. */\nexport type GrBottomNavItem = {\n  label: string\n  value: string\n  /** Иконка: класс UnoCSS-иконки (`'i-lucide-home'`) или Vue-компонент. Декоративна. */\n  icon?: string | Component\n  /** Счётчик поверх пункта. Число озвучивается словами, строка — как есть. */\n  badge?: string | number\n  /** Подпись счётчика для скринридера, сильнее локали. */\n  badgeLabel?: string\n  disabled?: boolean\n  href?: string\n  /** Цель роутерной ссылки: уезжает в компонент из `as`. */\n  to?: unknown\n  /** Доступное имя пункта, когда подписи недостаточно. */\n  ariaLabel?: string\n}\n\n/**\n * GrBottomNav — нижняя навигация приложения: ряд разделов, прижатый к нижней\n * кромке экрана.\n *\n * Активный пункт объявлен `aria-current=\"page\"` и отличается не только цветом:\n * подложкой и весом подписи тоже.\n */\nexport interface GrBottomNavProps {\n  modelValue: string\n  items: GrBottomNavItem[]\n  /** Компонент ссылки для пунктов с `to`: `RouterLink`, `NuxtLink`, `Link` Inertia. */\n  as?: string | Component\n  /** Брейкпоинт, начиная с которого панель скрывается. `none` — видна всегда. */\n  hideAbove?: GrBottomNavHideAbove\n  /** `static` вынимает панель из фиксированного слоя — для встраивания в макет. */\n  position?: GrBottomNavPosition\n  /** Имя лендмарка. Не задано — берётся из локали. */\n  ariaLabel?: string\n  /**\n   * Ступень размера: высота полосы, глиф и кегль подписи. Тач-таргет пункта\n   * остаётся 44×44 на любой ступени.\n   */\n  size?: GrComponentSize\n}\n\nexport interface GrBottomNavEmits {\n  (e: 'update:modelValue', value: string): void\n}\n\nconst props = withDefaults(defineProps<GrBottomNavProps>(), {\n  as: undefined,\n  hideAbove: 'sm',\n  position: 'fixed',\n  ariaLabel: undefined,\n  // `undefined`: «настоящий» дефолт живёт в `useGrComponentSize`, иначе\n  // `GrConfigProvider` не отличит заданное значение от подставленного Vue.\n  size: undefined,\n})\n\nconst emit = defineEmits<GrBottomNavEmits>()\n\ndefineSlots<{\n  /**\n   * Содержимое пункта вместо иконки, подписи и счётчика. Корень пункта —\n   * тег, `aria-current`, `aria-disabled` и клик — остаётся за компонентом.\n   */\n  item?: (props: {\n    item: GrBottomNavItem\n    active: boolean\n    disabled: boolean\n    badgeLabel: string | undefined\n  }) => any\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst resolvedAriaLabel = computed(() => props.ariaLabel ?? t('gr.bottomNav.label', 'Bottom navigation'))\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrBottomNav' })\n\nconst rootClass = computed(() => grBottomNavRootClass({\n  position: props.position,\n  hideAbove: props.hideAbove,\n}))\n\nconst linkComponent = computed(() => (props.as && typeof props.as !== 'string' ? markRaw(props.as) : props.as))\n\nfunction itemTag(item: GrBottomNavItem): string | Component {\n  if (item.disabled)\n    return 'span'\n  if (item.to !== undefined && linkComponent.value)\n    return linkComponent.value\n  return item.href ? 'a' : 'button'\n}\n\n/**\n * Счётчик рисуется декоративно, а рядом идёт скрытая подпись: голое «3» без\n * единицы измерения диктору ничего не сообщает.\n */\nfunction badgeLabel(item: GrBottomNavItem): string | undefined {\n  if (item.badge == null || item.badge === '')\n    return undefined\n  if (item.badgeLabel)\n    return item.badgeLabel\n  if (typeof item.badge === 'number') {\n    return t('gr.bottomNav.badge', '{count} new', { count: item.badge, n: item.badge })\n  }\n  return String(item.badge)\n}\n\nfunction select(item: GrBottomNavItem): void {\n  if (item.disabled)\n    return\n  emit('update:modelValue', item.value)\n}\n</script>\n\n<template>\n  <nav :class=\"rootClass\" :aria-label=\"resolvedAriaLabel\">\n    <div :class=\"grBottomNavListClass(resolvedSize)\">\n      <component\n        :is=\"itemTag(item)\"\n        v-for=\"item in items\"\n        :key=\"item.value\"\n        data-gr-bottom-nav-item\n        :type=\"itemTag(item) === 'button' ? 'button' : undefined\"\n        :href=\"itemTag(item) === 'a' ? item.href : undefined\"\n        :to=\"item.to !== undefined && linkComponent ? item.to : undefined\"\n        :aria-current=\"item.value === modelValue ? 'page' : undefined\"\n        :aria-disabled=\"item.disabled ? 'true' : undefined\"\n        :aria-label=\"item.ariaLabel\"\n        :class=\"grBottomNavItemClass({ active: item.value === modelValue, disabled: item.disabled ?? false, size: resolvedSize })\"\n        @click=\"select(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :active=\"item.value === modelValue\"\n          :disabled=\"item.disabled ?? false\"\n          :badge-label=\"badgeLabel(item)\"\n        >\n          <component :is=\"item.icon\" v-if=\"item.icon && typeof item.icon !== 'string'\" :class=\"grBottomNavIconClass(resolvedSize)\" aria-hidden=\"true\" />\n          <span v-else-if=\"item.icon\" :class=\"[item.icon, grBottomNavIconClass(resolvedSize)]\" aria-hidden=\"true\" />\n\n          <span :class=\"itemLabelClass\">{{ item.label }}</span>\n\n          <template v-if=\"item.badge != null && item.badge !== ''\">\n            <span data-gr-bottom-nav-badge :class=\"itemBadgeClass\" aria-hidden=\"true\">{{ item.badge }}</span>\n            <span data-gr-bottom-nav-badge-label class=\"sr-only\">{{ badgeLabel(item) }}</span>\n          </template>\n        </slot>\n      </component>\n    </div>\n  </nav>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, markRaw, type Component } from 'vue'\n\nimport type { GrComponentSize } from '../shared/sizes'\n\nimport { useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  grBottomNavIconClass,\n  grBottomNavItemClass,\n  grBottomNavListClass,\n  grBottomNavRootClass,\n  itemBadgeClass,\n  itemLabelClass,\n  type GrBottomNavHideAbove,\n  type GrBottomNavPosition,\n} from './grBottomNavStyles'\n\nimport './defaults'\n\nexport type { GrBottomNavHideAbove, GrBottomNavPosition } from './grBottomNavStyles'\n\n/** Пункт нижней навигации. Кроме подписи и значения всё опционально. */\nexport type GrBottomNavItem = {\n  label: string\n  value: string\n  /** Иконка: класс UnoCSS-иконки (`'i-lucide-home'`) или Vue-компонент. Декоративна. */\n  icon?: string | Component\n  /** Счётчик поверх пункта. Число озвучивается словами, строка — как есть. */\n  badge?: string | number\n  /** Подпись счётчика для скринридера, сильнее локали. */\n  badgeLabel?: string\n  disabled?: boolean\n  href?: string\n  /** Цель роутерной ссылки: уезжает в компонент из `as`. */\n  to?: unknown\n  /** Доступное имя пункта, когда подписи недостаточно. */\n  ariaLabel?: string\n}\n\n/**\n * GrBottomNav — нижняя навигация приложения: ряд разделов, прижатый к нижней\n * кромке экрана.\n *\n * Активный пункт объявлен `aria-current=\"page\"` и отличается не только цветом:\n * подложкой и весом подписи тоже.\n */\nexport interface GrBottomNavProps {\n  modelValue: string\n  items: GrBottomNavItem[]\n  /** Компонент ссылки для пунктов с `to`: `RouterLink`, `NuxtLink`, `Link` Inertia. */\n  as?: string | Component\n  /** Брейкпоинт, начиная с которого панель скрывается. `none` — видна всегда. */\n  hideAbove?: GrBottomNavHideAbove\n  /** `static` вынимает панель из фиксированного слоя — для встраивания в макет. */\n  position?: GrBottomNavPosition\n  /** Имя лендмарка. Не задано — берётся из локали. */\n  ariaLabel?: string\n  /**\n   * Ступень размера: высота полосы, глиф и кегль подписи. Тач-таргет пункта\n   * остаётся 44×44 на любой ступени.\n   */\n  size?: GrComponentSize\n}\n\nexport interface GrBottomNavEmits {\n  (e: 'update:modelValue', value: string): void\n}\n\nconst props = withDefaults(defineProps<GrBottomNavProps>(), {\n  as: undefined,\n  hideAbove: 'sm',\n  position: 'fixed',\n  ariaLabel: undefined,\n  // `undefined`: «настоящий» дефолт живёт в `useGrComponentSize`, иначе\n  // `GrConfigProvider` не отличит заданное значение от подставленного Vue.\n  size: undefined,\n})\n\nconst emit = defineEmits<GrBottomNavEmits>()\n\ndefineSlots<{\n  /**\n   * Содержимое пункта вместо иконки, подписи и счётчика. Корень пункта —\n   * тег, `aria-current`, `aria-disabled` и клик — остаётся за компонентом.\n   */\n  item?: (props: {\n    item: GrBottomNavItem\n    active: boolean\n    disabled: boolean\n    badgeLabel: string | undefined\n  }) => any\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst resolvedAriaLabel = computed(() => props.ariaLabel ?? t('gr.bottomNav.label', 'Bottom navigation'))\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrBottomNav' })\n\nconst rootClass = computed(() => grBottomNavRootClass({\n  position: props.position,\n  hideAbove: props.hideAbove,\n}))\n\nconst linkComponent = computed(() => (props.as && typeof props.as !== 'string' ? markRaw(props.as) : props.as))\n\nfunction itemTag(item: GrBottomNavItem): string | Component {\n  if (item.disabled)\n    return 'span'\n  if (item.to !== undefined && linkComponent.value)\n    return linkComponent.value\n  return item.href ? 'a' : 'button'\n}\n\n/**\n * Счётчик рисуется декоративно, а рядом идёт скрытая подпись: голое «3» без\n * единицы измерения диктору ничего не сообщает.\n */\nfunction badgeLabel(item: GrBottomNavItem): string | undefined {\n  if (item.badge == null || item.badge === '')\n    return undefined\n  if (item.badgeLabel)\n    return item.badgeLabel\n  if (typeof item.badge === 'number') {\n    return t('gr.bottomNav.badge', '{count} new', { count: item.badge, n: item.badge })\n  }\n  return String(item.badge)\n}\n\nfunction select(item: GrBottomNavItem): void {\n  if (item.disabled)\n    return\n  emit('update:modelValue', item.value)\n}\n</script>\n\n<template>\n  <nav :class=\"rootClass\" :aria-label=\"resolvedAriaLabel\">\n    <div :class=\"grBottomNavListClass(resolvedSize)\">\n      <component\n        :is=\"itemTag(item)\"\n        v-for=\"item in items\"\n        :key=\"item.value\"\n        data-gr-bottom-nav-item\n        :type=\"itemTag(item) === 'button' ? 'button' : undefined\"\n        :href=\"itemTag(item) === 'a' ? item.href : undefined\"\n        :to=\"item.to !== undefined && linkComponent ? item.to : undefined\"\n        :aria-current=\"item.value === modelValue ? 'page' : undefined\"\n        :aria-disabled=\"item.disabled ? 'true' : undefined\"\n        :aria-label=\"item.ariaLabel\"\n        :class=\"grBottomNavItemClass({ active: item.value === modelValue, disabled: item.disabled ?? false, size: resolvedSize })\"\n        @click=\"select(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :active=\"item.value === modelValue\"\n          :disabled=\"item.disabled ?? false\"\n          :badge-label=\"badgeLabel(item)\"\n        >\n          <component :is=\"item.icon\" v-if=\"item.icon && typeof item.icon !== 'string'\" :class=\"grBottomNavIconClass(resolvedSize)\" aria-hidden=\"true\" />\n          <span v-else-if=\"item.icon\" :class=\"[item.icon, grBottomNavIconClass(resolvedSize)]\" aria-hidden=\"true\" />\n\n          <span :class=\"itemLabelClass\">{{ item.label }}</span>\n\n          <template v-if=\"item.badge != null && item.badge !== ''\">\n            <span data-gr-bottom-nav-badge :class=\"itemBadgeClass\" aria-hidden=\"true\">{{ item.badge }}</span>\n            <span data-gr-bottom-nav-badge-label class=\"sr-only\">{{ badgeLabel(item) }}</span>\n          </template>\n        </slot>\n      </component>\n    </div>\n  </nav>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"GrBottomNav-nE08pVUJ.js","names":[],"sources":["../../../../src/components/GrBottomNav/GrBottomNav.vue","../../../../src/components/GrBottomNav/GrBottomNav.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, markRaw, type Component } from 'vue'\n\nimport type { GrComponentSize } from '../shared/sizes'\n\nimport { useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  grBottomNavIconClass,\n  grBottomNavItemClass,\n  grBottomNavListClass,\n  grBottomNavRootClass,\n  itemBadgeClass,\n  itemLabelClass,\n  type GrBottomNavHideAbove,\n  type GrBottomNavPosition,\n} from './grBottomNavStyles'\n\nimport './defaults'\n\nexport type { GrBottomNavHideAbove, GrBottomNavPosition } from './grBottomNavStyles'\n\n/** Пункт нижней навигации. Кроме подписи и значения всё опционально. */\nexport type GrBottomNavItem = {\n  label: string\n  value: string\n  /** Иконка: класс UnoCSS-иконки (`'i-lucide-home'`) или Vue-компонент. Декоративна. */\n  icon?: string | Component\n  /** Счётчик поверх пункта. Число озвучивается словами, строка — как есть. */\n  badge?: string | number\n  /** Подпись счётчика для скринридера, сильнее локали. */\n  badgeLabel?: string\n  disabled?: boolean\n  href?: string\n  /** Цель роутерной ссылки: уезжает в компонент из `as`. */\n  to?: unknown\n  /** Доступное имя пункта, когда подписи недостаточно. */\n  ariaLabel?: string\n}\n\n/**\n * GrBottomNav — нижняя навигация приложения: ряд разделов, прижатый к нижней\n * кромке экрана.\n *\n * Активный пункт объявлен `aria-current=\"page\"` и отличается не только цветом:\n * подложкой и весом подписи тоже.\n */\nexport interface GrBottomNavProps {\n  modelValue: string\n  items: GrBottomNavItem[]\n  /** Компонент ссылки для пунктов с `to`: `RouterLink`, `NuxtLink`, `Link` Inertia. */\n  as?: string | Component\n  /** Брейкпоинт, начиная с которого панель скрывается. `none` — видна всегда. */\n  hideAbove?: GrBottomNavHideAbove\n  /** `static` вынимает панель из фиксированного слоя — для встраивания в макет. */\n  position?: GrBottomNavPosition\n  /** Имя лендмарка. Не задано — берётся из локали. */\n  ariaLabel?: string\n  /**\n   * Ступень размера: высота полосы, глиф и кегль подписи. Тач-таргет пункта\n   * остаётся 44×44 на любой ступени.\n   */\n  size?: GrComponentSize\n}\n\nexport interface GrBottomNavEmits {\n  (e: 'update:modelValue', value: string): void\n}\n\nconst props = withDefaults(defineProps<GrBottomNavProps>(), {\n  as: undefined,\n  hideAbove: 'sm',\n  position: 'fixed',\n  ariaLabel: undefined,\n  // `undefined`: «настоящий» дефолт живёт в `useGrComponentSize`, иначе\n  // `GrConfigProvider` не отличит заданное значение от подставленного Vue.\n  size: undefined,\n})\n\nconst emit = defineEmits<GrBottomNavEmits>()\n\ndefineSlots<{\n  /**\n   * Содержимое пункта вместо иконки, подписи и счётчика. Корень пункта —\n   * тег, `aria-current`, `aria-disabled` и клик — остаётся за компонентом.\n   */\n  item?: (props: {\n    item: GrBottomNavItem\n    active: boolean\n    disabled: boolean\n    badgeLabel: string | undefined\n  }) => any\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst resolvedAriaLabel = computed(() => props.ariaLabel ?? t('gr.bottomNav.label', 'Bottom navigation'))\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrBottomNav' })\n\nconst rootClass = computed(() => grBottomNavRootClass({\n  position: props.position,\n  hideAbove: props.hideAbove,\n}))\n\nconst linkComponent = computed(() => (props.as && typeof props.as !== 'string' ? markRaw(props.as) : props.as))\n\nfunction itemTag(item: GrBottomNavItem): string | Component {\n  if (item.disabled)\n    return 'span'\n  if (item.to !== undefined && linkComponent.value)\n    return linkComponent.value\n  return item.href ? 'a' : 'button'\n}\n\n/**\n * Счётчик рисуется декоративно, а рядом идёт скрытая подпись: голое «3» без\n * единицы измерения диктору ничего не сообщает.\n */\nfunction badgeLabel(item: GrBottomNavItem): string | undefined {\n  if (item.badge == null || item.badge === '')\n    return undefined\n  if (item.badgeLabel)\n    return item.badgeLabel\n  if (typeof item.badge === 'number') {\n    return t('gr.bottomNav.badge', '{count} new', { count: item.badge, n: item.badge })\n  }\n  return String(item.badge)\n}\n\nfunction select(item: GrBottomNavItem): void {\n  if (item.disabled)\n    return\n  emit('update:modelValue', item.value)\n}\n</script>\n\n<template>\n  <nav :class=\"rootClass\" :aria-label=\"resolvedAriaLabel\">\n    <div :class=\"grBottomNavListClass(resolvedSize)\">\n      <component\n        :is=\"itemTag(item)\"\n        v-for=\"item in items\"\n        :key=\"item.value\"\n        data-gr-bottom-nav-item\n        :type=\"itemTag(item) === 'button' ? 'button' : undefined\"\n        :href=\"itemTag(item) === 'a' ? item.href : undefined\"\n        :to=\"item.to !== undefined && linkComponent ? item.to : undefined\"\n        :aria-current=\"item.value === modelValue ? 'page' : undefined\"\n        :aria-disabled=\"item.disabled ? 'true' : undefined\"\n        :aria-label=\"item.ariaLabel\"\n        :class=\"grBottomNavItemClass({ active: item.value === modelValue, disabled: item.disabled ?? false, size: resolvedSize })\"\n        @click=\"select(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :active=\"item.value === modelValue\"\n          :disabled=\"item.disabled ?? false\"\n          :badge-label=\"badgeLabel(item)\"\n        >\n          <component :is=\"item.icon\" v-if=\"item.icon && typeof item.icon !== 'string'\" :class=\"grBottomNavIconClass(resolvedSize)\" aria-hidden=\"true\" />\n          <span v-else-if=\"item.icon\" :class=\"[item.icon, grBottomNavIconClass(resolvedSize)]\" aria-hidden=\"true\" />\n\n          <span :class=\"itemLabelClass\">{{ item.label }}</span>\n\n          <template v-if=\"item.badge != null && item.badge !== ''\">\n            <span data-gr-bottom-nav-badge :class=\"itemBadgeClass\" aria-hidden=\"true\">{{ item.badge }}</span>\n            <span data-gr-bottom-nav-badge-label class=\"sr-only\">{{ badgeLabel(item) }}</span>\n          </template>\n        </slot>\n      </component>\n    </div>\n  </nav>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, markRaw, type Component } from 'vue'\n\nimport type { GrComponentSize } from '../shared/sizes'\n\nimport { useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  grBottomNavIconClass,\n  grBottomNavItemClass,\n  grBottomNavListClass,\n  grBottomNavRootClass,\n  itemBadgeClass,\n  itemLabelClass,\n  type GrBottomNavHideAbove,\n  type GrBottomNavPosition,\n} from './grBottomNavStyles'\n\nimport './defaults'\n\nexport type { GrBottomNavHideAbove, GrBottomNavPosition } from './grBottomNavStyles'\n\n/** Пункт нижней навигации. Кроме подписи и значения всё опционально. */\nexport type GrBottomNavItem = {\n  label: string\n  value: string\n  /** Иконка: класс UnoCSS-иконки (`'i-lucide-home'`) или Vue-компонент. Декоративна. */\n  icon?: string | Component\n  /** Счётчик поверх пункта. Число озвучивается словами, строка — как есть. */\n  badge?: string | number\n  /** Подпись счётчика для скринридера, сильнее локали. */\n  badgeLabel?: string\n  disabled?: boolean\n  href?: string\n  /** Цель роутерной ссылки: уезжает в компонент из `as`. */\n  to?: unknown\n  /** Доступное имя пункта, когда подписи недостаточно. */\n  ariaLabel?: string\n}\n\n/**\n * GrBottomNav — нижняя навигация приложения: ряд разделов, прижатый к нижней\n * кромке экрана.\n *\n * Активный пункт объявлен `aria-current=\"page\"` и отличается не только цветом:\n * подложкой и весом подписи тоже.\n */\nexport interface GrBottomNavProps {\n  modelValue: string\n  items: GrBottomNavItem[]\n  /** Компонент ссылки для пунктов с `to`: `RouterLink`, `NuxtLink`, `Link` Inertia. */\n  as?: string | Component\n  /** Брейкпоинт, начиная с которого панель скрывается. `none` — видна всегда. */\n  hideAbove?: GrBottomNavHideAbove\n  /** `static` вынимает панель из фиксированного слоя — для встраивания в макет. */\n  position?: GrBottomNavPosition\n  /** Имя лендмарка. Не задано — берётся из локали. */\n  ariaLabel?: string\n  /**\n   * Ступень размера: высота полосы, глиф и кегль подписи. Тач-таргет пункта\n   * остаётся 44×44 на любой ступени.\n   */\n  size?: GrComponentSize\n}\n\nexport interface GrBottomNavEmits {\n  (e: 'update:modelValue', value: string): void\n}\n\nconst props = withDefaults(defineProps<GrBottomNavProps>(), {\n  as: undefined,\n  hideAbove: 'sm',\n  position: 'fixed',\n  ariaLabel: undefined,\n  // `undefined`: «настоящий» дефолт живёт в `useGrComponentSize`, иначе\n  // `GrConfigProvider` не отличит заданное значение от подставленного Vue.\n  size: undefined,\n})\n\nconst emit = defineEmits<GrBottomNavEmits>()\n\ndefineSlots<{\n  /**\n   * Содержимое пункта вместо иконки, подписи и счётчика. Корень пункта —\n   * тег, `aria-current`, `aria-disabled` и клик — остаётся за компонентом.\n   */\n  item?: (props: {\n    item: GrBottomNavItem\n    active: boolean\n    disabled: boolean\n    badgeLabel: string | undefined\n  }) => any\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst resolvedAriaLabel = computed(() => props.ariaLabel ?? t('gr.bottomNav.label', 'Bottom navigation'))\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrBottomNav' })\n\nconst rootClass = computed(() => grBottomNavRootClass({\n  position: props.position,\n  hideAbove: props.hideAbove,\n}))\n\nconst linkComponent = computed(() => (props.as && typeof props.as !== 'string' ? markRaw(props.as) : props.as))\n\nfunction itemTag(item: GrBottomNavItem): string | Component {\n  if (item.disabled)\n    return 'span'\n  if (item.to !== undefined && linkComponent.value)\n    return linkComponent.value\n  return item.href ? 'a' : 'button'\n}\n\n/**\n * Счётчик рисуется декоративно, а рядом идёт скрытая подпись: голое «3» без\n * единицы измерения диктору ничего не сообщает.\n */\nfunction badgeLabel(item: GrBottomNavItem): string | undefined {\n  if (item.badge == null || item.badge === '')\n    return undefined\n  if (item.badgeLabel)\n    return item.badgeLabel\n  if (typeof item.badge === 'number') {\n    return t('gr.bottomNav.badge', '{count} new', { count: item.badge, n: item.badge })\n  }\n  return String(item.badge)\n}\n\nfunction select(item: GrBottomNavItem): void {\n  if (item.disabled)\n    return\n  emit('update:modelValue', item.value)\n}\n</script>\n\n<template>\n  <nav :class=\"rootClass\" :aria-label=\"resolvedAriaLabel\">\n    <div :class=\"grBottomNavListClass(resolvedSize)\">\n      <component\n        :is=\"itemTag(item)\"\n        v-for=\"item in items\"\n        :key=\"item.value\"\n        data-gr-bottom-nav-item\n        :type=\"itemTag(item) === 'button' ? 'button' : undefined\"\n        :href=\"itemTag(item) === 'a' ? item.href : undefined\"\n        :to=\"item.to !== undefined && linkComponent ? item.to : undefined\"\n        :aria-current=\"item.value === modelValue ? 'page' : undefined\"\n        :aria-disabled=\"item.disabled ? 'true' : undefined\"\n        :aria-label=\"item.ariaLabel\"\n        :class=\"grBottomNavItemClass({ active: item.value === modelValue, disabled: item.disabled ?? false, size: resolvedSize })\"\n        @click=\"select(item)\"\n      >\n        <slot\n          name=\"item\"\n          :item=\"item\"\n          :active=\"item.value === modelValue\"\n          :disabled=\"item.disabled ?? false\"\n          :badge-label=\"badgeLabel(item)\"\n        >\n          <component :is=\"item.icon\" v-if=\"item.icon && typeof item.icon !== 'string'\" :class=\"grBottomNavIconClass(resolvedSize)\" aria-hidden=\"true\" />\n          <span v-else-if=\"item.icon\" :class=\"[item.icon, grBottomNavIconClass(resolvedSize)]\" aria-hidden=\"true\" />\n\n          <span :class=\"itemLabelClass\">{{ item.label }}</span>\n\n          <template v-if=\"item.badge != null && item.badge !== ''\">\n            <span data-gr-bottom-nav-badge :class=\"itemBadgeClass\" aria-hidden=\"true\">{{ item.badge }}</span>\n            <span data-gr-bottom-nav-badge-label class=\"sr-only\">{{ badgeLabel(item) }}</span>\n          </template>\n        </slot>\n      </component>\n    </div>\n  </nav>\n</template>\n"],"mappings":"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"}

package/dist/components/GrBottomNav/index.js

@@ -1,3 +1,3 @@
 import { n as grBottomNavSafelist, t as grBottomNavConfig } from "../../chunks/config-DM0lsduD.js";
-import { t as GrBottomNav_default } from "./chunks/GrBottomNav-wtFatLjB.js";
+import { t as GrBottomNav_default } from "./chunks/GrBottomNav-nE08pVUJ.js";
 export { GrBottomNav_default as GrBottomNav, GrBottomNav_default as default, grBottomNavConfig, grBottomNavSafelist };

package/dist/components/GrBreadcrumbs/chunks/{GrBreadcrumbs-DRDNan_n.js → GrBreadcrumbs-DOpwY2EF.js}

@@ -1,6 +1,6 @@
-import { a as useGrComponentSize, i as useGrComponentProp } from "../../../chunks/context-CTbuwcYs.js";
+import { a as useGrComponentSize, i as useGrComponentProp } from "../../../chunks/context-CPMRfwVr.js";
 import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
-import { t as GrLink_default } from "../../GrLink/chunks/GrLink-DYXw3W9w.js";
+import { t as GrLink_default } from "../../GrLink/chunks/GrLink-DwWErumU.js";
 import { n as iconTag, t as iconClass } from "../../../chunks/icon-Dag2tIMs.js";
 import { a as breadcrumbsItemIconClass, c as breadcrumbsLabelHiddenClass, d as breadcrumbsListWrapClass, f as breadcrumbsRootClass, g as resolveBreadcrumbsLayout, h as resolveBreadcrumbsFit, i as breadcrumbsEllipsisClass, l as breadcrumbsListClass, m as breadcrumbsSizeClassBySize, o as breadcrumbsItemWrapClass, p as breadcrumbsSeparatorClass, r as breadcrumbsCurrentClass, s as breadcrumbsLabelClass, u as breadcrumbsListNowrapClass } from "../../../chunks/config-C0Eu8jpG.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, nextTick, normalizeClass, onBeforeUnmount, onMounted, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, watch, withCtx } from "vue";
@@ -113,7 +113,7 @@ var GrBreadcrumbs_default = /* @__PURE__ */ defineComponent({
 		function labelClassFor(item) {
 			if (!item.iconOnly) return breadcrumbsLabelClass;
 			if (!item.icon) {
-				if (typeof process !== "undefined" && process.env.NODE_ENV !== "production") console.warn(`[granularity] GrBreadcrumbs: у пункта «${item.label}» стоит \`iconOnly\` без \`icon\`. Подпись осталась видимой: прятать её, не показав иконку, значит стереть пункт.`);
+				if (process.env.NODE_ENV !== "production") console.warn(`[granularity] GrBreadcrumbs: у пункта «${item.label}» стоит \`iconOnly\` без \`icon\`. Подпись осталась видимой: прятать её, не показав иконку, значит стереть пункт.`);
 				return breadcrumbsLabelClass;
 			}
 			return breadcrumbsLabelHiddenClass;