@feugene/granularity 0.20.0 → 0.21.0

package/dist/components/GrInputTag/chunks/{GrInputTag-Dghhg03-.js.map → GrInputTag-C7QVPijj.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrInputTag-Dghhg03-.js","names":[],"sources":["../../../../src/components/GrInputTag/GrInputTag.vue","../../../../src/components/GrInputTag/GrInputTag.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, nextTick, ref } from 'vue'\n\nimport GrBadge from '../GrBadge/GrBadge.vue'\nimport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from '../GrBadge'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport IconClose from '~icons/lucide/x'\nimport IconLoader from '~icons/lucide/loader-2'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useControlAddons } from '../../composables/internal/useControlAddons'\nimport { useGrFormFieldContext } from '../GrFormField/context'\nimport { useAnnouncer } from '../../composables/useAnnouncer'\nimport { useRovingFocus } from '../../composables/useRovingFocus'\nimport { useGrFormControl } from '../../composables/useGrFormControl'\nimport { useFocusWithin } from '../../composables/internal/useFocusWithin'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { isComposingEvent } from '../../internal/keyboard'\n\nimport {\n  clearButtonClass,\n  grInputTagInputClass,\n  grInputTagWrapperClass,\n  removeButtonClass,\n  spinnerClass,\n  type GrInputTagSize,\n  type GrInputTagState,\n} from './grInputTagStyles'\n\nexport type { GrInputTagSize, GrInputTagState } from './grInputTagStyles'\n\nconst REGEX_SPECIAL_CHAR_RE = /[.*+?^${}()|[\\]\\\\]/g\n\n/**\n * Props for {@link GrInputTag}.\n * Tag-input primitive: renders a set of badges with an inline `<input>` for entering new tags.\n * Splits input by configurable `separators`, supports paste, Enter and Backspace editing.\n */\nexport interface GrInputTagProps {\n  modelValue: string[]\n  placeholder?: string\n  disabled?: boolean\n  readonly?: boolean\n  invalid?: boolean\n  /** Обязательное поле (`aria-required`). Складывается с `required` у `GrFormField`. */\n  required?: boolean\n  state?: GrInputTagState\n  size?: GrInputTagSize\n  separators?: string[]\n  allowDuplicates?: boolean\n  trim?: boolean\n  max?: number\n  addOnBlur?: boolean\n  clearInputOnAdd?: boolean\n  /**\n   * Проверка тега перед добавлением. Может быть асинхронной (проверка на\n   * сервере). Отклонённый тег не добавляется и уходит в событие `reject`.\n   */\n  beforeAdd?: (tag: string) => boolean | Promise<boolean>\n  /** Кнопка «снести все теги». Настраивается через `GrConfigProvider`. */\n  clearable?: boolean\n  /** Фоновая работа: спиннер + `aria-busy`. Асинхронный `beforeAdd` поднимает его сам. */\n  loading?: boolean\n  tagTone?: GrBadgeTone\n  tagDark?: boolean\n  tagSize?: GrBadgeSize\n  tagRadius?: GrBadgeRadius\n  tagClosable?: boolean\n  /** i18n-friendly aria-label for the per-tag remove button. */\n  removeTagLabel?: string\n  /** i18n aria-label кнопки «снести все». */\n  clearAllLabel?: string\n  /**\n   * Имя контрола, когда он используется вне `GrFormField`. Внутри поля имя даёт\n   * связка с его `<label for>` — там проп не нужен. Без того и другого у инпута\n   * нет доступного имени вовсе: placeholder именем не считается.\n   */\n  ariaLabel?: string\n  /** Имя для нативной формы: hidden input на каждый тег. */\n  name?: string\n  /**\n   * Ширины аддонов `prefix`/`suffix` — общий контракт контролов пакета\n   * (`docs/form-controls.md`).\n   */\n  prefixMinWidth?: string\n  prefixMaxWidth?: string\n  suffixMinWidth?: string\n  suffixMaxWidth?: string\n  prefixFixed?: boolean\n  suffixFixed?: boolean\n}\n\nexport interface GrInputTagEmits {\n  (e: 'update:modelValue', value: string[]): void\n  (e: 'add', value: string): void\n  (e: 'remove', value: string, index: number): void\n  /** Тег не прошёл `beforeAdd`. */\n  (e: 'reject', value: string): void\n  /** Набор снесён кнопкой «очистить». */\n  (e: 'clear'): void\n  /** Набор тегов изменился. */\n  (e: 'change', value: string[]): void\n  (e: 'focus', event: FocusEvent): void\n  (e: 'blur', event: FocusEvent): void\n}\n\nconst props = withDefaults(\n  defineProps<GrInputTagProps>(),\n  {\n    placeholder: undefined,\n    disabled: false,\n    readonly: false,\n    invalid: false,\n    required: false,\n    state: 'default',\n    // Настраивается через `GrConfigProvider`; дефолт — в резолвере ниже.\n    size: undefined,\n    separators: () => [','],\n    allowDuplicates: false,\n    trim: true,\n    max: undefined,\n    addOnBlur: false,\n    clearInputOnAdd: true,\n    beforeAdd: undefined,\n    clearable: undefined,\n    loading: false,\n    tagTone: 'neutral',\n    tagDark: false,\n    tagSize: 'md',\n    tagRadius: 'round',\n    tagClosable: true,\n    removeTagLabel: undefined,\n    clearAllLabel: undefined,\n    ariaLabel: undefined,\n    name: undefined,\n  },\n)\n\nconst emit = defineEmits<GrInputTagEmits>()\ndefineSlots<{\n  /** Аддон слева от чипов: иконка, метка. */\n  prefix?: () => any\n  /** Аддон справа, перед кнопкой очистки. */\n  suffix?: () => any\n  /** Свой чип: `remove` снимает значение. */\n  tag?: (props: { tag: string, index: number, remove: () => void }) => any\n}>()\n\n\n// Fallback из контекста `GrFormField` (id/aria-describedby/invalid/required) —\n// как у GrInput и GrSelect: контрол не знает про форму, знает только про поле.\nconst field = useGrFormFieldContext()\nconst resolvedId = computed(() => field?.id.value)\nconst describedBy = computed(() => field?.describedById.value)\nconst {\n  disabled: isDisabled,\n  invalid: isInvalid,\n  required: isRequired,\n  readonly: isReadonly,\n} = useGrFormControl(() => props)\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\n/** Ширина аддона по умолчанию — та же лестница, что у `GrInput`. */\nconst ADDON_MIN_WIDTH_BY_SIZE: Record<GrInputTagSize, string> = {\n  xs: '2rem',\n  sm: '2.25rem',\n  md: '2.5rem',\n  lg: '3rem',\n}\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrInputTag' })\n\n/**\n * Аддоны — флекс-соседи поля: оболочка тегового поля и так флекс-строка с\n * бейджами, поэтому места паддингом резервировать не нужно.\n */\nconst { hasPrefix, hasSuffix, prefixEl, suffixEl, prefixStyle, suffixStyle } = useControlAddons(() => props, {\n  defaultMinWidth: () => ADDON_MIN_WIDTH_BY_SIZE[resolvedSize.value],\n  paddingX: () => '0px',\n})\nconst resolvedClearable = useGrComponentProp('GrInputTag', 'clearable', () => props.clearable, false)\n\nconst { t } = useGranularityTranslations()\nconst resolvedClearAllLabel = computed(() => props.clearAllLabel ?? t('gr.inputTag.clearAll', 'Clear all tags'))\n\nfunction removeTagLabelFor(tag: string): string {\n  // Безликое «Remove tag» на двадцати кнопках подряд не даёт выбрать нужную:\n  // имя обязано называть сам тег.\n  return props.removeTagLabel ?? t('gr.inputTag.removeTagNamed', 'Remove tag {tag}', { tag })\n}\n\nconst inputValue = ref('')\nconst inputEl = ref<HTMLInputElement | null>(null)\nconst rootEl = ref<HTMLElement | null>(null)\n\n// Внутри корня фокус ходит между полем и кнопками удаления чипов: без границы\n// каждое такое перемещение давало бы потребителю пару `blur` + `focus`.\nconst { onFocusIn, onFocusOut } = useFocusWithin(rootEl, {\n  enter: event => emit('focus', event),\n  leave: event => emit('blur', event),\n})\nconst removeEls = ref<HTMLButtonElement[]>([])\n\nfunction setRemoveEl(index: number) {\n  return (el: unknown): void => {\n    removeEls.value[index] = el as HTMLButtonElement\n  }\n}\n\nfunction focus(): void {\n  inputEl.value?.focus()\n}\n\nfunction blur(): void {\n  inputEl.value?.blur()\n}\n\nconst isMaxed = computed(() => props.max !== undefined && props.modelValue.length >= props.max)\nconst canEdit = computed(() => !isDisabled.value && !isReadonly.value)\nconst showRemove = computed(() => props.tagClosable && canEdit.value)\n\n// Добавление, удаление и достигнутый предел — события, а не состояние виджета:\n// показывать их негде, объявить нужно. Это работа общего живого региона.\nconst { announce } = useAnnouncer()\n\n/**\n * Roving tabindex по крестикам: двадцать тегов давали двадцать одну остановку\n * `Tab`. В таб-порядке ровно один крестик, между ними ходят стрелками.\n *\n * Адресация индексом, а не значением тега: теги допускают повторы, и по\n * значению два одинаковых чипа было бы не различить.\n */\nconst tagIndexes = computed(() => props.modelValue.map((_, index) => index))\n\nconst roving = useRovingFocus<number>({\n  items: () => tagIndexes.value,\n  elementFor: index => removeEls.value[index],\n  orientation: () => 'horizontal',\n  // Ряд чипов — не кольцо: у него есть край, и за краем стоит поле ввода.\n  wrap: () => false,\n  onOverflow: (edge) => {\n    // За последним чипом — поле ввода: продолжение того же ряда. Слева от\n    // первого — начало строки, фокус остаётся на месте.\n    if (edge === 'end') focus()\n    return true\n  },\n  // Удаление чипа перерисовывает ряд: без ожидания фокус уехал бы на узел,\n  // которого уже нет.\n  beforeFocus: () => nextTick(),\n})\n\nasync function focusTag(index: number): Promise<void> {\n  const last = props.modelValue.length - 1\n  if (last < 0) {\n    focus()\n    return\n  }\n\n  await roving.focusKey(Math.min(Math.max(index, 0), last))\n}\n\nfunction escapeRegexChar(ch: string): string {\n  return ch.replace(REGEX_SPECIAL_CHAR_RE, '\\\\$&')\n}\n\nconst splitRegex = computed(() => {\n  const seps = (props.separators ?? []).filter(Boolean).map(s => s[0]!)\n  const uniq = [...new Set([...seps, '\\n', '\\r', '\\t'])]\n  const body = uniq.map(escapeRegexChar).join('')\n  return new RegExp(`[${body}]+`, 'g')\n})\n\nfunction normalizeTag(raw: string): string {\n  return props.trim ? raw.trim() : raw\n}\n\nfunction splitToTags(raw: string): string[] {\n  return raw\n    .split(splitRegex.value)\n    .map(v => normalizeTag(v))\n    .filter(Boolean)\n}\n\nfunction addMany(rawTags: string[]): boolean {\n  if (!canEdit.value || isMaxed.value)\n    return false\n\n  const next = props.modelValue.slice()\n  const added: string[] = []\n\n  for (const raw of rawTags) {\n    const tag = normalizeTag(raw)\n    if (!tag)\n      continue\n\n    if (!props.allowDuplicates && next.includes(tag))\n      continue\n\n    if (props.max !== undefined && next.length >= props.max)\n      break\n\n    next.push(tag)\n    added.push(tag)\n    emit('add', tag)\n  }\n\n  if (!added.length)\n    return false\n\n  emit('update:modelValue', next)\n  emit('change', next)\n  announce(added.length === 1\n    ? t('gr.inputTag.added', 'Tag added: {tag}', { tag: added[0]! })\n    : t('gr.inputTag.addedMany', '{count} tags added', { count: added.length }))\n\n  return true\n}\n\n// Счётчик запуска: пока идёт асинхронная проверка, пользователь успевает нажать\n// Enter второй раз — результат устаревшей проверки дописывать нельзя.\nlet validationRun = 0\nconst validating = ref(false)\nconst isBusy = computed(() => props.loading || validating.value)\n\nasync function filterAllowed(tags: string[], run: number): Promise<string[] | null> {\n  const check = props.beforeAdd\n  if (!check)\n    return tags\n\n  const allowed: string[] = []\n\n  for (const tag of tags) {\n    const ok = await check(tag)\n    if (run !== validationRun)\n      return null\n\n    if (ok)\n      allowed.push(tag)\n    else\n      emit('reject', tag)\n  }\n\n  return allowed\n}\n\nasync function commitInput(): Promise<void> {\n  if (!canEdit.value || !inputValue.value)\n    return\n\n  if (isMaxed.value) {\n    announce(t('gr.inputTag.limitReached', 'Tag limit reached'))\n    return\n  }\n\n  const raw = inputValue.value\n  const tags = splitToTags(raw)\n  if (!tags.length)\n    return\n\n  const run = ++validationRun\n  validating.value = Boolean(props.beforeAdd)\n\n  const allowed = await filterAllowed(tags, run)\n\n  if (run === validationRun)\n    validating.value = false\n\n  if (allowed === null || !allowed.length)\n    return\n\n  const changed = addMany(allowed)\n  // Значение могло измениться, пока шла проверка: стирать чужой ввод нельзя.\n  if (changed && props.clearInputOnAdd && inputValue.value === raw)\n    inputValue.value = ''\n}\n\nfunction removeAt(index: number): void {\n  if (!canEdit.value)\n    return\n\n  const next = props.modelValue.slice()\n  const removed = next[index]\n  if (removed === undefined)\n    return\n\n  next.splice(index, 1)\n  emit('update:modelValue', next)\n  emit('change', next)\n  emit('remove', removed, index)\n  announce(t('gr.inputTag.removed', 'Tag removed: {tag}', { tag: removed }))\n}\n\n/** Удаление с клавиатуры: фокус переезжает на соседний чип, а не пропадает. */\nasync function removeAtFromKeyboard(index: number): Promise<void> {\n  removeAt(index)\n  await nextTick()\n\n  if (props.modelValue.length === 0) {\n    focus()\n    return\n  }\n\n  await focusTag(Math.min(index, props.modelValue.length - 1))\n}\n\nfunction clearAll(): void {\n  if (!canEdit.value || props.modelValue.length === 0)\n    return\n\n  emit('update:modelValue', [])\n  emit('change', [])\n  emit('clear')\n  announce(t('gr.inputTag.cleared', 'All tags removed'))\n  focus()\n}\n\nfunction onInput(e: Event): void {\n  inputValue.value = (e.target as HTMLInputElement).value\n}\n\nfunction onKeydown(e: KeyboardEvent): void {\n  // Enter/сепаратор во время IME-композиции коммитят её, а не тег.\n  if (isComposingEvent(e))\n    return\n  if (!canEdit.value)\n    return\n\n  if (e.key === 'Enter') {\n    e.preventDefault()\n    void commitInput()\n    return\n  }\n\n  if ((props.separators ?? []).includes(e.key)) {\n    e.preventDefault()\n    void commitInput()\n    return\n  }\n\n  if (inputValue.value.length === 0 && props.modelValue.length > 0) {\n    if (e.key === 'Backspace') {\n      e.preventDefault()\n      removeAt(props.modelValue.length - 1)\n      return\n    }\n\n    // Из пустого поля стрелка влево уводит на последний чип — дальше по чипам\n    // работают те же стрелки, `Tab` для этого не нужен.\n    if (e.key === 'ArrowLeft') {\n      e.preventDefault()\n      void focusTag(props.modelValue.length - 1)\n    }\n  }\n}\n\nfunction onTagKeydown(e: KeyboardEvent, index: number): void {\n  if (roving.handleNavigationKeys(e)) {\n    return\n  }\n\n  if (e.key === 'Delete' || e.key === 'Backspace') {\n    e.preventDefault()\n    void removeAtFromKeyboard(index)\n  }\n}\n\nfunction onBlur(): void {\n  if (props.addOnBlur)\n    void commitInput()\n}\n\nfunction onPaste(e: ClipboardEvent): void {\n  if (!canEdit.value || isMaxed.value)\n    return\n\n  const pasted = e.clipboardData?.getData('text')\n  if (!pasted)\n    return\n\n  const tags = splitToTags(pasted)\n  if (tags.length <= 1)\n    return\n\n  e.preventDefault()\n\n  const run = ++validationRun\n  validating.value = Boolean(props.beforeAdd)\n\n  void filterAllowed(tags, run).then((allowed) => {\n    if (run === validationRun)\n      validating.value = false\n\n    if (allowed?.length)\n      addMany(allowed)\n  })\n}\n\nconst wrapperClassName = computed(() => {\n  return grInputTagWrapperClass({\n    size: resolvedSize.value,\n    state: props.state,\n    invalid: isInvalid.value,\n    disabled: isDisabled.value,\n  })\n})\n\nconst inputClassName = computed(() => grInputTagInputClass(resolvedSize.value))\n\nconst showClearAll = computed(() => resolvedClearable.value && canEdit.value && props.modelValue.length > 0)\n\nconst placeholderText = computed(() => props.modelValue.length > 0 ? undefined : props.placeholder)\n\ndefineExpose({ focus, blur, clear: clearAll })\n</script>\n\n<template>\n  <div\n    ref=\"rootEl\"\n    data-gr-input-tag\n    data-testid=\"gr-input-tag\"\n    :class=\"wrapperClassName\"\n    @click=\"focus\"\n    @focusin=\"onFocusIn\"\n    @focusout=\"onFocusOut\"\n  >\n    <span\n      v-if=\"hasPrefix\"\n      ref=\"prefixEl\"\n      data-gr-input-tag-prefix\n      class=\"inline-flex shrink-0 items-center justify-center text-[var(--gr-muted-fg)]\"\n      :style=\"prefixStyle\"\n    >\n      <slot name=\"prefix\" />\n    </span>\n\n    <!-- Нативная форма: hidden на каждый тег — стандартная сериализация набора. -->\n    <template v-if=\"name\">\n      <input\n        v-for=\"(tag, tagIndex) in modelValue\"\n        :key=\"`hidden-${tagIndex}`\"\n        type=\"hidden\"\n        :name=\"name\"\n        :value=\"tag\"\n      >\n    </template>\n    <!--\n      `display: contents` — список нужен ради роли, а не ради раскладки: чипы\n      обязаны переноситься в одном потоке с полем ввода.\n    -->\n    <span v-if=\"modelValue.length\" role=\"list\" class=\"contents\">\n      <GrBadge\n        v-for=\"(tag, i) in modelValue\"\n        :key=\"`${tag}-${i}`\"\n        role=\"listitem\"\n        :tone=\"tagTone\"\n        :dark=\"tagDark\"\n        :size=\"tagSize\"\n        :radius=\"tagRadius\"\n        data-gr-input-tag-item\n        data-testid=\"gr-input-tag-item\"\n        :data-index=\"i\"\n      >\n        <span class=\"inline-flex items-center gap-1 align-middle\">\n          <slot name=\"tag\" :tag=\"tag\" :index=\"i\" :remove=\"() => removeAt(i)\">\n            <span class=\"truncate max-w-[18rem]\">{{ tag }}</span>\n          </slot>\n\n          <button\n            v-if=\"showRemove\"\n            :ref=\"setRemoveEl(i)\"\n            type=\"button\"\n            :class=\"removeButtonClass\"\n            :aria-label=\"removeTagLabelFor(tag)\"\n            :tabindex=\"roving.tabindexFor(i)\"\n            data-gr-input-tag-remove\n            data-testid=\"gr-input-tag-remove\"\n            :data-index=\"i\"\n            @mousedown.prevent.stop\n            @focus=\"roving.setActive(i)\"\n            @keydown=\"onTagKeydown($event, i)\"\n            @click.stop=\"removeAt(i)\"\n          >\n            <GrIcon size=\"sm\">\n              <IconClose />\n            </GrIcon>\n          </button>\n        </span>\n      </GrBadge>\n    </span>\n\n    <input\n      :id=\"resolvedId\"\n      ref=\"inputEl\"\n      data-gr-input-tag-input\n      data-testid=\"gr-input-tag-input\"\n      :value=\"inputValue\"\n      :disabled=\"isDisabled\"\n      :readonly=\"isReadonly\"\n      :placeholder=\"placeholderText\"\n      :aria-label=\"ariaLabel\"\n      :aria-describedby=\"describedBy\"\n      :aria-required=\"isRequired ? 'true' : undefined\"\n      :aria-readonly=\"isReadonly ? 'true' : undefined\"\n      :aria-invalid=\"isInvalid ? 'true' : undefined\"\n      :aria-busy=\"isBusy ? 'true' : undefined\"\n      class=\"flex-1 min-w-[120px] bg-transparent border-none outline-none placeholder:text-[var(--gr-muted-fg)]\"\n      :class=\"inputClassName\"\n      @input=\"onInput\"\n      @keydown=\"onKeydown\"\n      @blur=\"onBlur\"\n      @paste=\"onPaste\"\n    >\n\n    <span\n      v-if=\"hasSuffix\"\n      ref=\"suffixEl\"\n      data-gr-input-tag-suffix\n      class=\"inline-flex shrink-0 items-center justify-center text-[var(--gr-muted-fg)]\"\n      :style=\"suffixStyle\"\n    >\n      <slot name=\"suffix\" />\n    </span>\n\n    <span\n      v-if=\"isBusy\"\n      data-gr-input-tag-spinner\n      :class=\"spinnerClass\"\n      aria-hidden=\"true\"\n    >\n      <GrIcon size=\"sm\">\n        <IconLoader class=\"animate-spin\" />\n      </GrIcon>\n    </span>\n\n    <button\n      v-if=\"showClearAll\"\n      type=\"button\"\n      data-gr-input-tag-clear\n      :class=\"clearButtonClass\"\n      :aria-label=\"resolvedClearAllLabel\"\n      @mousedown.prevent.stop\n      @click.stop=\"clearAll\"\n    >\n      <GrIcon size=\"sm\">\n        <IconClose />\n      </GrIcon>\n    </button>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, ref } from 'vue'\n\nimport GrBadge from '../GrBadge/GrBadge.vue'\nimport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from '../GrBadge'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport IconClose from '~icons/lucide/x'\nimport IconLoader from '~icons/lucide/loader-2'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useControlAddons } from '../../composables/internal/useControlAddons'\nimport { useGrFormFieldContext } from '../GrFormField/context'\nimport { useAnnouncer } from '../../composables/useAnnouncer'\nimport { useRovingFocus } from '../../composables/useRovingFocus'\nimport { useGrFormControl } from '../../composables/useGrFormControl'\nimport { useFocusWithin } from '../../composables/internal/useFocusWithin'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { isComposingEvent } from '../../internal/keyboard'\n\nimport {\n  clearButtonClass,\n  grInputTagInputClass,\n  grInputTagWrapperClass,\n  removeButtonClass,\n  spinnerClass,\n  type GrInputTagSize,\n  type GrInputTagState,\n} from './grInputTagStyles'\n\nexport type { GrInputTagSize, GrInputTagState } from './grInputTagStyles'\n\nconst REGEX_SPECIAL_CHAR_RE = /[.*+?^${}()|[\\]\\\\]/g\n\n/**\n * Props for {@link GrInputTag}.\n * Tag-input primitive: renders a set of badges with an inline `<input>` for entering new tags.\n * Splits input by configurable `separators`, supports paste, Enter and Backspace editing.\n */\nexport interface GrInputTagProps {\n  modelValue: string[]\n  placeholder?: string\n  disabled?: boolean\n  readonly?: boolean\n  invalid?: boolean\n  /** Обязательное поле (`aria-required`). Складывается с `required` у `GrFormField`. */\n  required?: boolean\n  state?: GrInputTagState\n  size?: GrInputTagSize\n  separators?: string[]\n  allowDuplicates?: boolean\n  trim?: boolean\n  max?: number\n  addOnBlur?: boolean\n  clearInputOnAdd?: boolean\n  /**\n   * Проверка тега перед добавлением. Может быть асинхронной (проверка на\n   * сервере). Отклонённый тег не добавляется и уходит в событие `reject`.\n   */\n  beforeAdd?: (tag: string) => boolean | Promise<boolean>\n  /** Кнопка «снести все теги». Настраивается через `GrConfigProvider`. */\n  clearable?: boolean\n  /** Фоновая работа: спиннер + `aria-busy`. Асинхронный `beforeAdd` поднимает его сам. */\n  loading?: boolean\n  tagTone?: GrBadgeTone\n  tagDark?: boolean\n  tagSize?: GrBadgeSize\n  tagRadius?: GrBadgeRadius\n  tagClosable?: boolean\n  /** i18n-friendly aria-label for the per-tag remove button. */\n  removeTagLabel?: string\n  /** i18n aria-label кнопки «снести все». */\n  clearAllLabel?: string\n  /**\n   * Имя контрола, когда он используется вне `GrFormField`. Внутри поля имя даёт\n   * связка с его `<label for>` — там проп не нужен. Без того и другого у инпута\n   * нет доступного имени вовсе: placeholder именем не считается.\n   */\n  ariaLabel?: string\n  /** Имя для нативной формы: hidden input на каждый тег. */\n  name?: string\n  /**\n   * Ширины аддонов `prefix`/`suffix` — общий контракт контролов пакета\n   * (`docs/form-controls.md`).\n   */\n  prefixMinWidth?: string\n  prefixMaxWidth?: string\n  suffixMinWidth?: string\n  suffixMaxWidth?: string\n  prefixFixed?: boolean\n  suffixFixed?: boolean\n}\n\nexport interface GrInputTagEmits {\n  (e: 'update:modelValue', value: string[]): void\n  (e: 'add', value: string): void\n  (e: 'remove', value: string, index: number): void\n  /** Тег не прошёл `beforeAdd`. */\n  (e: 'reject', value: string): void\n  /** Набор снесён кнопкой «очистить». */\n  (e: 'clear'): void\n  /** Набор тегов изменился. */\n  (e: 'change', value: string[]): void\n  (e: 'focus', event: FocusEvent): void\n  (e: 'blur', event: FocusEvent): void\n}\n\nconst props = withDefaults(\n  defineProps<GrInputTagProps>(),\n  {\n    placeholder: undefined,\n    disabled: false,\n    readonly: false,\n    invalid: false,\n    required: false,\n    state: 'default',\n    // Настраивается через `GrConfigProvider`; дефолт — в резолвере ниже.\n    size: undefined,\n    separators: () => [','],\n    allowDuplicates: false,\n    trim: true,\n    max: undefined,\n    addOnBlur: false,\n    clearInputOnAdd: true,\n    beforeAdd: undefined,\n    clearable: undefined,\n    loading: false,\n    tagTone: 'neutral',\n    tagDark: false,\n    tagSize: 'md',\n    tagRadius: 'round',\n    tagClosable: true,\n    removeTagLabel: undefined,\n    clearAllLabel: undefined,\n    ariaLabel: undefined,\n    name: undefined,\n  },\n)\n\nconst emit = defineEmits<GrInputTagEmits>()\ndefineSlots<{\n  /** Аддон слева от чипов: иконка, метка. */\n  prefix?: () => any\n  /** Аддон справа, перед кнопкой очистки. */\n  suffix?: () => any\n  /** Свой чип: `remove` снимает значение. */\n  tag?: (props: { tag: string, index: number, remove: () => void }) => any\n}>()\n\n\n// Fallback из контекста `GrFormField` (id/aria-describedby/invalid/required) —\n// как у GrInput и GrSelect: контрол не знает про форму, знает только про поле.\nconst field = useGrFormFieldContext()\nconst resolvedId = computed(() => field?.id.value)\nconst describedBy = computed(() => field?.describedById.value)\nconst {\n  disabled: isDisabled,\n  invalid: isInvalid,\n  required: isRequired,\n  readonly: isReadonly,\n} = useGrFormControl(() => props)\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\n/** Ширина аддона по умолчанию — та же лестница, что у `GrInput`. */\nconst ADDON_MIN_WIDTH_BY_SIZE: Record<GrInputTagSize, string> = {\n  xs: '2rem',\n  sm: '2.25rem',\n  md: '2.5rem',\n  lg: '3rem',\n}\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrInputTag' })\n\n/**\n * Аддоны — флекс-соседи поля: оболочка тегового поля и так флекс-строка с\n * бейджами, поэтому места паддингом резервировать не нужно.\n */\nconst { hasPrefix, hasSuffix, prefixEl, suffixEl, prefixStyle, suffixStyle } = useControlAddons(() => props, {\n  defaultMinWidth: () => ADDON_MIN_WIDTH_BY_SIZE[resolvedSize.value],\n  paddingX: () => '0px',\n})\nconst resolvedClearable = useGrComponentProp('GrInputTag', 'clearable', () => props.clearable, false)\n\nconst { t } = useGranularityTranslations()\nconst resolvedClearAllLabel = computed(() => props.clearAllLabel ?? t('gr.inputTag.clearAll', 'Clear all tags'))\n\nfunction removeTagLabelFor(tag: string): string {\n  // Безликое «Remove tag» на двадцати кнопках подряд не даёт выбрать нужную:\n  // имя обязано называть сам тег.\n  return props.removeTagLabel ?? t('gr.inputTag.removeTagNamed', 'Remove tag {tag}', { tag })\n}\n\nconst inputValue = ref('')\nconst inputEl = ref<HTMLInputElement | null>(null)\nconst rootEl = ref<HTMLElement | null>(null)\n\n// Внутри корня фокус ходит между полем и кнопками удаления чипов: без границы\n// каждое такое перемещение давало бы потребителю пару `blur` + `focus`.\nconst { onFocusIn, onFocusOut } = useFocusWithin(rootEl, {\n  enter: event => emit('focus', event),\n  leave: event => emit('blur', event),\n})\nconst removeEls = ref<HTMLButtonElement[]>([])\n\nfunction setRemoveEl(index: number) {\n  return (el: unknown): void => {\n    removeEls.value[index] = el as HTMLButtonElement\n  }\n}\n\nfunction focus(): void {\n  inputEl.value?.focus()\n}\n\nfunction blur(): void {\n  inputEl.value?.blur()\n}\n\nconst isMaxed = computed(() => props.max !== undefined && props.modelValue.length >= props.max)\nconst canEdit = computed(() => !isDisabled.value && !isReadonly.value)\nconst showRemove = computed(() => props.tagClosable && canEdit.value)\n\n// Добавление, удаление и достигнутый предел — события, а не состояние виджета:\n// показывать их негде, объявить нужно. Это работа общего живого региона.\nconst { announce } = useAnnouncer()\n\n/**\n * Roving tabindex по крестикам: двадцать тегов давали двадцать одну остановку\n * `Tab`. В таб-порядке ровно один крестик, между ними ходят стрелками.\n *\n * Адресация индексом, а не значением тега: теги допускают повторы, и по\n * значению два одинаковых чипа было бы не различить.\n */\nconst tagIndexes = computed(() => props.modelValue.map((_, index) => index))\n\nconst roving = useRovingFocus<number>({\n  items: () => tagIndexes.value,\n  elementFor: index => removeEls.value[index],\n  orientation: () => 'horizontal',\n  // Ряд чипов — не кольцо: у него есть край, и за краем стоит поле ввода.\n  wrap: () => false,\n  onOverflow: (edge) => {\n    // За последним чипом — поле ввода: продолжение того же ряда. Слева от\n    // первого — начало строки, фокус остаётся на месте.\n    if (edge === 'end') focus()\n    return true\n  },\n  // Удаление чипа перерисовывает ряд: без ожидания фокус уехал бы на узел,\n  // которого уже нет.\n  beforeFocus: () => nextTick(),\n})\n\nasync function focusTag(index: number): Promise<void> {\n  const last = props.modelValue.length - 1\n  if (last < 0) {\n    focus()\n    return\n  }\n\n  await roving.focusKey(Math.min(Math.max(index, 0), last))\n}\n\nfunction escapeRegexChar(ch: string): string {\n  return ch.replace(REGEX_SPECIAL_CHAR_RE, '\\\\$&')\n}\n\nconst splitRegex = computed(() => {\n  const seps = (props.separators ?? []).filter(Boolean).map(s => s[0]!)\n  const uniq = [...new Set([...seps, '\\n', '\\r', '\\t'])]\n  const body = uniq.map(escapeRegexChar).join('')\n  return new RegExp(`[${body}]+`, 'g')\n})\n\nfunction normalizeTag(raw: string): string {\n  return props.trim ? raw.trim() : raw\n}\n\nfunction splitToTags(raw: string): string[] {\n  return raw\n    .split(splitRegex.value)\n    .map(v => normalizeTag(v))\n    .filter(Boolean)\n}\n\nfunction addMany(rawTags: string[]): boolean {\n  if (!canEdit.value || isMaxed.value)\n    return false\n\n  const next = props.modelValue.slice()\n  const added: string[] = []\n\n  for (const raw of rawTags) {\n    const tag = normalizeTag(raw)\n    if (!tag)\n      continue\n\n    if (!props.allowDuplicates && next.includes(tag))\n      continue\n\n    if (props.max !== undefined && next.length >= props.max)\n      break\n\n    next.push(tag)\n    added.push(tag)\n    emit('add', tag)\n  }\n\n  if (!added.length)\n    return false\n\n  emit('update:modelValue', next)\n  emit('change', next)\n  announce(added.length === 1\n    ? t('gr.inputTag.added', 'Tag added: {tag}', { tag: added[0]! })\n    : t('gr.inputTag.addedMany', '{count} tags added', { count: added.length }))\n\n  return true\n}\n\n// Счётчик запуска: пока идёт асинхронная проверка, пользователь успевает нажать\n// Enter второй раз — результат устаревшей проверки дописывать нельзя.\nlet validationRun = 0\nconst validating = ref(false)\nconst isBusy = computed(() => props.loading || validating.value)\n\nasync function filterAllowed(tags: string[], run: number): Promise<string[] | null> {\n  const check = props.beforeAdd\n  if (!check)\n    return tags\n\n  const allowed: string[] = []\n\n  for (const tag of tags) {\n    const ok = await check(tag)\n    if (run !== validationRun)\n      return null\n\n    if (ok)\n      allowed.push(tag)\n    else\n      emit('reject', tag)\n  }\n\n  return allowed\n}\n\nasync function commitInput(): Promise<void> {\n  if (!canEdit.value || !inputValue.value)\n    return\n\n  if (isMaxed.value) {\n    announce(t('gr.inputTag.limitReached', 'Tag limit reached'))\n    return\n  }\n\n  const raw = inputValue.value\n  const tags = splitToTags(raw)\n  if (!tags.length)\n    return\n\n  const run = ++validationRun\n  validating.value = Boolean(props.beforeAdd)\n\n  const allowed = await filterAllowed(tags, run)\n\n  if (run === validationRun)\n    validating.value = false\n\n  if (allowed === null || !allowed.length)\n    return\n\n  const changed = addMany(allowed)\n  // Значение могло измениться, пока шла проверка: стирать чужой ввод нельзя.\n  if (changed && props.clearInputOnAdd && inputValue.value === raw)\n    inputValue.value = ''\n}\n\nfunction removeAt(index: number): void {\n  if (!canEdit.value)\n    return\n\n  const next = props.modelValue.slice()\n  const removed = next[index]\n  if (removed === undefined)\n    return\n\n  next.splice(index, 1)\n  emit('update:modelValue', next)\n  emit('change', next)\n  emit('remove', removed, index)\n  announce(t('gr.inputTag.removed', 'Tag removed: {tag}', { tag: removed }))\n}\n\n/** Удаление с клавиатуры: фокус переезжает на соседний чип, а не пропадает. */\nasync function removeAtFromKeyboard(index: number): Promise<void> {\n  removeAt(index)\n  await nextTick()\n\n  if (props.modelValue.length === 0) {\n    focus()\n    return\n  }\n\n  await focusTag(Math.min(index, props.modelValue.length - 1))\n}\n\nfunction clearAll(): void {\n  if (!canEdit.value || props.modelValue.length === 0)\n    return\n\n  emit('update:modelValue', [])\n  emit('change', [])\n  emit('clear')\n  announce(t('gr.inputTag.cleared', 'All tags removed'))\n  focus()\n}\n\nfunction onInput(e: Event): void {\n  inputValue.value = (e.target as HTMLInputElement).value\n}\n\nfunction onKeydown(e: KeyboardEvent): void {\n  // Enter/сепаратор во время IME-композиции коммитят её, а не тег.\n  if (isComposingEvent(e))\n    return\n  if (!canEdit.value)\n    return\n\n  if (e.key === 'Enter') {\n    e.preventDefault()\n    void commitInput()\n    return\n  }\n\n  if ((props.separators ?? []).includes(e.key)) {\n    e.preventDefault()\n    void commitInput()\n    return\n  }\n\n  if (inputValue.value.length === 0 && props.modelValue.length > 0) {\n    if (e.key === 'Backspace') {\n      e.preventDefault()\n      removeAt(props.modelValue.length - 1)\n      return\n    }\n\n    // Из пустого поля стрелка влево уводит на последний чип — дальше по чипам\n    // работают те же стрелки, `Tab` для этого не нужен.\n    if (e.key === 'ArrowLeft') {\n      e.preventDefault()\n      void focusTag(props.modelValue.length - 1)\n    }\n  }\n}\n\nfunction onTagKeydown(e: KeyboardEvent, index: number): void {\n  if (roving.handleNavigationKeys(e)) {\n    return\n  }\n\n  if (e.key === 'Delete' || e.key === 'Backspace') {\n    e.preventDefault()\n    void removeAtFromKeyboard(index)\n  }\n}\n\nfunction onBlur(): void {\n  if (props.addOnBlur)\n    void commitInput()\n}\n\nfunction onPaste(e: ClipboardEvent): void {\n  if (!canEdit.value || isMaxed.value)\n    return\n\n  const pasted = e.clipboardData?.getData('text')\n  if (!pasted)\n    return\n\n  const tags = splitToTags(pasted)\n  if (tags.length <= 1)\n    return\n\n  e.preventDefault()\n\n  const run = ++validationRun\n  validating.value = Boolean(props.beforeAdd)\n\n  void filterAllowed(tags, run).then((allowed) => {\n    if (run === validationRun)\n      validating.value = false\n\n    if (allowed?.length)\n      addMany(allowed)\n  })\n}\n\nconst wrapperClassName = computed(() => {\n  return grInputTagWrapperClass({\n    size: resolvedSize.value,\n    state: props.state,\n    invalid: isInvalid.value,\n    disabled: isDisabled.value,\n  })\n})\n\nconst inputClassName = computed(() => grInputTagInputClass(resolvedSize.value))\n\nconst showClearAll = computed(() => resolvedClearable.value && canEdit.value && props.modelValue.length > 0)\n\nconst placeholderText = computed(() => props.modelValue.length > 0 ? undefined : props.placeholder)\n\ndefineExpose({ focus, blur, clear: clearAll })\n</script>\n\n<template>\n  <div\n    ref=\"rootEl\"\n    data-gr-input-tag\n    data-testid=\"gr-input-tag\"\n    :class=\"wrapperClassName\"\n    @click=\"focus\"\n    @focusin=\"onFocusIn\"\n    @focusout=\"onFocusOut\"\n  >\n    <span\n      v-if=\"hasPrefix\"\n      ref=\"prefixEl\"\n      data-gr-input-tag-prefix\n      class=\"inline-flex shrink-0 items-center justify-center text-[var(--gr-muted-fg)]\"\n      :style=\"prefixStyle\"\n    >\n      <slot name=\"prefix\" />\n    </span>\n\n    <!-- Нативная форма: hidden на каждый тег — стандартная сериализация набора. -->\n    <template v-if=\"name\">\n      <input\n        v-for=\"(tag, tagIndex) in modelValue\"\n        :key=\"`hidden-${tagIndex}`\"\n        type=\"hidden\"\n        :name=\"name\"\n        :value=\"tag\"\n      >\n    </template>\n    <!--\n      `display: contents` — список нужен ради роли, а не ради раскладки: чипы\n      обязаны переноситься в одном потоке с полем ввода.\n    -->\n    <span v-if=\"modelValue.length\" role=\"list\" class=\"contents\">\n      <GrBadge\n        v-for=\"(tag, i) in modelValue\"\n        :key=\"`${tag}-${i}`\"\n        role=\"listitem\"\n        :tone=\"tagTone\"\n        :dark=\"tagDark\"\n        :size=\"tagSize\"\n        :radius=\"tagRadius\"\n        data-gr-input-tag-item\n        data-testid=\"gr-input-tag-item\"\n        :data-index=\"i\"\n      >\n        <span class=\"inline-flex items-center gap-1 align-middle\">\n          <slot name=\"tag\" :tag=\"tag\" :index=\"i\" :remove=\"() => removeAt(i)\">\n            <span class=\"truncate max-w-[18rem]\">{{ tag }}</span>\n          </slot>\n\n          <button\n            v-if=\"showRemove\"\n            :ref=\"setRemoveEl(i)\"\n            type=\"button\"\n            :class=\"removeButtonClass\"\n            :aria-label=\"removeTagLabelFor(tag)\"\n            :tabindex=\"roving.tabindexFor(i)\"\n            data-gr-input-tag-remove\n            data-testid=\"gr-input-tag-remove\"\n            :data-index=\"i\"\n            @mousedown.prevent.stop\n            @focus=\"roving.setActive(i)\"\n            @keydown=\"onTagKeydown($event, i)\"\n            @click.stop=\"removeAt(i)\"\n          >\n            <GrIcon size=\"sm\">\n              <IconClose />\n            </GrIcon>\n          </button>\n        </span>\n      </GrBadge>\n    </span>\n\n    <input\n      :id=\"resolvedId\"\n      ref=\"inputEl\"\n      data-gr-input-tag-input\n      data-testid=\"gr-input-tag-input\"\n      :value=\"inputValue\"\n      :disabled=\"isDisabled\"\n      :readonly=\"isReadonly\"\n      :placeholder=\"placeholderText\"\n      :aria-label=\"ariaLabel\"\n      :aria-describedby=\"describedBy\"\n      :aria-required=\"isRequired ? 'true' : undefined\"\n      :aria-readonly=\"isReadonly ? 'true' : undefined\"\n      :aria-invalid=\"isInvalid ? 'true' : undefined\"\n      :aria-busy=\"isBusy ? 'true' : undefined\"\n      class=\"flex-1 min-w-[120px] bg-transparent border-none outline-none placeholder:text-[var(--gr-muted-fg)]\"\n      :class=\"inputClassName\"\n      @input=\"onInput\"\n      @keydown=\"onKeydown\"\n      @blur=\"onBlur\"\n      @paste=\"onPaste\"\n    >\n\n    <span\n      v-if=\"hasSuffix\"\n      ref=\"suffixEl\"\n      data-gr-input-tag-suffix\n      class=\"inline-flex shrink-0 items-center justify-center text-[var(--gr-muted-fg)]\"\n      :style=\"suffixStyle\"\n    >\n      <slot name=\"suffix\" />\n    </span>\n\n    <span\n      v-if=\"isBusy\"\n      data-gr-input-tag-spinner\n      :class=\"spinnerClass\"\n      aria-hidden=\"true\"\n    >\n      <GrIcon size=\"sm\">\n        <IconLoader class=\"animate-spin\" />\n      </GrIcon>\n    </span>\n\n    <button\n      v-if=\"showClearAll\"\n      type=\"button\"\n      data-gr-input-tag-clear\n      :class=\"clearButtonClass\"\n      :aria-label=\"resolvedClearAllLabel\"\n      @mousedown.prevent.stop\n      @click.stop=\"clearAll\"\n    >\n      <GrIcon size=\"sm\">\n        <IconClose />\n      </GrIcon>\n    </button>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"GrInputTag-C7QVPijj.js","names":[],"sources":["../../../../src/components/GrInputTag/GrInputTag.vue","../../../../src/components/GrInputTag/GrInputTag.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, nextTick, ref } from 'vue'\n\nimport GrBadge from '../GrBadge/GrBadge.vue'\nimport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from '../GrBadge'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport IconClose from '~icons/lucide/x'\nimport IconLoader from '~icons/lucide/loader-2'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useControlAddons } from '../../composables/internal/useControlAddons'\nimport { useGrFormFieldContext } from '../GrFormField/context'\nimport { useAnnouncer } from '../../composables/useAnnouncer'\nimport { useRovingFocus } from '../../composables/useRovingFocus'\nimport { useGrFormControl } from '../../composables/useGrFormControl'\nimport { useFocusWithin } from '../../composables/internal/useFocusWithin'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { isComposingEvent } from '../../internal/keyboard'\n\nimport {\n  clearButtonClass,\n  grInputTagInputClass,\n  grInputTagWrapperClass,\n  removeButtonClass,\n  spinnerClass,\n  type GrInputTagSize,\n  type GrInputTagState,\n} from './grInputTagStyles'\n\nexport type { GrInputTagSize, GrInputTagState } from './grInputTagStyles'\n\nconst REGEX_SPECIAL_CHAR_RE = /[.*+?^${}()|[\\]\\\\]/g\n\n/**\n * Props for {@link GrInputTag}.\n * Tag-input primitive: renders a set of badges with an inline `<input>` for entering new tags.\n * Splits input by configurable `separators`, supports paste, Enter and Backspace editing.\n */\nexport interface GrInputTagProps {\n  modelValue: string[]\n  placeholder?: string\n  disabled?: boolean\n  readonly?: boolean\n  invalid?: boolean\n  /** Обязательное поле (`aria-required`). Складывается с `required` у `GrFormField`. */\n  required?: boolean\n  state?: GrInputTagState\n  size?: GrInputTagSize\n  separators?: string[]\n  allowDuplicates?: boolean\n  trim?: boolean\n  max?: number\n  addOnBlur?: boolean\n  clearInputOnAdd?: boolean\n  /**\n   * Проверка тега перед добавлением. Может быть асинхронной (проверка на\n   * сервере). Отклонённый тег не добавляется и уходит в событие `reject`.\n   */\n  beforeAdd?: (tag: string) => boolean | Promise<boolean>\n  /** Кнопка «снести все теги». Настраивается через `GrConfigProvider`. */\n  clearable?: boolean\n  /** Фоновая работа: спиннер + `aria-busy`. Асинхронный `beforeAdd` поднимает его сам. */\n  loading?: boolean\n  tagTone?: GrBadgeTone\n  tagDark?: boolean\n  tagSize?: GrBadgeSize\n  tagRadius?: GrBadgeRadius\n  tagClosable?: boolean\n  /** i18n-friendly aria-label for the per-tag remove button. */\n  removeTagLabel?: string\n  /** i18n aria-label кнопки «снести все». */\n  clearAllLabel?: string\n  /**\n   * Имя контрола, когда он используется вне `GrFormField`. Внутри поля имя даёт\n   * связка с его `<label for>` — там проп не нужен. Без того и другого у инпута\n   * нет доступного имени вовсе: placeholder именем не считается.\n   */\n  ariaLabel?: string\n  /** Имя для нативной формы: hidden input на каждый тег. */\n  name?: string\n  /**\n   * Ширины аддонов `prefix`/`suffix` — общий контракт контролов пакета\n   * (`docs/form-controls.md`).\n   */\n  prefixMinWidth?: string\n  prefixMaxWidth?: string\n  suffixMinWidth?: string\n  suffixMaxWidth?: string\n  prefixFixed?: boolean\n  suffixFixed?: boolean\n}\n\nexport interface GrInputTagEmits {\n  (e: 'update:modelValue', value: string[]): void\n  (e: 'add', value: string): void\n  (e: 'remove', value: string, index: number): void\n  /** Тег не прошёл `beforeAdd`. */\n  (e: 'reject', value: string): void\n  /** Набор снесён кнопкой «очистить». */\n  (e: 'clear'): void\n  /** Набор тегов изменился. */\n  (e: 'change', value: string[]): void\n  (e: 'focus', event: FocusEvent): void\n  (e: 'blur', event: FocusEvent): void\n}\n\nconst props = withDefaults(\n  defineProps<GrInputTagProps>(),\n  {\n    placeholder: undefined,\n    disabled: false,\n    readonly: false,\n    invalid: false,\n    required: false,\n    state: 'default',\n    // Настраивается через `GrConfigProvider`; дефолт — в резолвере ниже.\n    size: undefined,\n    separators: () => [','],\n    allowDuplicates: false,\n    trim: true,\n    max: undefined,\n    addOnBlur: false,\n    clearInputOnAdd: true,\n    beforeAdd: undefined,\n    clearable: undefined,\n    loading: false,\n    tagTone: 'neutral',\n    tagDark: false,\n    tagSize: 'md',\n    tagRadius: 'round',\n    tagClosable: true,\n    removeTagLabel: undefined,\n    clearAllLabel: undefined,\n    ariaLabel: undefined,\n    name: undefined,\n  },\n)\n\nconst emit = defineEmits<GrInputTagEmits>()\ndefineSlots<{\n  /** Аддон слева от чипов: иконка, метка. */\n  prefix?: () => any\n  /** Аддон справа, перед кнопкой очистки. */\n  suffix?: () => any\n  /** Свой чип: `remove` снимает значение. */\n  tag?: (props: { tag: string, index: number, remove: () => void }) => any\n}>()\n\n\n// Fallback из контекста `GrFormField` (id/aria-describedby/invalid/required) —\n// как у GrInput и GrSelect: контрол не знает про форму, знает только про поле.\nconst field = useGrFormFieldContext()\nconst resolvedId = computed(() => field?.id.value)\nconst describedBy = computed(() => field?.describedById.value)\nconst {\n  disabled: isDisabled,\n  invalid: isInvalid,\n  required: isRequired,\n  readonly: isReadonly,\n} = useGrFormControl(() => props)\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\n/** Ширина аддона по умолчанию — та же лестница, что у `GrInput`. */\nconst ADDON_MIN_WIDTH_BY_SIZE: Record<GrInputTagSize, string> = {\n  xs: '2rem',\n  sm: '2.25rem',\n  md: '2.5rem',\n  lg: '3rem',\n}\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrInputTag' })\n\n/**\n * Аддоны — флекс-соседи поля: оболочка тегового поля и так флекс-строка с\n * бейджами, поэтому места паддингом резервировать не нужно.\n */\nconst { hasPrefix, hasSuffix, prefixEl, suffixEl, prefixStyle, suffixStyle } = useControlAddons(() => props, {\n  defaultMinWidth: () => ADDON_MIN_WIDTH_BY_SIZE[resolvedSize.value],\n  paddingX: () => '0px',\n})\nconst resolvedClearable = useGrComponentProp('GrInputTag', 'clearable', () => props.clearable, false)\n\nconst { t } = useGranularityTranslations()\nconst resolvedClearAllLabel = computed(() => props.clearAllLabel ?? t('gr.inputTag.clearAll', 'Clear all tags'))\n\nfunction removeTagLabelFor(tag: string): string {\n  // Безликое «Remove tag» на двадцати кнопках подряд не даёт выбрать нужную:\n  // имя обязано называть сам тег.\n  return props.removeTagLabel ?? t('gr.inputTag.removeTagNamed', 'Remove tag {tag}', { tag })\n}\n\nconst inputValue = ref('')\nconst inputEl = ref<HTMLInputElement | null>(null)\nconst rootEl = ref<HTMLElement | null>(null)\n\n// Внутри корня фокус ходит между полем и кнопками удаления чипов: без границы\n// каждое такое перемещение давало бы потребителю пару `blur` + `focus`.\nconst { onFocusIn, onFocusOut } = useFocusWithin(rootEl, {\n  enter: event => emit('focus', event),\n  leave: event => emit('blur', event),\n})\nconst removeEls = ref<HTMLButtonElement[]>([])\n\nfunction setRemoveEl(index: number) {\n  return (el: unknown): void => {\n    removeEls.value[index] = el as HTMLButtonElement\n  }\n}\n\nfunction focus(): void {\n  inputEl.value?.focus()\n}\n\nfunction blur(): void {\n  inputEl.value?.blur()\n}\n\nconst isMaxed = computed(() => props.max !== undefined && props.modelValue.length >= props.max)\nconst canEdit = computed(() => !isDisabled.value && !isReadonly.value)\nconst showRemove = computed(() => props.tagClosable && canEdit.value)\n\n// Добавление, удаление и достигнутый предел — события, а не состояние виджета:\n// показывать их негде, объявить нужно. Это работа общего живого региона.\nconst { announce } = useAnnouncer()\n\n/**\n * Roving tabindex по крестикам: двадцать тегов давали двадцать одну остановку\n * `Tab`. В таб-порядке ровно один крестик, между ними ходят стрелками.\n *\n * Адресация индексом, а не значением тега: теги допускают повторы, и по\n * значению два одинаковых чипа было бы не различить.\n */\nconst tagIndexes = computed(() => props.modelValue.map((_, index) => index))\n\nconst roving = useRovingFocus<number>({\n  items: () => tagIndexes.value,\n  elementFor: index => removeEls.value[index],\n  orientation: () => 'horizontal',\n  // Ряд чипов — не кольцо: у него есть край, и за краем стоит поле ввода.\n  wrap: () => false,\n  onOverflow: (edge) => {\n    // За последним чипом — поле ввода: продолжение того же ряда. Слева от\n    // первого — начало строки, фокус остаётся на месте.\n    if (edge === 'end') focus()\n    return true\n  },\n  // Удаление чипа перерисовывает ряд: без ожидания фокус уехал бы на узел,\n  // которого уже нет.\n  beforeFocus: () => nextTick(),\n})\n\nasync function focusTag(index: number): Promise<void> {\n  const last = props.modelValue.length - 1\n  if (last < 0) {\n    focus()\n    return\n  }\n\n  await roving.focusKey(Math.min(Math.max(index, 0), last))\n}\n\nfunction escapeRegexChar(ch: string): string {\n  return ch.replace(REGEX_SPECIAL_CHAR_RE, '\\\\$&')\n}\n\nconst splitRegex = computed(() => {\n  const seps = (props.separators ?? []).filter(Boolean).map(s => s[0]!)\n  const uniq = [...new Set([...seps, '\\n', '\\r', '\\t'])]\n  const body = uniq.map(escapeRegexChar).join('')\n  return new RegExp(`[${body}]+`, 'g')\n})\n\nfunction normalizeTag(raw: string): string {\n  return props.trim ? raw.trim() : raw\n}\n\nfunction splitToTags(raw: string): string[] {\n  return raw\n    .split(splitRegex.value)\n    .map(v => normalizeTag(v))\n    .filter(Boolean)\n}\n\nfunction addMany(rawTags: string[]): boolean {\n  if (!canEdit.value || isMaxed.value)\n    return false\n\n  const next = props.modelValue.slice()\n  const added: string[] = []\n\n  for (const raw of rawTags) {\n    const tag = normalizeTag(raw)\n    if (!tag)\n      continue\n\n    if (!props.allowDuplicates && next.includes(tag))\n      continue\n\n    if (props.max !== undefined && next.length >= props.max)\n      break\n\n    next.push(tag)\n    added.push(tag)\n    emit('add', tag)\n  }\n\n  if (!added.length)\n    return false\n\n  emit('update:modelValue', next)\n  emit('change', next)\n  announce(added.length === 1\n    ? t('gr.inputTag.added', 'Tag added: {tag}', { tag: added[0]! })\n    : t('gr.inputTag.addedMany', '{count} tags added', { count: added.length }))\n\n  return true\n}\n\n// Счётчик запуска: пока идёт асинхронная проверка, пользователь успевает нажать\n// Enter второй раз — результат устаревшей проверки дописывать нельзя.\nlet validationRun = 0\nconst validating = ref(false)\nconst isBusy = computed(() => props.loading || validating.value)\n\nasync function filterAllowed(tags: string[], run: number): Promise<string[] | null> {\n  const check = props.beforeAdd\n  if (!check)\n    return tags\n\n  const allowed: string[] = []\n\n  for (const tag of tags) {\n    const ok = await check(tag)\n    if (run !== validationRun)\n      return null\n\n    if (ok)\n      allowed.push(tag)\n    else\n      emit('reject', tag)\n  }\n\n  return allowed\n}\n\nasync function commitInput(): Promise<void> {\n  if (!canEdit.value || !inputValue.value)\n    return\n\n  if (isMaxed.value) {\n    announce(t('gr.inputTag.limitReached', 'Tag limit reached'))\n    return\n  }\n\n  const raw = inputValue.value\n  const tags = splitToTags(raw)\n  if (!tags.length)\n    return\n\n  const run = ++validationRun\n  validating.value = Boolean(props.beforeAdd)\n\n  const allowed = await filterAllowed(tags, run)\n\n  if (run === validationRun)\n    validating.value = false\n\n  if (allowed === null || !allowed.length)\n    return\n\n  const changed = addMany(allowed)\n  // Значение могло измениться, пока шла проверка: стирать чужой ввод нельзя.\n  if (changed && props.clearInputOnAdd && inputValue.value === raw)\n    inputValue.value = ''\n}\n\nfunction removeAt(index: number): void {\n  if (!canEdit.value)\n    return\n\n  const next = props.modelValue.slice()\n  const removed = next[index]\n  if (removed === undefined)\n    return\n\n  next.splice(index, 1)\n  emit('update:modelValue', next)\n  emit('change', next)\n  emit('remove', removed, index)\n  announce(t('gr.inputTag.removed', 'Tag removed: {tag}', { tag: removed }))\n}\n\n/** Удаление с клавиатуры: фокус переезжает на соседний чип, а не пропадает. */\nasync function removeAtFromKeyboard(index: number): Promise<void> {\n  removeAt(index)\n  await nextTick()\n\n  if (props.modelValue.length === 0) {\n    focus()\n    return\n  }\n\n  await focusTag(Math.min(index, props.modelValue.length - 1))\n}\n\nfunction clearAll(): void {\n  if (!canEdit.value || props.modelValue.length === 0)\n    return\n\n  emit('update:modelValue', [])\n  emit('change', [])\n  emit('clear')\n  announce(t('gr.inputTag.cleared', 'All tags removed'))\n  focus()\n}\n\nfunction onInput(e: Event): void {\n  inputValue.value = (e.target as HTMLInputElement).value\n}\n\nfunction onKeydown(e: KeyboardEvent): void {\n  // Enter/сепаратор во время IME-композиции коммитят её, а не тег.\n  if (isComposingEvent(e))\n    return\n  if (!canEdit.value)\n    return\n\n  if (e.key === 'Enter') {\n    e.preventDefault()\n    void commitInput()\n    return\n  }\n\n  if ((props.separators ?? []).includes(e.key)) {\n    e.preventDefault()\n    void commitInput()\n    return\n  }\n\n  if (inputValue.value.length === 0 && props.modelValue.length > 0) {\n    if (e.key === 'Backspace') {\n      e.preventDefault()\n      removeAt(props.modelValue.length - 1)\n      return\n    }\n\n    // Из пустого поля стрелка влево уводит на последний чип — дальше по чипам\n    // работают те же стрелки, `Tab` для этого не нужен.\n    if (e.key === 'ArrowLeft') {\n      e.preventDefault()\n      void focusTag(props.modelValue.length - 1)\n    }\n  }\n}\n\nfunction onTagKeydown(e: KeyboardEvent, index: number): void {\n  if (roving.handleNavigationKeys(e)) {\n    return\n  }\n\n  if (e.key === 'Delete' || e.key === 'Backspace') {\n    e.preventDefault()\n    void removeAtFromKeyboard(index)\n  }\n}\n\nfunction onBlur(): void {\n  if (props.addOnBlur)\n    void commitInput()\n}\n\nfunction onPaste(e: ClipboardEvent): void {\n  if (!canEdit.value || isMaxed.value)\n    return\n\n  const pasted = e.clipboardData?.getData('text')\n  if (!pasted)\n    return\n\n  const tags = splitToTags(pasted)\n  if (tags.length <= 1)\n    return\n\n  e.preventDefault()\n\n  const run = ++validationRun\n  validating.value = Boolean(props.beforeAdd)\n\n  void filterAllowed(tags, run).then((allowed) => {\n    if (run === validationRun)\n      validating.value = false\n\n    if (allowed?.length)\n      addMany(allowed)\n  })\n}\n\nconst wrapperClassName = computed(() => {\n  return grInputTagWrapperClass({\n    size: resolvedSize.value,\n    state: props.state,\n    invalid: isInvalid.value,\n    disabled: isDisabled.value,\n  })\n})\n\nconst inputClassName = computed(() => grInputTagInputClass(resolvedSize.value))\n\nconst showClearAll = computed(() => resolvedClearable.value && canEdit.value && props.modelValue.length > 0)\n\nconst placeholderText = computed(() => props.modelValue.length > 0 ? undefined : props.placeholder)\n\ndefineExpose({ focus, blur, clear: clearAll })\n</script>\n\n<template>\n  <div\n    ref=\"rootEl\"\n    data-gr-input-tag\n    data-testid=\"gr-input-tag\"\n    :class=\"wrapperClassName\"\n    @click=\"focus\"\n    @focusin=\"onFocusIn\"\n    @focusout=\"onFocusOut\"\n  >\n    <span\n      v-if=\"hasPrefix\"\n      ref=\"prefixEl\"\n      data-gr-input-tag-prefix\n      class=\"inline-flex shrink-0 items-center justify-center text-[var(--gr-muted-fg)]\"\n      :style=\"prefixStyle\"\n    >\n      <slot name=\"prefix\" />\n    </span>\n\n    <!-- Нативная форма: hidden на каждый тег — стандартная сериализация набора. -->\n    <template v-if=\"name\">\n      <input\n        v-for=\"(tag, tagIndex) in modelValue\"\n        :key=\"`hidden-${tagIndex}`\"\n        type=\"hidden\"\n        :name=\"name\"\n        :value=\"tag\"\n      >\n    </template>\n    <!--\n      `display: contents` — список нужен ради роли, а не ради раскладки: чипы\n      обязаны переноситься в одном потоке с полем ввода.\n    -->\n    <span v-if=\"modelValue.length\" role=\"list\" class=\"contents\">\n      <GrBadge\n        v-for=\"(tag, i) in modelValue\"\n        :key=\"`${tag}-${i}`\"\n        role=\"listitem\"\n        :tone=\"tagTone\"\n        :dark=\"tagDark\"\n        :size=\"tagSize\"\n        :radius=\"tagRadius\"\n        data-gr-input-tag-item\n        data-testid=\"gr-input-tag-item\"\n        :data-index=\"i\"\n      >\n        <span class=\"inline-flex items-center gap-1 align-middle\">\n          <slot name=\"tag\" :tag=\"tag\" :index=\"i\" :remove=\"() => removeAt(i)\">\n            <span class=\"truncate max-w-[18rem]\">{{ tag }}</span>\n          </slot>\n\n          <button\n            v-if=\"showRemove\"\n            :ref=\"setRemoveEl(i)\"\n            type=\"button\"\n            :class=\"removeButtonClass\"\n            :aria-label=\"removeTagLabelFor(tag)\"\n            :tabindex=\"roving.tabindexFor(i)\"\n            data-gr-input-tag-remove\n            data-testid=\"gr-input-tag-remove\"\n            :data-index=\"i\"\n            @mousedown.prevent.stop\n            @focus=\"roving.setActive(i)\"\n            @keydown=\"onTagKeydown($event, i)\"\n            @click.stop=\"removeAt(i)\"\n          >\n            <GrIcon size=\"sm\">\n              <IconClose />\n            </GrIcon>\n          </button>\n        </span>\n      </GrBadge>\n    </span>\n\n    <input\n      :id=\"resolvedId\"\n      ref=\"inputEl\"\n      data-gr-input-tag-input\n      data-testid=\"gr-input-tag-input\"\n      :value=\"inputValue\"\n      :disabled=\"isDisabled\"\n      :readonly=\"isReadonly\"\n      :placeholder=\"placeholderText\"\n      :aria-label=\"ariaLabel\"\n      :aria-describedby=\"describedBy\"\n      :aria-required=\"isRequired ? 'true' : undefined\"\n      :aria-readonly=\"isReadonly ? 'true' : undefined\"\n      :aria-invalid=\"isInvalid ? 'true' : undefined\"\n      :aria-busy=\"isBusy ? 'true' : undefined\"\n      class=\"flex-1 min-w-[120px] bg-transparent border-none outline-none placeholder:text-[var(--gr-muted-fg)]\"\n      :class=\"inputClassName\"\n      @input=\"onInput\"\n      @keydown=\"onKeydown\"\n      @blur=\"onBlur\"\n      @paste=\"onPaste\"\n    >\n\n    <span\n      v-if=\"hasSuffix\"\n      ref=\"suffixEl\"\n      data-gr-input-tag-suffix\n      class=\"inline-flex shrink-0 items-center justify-center text-[var(--gr-muted-fg)]\"\n      :style=\"suffixStyle\"\n    >\n      <slot name=\"suffix\" />\n    </span>\n\n    <span\n      v-if=\"isBusy\"\n      data-gr-input-tag-spinner\n      :class=\"spinnerClass\"\n      aria-hidden=\"true\"\n    >\n      <GrIcon size=\"sm\">\n        <IconLoader class=\"animate-spin\" />\n      </GrIcon>\n    </span>\n\n    <button\n      v-if=\"showClearAll\"\n      type=\"button\"\n      data-gr-input-tag-clear\n      :class=\"clearButtonClass\"\n      :aria-label=\"resolvedClearAllLabel\"\n      @mousedown.prevent.stop\n      @click.stop=\"clearAll\"\n    >\n      <GrIcon size=\"sm\">\n        <IconClose />\n      </GrIcon>\n    </button>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, ref } from 'vue'\n\nimport GrBadge from '../GrBadge/GrBadge.vue'\nimport type { GrBadgeRadius, GrBadgeSize, GrBadgeTone } from '../GrBadge'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport IconClose from '~icons/lucide/x'\nimport IconLoader from '~icons/lucide/loader-2'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useControlAddons } from '../../composables/internal/useControlAddons'\nimport { useGrFormFieldContext } from '../GrFormField/context'\nimport { useAnnouncer } from '../../composables/useAnnouncer'\nimport { useRovingFocus } from '../../composables/useRovingFocus'\nimport { useGrFormControl } from '../../composables/useGrFormControl'\nimport { useFocusWithin } from '../../composables/internal/useFocusWithin'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { isComposingEvent } from '../../internal/keyboard'\n\nimport {\n  clearButtonClass,\n  grInputTagInputClass,\n  grInputTagWrapperClass,\n  removeButtonClass,\n  spinnerClass,\n  type GrInputTagSize,\n  type GrInputTagState,\n} from './grInputTagStyles'\n\nexport type { GrInputTagSize, GrInputTagState } from './grInputTagStyles'\n\nconst REGEX_SPECIAL_CHAR_RE = /[.*+?^${}()|[\\]\\\\]/g\n\n/**\n * Props for {@link GrInputTag}.\n * Tag-input primitive: renders a set of badges with an inline `<input>` for entering new tags.\n * Splits input by configurable `separators`, supports paste, Enter and Backspace editing.\n */\nexport interface GrInputTagProps {\n  modelValue: string[]\n  placeholder?: string\n  disabled?: boolean\n  readonly?: boolean\n  invalid?: boolean\n  /** Обязательное поле (`aria-required`). Складывается с `required` у `GrFormField`. */\n  required?: boolean\n  state?: GrInputTagState\n  size?: GrInputTagSize\n  separators?: string[]\n  allowDuplicates?: boolean\n  trim?: boolean\n  max?: number\n  addOnBlur?: boolean\n  clearInputOnAdd?: boolean\n  /**\n   * Проверка тега перед добавлением. Может быть асинхронной (проверка на\n   * сервере). Отклонённый тег не добавляется и уходит в событие `reject`.\n   */\n  beforeAdd?: (tag: string) => boolean | Promise<boolean>\n  /** Кнопка «снести все теги». Настраивается через `GrConfigProvider`. */\n  clearable?: boolean\n  /** Фоновая работа: спиннер + `aria-busy`. Асинхронный `beforeAdd` поднимает его сам. */\n  loading?: boolean\n  tagTone?: GrBadgeTone\n  tagDark?: boolean\n  tagSize?: GrBadgeSize\n  tagRadius?: GrBadgeRadius\n  tagClosable?: boolean\n  /** i18n-friendly aria-label for the per-tag remove button. */\n  removeTagLabel?: string\n  /** i18n aria-label кнопки «снести все». */\n  clearAllLabel?: string\n  /**\n   * Имя контрола, когда он используется вне `GrFormField`. Внутри поля имя даёт\n   * связка с его `<label for>` — там проп не нужен. Без того и другого у инпута\n   * нет доступного имени вовсе: placeholder именем не считается.\n   */\n  ariaLabel?: string\n  /** Имя для нативной формы: hidden input на каждый тег. */\n  name?: string\n  /**\n   * Ширины аддонов `prefix`/`suffix` — общий контракт контролов пакета\n   * (`docs/form-controls.md`).\n   */\n  prefixMinWidth?: string\n  prefixMaxWidth?: string\n  suffixMinWidth?: string\n  suffixMaxWidth?: string\n  prefixFixed?: boolean\n  suffixFixed?: boolean\n}\n\nexport interface GrInputTagEmits {\n  (e: 'update:modelValue', value: string[]): void\n  (e: 'add', value: string): void\n  (e: 'remove', value: string, index: number): void\n  /** Тег не прошёл `beforeAdd`. */\n  (e: 'reject', value: string): void\n  /** Набор снесён кнопкой «очистить». */\n  (e: 'clear'): void\n  /** Набор тегов изменился. */\n  (e: 'change', value: string[]): void\n  (e: 'focus', event: FocusEvent): void\n  (e: 'blur', event: FocusEvent): void\n}\n\nconst props = withDefaults(\n  defineProps<GrInputTagProps>(),\n  {\n    placeholder: undefined,\n    disabled: false,\n    readonly: false,\n    invalid: false,\n    required: false,\n    state: 'default',\n    // Настраивается через `GrConfigProvider`; дефолт — в резолвере ниже.\n    size: undefined,\n    separators: () => [','],\n    allowDuplicates: false,\n    trim: true,\n    max: undefined,\n    addOnBlur: false,\n    clearInputOnAdd: true,\n    beforeAdd: undefined,\n    clearable: undefined,\n    loading: false,\n    tagTone: 'neutral',\n    tagDark: false,\n    tagSize: 'md',\n    tagRadius: 'round',\n    tagClosable: true,\n    removeTagLabel: undefined,\n    clearAllLabel: undefined,\n    ariaLabel: undefined,\n    name: undefined,\n  },\n)\n\nconst emit = defineEmits<GrInputTagEmits>()\ndefineSlots<{\n  /** Аддон слева от чипов: иконка, метка. */\n  prefix?: () => any\n  /** Аддон справа, перед кнопкой очистки. */\n  suffix?: () => any\n  /** Свой чип: `remove` снимает значение. */\n  tag?: (props: { tag: string, index: number, remove: () => void }) => any\n}>()\n\n\n// Fallback из контекста `GrFormField` (id/aria-describedby/invalid/required) —\n// как у GrInput и GrSelect: контрол не знает про форму, знает только про поле.\nconst field = useGrFormFieldContext()\nconst resolvedId = computed(() => field?.id.value)\nconst describedBy = computed(() => field?.describedById.value)\nconst {\n  disabled: isDisabled,\n  invalid: isInvalid,\n  required: isRequired,\n  readonly: isReadonly,\n} = useGrFormControl(() => props)\n\n// Эффективные значения: локальный проп → `GrConfigProvider` → дефолт компонента.\n/** Ширина аддона по умолчанию — та же лестница, что у `GrInput`. */\nconst ADDON_MIN_WIDTH_BY_SIZE: Record<GrInputTagSize, string> = {\n  xs: '2rem',\n  sm: '2.25rem',\n  md: '2.5rem',\n  lg: '3rem',\n}\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrInputTag' })\n\n/**\n * Аддоны — флекс-соседи поля: оболочка тегового поля и так флекс-строка с\n * бейджами, поэтому места паддингом резервировать не нужно.\n */\nconst { hasPrefix, hasSuffix, prefixEl, suffixEl, prefixStyle, suffixStyle } = useControlAddons(() => props, {\n  defaultMinWidth: () => ADDON_MIN_WIDTH_BY_SIZE[resolvedSize.value],\n  paddingX: () => '0px',\n})\nconst resolvedClearable = useGrComponentProp('GrInputTag', 'clearable', () => props.clearable, false)\n\nconst { t } = useGranularityTranslations()\nconst resolvedClearAllLabel = computed(() => props.clearAllLabel ?? t('gr.inputTag.clearAll', 'Clear all tags'))\n\nfunction removeTagLabelFor(tag: string): string {\n  // Безликое «Remove tag» на двадцати кнопках подряд не даёт выбрать нужную:\n  // имя обязано называть сам тег.\n  return props.removeTagLabel ?? t('gr.inputTag.removeTagNamed', 'Remove tag {tag}', { tag })\n}\n\nconst inputValue = ref('')\nconst inputEl = ref<HTMLInputElement | null>(null)\nconst rootEl = ref<HTMLElement | null>(null)\n\n// Внутри корня фокус ходит между полем и кнопками удаления чипов: без границы\n// каждое такое перемещение давало бы потребителю пару `blur` + `focus`.\nconst { onFocusIn, onFocusOut } = useFocusWithin(rootEl, {\n  enter: event => emit('focus', event),\n  leave: event => emit('blur', event),\n})\nconst removeEls = ref<HTMLButtonElement[]>([])\n\nfunction setRemoveEl(index: number) {\n  return (el: unknown): void => {\n    removeEls.value[index] = el as HTMLButtonElement\n  }\n}\n\nfunction focus(): void {\n  inputEl.value?.focus()\n}\n\nfunction blur(): void {\n  inputEl.value?.blur()\n}\n\nconst isMaxed = computed(() => props.max !== undefined && props.modelValue.length >= props.max)\nconst canEdit = computed(() => !isDisabled.value && !isReadonly.value)\nconst showRemove = computed(() => props.tagClosable && canEdit.value)\n\n// Добавление, удаление и достигнутый предел — события, а не состояние виджета:\n// показывать их негде, объявить нужно. Это работа общего живого региона.\nconst { announce } = useAnnouncer()\n\n/**\n * Roving tabindex по крестикам: двадцать тегов давали двадцать одну остановку\n * `Tab`. В таб-порядке ровно один крестик, между ними ходят стрелками.\n *\n * Адресация индексом, а не значением тега: теги допускают повторы, и по\n * значению два одинаковых чипа было бы не различить.\n */\nconst tagIndexes = computed(() => props.modelValue.map((_, index) => index))\n\nconst roving = useRovingFocus<number>({\n  items: () => tagIndexes.value,\n  elementFor: index => removeEls.value[index],\n  orientation: () => 'horizontal',\n  // Ряд чипов — не кольцо: у него есть край, и за краем стоит поле ввода.\n  wrap: () => false,\n  onOverflow: (edge) => {\n    // За последним чипом — поле ввода: продолжение того же ряда. Слева от\n    // первого — начало строки, фокус остаётся на месте.\n    if (edge === 'end') focus()\n    return true\n  },\n  // Удаление чипа перерисовывает ряд: без ожидания фокус уехал бы на узел,\n  // которого уже нет.\n  beforeFocus: () => nextTick(),\n})\n\nasync function focusTag(index: number): Promise<void> {\n  const last = props.modelValue.length - 1\n  if (last < 0) {\n    focus()\n    return\n  }\n\n  await roving.focusKey(Math.min(Math.max(index, 0), last))\n}\n\nfunction escapeRegexChar(ch: string): string {\n  return ch.replace(REGEX_SPECIAL_CHAR_RE, '\\\\$&')\n}\n\nconst splitRegex = computed(() => {\n  const seps = (props.separators ?? []).filter(Boolean).map(s => s[0]!)\n  const uniq = [...new Set([...seps, '\\n', '\\r', '\\t'])]\n  const body = uniq.map(escapeRegexChar).join('')\n  return new RegExp(`[${body}]+`, 'g')\n})\n\nfunction normalizeTag(raw: string): string {\n  return props.trim ? raw.trim() : raw\n}\n\nfunction splitToTags(raw: string): string[] {\n  return raw\n    .split(splitRegex.value)\n    .map(v => normalizeTag(v))\n    .filter(Boolean)\n}\n\nfunction addMany(rawTags: string[]): boolean {\n  if (!canEdit.value || isMaxed.value)\n    return false\n\n  const next = props.modelValue.slice()\n  const added: string[] = []\n\n  for (const raw of rawTags) {\n    const tag = normalizeTag(raw)\n    if (!tag)\n      continue\n\n    if (!props.allowDuplicates && next.includes(tag))\n      continue\n\n    if (props.max !== undefined && next.length >= props.max)\n      break\n\n    next.push(tag)\n    added.push(tag)\n    emit('add', tag)\n  }\n\n  if (!added.length)\n    return false\n\n  emit('update:modelValue', next)\n  emit('change', next)\n  announce(added.length === 1\n    ? t('gr.inputTag.added', 'Tag added: {tag}', { tag: added[0]! })\n    : t('gr.inputTag.addedMany', '{count} tags added', { count: added.length }))\n\n  return true\n}\n\n// Счётчик запуска: пока идёт асинхронная проверка, пользователь успевает нажать\n// Enter второй раз — результат устаревшей проверки дописывать нельзя.\nlet validationRun = 0\nconst validating = ref(false)\nconst isBusy = computed(() => props.loading || validating.value)\n\nasync function filterAllowed(tags: string[], run: number): Promise<string[] | null> {\n  const check = props.beforeAdd\n  if (!check)\n    return tags\n\n  const allowed: string[] = []\n\n  for (const tag of tags) {\n    const ok = await check(tag)\n    if (run !== validationRun)\n      return null\n\n    if (ok)\n      allowed.push(tag)\n    else\n      emit('reject', tag)\n  }\n\n  return allowed\n}\n\nasync function commitInput(): Promise<void> {\n  if (!canEdit.value || !inputValue.value)\n    return\n\n  if (isMaxed.value) {\n    announce(t('gr.inputTag.limitReached', 'Tag limit reached'))\n    return\n  }\n\n  const raw = inputValue.value\n  const tags = splitToTags(raw)\n  if (!tags.length)\n    return\n\n  const run = ++validationRun\n  validating.value = Boolean(props.beforeAdd)\n\n  const allowed = await filterAllowed(tags, run)\n\n  if (run === validationRun)\n    validating.value = false\n\n  if (allowed === null || !allowed.length)\n    return\n\n  const changed = addMany(allowed)\n  // Значение могло измениться, пока шла проверка: стирать чужой ввод нельзя.\n  if (changed && props.clearInputOnAdd && inputValue.value === raw)\n    inputValue.value = ''\n}\n\nfunction removeAt(index: number): void {\n  if (!canEdit.value)\n    return\n\n  const next = props.modelValue.slice()\n  const removed = next[index]\n  if (removed === undefined)\n    return\n\n  next.splice(index, 1)\n  emit('update:modelValue', next)\n  emit('change', next)\n  emit('remove', removed, index)\n  announce(t('gr.inputTag.removed', 'Tag removed: {tag}', { tag: removed }))\n}\n\n/** Удаление с клавиатуры: фокус переезжает на соседний чип, а не пропадает. */\nasync function removeAtFromKeyboard(index: number): Promise<void> {\n  removeAt(index)\n  await nextTick()\n\n  if (props.modelValue.length === 0) {\n    focus()\n    return\n  }\n\n  await focusTag(Math.min(index, props.modelValue.length - 1))\n}\n\nfunction clearAll(): void {\n  if (!canEdit.value || props.modelValue.length === 0)\n    return\n\n  emit('update:modelValue', [])\n  emit('change', [])\n  emit('clear')\n  announce(t('gr.inputTag.cleared', 'All tags removed'))\n  focus()\n}\n\nfunction onInput(e: Event): void {\n  inputValue.value = (e.target as HTMLInputElement).value\n}\n\nfunction onKeydown(e: KeyboardEvent): void {\n  // Enter/сепаратор во время IME-композиции коммитят её, а не тег.\n  if (isComposingEvent(e))\n    return\n  if (!canEdit.value)\n    return\n\n  if (e.key === 'Enter') {\n    e.preventDefault()\n    void commitInput()\n    return\n  }\n\n  if ((props.separators ?? []).includes(e.key)) {\n    e.preventDefault()\n    void commitInput()\n    return\n  }\n\n  if (inputValue.value.length === 0 && props.modelValue.length > 0) {\n    if (e.key === 'Backspace') {\n      e.preventDefault()\n      removeAt(props.modelValue.length - 1)\n      return\n    }\n\n    // Из пустого поля стрелка влево уводит на последний чип — дальше по чипам\n    // работают те же стрелки, `Tab` для этого не нужен.\n    if (e.key === 'ArrowLeft') {\n      e.preventDefault()\n      void focusTag(props.modelValue.length - 1)\n    }\n  }\n}\n\nfunction onTagKeydown(e: KeyboardEvent, index: number): void {\n  if (roving.handleNavigationKeys(e)) {\n    return\n  }\n\n  if (e.key === 'Delete' || e.key === 'Backspace') {\n    e.preventDefault()\n    void removeAtFromKeyboard(index)\n  }\n}\n\nfunction onBlur(): void {\n  if (props.addOnBlur)\n    void commitInput()\n}\n\nfunction onPaste(e: ClipboardEvent): void {\n  if (!canEdit.value || isMaxed.value)\n    return\n\n  const pasted = e.clipboardData?.getData('text')\n  if (!pasted)\n    return\n\n  const tags = splitToTags(pasted)\n  if (tags.length <= 1)\n    return\n\n  e.preventDefault()\n\n  const run = ++validationRun\n  validating.value = Boolean(props.beforeAdd)\n\n  void filterAllowed(tags, run).then((allowed) => {\n    if (run === validationRun)\n      validating.value = false\n\n    if (allowed?.length)\n      addMany(allowed)\n  })\n}\n\nconst wrapperClassName = computed(() => {\n  return grInputTagWrapperClass({\n    size: resolvedSize.value,\n    state: props.state,\n    invalid: isInvalid.value,\n    disabled: isDisabled.value,\n  })\n})\n\nconst inputClassName = computed(() => grInputTagInputClass(resolvedSize.value))\n\nconst showClearAll = computed(() => resolvedClearable.value && canEdit.value && props.modelValue.length > 0)\n\nconst placeholderText = computed(() => props.modelValue.length > 0 ? undefined : props.placeholder)\n\ndefineExpose({ focus, blur, clear: clearAll })\n</script>\n\n<template>\n  <div\n    ref=\"rootEl\"\n    data-gr-input-tag\n    data-testid=\"gr-input-tag\"\n    :class=\"wrapperClassName\"\n    @click=\"focus\"\n    @focusin=\"onFocusIn\"\n    @focusout=\"onFocusOut\"\n  >\n    <span\n      v-if=\"hasPrefix\"\n      ref=\"prefixEl\"\n      data-gr-input-tag-prefix\n      class=\"inline-flex shrink-0 items-center justify-center text-[var(--gr-muted-fg)]\"\n      :style=\"prefixStyle\"\n    >\n      <slot name=\"prefix\" />\n    </span>\n\n    <!-- Нативная форма: hidden на каждый тег — стандартная сериализация набора. -->\n    <template v-if=\"name\">\n      <input\n        v-for=\"(tag, tagIndex) in modelValue\"\n        :key=\"`hidden-${tagIndex}`\"\n        type=\"hidden\"\n        :name=\"name\"\n        :value=\"tag\"\n      >\n    </template>\n    <!--\n      `display: contents` — список нужен ради роли, а не ради раскладки: чипы\n      обязаны переноситься в одном потоке с полем ввода.\n    -->\n    <span v-if=\"modelValue.length\" role=\"list\" class=\"contents\">\n      <GrBadge\n        v-for=\"(tag, i) in modelValue\"\n        :key=\"`${tag}-${i}`\"\n        role=\"listitem\"\n        :tone=\"tagTone\"\n        :dark=\"tagDark\"\n        :size=\"tagSize\"\n        :radius=\"tagRadius\"\n        data-gr-input-tag-item\n        data-testid=\"gr-input-tag-item\"\n        :data-index=\"i\"\n      >\n        <span class=\"inline-flex items-center gap-1 align-middle\">\n          <slot name=\"tag\" :tag=\"tag\" :index=\"i\" :remove=\"() => removeAt(i)\">\n            <span class=\"truncate max-w-[18rem]\">{{ tag }}</span>\n          </slot>\n\n          <button\n            v-if=\"showRemove\"\n            :ref=\"setRemoveEl(i)\"\n            type=\"button\"\n            :class=\"removeButtonClass\"\n            :aria-label=\"removeTagLabelFor(tag)\"\n            :tabindex=\"roving.tabindexFor(i)\"\n            data-gr-input-tag-remove\n            data-testid=\"gr-input-tag-remove\"\n            :data-index=\"i\"\n            @mousedown.prevent.stop\n            @focus=\"roving.setActive(i)\"\n            @keydown=\"onTagKeydown($event, i)\"\n            @click.stop=\"removeAt(i)\"\n          >\n            <GrIcon size=\"sm\">\n              <IconClose />\n            </GrIcon>\n          </button>\n        </span>\n      </GrBadge>\n    </span>\n\n    <input\n      :id=\"resolvedId\"\n      ref=\"inputEl\"\n      data-gr-input-tag-input\n      data-testid=\"gr-input-tag-input\"\n      :value=\"inputValue\"\n      :disabled=\"isDisabled\"\n      :readonly=\"isReadonly\"\n      :placeholder=\"placeholderText\"\n      :aria-label=\"ariaLabel\"\n      :aria-describedby=\"describedBy\"\n      :aria-required=\"isRequired ? 'true' : undefined\"\n      :aria-readonly=\"isReadonly ? 'true' : undefined\"\n      :aria-invalid=\"isInvalid ? 'true' : undefined\"\n      :aria-busy=\"isBusy ? 'true' : undefined\"\n      class=\"flex-1 min-w-[120px] bg-transparent border-none outline-none placeholder:text-[var(--gr-muted-fg)]\"\n      :class=\"inputClassName\"\n      @input=\"onInput\"\n      @keydown=\"onKeydown\"\n      @blur=\"onBlur\"\n      @paste=\"onPaste\"\n    >\n\n    <span\n      v-if=\"hasSuffix\"\n      ref=\"suffixEl\"\n      data-gr-input-tag-suffix\n      class=\"inline-flex shrink-0 items-center justify-center text-[var(--gr-muted-fg)]\"\n      :style=\"suffixStyle\"\n    >\n      <slot name=\"suffix\" />\n    </span>\n\n    <span\n      v-if=\"isBusy\"\n      data-gr-input-tag-spinner\n      :class=\"spinnerClass\"\n      aria-hidden=\"true\"\n    >\n      <GrIcon size=\"sm\">\n        <IconLoader class=\"animate-spin\" />\n      </GrIcon>\n    </span>\n\n    <button\n      v-if=\"showClearAll\"\n      type=\"button\"\n      data-gr-input-tag-clear\n      :class=\"clearButtonClass\"\n      :aria-label=\"resolvedClearAllLabel\"\n      @mousedown.prevent.stop\n      @click.stop=\"clearAll\"\n    >\n      <GrIcon size=\"sm\">\n        <IconClose />\n      </GrIcon>\n    </button>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/GrInputTag/index.js

@@ -1,3 +1,3 @@
 import { n as grInputTagSafelist, t as grInputTagConfig } from "../../chunks/config-BN4sXYXn.js";
-import { t as GrInputTag_default } from "./chunks/GrInputTag-Dghhg03-.js";
+import { t as GrInputTag_default } from "./chunks/GrInputTag-C7QVPijj.js";
 export { GrInputTag_default as GrInputTag, GrInputTag_default as default, grInputTagConfig, grInputTagSafelist };

package/dist/components/GrList/chunks/{GrList-CHibO0xA.js → GrList-BUzFRa8-.js}

@@ -2,7 +2,7 @@ import { n as useGranularityTranslations } from "../../../chunks/granularityI18n
 import { useVirtualList } from "../../../composables/useVirtualList.js";
 import { t as _plugin_vue_export_helper_default } from "../../../chunks/_plugin-vue_export-helper-BOaGB7Aw.js";
 import { t as GrSkeleton_default } from "../../GrSkeleton/chunks/GrSkeleton-CgfXxPQ2.js";
-import { t as GrCard_default } from "../../GrCard/chunks/GrCard-DfIZOP5N.js";
+import { t as GrCard_default } from "../../GrCard/chunks/GrCard-Bc7nRfbe.js";
 import { n as hasMeaningfulSlotContent } from "../../../chunks/slotNodes-DxNXpC7v.js";
 import { a as grListItemPaddingClass, c as itemHoverClass, d as itemTitleClass, f as loadingRowClass, i as emptyClass, l as itemInteractiveClass, o as itemDescriptionClass, r as dividedClass, s as itemDisabledClass, u as itemLayoutClass } from "../../../chunks/config-BsuDM3Hb.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, markRaw, normalizeClass, normalizeStyle, onMounted, onUpdated, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, withCtx } from "vue";

package/dist/components/GrList/chunks/{GrList-CHibO0xA.js.map → GrList-BUzFRa8-.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrList-CHibO0xA.js","names":["$slots"],"sources":["../../../../src/components/GrList/GrList.vue","../../../../src/components/GrList/GrList.vue","../../../../src/components/GrList/GrListItem.vue","../../../../src/components/GrList/GrListItem.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T = unknown\">\nimport { computed, onMounted, onUpdated, ref, useSlots, watch } from 'vue'\n\nimport GrCard from '../GrCard'\nimport type { GrCardVariant } from '../GrCard/grCardStyles'\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { hasMeaningfulSlotContent } from '../shared/slotNodes'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useVirtualList, type GrVirtualAlign } from '../../composables/useVirtualList'\n\nimport { dividedClass, emptyClass, loadingRowClass } from './grListStyles'\n\nexport interface GrListProps<TItem = unknown> {\n  /**\n   * Поверхность списка — вариант карточки под ним. `ghost` убирает рамку и\n   * тень: список внутри уже существующей карточки не должен давать вторую.\n   */\n  variant?: GrCardVariant\n  /** Показывать ли горизонтальные разделители между элементами (по умолчанию — да). */\n  divided?: boolean\n  /** Идёт загрузка: вместо пунктов — строки-скелетоны, контейнер помечен `aria-busy`. */\n  loading?: boolean\n  /** Сколько строк-заглушек показать при `loading`. */\n  loadingRows?: number\n  /**\n   * Список пуст. По умолчанию определяется сам — по содержимому слота; проп\n   * нужен там, где потребитель знает лучше (например, слот заполнен\n   * заголовками групп, а данных в них нет).\n   */\n  empty?: boolean\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n  /**\n   * Данные списка. С ними пункты рисует слот `#item`, а не слот по умолчанию, —\n   * и только так список знает размер набора, то есть может его виртуализировать.\n   */\n  items?: TItem[]\n  /** Ключ пункта для `v-for`: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Высота видимой части: контейнер становится скроллером. Число — пиксели. */\n  maxHeight?: number | string\n  /** Держать в DOM только окно вокруг вьюпорта. Требует `items` и `maxHeight`. */\n  virtual?: boolean\n  /** Оценка высоты пункта до замера. Уточняется по факту при первом рендере. */\n  estimatedItemSize?: number\n}\n\nconst props = withDefaults(defineProps<GrListProps<T>>(), {\n  // Дефолт живёт в `GrCard` (и его резолвере `GrConfigProvider`), поэтому здесь\n  // остаётся `undefined` — иначе список перебивал бы настройку карточки.\n  variant: undefined,\n  divided: true,\n  loading: false,\n  loadingRows: 3,\n  empty: undefined,\n  emptyText: undefined,\n  items: undefined,\n  itemKey: undefined,\n  maxHeight: undefined,\n  virtual: false,\n  // Строка обычной плотности с заголовком и описанием.\n  estimatedItemSize: 56,\n})\n\nconst slots = useSlots()\nconst { t } = useGranularityTranslations()\n\nconst listEl = ref<HTMLElement | null>(null)\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.list.empty', 'Nothing here yet'))\n\nconst dataMode = computed(() => props.items !== undefined)\n\n// Пустоту видно по слоту: `v-for` по пустому массиву оставляет фрагмент без\n// узлов, `v-if` — комментарий, и ни то ни другое пунктом списка не является.\nconst isEmpty = computed(() => {\n  if (props.empty !== undefined)\n    return props.empty\n\n  if (dataMode.value)\n    return props.items!.length === 0\n\n  return !hasMeaningfulSlotContent(slots.default?.() ?? [])\n})\n\nconst showItems = computed(() => !props.loading && !isEmpty.value)\n\n// Разделители нужны только между пунктами: в пустой и загрузочной ветках они\n// оставили бы висящую линию.\nconst listClass = computed(() => (props.divided && showItems.value ? dividedClass : undefined))\n\nconst loadingRowCount = computed(() => Math.max(1, Math.trunc(props.loadingRows)))\n\nconst virtualEnabled = computed(() => props.virtual && dataMode.value && props.maxHeight !== undefined)\n\nconst virtualizer = useVirtualList({\n  container: listEl,\n  count: () => (virtualEnabled.value && showItems.value ? props.items!.length : 0),\n  // Замена массива сбрасывает замеры; append в тот же массив их сохраняет.\n  source: () => props.items,\n  itemSize: () => props.estimatedItemSize,\n  // Первый рендер обязан совпасть с серверным: контейнера ещё нет, и окно\n  // считается от объявленной высоты, а не от измеренной.\n  viewportSize: () => (typeof props.maxHeight === 'number' ? props.maxHeight : undefined),\n})\n\n/** Окно к отрисовке: при выключенной виртуализации — весь набор. */\nconst renderedItems = computed(() => {\n  const items = props.items ?? []\n  if (!virtualEnabled.value) return items.map((item, index) => ({ item, index }))\n\n  const { start, end } = virtualizer.range.value\n  return items.slice(start, end).map((item, offset) => ({ item, index: start + offset }))\n})\n\nfunction keyOf(item: T, index: number): string | number {\n  const key = props.itemKey\n  if (typeof key === 'function') return key(item, index)\n  if (typeof key === 'string') return (item as Record<string, unknown>)[key] as string | number\n\n  return index\n}\n\n/**\n * ARIA-набор для пункта.\n *\n * Только в виртуальном режиме: в DOM тогда неполный набор, и без этих атрибутов\n * диктор объявил бы «7 из 20» на списке в пять тысяч. Когда набор в DOM целиком,\n * его размер и позицию браузер считает сам, а руками проставленные атрибуты\n * начинают расходиться с разметкой при любой фильтрации.\n */\nfunction ariaOf(index: number): Record<string, number> {\n  if (!virtualEnabled.value) return {}\n\n  return { 'aria-setsize': props.items!.length, 'aria-posinset': index + 1 }\n}\n\nconst maxHeightStyle = computed(() => {\n  const value = props.maxHeight\n  if (value == null) return undefined\n  return typeof value === 'number' ? `${value}px` : value\n})\n\nconst listStyle = computed(() => {\n  if (props.maxHeight === undefined) return undefined\n\n  const scroller = { overflowY: 'auto' as const, maxHeight: maxHeightStyle.value }\n  if (!virtualEnabled.value) return scroller\n\n  return { ...scroller, ...virtualizer.spacerStyle.value }\n})\n\n/**\n * Замер отрисованных пунктов.\n *\n * Идёт по детям контейнера, а не по `ref` на элементе: пункт рисует слот\n * потребителя, привязать к нему `ref` неоткуда. В виртуальном режиме прямые\n * дети контейнера — ровно окно (распорки живут псевдоэлементами и детьми не\n * считаются), поэтому сопоставление по позиции однозначно.\n */\nfunction measureRendered(): void {\n  if (!virtualEnabled.value) return\n  // В состояниях loading/empty дети контейнера — скелетоны и заглушки: их\n  // высоты записались бы в замеры под индексами будущих строк данных.\n  if (!showItems.value) return\n\n  const container = listEl.value\n  if (!container) return\n\n  const { start } = virtualizer.range.value\n  const children = container.children\n  for (let offset = 0; offset < children.length; offset++) {\n    virtualizer.measure(start + offset, children[offset])\n  }\n}\n\nonMounted(measureRendered)\nonUpdated(measureRendered)\n\nfunction scrollToIndex(index: number, align?: GrVirtualAlign): void {\n  virtualizer.scrollToIndex(index, align)\n}\n\ndefineExpose({ scrollToIndex })\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [props.virtual, dataMode.value, props.maxHeight] as const,\n    ([virtual, hasItems, maxHeight]) => {\n      if (!virtual) return\n\n      if (!hasItems) {\n        console.warn(\n          '[granularity] GrList: `virtual` требует `items` — пункты из слота по умолчанию '\n          + 'список не считает и резать окно ему не из чего.',\n        )\n      }\n      else if (maxHeight === undefined) {\n        console.warn(\n          '[granularity] GrList: `virtual` требует `maxHeight` — без ограничения высоты '\n          + 'вьюпорта нет, и в окно попадает весь набор.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  watch(\n    () => [dataMode.value, Boolean(slots.item)] as const,\n    ([hasItems, hasSlot]) => {\n      if (hasItems && !hasSlot) {\n        console.warn(\n          '[granularity] GrList: с `items` пункты рисует слот `#item` — без него список пуст.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  onMounted(() => {\n    if (!virtualEnabled.value) return\n\n    const first = listEl.value?.firstElementChild\n    if (first && !first.hasAttribute('aria-posinset')) {\n      console.warn(\n        '[granularity] GrList: при `virtual` пункты обязаны нести `aria-setsize`/`aria-posinset` — '\n        + 'пробросьте `aria` из слота `#item`: <GrListItem v-bind=\"aria\" … />. Иначе диктор '\n        + 'посчитает набор по отрисованному окну.',\n      )\n    }\n  })\n}\n</script>\n\n<template>\n  <GrCard :variant=\"variant\">\n    <div\n      ref=\"listEl\"\n      data-gr-list\n      role=\"list\"\n      :class=\"listClass\"\n      :style=\"listStyle\"\n      :tabindex=\"maxHeight === undefined ? undefined : 0\"\n      :data-gr-virtual=\"virtualEnabled ? '' : undefined\"\n      :aria-busy=\"loading ? 'true' : undefined\"\n    >\n      <template v-if=\"loading\">\n        <slot name=\"loading\">\n          <div\n            v-for=\"row in loadingRowCount\"\n            :key=\"row\"\n            data-gr-list-loading-row\n            :class=\"loadingRowClass\"\n          >\n            <GrSkeleton />\n          </div>\n        </slot>\n      </template>\n\n      <div\n        v-else-if=\"isEmpty\"\n        data-gr-list-empty\n        :class=\"emptyClass\"\n      >\n        <slot name=\"empty\">\n          {{ resolvedEmptyText }}\n        </slot>\n      </div>\n\n      <template v-else-if=\"dataMode\">\n        <template\n          v-for=\"entry in renderedItems\"\n          :key=\"keyOf(entry.item, entry.index)\"\n        >\n          <slot\n            name=\"item\"\n            :item=\"entry.item\"\n            :index=\"entry.index\"\n            :aria=\"ariaOf(entry.index)\"\n          />\n        </template>\n      </template>\n\n      <slot v-else />\n    </div>\n  </GrCard>\n</template>\n\n<style scoped>\n/* Срезанное сверху и снизу держат псевдоэлементы контейнера: их не за что\n   размонтировать, в дереве доступности их нет, а высота приезжает переменными\n   в том же патче, что и пункты. Почему не отступы контейнера и не поля крайних\n   пунктов — `docs/virtual-list.md`. */\n[data-gr-virtual]::before,\n[data-gr-virtual]::after {\n    content: '';\n    display: block;\n    flex: none;\n}\n\n[data-gr-virtual]::before {\n    height: var(--gr-virtual-before, 0px);\n}\n\n[data-gr-virtual]::after {\n    height: var(--gr-virtual-after, 0px);\n}\n</style>\n","<script setup lang=\"ts\" generic=\"T = unknown\">\nimport { computed, onMounted, onUpdated, ref, useSlots, watch } from 'vue'\n\nimport GrCard from '../GrCard'\nimport type { GrCardVariant } from '../GrCard/grCardStyles'\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { hasMeaningfulSlotContent } from '../shared/slotNodes'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useVirtualList, type GrVirtualAlign } from '../../composables/useVirtualList'\n\nimport { dividedClass, emptyClass, loadingRowClass } from './grListStyles'\n\nexport interface GrListProps<TItem = unknown> {\n  /**\n   * Поверхность списка — вариант карточки под ним. `ghost` убирает рамку и\n   * тень: список внутри уже существующей карточки не должен давать вторую.\n   */\n  variant?: GrCardVariant\n  /** Показывать ли горизонтальные разделители между элементами (по умолчанию — да). */\n  divided?: boolean\n  /** Идёт загрузка: вместо пунктов — строки-скелетоны, контейнер помечен `aria-busy`. */\n  loading?: boolean\n  /** Сколько строк-заглушек показать при `loading`. */\n  loadingRows?: number\n  /**\n   * Список пуст. По умолчанию определяется сам — по содержимому слота; проп\n   * нужен там, где потребитель знает лучше (например, слот заполнен\n   * заголовками групп, а данных в них нет).\n   */\n  empty?: boolean\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n  /**\n   * Данные списка. С ними пункты рисует слот `#item`, а не слот по умолчанию, —\n   * и только так список знает размер набора, то есть может его виртуализировать.\n   */\n  items?: TItem[]\n  /** Ключ пункта для `v-for`: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Высота видимой части: контейнер становится скроллером. Число — пиксели. */\n  maxHeight?: number | string\n  /** Держать в DOM только окно вокруг вьюпорта. Требует `items` и `maxHeight`. */\n  virtual?: boolean\n  /** Оценка высоты пункта до замера. Уточняется по факту при первом рендере. */\n  estimatedItemSize?: number\n}\n\nconst props = withDefaults(defineProps<GrListProps<T>>(), {\n  // Дефолт живёт в `GrCard` (и его резолвере `GrConfigProvider`), поэтому здесь\n  // остаётся `undefined` — иначе список перебивал бы настройку карточки.\n  variant: undefined,\n  divided: true,\n  loading: false,\n  loadingRows: 3,\n  empty: undefined,\n  emptyText: undefined,\n  items: undefined,\n  itemKey: undefined,\n  maxHeight: undefined,\n  virtual: false,\n  // Строка обычной плотности с заголовком и описанием.\n  estimatedItemSize: 56,\n})\n\nconst slots = useSlots()\nconst { t } = useGranularityTranslations()\n\nconst listEl = ref<HTMLElement | null>(null)\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.list.empty', 'Nothing here yet'))\n\nconst dataMode = computed(() => props.items !== undefined)\n\n// Пустоту видно по слоту: `v-for` по пустому массиву оставляет фрагмент без\n// узлов, `v-if` — комментарий, и ни то ни другое пунктом списка не является.\nconst isEmpty = computed(() => {\n  if (props.empty !== undefined)\n    return props.empty\n\n  if (dataMode.value)\n    return props.items!.length === 0\n\n  return !hasMeaningfulSlotContent(slots.default?.() ?? [])\n})\n\nconst showItems = computed(() => !props.loading && !isEmpty.value)\n\n// Разделители нужны только между пунктами: в пустой и загрузочной ветках они\n// оставили бы висящую линию.\nconst listClass = computed(() => (props.divided && showItems.value ? dividedClass : undefined))\n\nconst loadingRowCount = computed(() => Math.max(1, Math.trunc(props.loadingRows)))\n\nconst virtualEnabled = computed(() => props.virtual && dataMode.value && props.maxHeight !== undefined)\n\nconst virtualizer = useVirtualList({\n  container: listEl,\n  count: () => (virtualEnabled.value && showItems.value ? props.items!.length : 0),\n  // Замена массива сбрасывает замеры; append в тот же массив их сохраняет.\n  source: () => props.items,\n  itemSize: () => props.estimatedItemSize,\n  // Первый рендер обязан совпасть с серверным: контейнера ещё нет, и окно\n  // считается от объявленной высоты, а не от измеренной.\n  viewportSize: () => (typeof props.maxHeight === 'number' ? props.maxHeight : undefined),\n})\n\n/** Окно к отрисовке: при выключенной виртуализации — весь набор. */\nconst renderedItems = computed(() => {\n  const items = props.items ?? []\n  if (!virtualEnabled.value) return items.map((item, index) => ({ item, index }))\n\n  const { start, end } = virtualizer.range.value\n  return items.slice(start, end).map((item, offset) => ({ item, index: start + offset }))\n})\n\nfunction keyOf(item: T, index: number): string | number {\n  const key = props.itemKey\n  if (typeof key === 'function') return key(item, index)\n  if (typeof key === 'string') return (item as Record<string, unknown>)[key] as string | number\n\n  return index\n}\n\n/**\n * ARIA-набор для пункта.\n *\n * Только в виртуальном режиме: в DOM тогда неполный набор, и без этих атрибутов\n * диктор объявил бы «7 из 20» на списке в пять тысяч. Когда набор в DOM целиком,\n * его размер и позицию браузер считает сам, а руками проставленные атрибуты\n * начинают расходиться с разметкой при любой фильтрации.\n */\nfunction ariaOf(index: number): Record<string, number> {\n  if (!virtualEnabled.value) return {}\n\n  return { 'aria-setsize': props.items!.length, 'aria-posinset': index + 1 }\n}\n\nconst maxHeightStyle = computed(() => {\n  const value = props.maxHeight\n  if (value == null) return undefined\n  return typeof value === 'number' ? `${value}px` : value\n})\n\nconst listStyle = computed(() => {\n  if (props.maxHeight === undefined) return undefined\n\n  const scroller = { overflowY: 'auto' as const, maxHeight: maxHeightStyle.value }\n  if (!virtualEnabled.value) return scroller\n\n  return { ...scroller, ...virtualizer.spacerStyle.value }\n})\n\n/**\n * Замер отрисованных пунктов.\n *\n * Идёт по детям контейнера, а не по `ref` на элементе: пункт рисует слот\n * потребителя, привязать к нему `ref` неоткуда. В виртуальном режиме прямые\n * дети контейнера — ровно окно (распорки живут псевдоэлементами и детьми не\n * считаются), поэтому сопоставление по позиции однозначно.\n */\nfunction measureRendered(): void {\n  if (!virtualEnabled.value) return\n  // В состояниях loading/empty дети контейнера — скелетоны и заглушки: их\n  // высоты записались бы в замеры под индексами будущих строк данных.\n  if (!showItems.value) return\n\n  const container = listEl.value\n  if (!container) return\n\n  const { start } = virtualizer.range.value\n  const children = container.children\n  for (let offset = 0; offset < children.length; offset++) {\n    virtualizer.measure(start + offset, children[offset])\n  }\n}\n\nonMounted(measureRendered)\nonUpdated(measureRendered)\n\nfunction scrollToIndex(index: number, align?: GrVirtualAlign): void {\n  virtualizer.scrollToIndex(index, align)\n}\n\ndefineExpose({ scrollToIndex })\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [props.virtual, dataMode.value, props.maxHeight] as const,\n    ([virtual, hasItems, maxHeight]) => {\n      if (!virtual) return\n\n      if (!hasItems) {\n        console.warn(\n          '[granularity] GrList: `virtual` требует `items` — пункты из слота по умолчанию '\n          + 'список не считает и резать окно ему не из чего.',\n        )\n      }\n      else if (maxHeight === undefined) {\n        console.warn(\n          '[granularity] GrList: `virtual` требует `maxHeight` — без ограничения высоты '\n          + 'вьюпорта нет, и в окно попадает весь набор.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  watch(\n    () => [dataMode.value, Boolean(slots.item)] as const,\n    ([hasItems, hasSlot]) => {\n      if (hasItems && !hasSlot) {\n        console.warn(\n          '[granularity] GrList: с `items` пункты рисует слот `#item` — без него список пуст.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  onMounted(() => {\n    if (!virtualEnabled.value) return\n\n    const first = listEl.value?.firstElementChild\n    if (first && !first.hasAttribute('aria-posinset')) {\n      console.warn(\n        '[granularity] GrList: при `virtual` пункты обязаны нести `aria-setsize`/`aria-posinset` — '\n        + 'пробросьте `aria` из слота `#item`: <GrListItem v-bind=\"aria\" … />. Иначе диктор '\n        + 'посчитает набор по отрисованному окну.',\n      )\n    }\n  })\n}\n</script>\n\n<template>\n  <GrCard :variant=\"variant\">\n    <div\n      ref=\"listEl\"\n      data-gr-list\n      role=\"list\"\n      :class=\"listClass\"\n      :style=\"listStyle\"\n      :tabindex=\"maxHeight === undefined ? undefined : 0\"\n      :data-gr-virtual=\"virtualEnabled ? '' : undefined\"\n      :aria-busy=\"loading ? 'true' : undefined\"\n    >\n      <template v-if=\"loading\">\n        <slot name=\"loading\">\n          <div\n            v-for=\"row in loadingRowCount\"\n            :key=\"row\"\n            data-gr-list-loading-row\n            :class=\"loadingRowClass\"\n          >\n            <GrSkeleton />\n          </div>\n        </slot>\n      </template>\n\n      <div\n        v-else-if=\"isEmpty\"\n        data-gr-list-empty\n        :class=\"emptyClass\"\n      >\n        <slot name=\"empty\">\n          {{ resolvedEmptyText }}\n        </slot>\n      </div>\n\n      <template v-else-if=\"dataMode\">\n        <template\n          v-for=\"entry in renderedItems\"\n          :key=\"keyOf(entry.item, entry.index)\"\n        >\n          <slot\n            name=\"item\"\n            :item=\"entry.item\"\n            :index=\"entry.index\"\n            :aria=\"ariaOf(entry.index)\"\n          />\n        </template>\n      </template>\n\n      <slot v-else />\n    </div>\n  </GrCard>\n</template>\n\n<style scoped>\n/* Срезанное сверху и снизу держат псевдоэлементы контейнера: их не за что\n   размонтировать, в дереве доступности их нет, а высота приезжает переменными\n   в том же патче, что и пункты. Почему не отступы контейнера и не поля крайних\n   пунктов — `docs/virtual-list.md`. */\n[data-gr-virtual]::before,\n[data-gr-virtual]::after {\n    content: '';\n    display: block;\n    flex: none;\n}\n\n[data-gr-virtual]::before {\n    height: var(--gr-virtual-before, 0px);\n}\n\n[data-gr-virtual]::after {\n    height: var(--gr-virtual-after, 0px);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, markRaw, useSlots, watch, type Component } from 'vue'\n\nimport {\n  grListItemPaddingClass,\n  itemDescriptionClass,\n  itemDisabledClass,\n  itemHoverClass,\n  itemInteractiveClass,\n  itemLayoutClass,\n  itemTitleClass,\n  type GrListItemDensity,\n} from './grListStyles'\n\nexport type { GrListItemDensity } from './grListStyles'\n\nexport interface GrListItemProps {\n  /** Заголовок строки. Если передан слот `#title`, проп игнорируется. */\n  title?: string\n  /** Описание под заголовком. Если передан слот `#description`, проп игнорируется. */\n  description?: string\n  /** Плотность вертикальных отступов: `regular` — 12px, `compact` — 8px. */\n  density?: GrListItemDensity\n  /** Ссылка: строка становится `<a>`. */\n  href?: string\n  /** Свой корневой тег строки (`RouterLink`, `Link` от Inertia). Сильнее `href`. */\n  as?: string | Component\n  /** Кликабельная строка без ссылки — `<button>` с событием `click`. */\n  clickable?: boolean\n  /** Подсветка при наведении без интерактивности. */\n  hoverable?: boolean\n  disabled?: boolean\n}\n\nexport interface GrListItemEmits {\n  (e: 'click', event: MouseEvent): void\n}\n\nconst props = withDefaults(defineProps<GrListItemProps>(), {\n  title: undefined,\n  description: undefined,\n  density: 'regular',\n  href: undefined,\n  as: undefined,\n  clickable: false,\n  hoverable: false,\n  disabled: false,\n})\n\nconst emit = defineEmits<GrListItemEmits>()\n\nconst slots = useSlots()\n\nconst hasTitle = computed(() => !!slots.title || !!props.title)\nconst hasDescription = computed(() => !!slots.description || !!props.description)\n\nconst isInteractive = computed(() => !props.disabled && (!!props.as || !!props.href || props.clickable))\n\n/**\n * `role=\"listitem\"` остаётся на обёртке, а строка целиком — вложенный элемент:\n * `<a role=\"listitem\">` потерял бы роль ссылки, а интерактив снаружи разорвал бы\n * связку `list` → `listitem`. Обычная строка идёт по той же схеме, чтобы\n * разметка содержимого была написана один раз, а не по копии на ветку.\n */\nconst rowTag = computed<string | Component>(() => {\n  if (!isInteractive.value)\n    return 'div'\n\n  if (props.as)\n    return typeof props.as === 'string' ? props.as : markRaw(props.as)\n\n  return props.href ? 'a' : 'button'\n})\n\nconst rowClass = computed(() => [\n  itemLayoutClass,\n  grListItemPaddingClass(props.density),\n  isInteractive.value ? `${itemInteractiveClass} ${itemHoverClass}` : '',\n  !isInteractive.value && props.hoverable && !props.disabled ? itemHoverClass : '',\n  props.disabled ? itemDisabledClass : '',\n].filter(Boolean).join(' '))\n\nfunction onClick(event: MouseEvent): void {\n  // `disabled` сюда попадает вместе с обычной строкой: и то и другое —\n  // не-интерактив, а кликов не эмитит ни один.\n  if (!isInteractive.value)\n    return\n\n  emit('click', event)\n}\n\n/** Теги, попадающие в таб-порядок сами. `<a>` — только со ссылкой. */\nfunction isFocusableTag(tag: string): boolean {\n  return tag === 'button' || (tag === 'a' && !!props.href)\n}\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [isInteractive.value, props.as] as const,\n    ([interactive, as]) => {\n      // Компонент из `as` (`RouterLink`, Inertia `Link`) рендерит `<a>`, но узнать\n      // это до рендера нельзя — предупреждаем только по явно названному тегу.\n      if (!interactive || typeof as !== 'string' || isFocusableTag(as)) return\n\n      console.warn(\n        `[granularity] GrListItem: as=\"${as}\" не попадает в таб-порядок — строка кликается `\n        + 'мышью, но не с клавиатуры. Возьмите тег, умеющий фокус (`button`, `a` со ссылкой), '\n        + 'или компонент роутера.',\n      )\n    },\n    { immediate: true },\n  )\n}\n</script>\n\n<template>\n  <div\n    data-gr-list-item\n    role=\"listitem\"\n    :aria-disabled=\"disabled ? 'true' : undefined\"\n  >\n    <component\n      :is=\"rowTag\"\n      :data-gr-list-item-action=\"isInteractive ? '' : undefined\"\n      :type=\"rowTag === 'button' ? 'button' : undefined\"\n      :href=\"isInteractive ? href : undefined\"\n      :class=\"rowClass\"\n      @click=\"onClick\"\n    >\n      <div v-if=\"$slots.prefix\" class=\"shrink-0\">\n        <slot name=\"prefix\" />\n      </div>\n      <div class=\"min-w-0 flex-1\">\n        <div v-if=\"hasTitle\" :class=\"itemTitleClass\">\n          <slot name=\"title\">\n{{ title }}\n</slot>\n        </div>\n        <div\n          v-if=\"hasDescription\"\n          :class=\"itemDescriptionClass\"\n        >\n          <slot name=\"description\">\n{{ description }}\n</slot>\n        </div>\n      </div>\n      <div v-if=\"$slots.default\" class=\"shrink-0\">\n        <slot />\n      </div>\n    </component>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, markRaw, useSlots, watch, type Component } from 'vue'\n\nimport {\n  grListItemPaddingClass,\n  itemDescriptionClass,\n  itemDisabledClass,\n  itemHoverClass,\n  itemInteractiveClass,\n  itemLayoutClass,\n  itemTitleClass,\n  type GrListItemDensity,\n} from './grListStyles'\n\nexport type { GrListItemDensity } from './grListStyles'\n\nexport interface GrListItemProps {\n  /** Заголовок строки. Если передан слот `#title`, проп игнорируется. */\n  title?: string\n  /** Описание под заголовком. Если передан слот `#description`, проп игнорируется. */\n  description?: string\n  /** Плотность вертикальных отступов: `regular` — 12px, `compact` — 8px. */\n  density?: GrListItemDensity\n  /** Ссылка: строка становится `<a>`. */\n  href?: string\n  /** Свой корневой тег строки (`RouterLink`, `Link` от Inertia). Сильнее `href`. */\n  as?: string | Component\n  /** Кликабельная строка без ссылки — `<button>` с событием `click`. */\n  clickable?: boolean\n  /** Подсветка при наведении без интерактивности. */\n  hoverable?: boolean\n  disabled?: boolean\n}\n\nexport interface GrListItemEmits {\n  (e: 'click', event: MouseEvent): void\n}\n\nconst props = withDefaults(defineProps<GrListItemProps>(), {\n  title: undefined,\n  description: undefined,\n  density: 'regular',\n  href: undefined,\n  as: undefined,\n  clickable: false,\n  hoverable: false,\n  disabled: false,\n})\n\nconst emit = defineEmits<GrListItemEmits>()\n\nconst slots = useSlots()\n\nconst hasTitle = computed(() => !!slots.title || !!props.title)\nconst hasDescription = computed(() => !!slots.description || !!props.description)\n\nconst isInteractive = computed(() => !props.disabled && (!!props.as || !!props.href || props.clickable))\n\n/**\n * `role=\"listitem\"` остаётся на обёртке, а строка целиком — вложенный элемент:\n * `<a role=\"listitem\">` потерял бы роль ссылки, а интерактив снаружи разорвал бы\n * связку `list` → `listitem`. Обычная строка идёт по той же схеме, чтобы\n * разметка содержимого была написана один раз, а не по копии на ветку.\n */\nconst rowTag = computed<string | Component>(() => {\n  if (!isInteractive.value)\n    return 'div'\n\n  if (props.as)\n    return typeof props.as === 'string' ? props.as : markRaw(props.as)\n\n  return props.href ? 'a' : 'button'\n})\n\nconst rowClass = computed(() => [\n  itemLayoutClass,\n  grListItemPaddingClass(props.density),\n  isInteractive.value ? `${itemInteractiveClass} ${itemHoverClass}` : '',\n  !isInteractive.value && props.hoverable && !props.disabled ? itemHoverClass : '',\n  props.disabled ? itemDisabledClass : '',\n].filter(Boolean).join(' '))\n\nfunction onClick(event: MouseEvent): void {\n  // `disabled` сюда попадает вместе с обычной строкой: и то и другое —\n  // не-интерактив, а кликов не эмитит ни один.\n  if (!isInteractive.value)\n    return\n\n  emit('click', event)\n}\n\n/** Теги, попадающие в таб-порядок сами. `<a>` — только со ссылкой. */\nfunction isFocusableTag(tag: string): boolean {\n  return tag === 'button' || (tag === 'a' && !!props.href)\n}\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [isInteractive.value, props.as] as const,\n    ([interactive, as]) => {\n      // Компонент из `as` (`RouterLink`, Inertia `Link`) рендерит `<a>`, но узнать\n      // это до рендера нельзя — предупреждаем только по явно названному тегу.\n      if (!interactive || typeof as !== 'string' || isFocusableTag(as)) return\n\n      console.warn(\n        `[granularity] GrListItem: as=\"${as}\" не попадает в таб-порядок — строка кликается `\n        + 'мышью, но не с клавиатуры. Возьмите тег, умеющий фокус (`button`, `a` со ссылкой), '\n        + 'или компонент роутера.',\n      )\n    },\n    { immediate: true },\n  )\n}\n</script>\n\n<template>\n  <div\n    data-gr-list-item\n    role=\"listitem\"\n    :aria-disabled=\"disabled ? 'true' : undefined\"\n  >\n    <component\n      :is=\"rowTag\"\n      :data-gr-list-item-action=\"isInteractive ? '' : undefined\"\n      :type=\"rowTag === 'button' ? 'button' : undefined\"\n      :href=\"isInteractive ? href : undefined\"\n      :class=\"rowClass\"\n      @click=\"onClick\"\n    >\n      <div v-if=\"$slots.prefix\" class=\"shrink-0\">\n        <slot name=\"prefix\" />\n      </div>\n      <div class=\"min-w-0 flex-1\">\n        <div v-if=\"hasTitle\" :class=\"itemTitleClass\">\n          <slot name=\"title\">\n{{ title }}\n</slot>\n        </div>\n        <div\n          v-if=\"hasDescription\"\n          :class=\"itemDescriptionClass\"\n        >\n          <slot name=\"description\">\n{{ description }}\n</slot>\n        </div>\n      </div>\n      <div v-if=\"$slots.default\" class=\"shrink-0\">\n        <slot />\n      </div>\n    </component>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+CA,MAAM,QAAQ;EAiBd,MAAM,QAAQ,SAAS;EACvB,MAAM,EAAE,MAAM,2BAA2B;EAEzC,MAAM,SAAS,IAAwB,IAAI;EAE3C,MAAM,oBAAoB,eAAe,MAAM,aAAa,EAAE,iBAAiB,kBAAkB,CAAC;EAElG,MAAM,WAAW,eAAe,MAAM,UAAU,KAAA,CAAS;EAIzD,MAAM,UAAU,eAAe;GAC7B,IAAI,MAAM,UAAU,KAAA,GAClB,OAAO,MAAM;GAEf,IAAI,SAAS,OACX,OAAO,MAAM,MAAO,WAAW;GAEjC,OAAO,CAAC,yBAAyB,MAAM,UAAU,KAAK,CAAC,CAAC;EAC1D,CAAC;EAED,MAAM,YAAY,eAAe,CAAC,MAAM,WAAW,CAAC,QAAQ,KAAK;EAIjE,MAAM,YAAY,eAAgB,MAAM,WAAW,UAAU,QAAQ,eAAe,KAAA,CAAU;EAE9F,MAAM,kBAAkB,eAAe,KAAK,IAAI,GAAG,KAAK,MAAM,MAAM,WAAW,CAAC,CAAC;EAEjF,MAAM,iBAAiB,eAAe,MAAM,WAAW,SAAS,SAAS,MAAM,cAAc,KAAA,CAAS;EAEtG,MAAM,cAAc,eAAe;GACjC,WAAW;GACX,aAAc,eAAe,SAAS,UAAU,QAAQ,MAAM,MAAO,SAAS;GAE9E,cAAc,MAAM;GACpB,gBAAgB,MAAM;GAGtB,oBAAqB,OAAO,MAAM,cAAc,WAAW,MAAM,YAAY,KAAA;EAC/E,CAAC;;EAGD,MAAM,gBAAgB,eAAe;GACnC,MAAM,QAAQ,MAAM,SAAS,CAAC;GAC9B,IAAI,CAAC,eAAe,OAAO,OAAO,MAAM,KAAK,MAAM,WAAW;IAAE;IAAM;GAAM,EAAE;GAE9E,MAAM,EAAE,OAAO,QAAQ,YAAY,MAAM;GACzC,OAAO,MAAM,MAAM,OAAO,GAAG,CAAC,CAAC,KAAK,MAAM,YAAY;IAAE;IAAM,OAAO,QAAQ;GAAO,EAAE;EACxF,CAAC;EAED,SAAS,MAAM,MAAS,OAAgC;GACtD,MAAM,MAAM,MAAM;GAClB,IAAI,OAAO,QAAQ,YAAY,OAAO,IAAI,MAAM,KAAK;GACrD,IAAI,OAAO,QAAQ,UAAU,OAAQ,KAAiC;GAEtE,OAAO;EACT;;;;;;;;;EAUA,SAAS,OAAO,OAAuC;GACrD,IAAI,CAAC,eAAe,OAAO,OAAO,CAAC;GAEnC,OAAO;IAAE,gBAAgB,MAAM,MAAO;IAAQ,iBAAiB,QAAQ;GAAE;EAC3E;EAEA,MAAM,iBAAiB,eAAe;GACpC,MAAM,QAAQ,MAAM;GACpB,IAAI,SAAS,MAAM,OAAO,KAAA;GAC1B,OAAO,OAAO,UAAU,WAAW,GAAG,MAAM,MAAM;EACpD,CAAC;EAED,MAAM,YAAY,eAAe;GAC/B,IAAI,MAAM,cAAc,KAAA,GAAW,OAAO,KAAA;GAE1C,MAAM,WAAW;IAAE,WAAW;IAAiB,WAAW,eAAe;GAAM;GAC/E,IAAI,CAAC,eAAe,OAAO,OAAO;GAElC,OAAO;IAAE,GAAG;IAAU,GAAG,YAAY,YAAY;GAAM;EACzD,CAAC;;;;;;;;;EAUD,SAAS,kBAAwB;GAC/B,IAAI,CAAC,eAAe,OAAO;GAG3B,IAAI,CAAC,UAAU,OAAO;GAEtB,MAAM,YAAY,OAAO;GACzB,IAAI,CAAC,WAAW;GAEhB,MAAM,EAAE,UAAU,YAAY,MAAM;GACpC,MAAM,WAAW,UAAU;GAC3B,KAAK,IAAI,SAAS,GAAG,SAAS,SAAS,QAAQ,UAC7C,YAAY,QAAQ,QAAQ,QAAQ,SAAS,OAAO;EAExD;EAEA,UAAU,eAAe;EACzB,UAAU,eAAe;EAEzB,SAAS,cAAc,OAAe,OAA8B;GAClE,YAAY,cAAc,OAAO,KAAK;EACxC;EAEA,SAAa,EAAE,cAAc,CAAC;;uBAoD5B,YAkDS,MAAA,cAAA,GAAA,EAlDA,SAAS,QAAA,QAAO,GAAA;2BAiDjB,CAhDN,mBAgDM,OAAA;cA/CA;KAAJ,KAAI;KACJ,gBAAA;KACA,MAAK;KACJ,OAAK,eAAE,UAAA,KAAS;KAChB,OAAK,eAAE,UAAA,KAAS;KAChB,UAAU,QAAA,cAAc,KAAA,IAAY,KAAA,IAAS;KAC7C,mBAAiB,eAAA,QAAc,KAAQ,KAAA;KACvC,aAAW,QAAA,UAAO,SAAY,KAAA;QAEf,QAAA,UACd,WASO,KAAA,QAAA,WAAA,CAAA,SAAA,EAAA,UAAA,IAAA,GARL,mBAOM,UAAA,MAAA,WANU,gBAAA,QAAP,QAAG;yBADZ,mBAOM,OAAA;MALH,KAAK;MACN,4BAAA;MACC,OAAK,eAAE,MAAA,eAAA,CAAe;SAEvB,YAAc,kBAAA,CAAA,GAAA,CAAA;2BAMP,QAAA,SAAA,UAAA,GADb,mBAQM,OAAA;;KANJ,sBAAA;KACC,OAAK,eAAE,MAAA,UAAA,CAAU;QAElB,WAEO,KAAA,QAAA,SAAA,CAAA,SAAA,CAAA,gBAAA,gBADF,kBAAA,KAAiB,GAAA,CAAA,CAAA,GAAA,IAAA,CAAA,GAAA,CAAA,KAIH,SAAA,SAAA,UAAA,IAAA,GACnB,mBAUW,UAAA,EAAA,KAAA,EAAA,GAAA,WATO,cAAA,QAAT,UAAK;YAGZ,WAKE,KAAA,QAAA,QAAA;MAHC,MAAM,MAAM;MACZ,OAAO,MAAM;MACb,MAAM,OAAO,MAAM,KAAK;sBANrB,MAAM,MAAM,MAAM,MAAM,KAAK,CAAA;gBAWvC,WAAe,KAAA,QAAA,WAAA,CAAA,GAAA,KAAA,GAAA,MAAA,CAAA,CAAA,GAAA,IAAA,YAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EErPrB,MAAM,QAAQ;EAWd,MAAM,OAAO;EAEb,MAAM,QAAQ,SAAS;EAEvB,MAAM,WAAW,eAAe,CAAC,CAAC,MAAM,SAAS,CAAC,CAAC,MAAM,KAAK;EAC9D,MAAM,iBAAiB,eAAe,CAAC,CAAC,MAAM,eAAe,CAAC,CAAC,MAAM,WAAW;EAEhF,MAAM,gBAAgB,eAAe,CAAC,MAAM,aAAa,CAAC,CAAC,MAAM,MAAM,CAAC,CAAC,MAAM,QAAQ,MAAM,UAAU;;;;;;;EAQvG,MAAM,SAAS,eAAmC;GAChD,IAAI,CAAC,cAAc,OACjB,OAAO;GAET,IAAI,MAAM,IACR,OAAO,OAAO,MAAM,OAAO,WAAW,MAAM,KAAK,QAAQ,MAAM,EAAE;GAEnE,OAAO,MAAM,OAAO,MAAM;EAC5B,CAAC;EAED,MAAM,WAAW,eAAe;GAC9B;GACA,uBAAuB,MAAM,OAAO;GACpC,cAAc,QAAQ,GAAG,qBAAqB,GAAG,mBAAmB;GACpE,CAAC,cAAc,SAAS,MAAM,aAAa,CAAC,MAAM,WAAW,iBAAiB;GAC9E,MAAM,WAAW,oBAAoB;EACvC,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,CAAC;EAE3B,SAAS,QAAQ,OAAyB;GAGxC,IAAI,CAAC,cAAc,OACjB;GAEF,KAAK,SAAS,KAAK;EACrB;;uBA2BE,mBAmCM,OAAA;IAlCJ,qBAAA;IACA,MAAK;IACJ,iBAAe,QAAA,WAAQ,SAAY,KAAA;qBAEpC,YA6BY,wBA5BL,OAAA,KAAM,GAAA;IACV,4BAA0B,cAAA,QAAa,KAAQ,KAAA;IAC/C,MAAM,OAAA,UAAM,WAAA,WAA2B,KAAA;IACvC,MAAM,cAAA,QAAgB,QAAA,OAAO,KAAA;IAC7B,OAAK,eAAE,SAAA,KAAQ;IACR;;2BAIF;KAFKA,KAAAA,OAAO,UAAA,UAAA,GAAlB,mBAEM,OAFN,YAEM,CADJ,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;KAExB,mBAcM,OAdN,YAcM,CAbO,SAAA,SAAA,UAAA,GAAX,mBAIM,OAAA;;MAJgB,OAAK,eAAE,MAAA,cAAA,CAAc;SACzC,WAEH,KAAA,QAAA,SAAA,CAAA,SAAA,CAAA,gBAAA,gBADJ,QAAA,KAAK,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAIQ,eAAA,SAAA,UAAA,GADR,mBAOM,OAAA;;MALH,OAAK,eAAE,MAAA,oBAAA,CAAoB;SAE5B,WAEH,KAAA,QAAA,eAAA,CAAA,SAAA,CAAA,gBAAA,gBADJ,QAAA,WAAW,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA;KAIGA,KAAAA,OAAO,WAAA,UAAA,GAAlB,mBAEM,OAFN,YAEM,CADJ,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA"}
+{"version":3,"file":"GrList-BUzFRa8-.js","names":["$slots"],"sources":["../../../../src/components/GrList/GrList.vue","../../../../src/components/GrList/GrList.vue","../../../../src/components/GrList/GrListItem.vue","../../../../src/components/GrList/GrListItem.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T = unknown\">\nimport { computed, onMounted, onUpdated, ref, useSlots, watch } from 'vue'\n\nimport GrCard from '../GrCard'\nimport type { GrCardVariant } from '../GrCard/grCardStyles'\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { hasMeaningfulSlotContent } from '../shared/slotNodes'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useVirtualList, type GrVirtualAlign } from '../../composables/useVirtualList'\n\nimport { dividedClass, emptyClass, loadingRowClass } from './grListStyles'\n\nexport interface GrListProps<TItem = unknown> {\n  /**\n   * Поверхность списка — вариант карточки под ним. `ghost` убирает рамку и\n   * тень: список внутри уже существующей карточки не должен давать вторую.\n   */\n  variant?: GrCardVariant\n  /** Показывать ли горизонтальные разделители между элементами (по умолчанию — да). */\n  divided?: boolean\n  /** Идёт загрузка: вместо пунктов — строки-скелетоны, контейнер помечен `aria-busy`. */\n  loading?: boolean\n  /** Сколько строк-заглушек показать при `loading`. */\n  loadingRows?: number\n  /**\n   * Список пуст. По умолчанию определяется сам — по содержимому слота; проп\n   * нужен там, где потребитель знает лучше (например, слот заполнен\n   * заголовками групп, а данных в них нет).\n   */\n  empty?: boolean\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n  /**\n   * Данные списка. С ними пункты рисует слот `#item`, а не слот по умолчанию, —\n   * и только так список знает размер набора, то есть может его виртуализировать.\n   */\n  items?: TItem[]\n  /** Ключ пункта для `v-for`: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Высота видимой части: контейнер становится скроллером. Число — пиксели. */\n  maxHeight?: number | string\n  /** Держать в DOM только окно вокруг вьюпорта. Требует `items` и `maxHeight`. */\n  virtual?: boolean\n  /** Оценка высоты пункта до замера. Уточняется по факту при первом рендере. */\n  estimatedItemSize?: number\n}\n\nconst props = withDefaults(defineProps<GrListProps<T>>(), {\n  // Дефолт живёт в `GrCard` (и его резолвере `GrConfigProvider`), поэтому здесь\n  // остаётся `undefined` — иначе список перебивал бы настройку карточки.\n  variant: undefined,\n  divided: true,\n  loading: false,\n  loadingRows: 3,\n  empty: undefined,\n  emptyText: undefined,\n  items: undefined,\n  itemKey: undefined,\n  maxHeight: undefined,\n  virtual: false,\n  // Строка обычной плотности с заголовком и описанием.\n  estimatedItemSize: 56,\n})\n\nconst slots = useSlots()\nconst { t } = useGranularityTranslations()\n\nconst listEl = ref<HTMLElement | null>(null)\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.list.empty', 'Nothing here yet'))\n\nconst dataMode = computed(() => props.items !== undefined)\n\n// Пустоту видно по слоту: `v-for` по пустому массиву оставляет фрагмент без\n// узлов, `v-if` — комментарий, и ни то ни другое пунктом списка не является.\nconst isEmpty = computed(() => {\n  if (props.empty !== undefined)\n    return props.empty\n\n  if (dataMode.value)\n    return props.items!.length === 0\n\n  return !hasMeaningfulSlotContent(slots.default?.() ?? [])\n})\n\nconst showItems = computed(() => !props.loading && !isEmpty.value)\n\n// Разделители нужны только между пунктами: в пустой и загрузочной ветках они\n// оставили бы висящую линию.\nconst listClass = computed(() => (props.divided && showItems.value ? dividedClass : undefined))\n\nconst loadingRowCount = computed(() => Math.max(1, Math.trunc(props.loadingRows)))\n\nconst virtualEnabled = computed(() => props.virtual && dataMode.value && props.maxHeight !== undefined)\n\nconst virtualizer = useVirtualList({\n  container: listEl,\n  count: () => (virtualEnabled.value && showItems.value ? props.items!.length : 0),\n  // Замена массива сбрасывает замеры; append в тот же массив их сохраняет.\n  source: () => props.items,\n  itemSize: () => props.estimatedItemSize,\n  // Первый рендер обязан совпасть с серверным: контейнера ещё нет, и окно\n  // считается от объявленной высоты, а не от измеренной.\n  viewportSize: () => (typeof props.maxHeight === 'number' ? props.maxHeight : undefined),\n})\n\n/** Окно к отрисовке: при выключенной виртуализации — весь набор. */\nconst renderedItems = computed(() => {\n  const items = props.items ?? []\n  if (!virtualEnabled.value) return items.map((item, index) => ({ item, index }))\n\n  const { start, end } = virtualizer.range.value\n  return items.slice(start, end).map((item, offset) => ({ item, index: start + offset }))\n})\n\nfunction keyOf(item: T, index: number): string | number {\n  const key = props.itemKey\n  if (typeof key === 'function') return key(item, index)\n  if (typeof key === 'string') return (item as Record<string, unknown>)[key] as string | number\n\n  return index\n}\n\n/**\n * ARIA-набор для пункта.\n *\n * Только в виртуальном режиме: в DOM тогда неполный набор, и без этих атрибутов\n * диктор объявил бы «7 из 20» на списке в пять тысяч. Когда набор в DOM целиком,\n * его размер и позицию браузер считает сам, а руками проставленные атрибуты\n * начинают расходиться с разметкой при любой фильтрации.\n */\nfunction ariaOf(index: number): Record<string, number> {\n  if (!virtualEnabled.value) return {}\n\n  return { 'aria-setsize': props.items!.length, 'aria-posinset': index + 1 }\n}\n\nconst maxHeightStyle = computed(() => {\n  const value = props.maxHeight\n  if (value == null) return undefined\n  return typeof value === 'number' ? `${value}px` : value\n})\n\nconst listStyle = computed(() => {\n  if (props.maxHeight === undefined) return undefined\n\n  const scroller = { overflowY: 'auto' as const, maxHeight: maxHeightStyle.value }\n  if (!virtualEnabled.value) return scroller\n\n  return { ...scroller, ...virtualizer.spacerStyle.value }\n})\n\n/**\n * Замер отрисованных пунктов.\n *\n * Идёт по детям контейнера, а не по `ref` на элементе: пункт рисует слот\n * потребителя, привязать к нему `ref` неоткуда. В виртуальном режиме прямые\n * дети контейнера — ровно окно (распорки живут псевдоэлементами и детьми не\n * считаются), поэтому сопоставление по позиции однозначно.\n */\nfunction measureRendered(): void {\n  if (!virtualEnabled.value) return\n  // В состояниях loading/empty дети контейнера — скелетоны и заглушки: их\n  // высоты записались бы в замеры под индексами будущих строк данных.\n  if (!showItems.value) return\n\n  const container = listEl.value\n  if (!container) return\n\n  const { start } = virtualizer.range.value\n  const children = container.children\n  for (let offset = 0; offset < children.length; offset++) {\n    virtualizer.measure(start + offset, children[offset])\n  }\n}\n\nonMounted(measureRendered)\nonUpdated(measureRendered)\n\nfunction scrollToIndex(index: number, align?: GrVirtualAlign): void {\n  virtualizer.scrollToIndex(index, align)\n}\n\ndefineExpose({ scrollToIndex })\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [props.virtual, dataMode.value, props.maxHeight] as const,\n    ([virtual, hasItems, maxHeight]) => {\n      if (!virtual) return\n\n      if (!hasItems) {\n        console.warn(\n          '[granularity] GrList: `virtual` требует `items` — пункты из слота по умолчанию '\n          + 'список не считает и резать окно ему не из чего.',\n        )\n      }\n      else if (maxHeight === undefined) {\n        console.warn(\n          '[granularity] GrList: `virtual` требует `maxHeight` — без ограничения высоты '\n          + 'вьюпорта нет, и в окно попадает весь набор.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  watch(\n    () => [dataMode.value, Boolean(slots.item)] as const,\n    ([hasItems, hasSlot]) => {\n      if (hasItems && !hasSlot) {\n        console.warn(\n          '[granularity] GrList: с `items` пункты рисует слот `#item` — без него список пуст.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  onMounted(() => {\n    if (!virtualEnabled.value) return\n\n    const first = listEl.value?.firstElementChild\n    if (first && !first.hasAttribute('aria-posinset')) {\n      console.warn(\n        '[granularity] GrList: при `virtual` пункты обязаны нести `aria-setsize`/`aria-posinset` — '\n        + 'пробросьте `aria` из слота `#item`: <GrListItem v-bind=\"aria\" … />. Иначе диктор '\n        + 'посчитает набор по отрисованному окну.',\n      )\n    }\n  })\n}\n</script>\n\n<template>\n  <GrCard :variant=\"variant\">\n    <div\n      ref=\"listEl\"\n      data-gr-list\n      role=\"list\"\n      :class=\"listClass\"\n      :style=\"listStyle\"\n      :tabindex=\"maxHeight === undefined ? undefined : 0\"\n      :data-gr-virtual=\"virtualEnabled ? '' : undefined\"\n      :aria-busy=\"loading ? 'true' : undefined\"\n    >\n      <template v-if=\"loading\">\n        <slot name=\"loading\">\n          <div\n            v-for=\"row in loadingRowCount\"\n            :key=\"row\"\n            data-gr-list-loading-row\n            :class=\"loadingRowClass\"\n          >\n            <GrSkeleton />\n          </div>\n        </slot>\n      </template>\n\n      <div\n        v-else-if=\"isEmpty\"\n        data-gr-list-empty\n        :class=\"emptyClass\"\n      >\n        <slot name=\"empty\">\n          {{ resolvedEmptyText }}\n        </slot>\n      </div>\n\n      <template v-else-if=\"dataMode\">\n        <template\n          v-for=\"entry in renderedItems\"\n          :key=\"keyOf(entry.item, entry.index)\"\n        >\n          <slot\n            name=\"item\"\n            :item=\"entry.item\"\n            :index=\"entry.index\"\n            :aria=\"ariaOf(entry.index)\"\n          />\n        </template>\n      </template>\n\n      <slot v-else />\n    </div>\n  </GrCard>\n</template>\n\n<style scoped>\n/* Срезанное сверху и снизу держат псевдоэлементы контейнера: их не за что\n   размонтировать, в дереве доступности их нет, а высота приезжает переменными\n   в том же патче, что и пункты. Почему не отступы контейнера и не поля крайних\n   пунктов — `docs/virtual-list.md`. */\n[data-gr-virtual]::before,\n[data-gr-virtual]::after {\n    content: '';\n    display: block;\n    flex: none;\n}\n\n[data-gr-virtual]::before {\n    height: var(--gr-virtual-before, 0px);\n}\n\n[data-gr-virtual]::after {\n    height: var(--gr-virtual-after, 0px);\n}\n</style>\n","<script setup lang=\"ts\" generic=\"T = unknown\">\nimport { computed, onMounted, onUpdated, ref, useSlots, watch } from 'vue'\n\nimport GrCard from '../GrCard'\nimport type { GrCardVariant } from '../GrCard/grCardStyles'\nimport GrSkeleton from '../GrSkeleton/GrSkeleton.vue'\nimport { hasMeaningfulSlotContent } from '../shared/slotNodes'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useVirtualList, type GrVirtualAlign } from '../../composables/useVirtualList'\n\nimport { dividedClass, emptyClass, loadingRowClass } from './grListStyles'\n\nexport interface GrListProps<TItem = unknown> {\n  /**\n   * Поверхность списка — вариант карточки под ним. `ghost` убирает рамку и\n   * тень: список внутри уже существующей карточки не должен давать вторую.\n   */\n  variant?: GrCardVariant\n  /** Показывать ли горизонтальные разделители между элементами (по умолчанию — да). */\n  divided?: boolean\n  /** Идёт загрузка: вместо пунктов — строки-скелетоны, контейнер помечен `aria-busy`. */\n  loading?: boolean\n  /** Сколько строк-заглушек показать при `loading`. */\n  loadingRows?: number\n  /**\n   * Список пуст. По умолчанию определяется сам — по содержимому слота; проп\n   * нужен там, где потребитель знает лучше (например, слот заполнен\n   * заголовками групп, а данных в них нет).\n   */\n  empty?: boolean\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n  /**\n   * Данные списка. С ними пункты рисует слот `#item`, а не слот по умолчанию, —\n   * и только так список знает размер набора, то есть может его виртуализировать.\n   */\n  items?: TItem[]\n  /** Ключ пункта для `v-for`: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Высота видимой части: контейнер становится скроллером. Число — пиксели. */\n  maxHeight?: number | string\n  /** Держать в DOM только окно вокруг вьюпорта. Требует `items` и `maxHeight`. */\n  virtual?: boolean\n  /** Оценка высоты пункта до замера. Уточняется по факту при первом рендере. */\n  estimatedItemSize?: number\n}\n\nconst props = withDefaults(defineProps<GrListProps<T>>(), {\n  // Дефолт живёт в `GrCard` (и его резолвере `GrConfigProvider`), поэтому здесь\n  // остаётся `undefined` — иначе список перебивал бы настройку карточки.\n  variant: undefined,\n  divided: true,\n  loading: false,\n  loadingRows: 3,\n  empty: undefined,\n  emptyText: undefined,\n  items: undefined,\n  itemKey: undefined,\n  maxHeight: undefined,\n  virtual: false,\n  // Строка обычной плотности с заголовком и описанием.\n  estimatedItemSize: 56,\n})\n\nconst slots = useSlots()\nconst { t } = useGranularityTranslations()\n\nconst listEl = ref<HTMLElement | null>(null)\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.list.empty', 'Nothing here yet'))\n\nconst dataMode = computed(() => props.items !== undefined)\n\n// Пустоту видно по слоту: `v-for` по пустому массиву оставляет фрагмент без\n// узлов, `v-if` — комментарий, и ни то ни другое пунктом списка не является.\nconst isEmpty = computed(() => {\n  if (props.empty !== undefined)\n    return props.empty\n\n  if (dataMode.value)\n    return props.items!.length === 0\n\n  return !hasMeaningfulSlotContent(slots.default?.() ?? [])\n})\n\nconst showItems = computed(() => !props.loading && !isEmpty.value)\n\n// Разделители нужны только между пунктами: в пустой и загрузочной ветках они\n// оставили бы висящую линию.\nconst listClass = computed(() => (props.divided && showItems.value ? dividedClass : undefined))\n\nconst loadingRowCount = computed(() => Math.max(1, Math.trunc(props.loadingRows)))\n\nconst virtualEnabled = computed(() => props.virtual && dataMode.value && props.maxHeight !== undefined)\n\nconst virtualizer = useVirtualList({\n  container: listEl,\n  count: () => (virtualEnabled.value && showItems.value ? props.items!.length : 0),\n  // Замена массива сбрасывает замеры; append в тот же массив их сохраняет.\n  source: () => props.items,\n  itemSize: () => props.estimatedItemSize,\n  // Первый рендер обязан совпасть с серверным: контейнера ещё нет, и окно\n  // считается от объявленной высоты, а не от измеренной.\n  viewportSize: () => (typeof props.maxHeight === 'number' ? props.maxHeight : undefined),\n})\n\n/** Окно к отрисовке: при выключенной виртуализации — весь набор. */\nconst renderedItems = computed(() => {\n  const items = props.items ?? []\n  if (!virtualEnabled.value) return items.map((item, index) => ({ item, index }))\n\n  const { start, end } = virtualizer.range.value\n  return items.slice(start, end).map((item, offset) => ({ item, index: start + offset }))\n})\n\nfunction keyOf(item: T, index: number): string | number {\n  const key = props.itemKey\n  if (typeof key === 'function') return key(item, index)\n  if (typeof key === 'string') return (item as Record<string, unknown>)[key] as string | number\n\n  return index\n}\n\n/**\n * ARIA-набор для пункта.\n *\n * Только в виртуальном режиме: в DOM тогда неполный набор, и без этих атрибутов\n * диктор объявил бы «7 из 20» на списке в пять тысяч. Когда набор в DOM целиком,\n * его размер и позицию браузер считает сам, а руками проставленные атрибуты\n * начинают расходиться с разметкой при любой фильтрации.\n */\nfunction ariaOf(index: number): Record<string, number> {\n  if (!virtualEnabled.value) return {}\n\n  return { 'aria-setsize': props.items!.length, 'aria-posinset': index + 1 }\n}\n\nconst maxHeightStyle = computed(() => {\n  const value = props.maxHeight\n  if (value == null) return undefined\n  return typeof value === 'number' ? `${value}px` : value\n})\n\nconst listStyle = computed(() => {\n  if (props.maxHeight === undefined) return undefined\n\n  const scroller = { overflowY: 'auto' as const, maxHeight: maxHeightStyle.value }\n  if (!virtualEnabled.value) return scroller\n\n  return { ...scroller, ...virtualizer.spacerStyle.value }\n})\n\n/**\n * Замер отрисованных пунктов.\n *\n * Идёт по детям контейнера, а не по `ref` на элементе: пункт рисует слот\n * потребителя, привязать к нему `ref` неоткуда. В виртуальном режиме прямые\n * дети контейнера — ровно окно (распорки живут псевдоэлементами и детьми не\n * считаются), поэтому сопоставление по позиции однозначно.\n */\nfunction measureRendered(): void {\n  if (!virtualEnabled.value) return\n  // В состояниях loading/empty дети контейнера — скелетоны и заглушки: их\n  // высоты записались бы в замеры под индексами будущих строк данных.\n  if (!showItems.value) return\n\n  const container = listEl.value\n  if (!container) return\n\n  const { start } = virtualizer.range.value\n  const children = container.children\n  for (let offset = 0; offset < children.length; offset++) {\n    virtualizer.measure(start + offset, children[offset])\n  }\n}\n\nonMounted(measureRendered)\nonUpdated(measureRendered)\n\nfunction scrollToIndex(index: number, align?: GrVirtualAlign): void {\n  virtualizer.scrollToIndex(index, align)\n}\n\ndefineExpose({ scrollToIndex })\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [props.virtual, dataMode.value, props.maxHeight] as const,\n    ([virtual, hasItems, maxHeight]) => {\n      if (!virtual) return\n\n      if (!hasItems) {\n        console.warn(\n          '[granularity] GrList: `virtual` требует `items` — пункты из слота по умолчанию '\n          + 'список не считает и резать окно ему не из чего.',\n        )\n      }\n      else if (maxHeight === undefined) {\n        console.warn(\n          '[granularity] GrList: `virtual` требует `maxHeight` — без ограничения высоты '\n          + 'вьюпорта нет, и в окно попадает весь набор.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  watch(\n    () => [dataMode.value, Boolean(slots.item)] as const,\n    ([hasItems, hasSlot]) => {\n      if (hasItems && !hasSlot) {\n        console.warn(\n          '[granularity] GrList: с `items` пункты рисует слот `#item` — без него список пуст.',\n        )\n      }\n    },\n    { immediate: true },\n  )\n\n  onMounted(() => {\n    if (!virtualEnabled.value) return\n\n    const first = listEl.value?.firstElementChild\n    if (first && !first.hasAttribute('aria-posinset')) {\n      console.warn(\n        '[granularity] GrList: при `virtual` пункты обязаны нести `aria-setsize`/`aria-posinset` — '\n        + 'пробросьте `aria` из слота `#item`: <GrListItem v-bind=\"aria\" … />. Иначе диктор '\n        + 'посчитает набор по отрисованному окну.',\n      )\n    }\n  })\n}\n</script>\n\n<template>\n  <GrCard :variant=\"variant\">\n    <div\n      ref=\"listEl\"\n      data-gr-list\n      role=\"list\"\n      :class=\"listClass\"\n      :style=\"listStyle\"\n      :tabindex=\"maxHeight === undefined ? undefined : 0\"\n      :data-gr-virtual=\"virtualEnabled ? '' : undefined\"\n      :aria-busy=\"loading ? 'true' : undefined\"\n    >\n      <template v-if=\"loading\">\n        <slot name=\"loading\">\n          <div\n            v-for=\"row in loadingRowCount\"\n            :key=\"row\"\n            data-gr-list-loading-row\n            :class=\"loadingRowClass\"\n          >\n            <GrSkeleton />\n          </div>\n        </slot>\n      </template>\n\n      <div\n        v-else-if=\"isEmpty\"\n        data-gr-list-empty\n        :class=\"emptyClass\"\n      >\n        <slot name=\"empty\">\n          {{ resolvedEmptyText }}\n        </slot>\n      </div>\n\n      <template v-else-if=\"dataMode\">\n        <template\n          v-for=\"entry in renderedItems\"\n          :key=\"keyOf(entry.item, entry.index)\"\n        >\n          <slot\n            name=\"item\"\n            :item=\"entry.item\"\n            :index=\"entry.index\"\n            :aria=\"ariaOf(entry.index)\"\n          />\n        </template>\n      </template>\n\n      <slot v-else />\n    </div>\n  </GrCard>\n</template>\n\n<style scoped>\n/* Срезанное сверху и снизу держат псевдоэлементы контейнера: их не за что\n   размонтировать, в дереве доступности их нет, а высота приезжает переменными\n   в том же патче, что и пункты. Почему не отступы контейнера и не поля крайних\n   пунктов — `docs/virtual-list.md`. */\n[data-gr-virtual]::before,\n[data-gr-virtual]::after {\n    content: '';\n    display: block;\n    flex: none;\n}\n\n[data-gr-virtual]::before {\n    height: var(--gr-virtual-before, 0px);\n}\n\n[data-gr-virtual]::after {\n    height: var(--gr-virtual-after, 0px);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, markRaw, useSlots, watch, type Component } from 'vue'\n\nimport {\n  grListItemPaddingClass,\n  itemDescriptionClass,\n  itemDisabledClass,\n  itemHoverClass,\n  itemInteractiveClass,\n  itemLayoutClass,\n  itemTitleClass,\n  type GrListItemDensity,\n} from './grListStyles'\n\nexport type { GrListItemDensity } from './grListStyles'\n\nexport interface GrListItemProps {\n  /** Заголовок строки. Если передан слот `#title`, проп игнорируется. */\n  title?: string\n  /** Описание под заголовком. Если передан слот `#description`, проп игнорируется. */\n  description?: string\n  /** Плотность вертикальных отступов: `regular` — 12px, `compact` — 8px. */\n  density?: GrListItemDensity\n  /** Ссылка: строка становится `<a>`. */\n  href?: string\n  /** Свой корневой тег строки (`RouterLink`, `Link` от Inertia). Сильнее `href`. */\n  as?: string | Component\n  /** Кликабельная строка без ссылки — `<button>` с событием `click`. */\n  clickable?: boolean\n  /** Подсветка при наведении без интерактивности. */\n  hoverable?: boolean\n  disabled?: boolean\n}\n\nexport interface GrListItemEmits {\n  (e: 'click', event: MouseEvent): void\n}\n\nconst props = withDefaults(defineProps<GrListItemProps>(), {\n  title: undefined,\n  description: undefined,\n  density: 'regular',\n  href: undefined,\n  as: undefined,\n  clickable: false,\n  hoverable: false,\n  disabled: false,\n})\n\nconst emit = defineEmits<GrListItemEmits>()\n\nconst slots = useSlots()\n\nconst hasTitle = computed(() => !!slots.title || !!props.title)\nconst hasDescription = computed(() => !!slots.description || !!props.description)\n\nconst isInteractive = computed(() => !props.disabled && (!!props.as || !!props.href || props.clickable))\n\n/**\n * `role=\"listitem\"` остаётся на обёртке, а строка целиком — вложенный элемент:\n * `<a role=\"listitem\">` потерял бы роль ссылки, а интерактив снаружи разорвал бы\n * связку `list` → `listitem`. Обычная строка идёт по той же схеме, чтобы\n * разметка содержимого была написана один раз, а не по копии на ветку.\n */\nconst rowTag = computed<string | Component>(() => {\n  if (!isInteractive.value)\n    return 'div'\n\n  if (props.as)\n    return typeof props.as === 'string' ? props.as : markRaw(props.as)\n\n  return props.href ? 'a' : 'button'\n})\n\nconst rowClass = computed(() => [\n  itemLayoutClass,\n  grListItemPaddingClass(props.density),\n  isInteractive.value ? `${itemInteractiveClass} ${itemHoverClass}` : '',\n  !isInteractive.value && props.hoverable && !props.disabled ? itemHoverClass : '',\n  props.disabled ? itemDisabledClass : '',\n].filter(Boolean).join(' '))\n\nfunction onClick(event: MouseEvent): void {\n  // `disabled` сюда попадает вместе с обычной строкой: и то и другое —\n  // не-интерактив, а кликов не эмитит ни один.\n  if (!isInteractive.value)\n    return\n\n  emit('click', event)\n}\n\n/** Теги, попадающие в таб-порядок сами. `<a>` — только со ссылкой. */\nfunction isFocusableTag(tag: string): boolean {\n  return tag === 'button' || (tag === 'a' && !!props.href)\n}\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [isInteractive.value, props.as] as const,\n    ([interactive, as]) => {\n      // Компонент из `as` (`RouterLink`, Inertia `Link`) рендерит `<a>`, но узнать\n      // это до рендера нельзя — предупреждаем только по явно названному тегу.\n      if (!interactive || typeof as !== 'string' || isFocusableTag(as)) return\n\n      console.warn(\n        `[granularity] GrListItem: as=\"${as}\" не попадает в таб-порядок — строка кликается `\n        + 'мышью, но не с клавиатуры. Возьмите тег, умеющий фокус (`button`, `a` со ссылкой), '\n        + 'или компонент роутера.',\n      )\n    },\n    { immediate: true },\n  )\n}\n</script>\n\n<template>\n  <div\n    data-gr-list-item\n    role=\"listitem\"\n    :aria-disabled=\"disabled ? 'true' : undefined\"\n  >\n    <component\n      :is=\"rowTag\"\n      :data-gr-list-item-action=\"isInteractive ? '' : undefined\"\n      :type=\"rowTag === 'button' ? 'button' : undefined\"\n      :href=\"isInteractive ? href : undefined\"\n      :class=\"rowClass\"\n      @click=\"onClick\"\n    >\n      <div v-if=\"$slots.prefix\" class=\"shrink-0\">\n        <slot name=\"prefix\" />\n      </div>\n      <div class=\"min-w-0 flex-1\">\n        <div v-if=\"hasTitle\" :class=\"itemTitleClass\">\n          <slot name=\"title\">\n{{ title }}\n</slot>\n        </div>\n        <div\n          v-if=\"hasDescription\"\n          :class=\"itemDescriptionClass\"\n        >\n          <slot name=\"description\">\n{{ description }}\n</slot>\n        </div>\n      </div>\n      <div v-if=\"$slots.default\" class=\"shrink-0\">\n        <slot />\n      </div>\n    </component>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, markRaw, useSlots, watch, type Component } from 'vue'\n\nimport {\n  grListItemPaddingClass,\n  itemDescriptionClass,\n  itemDisabledClass,\n  itemHoverClass,\n  itemInteractiveClass,\n  itemLayoutClass,\n  itemTitleClass,\n  type GrListItemDensity,\n} from './grListStyles'\n\nexport type { GrListItemDensity } from './grListStyles'\n\nexport interface GrListItemProps {\n  /** Заголовок строки. Если передан слот `#title`, проп игнорируется. */\n  title?: string\n  /** Описание под заголовком. Если передан слот `#description`, проп игнорируется. */\n  description?: string\n  /** Плотность вертикальных отступов: `regular` — 12px, `compact` — 8px. */\n  density?: GrListItemDensity\n  /** Ссылка: строка становится `<a>`. */\n  href?: string\n  /** Свой корневой тег строки (`RouterLink`, `Link` от Inertia). Сильнее `href`. */\n  as?: string | Component\n  /** Кликабельная строка без ссылки — `<button>` с событием `click`. */\n  clickable?: boolean\n  /** Подсветка при наведении без интерактивности. */\n  hoverable?: boolean\n  disabled?: boolean\n}\n\nexport interface GrListItemEmits {\n  (e: 'click', event: MouseEvent): void\n}\n\nconst props = withDefaults(defineProps<GrListItemProps>(), {\n  title: undefined,\n  description: undefined,\n  density: 'regular',\n  href: undefined,\n  as: undefined,\n  clickable: false,\n  hoverable: false,\n  disabled: false,\n})\n\nconst emit = defineEmits<GrListItemEmits>()\n\nconst slots = useSlots()\n\nconst hasTitle = computed(() => !!slots.title || !!props.title)\nconst hasDescription = computed(() => !!slots.description || !!props.description)\n\nconst isInteractive = computed(() => !props.disabled && (!!props.as || !!props.href || props.clickable))\n\n/**\n * `role=\"listitem\"` остаётся на обёртке, а строка целиком — вложенный элемент:\n * `<a role=\"listitem\">` потерял бы роль ссылки, а интерактив снаружи разорвал бы\n * связку `list` → `listitem`. Обычная строка идёт по той же схеме, чтобы\n * разметка содержимого была написана один раз, а не по копии на ветку.\n */\nconst rowTag = computed<string | Component>(() => {\n  if (!isInteractive.value)\n    return 'div'\n\n  if (props.as)\n    return typeof props.as === 'string' ? props.as : markRaw(props.as)\n\n  return props.href ? 'a' : 'button'\n})\n\nconst rowClass = computed(() => [\n  itemLayoutClass,\n  grListItemPaddingClass(props.density),\n  isInteractive.value ? `${itemInteractiveClass} ${itemHoverClass}` : '',\n  !isInteractive.value && props.hoverable && !props.disabled ? itemHoverClass : '',\n  props.disabled ? itemDisabledClass : '',\n].filter(Boolean).join(' '))\n\nfunction onClick(event: MouseEvent): void {\n  // `disabled` сюда попадает вместе с обычной строкой: и то и другое —\n  // не-интерактив, а кликов не эмитит ни один.\n  if (!isInteractive.value)\n    return\n\n  emit('click', event)\n}\n\n/** Теги, попадающие в таб-порядок сами. `<a>` — только со ссылкой. */\nfunction isFocusableTag(tag: string): boolean {\n  return tag === 'button' || (tag === 'a' && !!props.href)\n}\n\nif (import.meta.env?.DEV) {\n  watch(\n    () => [isInteractive.value, props.as] as const,\n    ([interactive, as]) => {\n      // Компонент из `as` (`RouterLink`, Inertia `Link`) рендерит `<a>`, но узнать\n      // это до рендера нельзя — предупреждаем только по явно названному тегу.\n      if (!interactive || typeof as !== 'string' || isFocusableTag(as)) return\n\n      console.warn(\n        `[granularity] GrListItem: as=\"${as}\" не попадает в таб-порядок — строка кликается `\n        + 'мышью, но не с клавиатуры. Возьмите тег, умеющий фокус (`button`, `a` со ссылкой), '\n        + 'или компонент роутера.',\n      )\n    },\n    { immediate: true },\n  )\n}\n</script>\n\n<template>\n  <div\n    data-gr-list-item\n    role=\"listitem\"\n    :aria-disabled=\"disabled ? 'true' : undefined\"\n  >\n    <component\n      :is=\"rowTag\"\n      :data-gr-list-item-action=\"isInteractive ? '' : undefined\"\n      :type=\"rowTag === 'button' ? 'button' : undefined\"\n      :href=\"isInteractive ? href : undefined\"\n      :class=\"rowClass\"\n      @click=\"onClick\"\n    >\n      <div v-if=\"$slots.prefix\" class=\"shrink-0\">\n        <slot name=\"prefix\" />\n      </div>\n      <div class=\"min-w-0 flex-1\">\n        <div v-if=\"hasTitle\" :class=\"itemTitleClass\">\n          <slot name=\"title\">\n{{ title }}\n</slot>\n        </div>\n        <div\n          v-if=\"hasDescription\"\n          :class=\"itemDescriptionClass\"\n        >\n          <slot name=\"description\">\n{{ description }}\n</slot>\n        </div>\n      </div>\n      <div v-if=\"$slots.default\" class=\"shrink-0\">\n        <slot />\n      </div>\n    </component>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/GrList/index.js

@@ -1,3 +1,3 @@
 import { n as grListSafelist, t as grListConfig } from "../../chunks/config-BsuDM3Hb.js";
-import { n as GrList_default, t as GrListItem_default } from "./chunks/GrList-CHibO0xA.js";
+import { n as GrList_default, t as GrListItem_default } from "./chunks/GrList-BUzFRa8-.js";
 export { GrList_default as GrList, GrList_default as default, GrListItem_default as GrListItem, grListConfig, grListSafelist };

package/dist/components/GrRadioGroup/index.js

@@ -1,3 +1,3 @@
 import { t as GrRadioGroup_default } from "./chunks/GrRadioGroup-BVmjKXcv.js";
-import { t as grRadioGroupConfig } from "../../chunks/config-QaIc_gRa.js";
+import { t as grRadioGroupConfig } from "../../chunks/config-QaIc_gRa2.js";
 export { GrRadioGroup_default as GrRadioGroup, GrRadioGroup_default as default, grRadioGroupConfig };

package/dist/components/GrRating/chunks/{GrRating-BSEtaibx.js → GrRating-BiAVT9H7.js}

@@ -3,7 +3,7 @@ import { n as useGranularityTranslations } from "../../../chunks/granularityI18n
 import { n as useGrFormFieldContext } from "../../../chunks/context-DdNIxa1w.js";
 import { useGrFormControl } from "../../../composables/useGrFormControl.js";
 import { n as iconTag, t as iconClass } from "../../../chunks/icon-Dag2tIMs.js";
-import { a as ratingSymbolClass, i as ratingRootClass, o as ratingTextSizeBySize, r as ratingFillClassByTone, s as ratingVoidClass } from "../../../chunks/config-Baj7Wvx-.js";
+import { a as ratingSymbolClass, i as ratingRootClass, o as ratingTextSizeBySize, r as ratingFillClassByTone, s as ratingVoidClass } from "../../../chunks/config-Baj7Wvx-2.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref } from "vue";
 //#region src/components/GrRating/GrRating.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["name", "value"];