@feugene/granularity 0.36.0 → 0.38.0

package/dist/components/GrSortableList/chunks/{GrSortableList-HyKX--rO.js.map → GrSortableList-CQCaWivn.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrSortableList-HyKX--rO.js","names":[],"sources":["../../../../src/components/GrSortableList/GrSortableList.vue","../../../../src/components/GrSortableList/GrSortableList.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, nextTick, ref } from 'vue'\n\nimport GrCard, { type GrCardVariant } from '../GrCard'\nimport { useAnnouncer } from '../../composables/useAnnouncer'\nimport { useDragSort } from '../../composables/useDragSort'\nimport { useRovingFocus } from '../../composables/useRovingFocus'\nimport { insertionIndex, moveItem } from '../../composables/internal/dragSortGeometry'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport type { GrSortableOrientation } from './grSortableListStyles'\nimport {\n  contentClass,\n  dividedClass,\n  emptyClass,\n  handleClass,\n  handleDisabledClass,\n  indicatorAfterClass,\n  indicatorBeforeClass,\n  listClass,\n  rowDisabledClass,\n  rowDraggingClass,\n  rowFocusClass,\n  rowGrabbedClass,\n  rowLayoutClass,\n} from './grSortableListStyles'\n\nimport IconGripVertical from '~icons/lucide/grip-vertical'\n\nexport interface GrSortableListProps<TItem = unknown> {\n  /** Набор в текущем порядке. `v-model`: наружу уходит новый массив, вход не мутируется. */\n  modelValue: TItem[]\n  /** Ключ элемента: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Список только для чтения: ни указателем, ни с клавиатуры. */\n  disabled?: boolean\n  /** Ось переноса. `horizontal` — ряд с переносом по ширине. */\n  orientation?: GrSortableOrientation\n  /** Поверхность под списком — вариант карточки. */\n  variant?: GrCardVariant\n  /** Разделители между строками. */\n  divided?: boolean\n  /** Тянуть можно только за ручку. Выключено — тянется вся строка. */\n  handleOnly?: boolean\n  /** Высота видимой части: список становится скроллером с автопрокруткой при переносе. */\n  maxHeight?: number | string\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n  /** Имя списка для скринридера. Не задано — берётся из локали. */\n  ariaLabel?: string\n}\n\nexport interface GrSortableListEmits<TItem = unknown> {\n  (e: 'update:modelValue', value: TItem[]): void\n  (e: 'move', from: number, to: number): void\n  (e: 'change', value: TItem[]): void\n}\n\nconst props = withDefaults(defineProps<GrSortableListProps<T>>(), {\n  itemKey: undefined,\n  disabled: false,\n  orientation: 'vertical',\n  variant: undefined,\n  divided: true,\n  handleOnly: true,\n  maxHeight: undefined,\n  emptyText: undefined,\n  ariaLabel: undefined,\n})\n\nconst emit = defineEmits<GrSortableListEmits<T>>()\n\ndefineSlots<{\n  item?: (props: { item: T, index: number, dragging: boolean, grabbed: boolean }) => any\n  handle?: (props: { item: T, index: number, disabled: boolean }) => any\n  empty?: () => any\n}>()\n\nconst { t } = useGranularityTranslations()\nconst { announce } = useAnnouncer()\n\nconst listEl = ref<HTMLElement | null>(null)\nconst rowEls = new Map<string, HTMLElement>()\n\nconst count = computed(() => props.modelValue.length)\nconst isEmpty = computed(() => count.value === 0)\nconst isVertical = computed(() => props.orientation === 'vertical')\n\nfunction keyOf(item: T, index: number): string {\n  if (typeof props.itemKey === 'function')\n    return String(props.itemKey(item, index))\n  if (typeof props.itemKey === 'string')\n    return String((item as Record<string, unknown>)[props.itemKey])\n\n  return String(index)\n}\n\nconst keys = computed(() => props.modelValue.map((item, index) => keyOf(item, index)))\n\nfunction indexOfKey(key: string): number {\n  return keys.value.indexOf(key)\n}\n\nfunction registerRow(key: string, el: unknown): void {\n  if (el instanceof HTMLElement) {\n    rowEls.set(key, el)\n    return\n  }\n\n  // Перестановка размонтирует старый узел уже после того, как встал новый:\n  // снимаем запись, только если она протухла (приём из `GrTree`).\n  const previous = rowEls.get(key)\n  if (previous && !previous.isConnected)\n    rowEls.delete(key)\n}\n\nconst roving = useRovingFocus<string>({\n  items: () => keys.value,\n  elementFor: key => rowEls.get(key) ?? null,\n  orientation: () => (isVertical.value ? 'vertical' : 'horizontal'),\n  wrap: () => false,\n})\n\nfunction applyMove(from: number, to: number): void {\n  if (from < 0 || to < 0 || from === to)\n    return\n\n  const next = moveItem(props.modelValue, from, to)\n  emit('update:modelValue', next)\n  emit('move', from, to)\n  emit('change', next)\n}\n\nconst sort = useDragSort<string, number>({\n  items: () => keys.value,\n  elementFor: key => rowEls.get(key) ?? null,\n  orientation: () => props.orientation,\n  scroller: () => (props.maxHeight === undefined ? null : listEl.value),\n  disabled: () => props.disabled,\n  resolveTarget: (hit, source) => insertionIndex(hit, indexOfKey(source), count.value),\n  onDrop: (source, to) => applyMove(indexOfKey(source), to),\n  onUpdate: (source, target, mode) => {\n    // Объявляется только клавиатурный перенос: у мыши всё видно на экране, а\n    // поток объявлений на каждом движении указателя делает диктор бесполезным.\n    if (mode !== 'keyboard' || source === null)\n      return\n\n    const position = (target ?? indexOfKey(source)) + 1\n    announce(t('gr.sortable.moved', 'Position {position} of {count}', { position, count: count.value }))\n  },\n})\n\nconst activeIndex = computed(() => (sort.source.value === null ? -1 : indexOfKey(sort.source.value)))\n\n/** Куда встанет строка: индикатор рисуется на строке-соседе, а не отдельным узлом. */\nfunction indicatorFor(index: number): 'before' | 'after' | null {\n  const target = sort.target.value\n  if (target === null || !sort.isActive.value || index === activeIndex.value)\n    return null\n\n  if (target === index)\n    return target < activeIndex.value || activeIndex.value === -1 ? 'before' : 'after'\n\n  return null\n}\n\nfunction rowClass(index: number, key: string): string[] {\n  const grabbed = sort.mode.value === 'keyboard' && sort.source.value === key\n  const dragging = sort.mode.value === 'pointer' && sort.source.value === key\n  const indicator = indicatorFor(index)\n\n  return [\n    rowLayoutClass,\n    rowFocusClass,\n    props.disabled ? rowDisabledClass : '',\n    grabbed ? rowGrabbedClass : '',\n    dragging ? rowDraggingClass : '',\n    indicator === 'before' ? indicatorBeforeClass : '',\n    indicator === 'after' ? indicatorAfterClass : '',\n  ]\n}\n\nfunction startPointer(key: string, event: PointerEvent): void {\n  if (props.disabled)\n    return\n\n  sort.startFrom(key)(event)\n}\n\nfunction grab(key: string): void {\n  sort.grab(key)\n  if (sort.mode.value !== 'keyboard')\n    return\n\n  // Цель ставится до объявления: `setTarget` сам объявляет позицию, и обратный\n  // порядок стёр бы более полное сообщение о захвате.\n  sort.setTarget(indexOfKey(key))\n  announce(t('gr.sortable.grabbed', 'Grabbed. Position {position} of {count}', {\n    position: indexOfKey(key) + 1,\n    count: count.value,\n  }))\n}\n\nasync function drop(key: string): Promise<void> {\n  const target = sort.target.value\n  sort.drop()\n\n  announce(t('gr.sortable.dropped', 'Dropped at position {position} of {count}', {\n    position: (target ?? 0) + 1,\n    count: count.value,\n  }))\n\n  // Фокус остаётся на перенесённой строке: иначе после переноса он падает на\n  // тело документа и клавиатурный сценарий обрывается на первом же шаге.\n  await nextTick()\n  await roving.focusKey(key)\n}\n\nfunction cancel(): void {\n  if (!sort.isActive.value)\n    return\n\n  sort.cancel()\n  announce(t('gr.sortable.cancelled', 'Move cancelled'))\n}\n\nfunction moveTargetBy(delta: number): void {\n  const current = sort.target.value ?? activeIndex.value\n  const next = Math.min(count.value - 1, Math.max(0, current + delta))\n\n  if (next !== current)\n    sort.setTarget(next)\n}\n\nfunction onRowKeydown(event: KeyboardEvent, key: string): void {\n  if (props.disabled)\n    return\n\n  const forward = isVertical.value ? 'ArrowDown' : 'ArrowRight'\n  const backward = isVertical.value ? 'ArrowUp' : 'ArrowLeft'\n  const grabbed = sort.mode.value === 'keyboard'\n\n  if (event.key === 'Escape') {\n    if (!grabbed)\n      return\n\n    event.preventDefault()\n    cancel()\n    return\n  }\n\n  if (event.key === ' ' || event.key === 'Enter') {\n    event.preventDefault()\n    if (grabbed)\n      void drop(key)\n    else grab(key)\n    return\n  }\n\n  if (grabbed) {\n    // Взятая строка забирает стрелки себе: двигается она, а не фокус.\n    if (event.key === forward || event.key === backward) {\n      event.preventDefault()\n      moveTargetBy(event.key === forward ? 1 : -1)\n    }\n    return\n  }\n\n  roving.handleNavigationKeys(event)\n}\n\n/** Фокус ушёл из списка — взятая строка не может остаться взятой навсегда. */\nfunction onFocusout(event: FocusEvent): void {\n  if (sort.mode.value !== 'keyboard')\n    return\n\n  const next = event.relatedTarget as Node | null\n  if (next && listEl.value?.contains(next))\n    return\n\n  cancel()\n}\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.sortable.empty', 'Nothing to sort yet'))\nconst resolvedLabel = computed(() => props.ariaLabel ?? t('gr.sortable.label', 'Sortable list'))\nconst handleLabel = computed(() => t('gr.sortable.handle', 'Reorder'))\n\nconst listStyle = computed(() => (props.maxHeight === undefined\n  ? undefined\n  : { maxHeight: typeof props.maxHeight === 'number' ? `${props.maxHeight}px` : props.maxHeight, overflow: 'auto' }))\n\ndefineExpose({\n  /** Программная перестановка — та же, что делает перенос. */\n  move: (from: number, to: number) => applyMove(from, to),\n  focusItem: (index: number) => roving.focusKey(keys.value[index]),\n})\n</script>\n\n<template>\n  <GrCard :variant=\"variant\">\n    <div\n      ref=\"listEl\"\n      role=\"list\"\n      data-gr-sortable\n      :aria-label=\"resolvedLabel\"\n      :aria-disabled=\"disabled ? 'true' : undefined\"\n      :class=\"[listClass[orientation], divided ? dividedClass : '']\"\n      :style=\"listStyle\"\n      @focusout=\"onFocusout\"\n    >\n      <div\n        v-if=\"isEmpty\"\n        data-gr-sortable-empty\n        :class=\"emptyClass\"\n      >\n        <slot name=\"empty\">\n          {{ resolvedEmptyText }}\n        </slot>\n      </div>\n\n      <div\n        v-for=\"(item, index) in modelValue\"\n        v-else\n        :key=\"keys[index]\"\n        :ref=\"el => registerRow(keys[index], el)\"\n        role=\"listitem\"\n        data-gr-sortable-item\n        :tabindex=\"disabled ? -1 : roving.tabindexFor(keys[index])\"\n        :aria-roledescription=\"handleLabel\"\n        :aria-posinset=\"index + 1\"\n        :aria-setsize=\"count\"\n        :aria-grabbed=\"sort.mode.value === 'keyboard' && sort.source.value === keys[index] ? 'true' : undefined\"\n        :class=\"rowClass(index, keys[index])\"\n        @keydown=\"onRowKeydown($event, keys[index])\"\n        @focus=\"roving.setActive(keys[index])\"\n        @pointerdown=\"handleOnly ? undefined : startPointer(keys[index], $event)\"\n      >\n        <button\n          type=\"button\"\n          tabindex=\"-1\"\n          data-gr-sortable-handle\n          :class=\"[handleClass, disabled ? handleDisabledClass : '']\"\n          :aria-label=\"handleLabel\"\n          :disabled=\"disabled\"\n          @pointerdown=\"startPointer(keys[index], $event)\"\n          @click.stop\n        >\n          <slot\n            name=\"handle\"\n            :item=\"item\"\n            :index=\"index\"\n            :disabled=\"disabled\"\n          >\n            <IconGripVertical class=\"block\" aria-hidden=\"true\" />\n          </slot>\n        </button>\n\n        <div :class=\"contentClass\">\n          <slot\n            name=\"item\"\n            :item=\"item\"\n            :index=\"index\"\n            :dragging=\"sort.mode.value === 'pointer' && sort.source.value === keys[index]\"\n            :grabbed=\"sort.mode.value === 'keyboard' && sort.source.value === keys[index]\"\n          >\n            {{ item }}\n          </slot>\n        </div>\n      </div>\n    </div>\n  </GrCard>\n</template>\n","<script setup lang=\"ts\" generic=\"T\">\nimport { computed, nextTick, ref } from 'vue'\n\nimport GrCard, { type GrCardVariant } from '../GrCard'\nimport { useAnnouncer } from '../../composables/useAnnouncer'\nimport { useDragSort } from '../../composables/useDragSort'\nimport { useRovingFocus } from '../../composables/useRovingFocus'\nimport { insertionIndex, moveItem } from '../../composables/internal/dragSortGeometry'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport type { GrSortableOrientation } from './grSortableListStyles'\nimport {\n  contentClass,\n  dividedClass,\n  emptyClass,\n  handleClass,\n  handleDisabledClass,\n  indicatorAfterClass,\n  indicatorBeforeClass,\n  listClass,\n  rowDisabledClass,\n  rowDraggingClass,\n  rowFocusClass,\n  rowGrabbedClass,\n  rowLayoutClass,\n} from './grSortableListStyles'\n\nimport IconGripVertical from '~icons/lucide/grip-vertical'\n\nexport interface GrSortableListProps<TItem = unknown> {\n  /** Набор в текущем порядке. `v-model`: наружу уходит новый массив, вход не мутируется. */\n  modelValue: TItem[]\n  /** Ключ элемента: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Список только для чтения: ни указателем, ни с клавиатуры. */\n  disabled?: boolean\n  /** Ось переноса. `horizontal` — ряд с переносом по ширине. */\n  orientation?: GrSortableOrientation\n  /** Поверхность под списком — вариант карточки. */\n  variant?: GrCardVariant\n  /** Разделители между строками. */\n  divided?: boolean\n  /** Тянуть можно только за ручку. Выключено — тянется вся строка. */\n  handleOnly?: boolean\n  /** Высота видимой части: список становится скроллером с автопрокруткой при переносе. */\n  maxHeight?: number | string\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n  /** Имя списка для скринридера. Не задано — берётся из локали. */\n  ariaLabel?: string\n}\n\nexport interface GrSortableListEmits<TItem = unknown> {\n  (e: 'update:modelValue', value: TItem[]): void\n  (e: 'move', from: number, to: number): void\n  (e: 'change', value: TItem[]): void\n}\n\nconst props = withDefaults(defineProps<GrSortableListProps<T>>(), {\n  itemKey: undefined,\n  disabled: false,\n  orientation: 'vertical',\n  variant: undefined,\n  divided: true,\n  handleOnly: true,\n  maxHeight: undefined,\n  emptyText: undefined,\n  ariaLabel: undefined,\n})\n\nconst emit = defineEmits<GrSortableListEmits<T>>()\n\ndefineSlots<{\n  item?: (props: { item: T, index: number, dragging: boolean, grabbed: boolean }) => any\n  handle?: (props: { item: T, index: number, disabled: boolean }) => any\n  empty?: () => any\n}>()\n\nconst { t } = useGranularityTranslations()\nconst { announce } = useAnnouncer()\n\nconst listEl = ref<HTMLElement | null>(null)\nconst rowEls = new Map<string, HTMLElement>()\n\nconst count = computed(() => props.modelValue.length)\nconst isEmpty = computed(() => count.value === 0)\nconst isVertical = computed(() => props.orientation === 'vertical')\n\nfunction keyOf(item: T, index: number): string {\n  if (typeof props.itemKey === 'function')\n    return String(props.itemKey(item, index))\n  if (typeof props.itemKey === 'string')\n    return String((item as Record<string, unknown>)[props.itemKey])\n\n  return String(index)\n}\n\nconst keys = computed(() => props.modelValue.map((item, index) => keyOf(item, index)))\n\nfunction indexOfKey(key: string): number {\n  return keys.value.indexOf(key)\n}\n\nfunction registerRow(key: string, el: unknown): void {\n  if (el instanceof HTMLElement) {\n    rowEls.set(key, el)\n    return\n  }\n\n  // Перестановка размонтирует старый узел уже после того, как встал новый:\n  // снимаем запись, только если она протухла (приём из `GrTree`).\n  const previous = rowEls.get(key)\n  if (previous && !previous.isConnected)\n    rowEls.delete(key)\n}\n\nconst roving = useRovingFocus<string>({\n  items: () => keys.value,\n  elementFor: key => rowEls.get(key) ?? null,\n  orientation: () => (isVertical.value ? 'vertical' : 'horizontal'),\n  wrap: () => false,\n})\n\nfunction applyMove(from: number, to: number): void {\n  if (from < 0 || to < 0 || from === to)\n    return\n\n  const next = moveItem(props.modelValue, from, to)\n  emit('update:modelValue', next)\n  emit('move', from, to)\n  emit('change', next)\n}\n\nconst sort = useDragSort<string, number>({\n  items: () => keys.value,\n  elementFor: key => rowEls.get(key) ?? null,\n  orientation: () => props.orientation,\n  scroller: () => (props.maxHeight === undefined ? null : listEl.value),\n  disabled: () => props.disabled,\n  resolveTarget: (hit, source) => insertionIndex(hit, indexOfKey(source), count.value),\n  onDrop: (source, to) => applyMove(indexOfKey(source), to),\n  onUpdate: (source, target, mode) => {\n    // Объявляется только клавиатурный перенос: у мыши всё видно на экране, а\n    // поток объявлений на каждом движении указателя делает диктор бесполезным.\n    if (mode !== 'keyboard' || source === null)\n      return\n\n    const position = (target ?? indexOfKey(source)) + 1\n    announce(t('gr.sortable.moved', 'Position {position} of {count}', { position, count: count.value }))\n  },\n})\n\nconst activeIndex = computed(() => (sort.source.value === null ? -1 : indexOfKey(sort.source.value)))\n\n/** Куда встанет строка: индикатор рисуется на строке-соседе, а не отдельным узлом. */\nfunction indicatorFor(index: number): 'before' | 'after' | null {\n  const target = sort.target.value\n  if (target === null || !sort.isActive.value || index === activeIndex.value)\n    return null\n\n  if (target === index)\n    return target < activeIndex.value || activeIndex.value === -1 ? 'before' : 'after'\n\n  return null\n}\n\nfunction rowClass(index: number, key: string): string[] {\n  const grabbed = sort.mode.value === 'keyboard' && sort.source.value === key\n  const dragging = sort.mode.value === 'pointer' && sort.source.value === key\n  const indicator = indicatorFor(index)\n\n  return [\n    rowLayoutClass,\n    rowFocusClass,\n    props.disabled ? rowDisabledClass : '',\n    grabbed ? rowGrabbedClass : '',\n    dragging ? rowDraggingClass : '',\n    indicator === 'before' ? indicatorBeforeClass : '',\n    indicator === 'after' ? indicatorAfterClass : '',\n  ]\n}\n\nfunction startPointer(key: string, event: PointerEvent): void {\n  if (props.disabled)\n    return\n\n  sort.startFrom(key)(event)\n}\n\nfunction grab(key: string): void {\n  sort.grab(key)\n  if (sort.mode.value !== 'keyboard')\n    return\n\n  // Цель ставится до объявления: `setTarget` сам объявляет позицию, и обратный\n  // порядок стёр бы более полное сообщение о захвате.\n  sort.setTarget(indexOfKey(key))\n  announce(t('gr.sortable.grabbed', 'Grabbed. Position {position} of {count}', {\n    position: indexOfKey(key) + 1,\n    count: count.value,\n  }))\n}\n\nasync function drop(key: string): Promise<void> {\n  const target = sort.target.value\n  sort.drop()\n\n  announce(t('gr.sortable.dropped', 'Dropped at position {position} of {count}', {\n    position: (target ?? 0) + 1,\n    count: count.value,\n  }))\n\n  // Фокус остаётся на перенесённой строке: иначе после переноса он падает на\n  // тело документа и клавиатурный сценарий обрывается на первом же шаге.\n  await nextTick()\n  await roving.focusKey(key)\n}\n\nfunction cancel(): void {\n  if (!sort.isActive.value)\n    return\n\n  sort.cancel()\n  announce(t('gr.sortable.cancelled', 'Move cancelled'))\n}\n\nfunction moveTargetBy(delta: number): void {\n  const current = sort.target.value ?? activeIndex.value\n  const next = Math.min(count.value - 1, Math.max(0, current + delta))\n\n  if (next !== current)\n    sort.setTarget(next)\n}\n\nfunction onRowKeydown(event: KeyboardEvent, key: string): void {\n  if (props.disabled)\n    return\n\n  const forward = isVertical.value ? 'ArrowDown' : 'ArrowRight'\n  const backward = isVertical.value ? 'ArrowUp' : 'ArrowLeft'\n  const grabbed = sort.mode.value === 'keyboard'\n\n  if (event.key === 'Escape') {\n    if (!grabbed)\n      return\n\n    event.preventDefault()\n    cancel()\n    return\n  }\n\n  if (event.key === ' ' || event.key === 'Enter') {\n    event.preventDefault()\n    if (grabbed)\n      void drop(key)\n    else grab(key)\n    return\n  }\n\n  if (grabbed) {\n    // Взятая строка забирает стрелки себе: двигается она, а не фокус.\n    if (event.key === forward || event.key === backward) {\n      event.preventDefault()\n      moveTargetBy(event.key === forward ? 1 : -1)\n    }\n    return\n  }\n\n  roving.handleNavigationKeys(event)\n}\n\n/** Фокус ушёл из списка — взятая строка не может остаться взятой навсегда. */\nfunction onFocusout(event: FocusEvent): void {\n  if (sort.mode.value !== 'keyboard')\n    return\n\n  const next = event.relatedTarget as Node | null\n  if (next && listEl.value?.contains(next))\n    return\n\n  cancel()\n}\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.sortable.empty', 'Nothing to sort yet'))\nconst resolvedLabel = computed(() => props.ariaLabel ?? t('gr.sortable.label', 'Sortable list'))\nconst handleLabel = computed(() => t('gr.sortable.handle', 'Reorder'))\n\nconst listStyle = computed(() => (props.maxHeight === undefined\n  ? undefined\n  : { maxHeight: typeof props.maxHeight === 'number' ? `${props.maxHeight}px` : props.maxHeight, overflow: 'auto' }))\n\ndefineExpose({\n  /** Программная перестановка — та же, что делает перенос. */\n  move: (from: number, to: number) => applyMove(from, to),\n  focusItem: (index: number) => roving.focusKey(keys.value[index]),\n})\n</script>\n\n<template>\n  <GrCard :variant=\"variant\">\n    <div\n      ref=\"listEl\"\n      role=\"list\"\n      data-gr-sortable\n      :aria-label=\"resolvedLabel\"\n      :aria-disabled=\"disabled ? 'true' : undefined\"\n      :class=\"[listClass[orientation], divided ? dividedClass : '']\"\n      :style=\"listStyle\"\n      @focusout=\"onFocusout\"\n    >\n      <div\n        v-if=\"isEmpty\"\n        data-gr-sortable-empty\n        :class=\"emptyClass\"\n      >\n        <slot name=\"empty\">\n          {{ resolvedEmptyText }}\n        </slot>\n      </div>\n\n      <div\n        v-for=\"(item, index) in modelValue\"\n        v-else\n        :key=\"keys[index]\"\n        :ref=\"el => registerRow(keys[index], el)\"\n        role=\"listitem\"\n        data-gr-sortable-item\n        :tabindex=\"disabled ? -1 : roving.tabindexFor(keys[index])\"\n        :aria-roledescription=\"handleLabel\"\n        :aria-posinset=\"index + 1\"\n        :aria-setsize=\"count\"\n        :aria-grabbed=\"sort.mode.value === 'keyboard' && sort.source.value === keys[index] ? 'true' : undefined\"\n        :class=\"rowClass(index, keys[index])\"\n        @keydown=\"onRowKeydown($event, keys[index])\"\n        @focus=\"roving.setActive(keys[index])\"\n        @pointerdown=\"handleOnly ? undefined : startPointer(keys[index], $event)\"\n      >\n        <button\n          type=\"button\"\n          tabindex=\"-1\"\n          data-gr-sortable-handle\n          :class=\"[handleClass, disabled ? handleDisabledClass : '']\"\n          :aria-label=\"handleLabel\"\n          :disabled=\"disabled\"\n          @pointerdown=\"startPointer(keys[index], $event)\"\n          @click.stop\n        >\n          <slot\n            name=\"handle\"\n            :item=\"item\"\n            :index=\"index\"\n            :disabled=\"disabled\"\n          >\n            <IconGripVertical class=\"block\" aria-hidden=\"true\" />\n          </slot>\n        </button>\n\n        <div :class=\"contentClass\">\n          <slot\n            name=\"item\"\n            :item=\"item\"\n            :index=\"index\"\n            :dragging=\"sort.mode.value === 'pointer' && sort.source.value === keys[index]\"\n            :grabbed=\"sort.mode.value === 'keyboard' && sort.source.value === keys[index]\"\n          >\n            {{ item }}\n          </slot>\n        </div>\n      </div>\n    </div>\n  </GrCard>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"GrSortableList-CQCaWivn.js","names":[],"sources":["../../../../src/components/GrSortableList/GrSortableList.vue","../../../../src/components/GrSortableList/GrSortableList.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T\">\nimport { computed, nextTick, ref } from 'vue'\n\nimport GrCard, { type GrCardVariant } from '../GrCard'\nimport { useAnnouncer } from '../../composables/useAnnouncer'\nimport { useDragSort } from '../../composables/useDragSort'\nimport { useRovingFocus } from '../../composables/useRovingFocus'\nimport { insertionIndex, moveItem } from '../../composables/internal/dragSortGeometry'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport type { GrSortableOrientation } from './grSortableListStyles'\nimport {\n  contentClass,\n  dividedClass,\n  emptyClass,\n  handleClass,\n  handleDisabledClass,\n  indicatorAfterClass,\n  indicatorBeforeClass,\n  listClass,\n  rowDisabledClass,\n  rowDraggingClass,\n  rowFocusClass,\n  rowGrabbedClass,\n  rowLayoutClass,\n} from './grSortableListStyles'\n\nimport IconGripVertical from '~icons/lucide/grip-vertical'\n\nexport interface GrSortableListProps<TItem = unknown> {\n  /** Набор в текущем порядке. `v-model`: наружу уходит новый массив, вход не мутируется. */\n  modelValue: TItem[]\n  /** Ключ элемента: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Список только для чтения: ни указателем, ни с клавиатуры. */\n  disabled?: boolean\n  /** Ось переноса. `horizontal` — ряд с переносом по ширине. */\n  orientation?: GrSortableOrientation\n  /** Поверхность под списком — вариант карточки. */\n  variant?: GrCardVariant\n  /** Разделители между строками. */\n  divided?: boolean\n  /** Тянуть можно только за ручку. Выключено — тянется вся строка. */\n  handleOnly?: boolean\n  /** Высота видимой части: список становится скроллером с автопрокруткой при переносе. */\n  maxHeight?: number | string\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n  /** Имя списка для скринридера. Не задано — берётся из локали. */\n  ariaLabel?: string\n}\n\nexport interface GrSortableListEmits<TItem = unknown> {\n  (e: 'update:modelValue', value: TItem[]): void\n  (e: 'move', from: number, to: number): void\n  (e: 'change', value: TItem[]): void\n}\n\nconst props = withDefaults(defineProps<GrSortableListProps<T>>(), {\n  itemKey: undefined,\n  disabled: false,\n  orientation: 'vertical',\n  variant: undefined,\n  divided: true,\n  handleOnly: true,\n  maxHeight: undefined,\n  emptyText: undefined,\n  ariaLabel: undefined,\n})\n\nconst emit = defineEmits<GrSortableListEmits<T>>()\n\ndefineSlots<{\n  item?: (props: { item: T, index: number, dragging: boolean, grabbed: boolean }) => any\n  handle?: (props: { item: T, index: number, disabled: boolean }) => any\n  empty?: () => any\n}>()\n\nconst { t } = useGranularityTranslations()\nconst { announce } = useAnnouncer()\n\nconst listEl = ref<HTMLElement | null>(null)\nconst rowEls = new Map<string, HTMLElement>()\n\nconst count = computed(() => props.modelValue.length)\nconst isEmpty = computed(() => count.value === 0)\nconst isVertical = computed(() => props.orientation === 'vertical')\n\nfunction keyOf(item: T, index: number): string {\n  if (typeof props.itemKey === 'function')\n    return String(props.itemKey(item, index))\n  if (typeof props.itemKey === 'string')\n    return String((item as Record<string, unknown>)[props.itemKey])\n\n  return String(index)\n}\n\nconst keys = computed(() => props.modelValue.map((item, index) => keyOf(item, index)))\n\nfunction indexOfKey(key: string): number {\n  return keys.value.indexOf(key)\n}\n\nfunction registerRow(key: string, el: unknown): void {\n  if (el instanceof HTMLElement) {\n    rowEls.set(key, el)\n    return\n  }\n\n  // Перестановка размонтирует старый узел уже после того, как встал новый:\n  // снимаем запись, только если она протухла (приём из `GrTree`).\n  const previous = rowEls.get(key)\n  if (previous && !previous.isConnected)\n    rowEls.delete(key)\n}\n\nconst roving = useRovingFocus<string>({\n  items: () => keys.value,\n  elementFor: key => rowEls.get(key) ?? null,\n  orientation: () => (isVertical.value ? 'vertical' : 'horizontal'),\n  wrap: () => false,\n})\n\nfunction applyMove(from: number, to: number): void {\n  if (from < 0 || to < 0 || from === to)\n    return\n\n  const next = moveItem(props.modelValue, from, to)\n  emit('update:modelValue', next)\n  emit('move', from, to)\n  emit('change', next)\n}\n\nconst sort = useDragSort<string, number>({\n  items: () => keys.value,\n  elementFor: key => rowEls.get(key) ?? null,\n  orientation: () => props.orientation,\n  scroller: () => (props.maxHeight === undefined ? null : listEl.value),\n  disabled: () => props.disabled,\n  resolveTarget: (hit, source) => insertionIndex(hit, indexOfKey(source), count.value),\n  onDrop: (source, to) => applyMove(indexOfKey(source), to),\n  onUpdate: (source, target, mode) => {\n    // Объявляется только клавиатурный перенос: у мыши всё видно на экране, а\n    // поток объявлений на каждом движении указателя делает диктор бесполезным.\n    if (mode !== 'keyboard' || source === null)\n      return\n\n    const position = (target ?? indexOfKey(source)) + 1\n    announce(t('gr.sortable.moved', 'Position {position} of {count}', { position, count: count.value }))\n  },\n})\n\nconst activeIndex = computed(() => (sort.source.value === null ? -1 : indexOfKey(sort.source.value)))\n\n/** Куда встанет строка: индикатор рисуется на строке-соседе, а не отдельным узлом. */\nfunction indicatorFor(index: number): 'before' | 'after' | null {\n  const target = sort.target.value\n  if (target === null || !sort.isActive.value || index === activeIndex.value)\n    return null\n\n  if (target === index)\n    return target < activeIndex.value || activeIndex.value === -1 ? 'before' : 'after'\n\n  return null\n}\n\nfunction rowClass(index: number, key: string): string[] {\n  const grabbed = sort.mode.value === 'keyboard' && sort.source.value === key\n  const dragging = sort.mode.value === 'pointer' && sort.source.value === key\n  const indicator = indicatorFor(index)\n\n  return [\n    rowLayoutClass,\n    rowFocusClass,\n    props.disabled ? rowDisabledClass : '',\n    grabbed ? rowGrabbedClass : '',\n    dragging ? rowDraggingClass : '',\n    indicator === 'before' ? indicatorBeforeClass : '',\n    indicator === 'after' ? indicatorAfterClass : '',\n  ]\n}\n\nfunction startPointer(key: string, event: PointerEvent): void {\n  if (props.disabled)\n    return\n\n  sort.startFrom(key)(event)\n}\n\nfunction grab(key: string): void {\n  sort.grab(key)\n  if (sort.mode.value !== 'keyboard')\n    return\n\n  // Цель ставится до объявления: `setTarget` сам объявляет позицию, и обратный\n  // порядок стёр бы более полное сообщение о захвате.\n  sort.setTarget(indexOfKey(key))\n  announce(t('gr.sortable.grabbed', 'Grabbed. Position {position} of {count}', {\n    position: indexOfKey(key) + 1,\n    count: count.value,\n  }))\n}\n\nasync function drop(key: string): Promise<void> {\n  const target = sort.target.value\n  sort.drop()\n\n  announce(t('gr.sortable.dropped', 'Dropped at position {position} of {count}', {\n    position: (target ?? 0) + 1,\n    count: count.value,\n  }))\n\n  // Фокус остаётся на перенесённой строке: иначе после переноса он падает на\n  // тело документа и клавиатурный сценарий обрывается на первом же шаге.\n  await nextTick()\n  await roving.focusKey(key)\n}\n\nfunction cancel(): void {\n  if (!sort.isActive.value)\n    return\n\n  sort.cancel()\n  announce(t('gr.sortable.cancelled', 'Move cancelled'))\n}\n\nfunction moveTargetBy(delta: number): void {\n  const current = sort.target.value ?? activeIndex.value\n  const next = Math.min(count.value - 1, Math.max(0, current + delta))\n\n  if (next !== current)\n    sort.setTarget(next)\n}\n\nfunction onRowKeydown(event: KeyboardEvent, key: string): void {\n  if (props.disabled)\n    return\n\n  const forward = isVertical.value ? 'ArrowDown' : 'ArrowRight'\n  const backward = isVertical.value ? 'ArrowUp' : 'ArrowLeft'\n  const grabbed = sort.mode.value === 'keyboard'\n\n  if (event.key === 'Escape') {\n    if (!grabbed)\n      return\n\n    event.preventDefault()\n    cancel()\n    return\n  }\n\n  if (event.key === ' ' || event.key === 'Enter') {\n    event.preventDefault()\n    if (grabbed)\n      void drop(key)\n    else grab(key)\n    return\n  }\n\n  if (grabbed) {\n    // Взятая строка забирает стрелки себе: двигается она, а не фокус.\n    if (event.key === forward || event.key === backward) {\n      event.preventDefault()\n      moveTargetBy(event.key === forward ? 1 : -1)\n    }\n    return\n  }\n\n  roving.handleNavigationKeys(event)\n}\n\n/** Фокус ушёл из списка — взятая строка не может остаться взятой навсегда. */\nfunction onFocusout(event: FocusEvent): void {\n  if (sort.mode.value !== 'keyboard')\n    return\n\n  const next = event.relatedTarget as Node | null\n  if (next && listEl.value?.contains(next))\n    return\n\n  cancel()\n}\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.sortable.empty', 'Nothing to sort yet'))\nconst resolvedLabel = computed(() => props.ariaLabel ?? t('gr.sortable.label', 'Sortable list'))\nconst handleLabel = computed(() => t('gr.sortable.handle', 'Reorder'))\n\nconst listStyle = computed(() => (props.maxHeight === undefined\n  ? undefined\n  : { maxHeight: typeof props.maxHeight === 'number' ? `${props.maxHeight}px` : props.maxHeight, overflow: 'auto' }))\n\ndefineExpose({\n  /** Программная перестановка — та же, что делает перенос. */\n  move: (from: number, to: number) => applyMove(from, to),\n  focusItem: (index: number) => roving.focusKey(keys.value[index]),\n})\n</script>\n\n<template>\n  <GrCard :variant=\"variant\">\n    <div\n      ref=\"listEl\"\n      role=\"list\"\n      data-gr-sortable\n      :aria-label=\"resolvedLabel\"\n      :aria-disabled=\"disabled ? 'true' : undefined\"\n      :class=\"[listClass[orientation], divided ? dividedClass : '']\"\n      :style=\"listStyle\"\n      @focusout=\"onFocusout\"\n    >\n      <div\n        v-if=\"isEmpty\"\n        data-gr-sortable-empty\n        :class=\"emptyClass\"\n      >\n        <slot name=\"empty\">\n          {{ resolvedEmptyText }}\n        </slot>\n      </div>\n\n      <div\n        v-for=\"(item, index) in modelValue\"\n        v-else\n        :key=\"keys[index]\"\n        :ref=\"el => registerRow(keys[index], el)\"\n        role=\"listitem\"\n        data-gr-sortable-item\n        :tabindex=\"disabled ? -1 : roving.tabindexFor(keys[index])\"\n        :aria-roledescription=\"handleLabel\"\n        :aria-posinset=\"index + 1\"\n        :aria-setsize=\"count\"\n        :aria-grabbed=\"sort.mode.value === 'keyboard' && sort.source.value === keys[index] ? 'true' : undefined\"\n        :class=\"rowClass(index, keys[index])\"\n        @keydown=\"onRowKeydown($event, keys[index])\"\n        @focus=\"roving.setActive(keys[index])\"\n        @pointerdown=\"handleOnly ? undefined : startPointer(keys[index], $event)\"\n      >\n        <button\n          type=\"button\"\n          tabindex=\"-1\"\n          data-gr-sortable-handle\n          :class=\"[handleClass, disabled ? handleDisabledClass : '']\"\n          :aria-label=\"handleLabel\"\n          :disabled=\"disabled\"\n          @pointerdown=\"startPointer(keys[index], $event)\"\n          @click.stop\n        >\n          <slot\n            name=\"handle\"\n            :item=\"item\"\n            :index=\"index\"\n            :disabled=\"disabled\"\n          >\n            <IconGripVertical class=\"block\" aria-hidden=\"true\" />\n          </slot>\n        </button>\n\n        <div :class=\"contentClass\">\n          <slot\n            name=\"item\"\n            :item=\"item\"\n            :index=\"index\"\n            :dragging=\"sort.mode.value === 'pointer' && sort.source.value === keys[index]\"\n            :grabbed=\"sort.mode.value === 'keyboard' && sort.source.value === keys[index]\"\n          >\n            {{ item }}\n          </slot>\n        </div>\n      </div>\n    </div>\n  </GrCard>\n</template>\n","<script setup lang=\"ts\" generic=\"T\">\nimport { computed, nextTick, ref } from 'vue'\n\nimport GrCard, { type GrCardVariant } from '../GrCard'\nimport { useAnnouncer } from '../../composables/useAnnouncer'\nimport { useDragSort } from '../../composables/useDragSort'\nimport { useRovingFocus } from '../../composables/useRovingFocus'\nimport { insertionIndex, moveItem } from '../../composables/internal/dragSortGeometry'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport type { GrSortableOrientation } from './grSortableListStyles'\nimport {\n  contentClass,\n  dividedClass,\n  emptyClass,\n  handleClass,\n  handleDisabledClass,\n  indicatorAfterClass,\n  indicatorBeforeClass,\n  listClass,\n  rowDisabledClass,\n  rowDraggingClass,\n  rowFocusClass,\n  rowGrabbedClass,\n  rowLayoutClass,\n} from './grSortableListStyles'\n\nimport IconGripVertical from '~icons/lucide/grip-vertical'\n\nexport interface GrSortableListProps<TItem = unknown> {\n  /** Набор в текущем порядке. `v-model`: наружу уходит новый массив, вход не мутируется. */\n  modelValue: TItem[]\n  /** Ключ элемента: имя поля или функция. Без него — индекс. */\n  itemKey?: string | ((item: TItem, index: number) => string | number)\n  /** Список только для чтения: ни указателем, ни с клавиатуры. */\n  disabled?: boolean\n  /** Ось переноса. `horizontal` — ряд с переносом по ширине. */\n  orientation?: GrSortableOrientation\n  /** Поверхность под списком — вариант карточки. */\n  variant?: GrCardVariant\n  /** Разделители между строками. */\n  divided?: boolean\n  /** Тянуть можно только за ручку. Выключено — тянется вся строка. */\n  handleOnly?: boolean\n  /** Высота видимой части: список становится скроллером с автопрокруткой при переносе. */\n  maxHeight?: number | string\n  /** Текст пустого состояния. Слот `#empty` сильнее. */\n  emptyText?: string\n  /** Имя списка для скринридера. Не задано — берётся из локали. */\n  ariaLabel?: string\n}\n\nexport interface GrSortableListEmits<TItem = unknown> {\n  (e: 'update:modelValue', value: TItem[]): void\n  (e: 'move', from: number, to: number): void\n  (e: 'change', value: TItem[]): void\n}\n\nconst props = withDefaults(defineProps<GrSortableListProps<T>>(), {\n  itemKey: undefined,\n  disabled: false,\n  orientation: 'vertical',\n  variant: undefined,\n  divided: true,\n  handleOnly: true,\n  maxHeight: undefined,\n  emptyText: undefined,\n  ariaLabel: undefined,\n})\n\nconst emit = defineEmits<GrSortableListEmits<T>>()\n\ndefineSlots<{\n  item?: (props: { item: T, index: number, dragging: boolean, grabbed: boolean }) => any\n  handle?: (props: { item: T, index: number, disabled: boolean }) => any\n  empty?: () => any\n}>()\n\nconst { t } = useGranularityTranslations()\nconst { announce } = useAnnouncer()\n\nconst listEl = ref<HTMLElement | null>(null)\nconst rowEls = new Map<string, HTMLElement>()\n\nconst count = computed(() => props.modelValue.length)\nconst isEmpty = computed(() => count.value === 0)\nconst isVertical = computed(() => props.orientation === 'vertical')\n\nfunction keyOf(item: T, index: number): string {\n  if (typeof props.itemKey === 'function')\n    return String(props.itemKey(item, index))\n  if (typeof props.itemKey === 'string')\n    return String((item as Record<string, unknown>)[props.itemKey])\n\n  return String(index)\n}\n\nconst keys = computed(() => props.modelValue.map((item, index) => keyOf(item, index)))\n\nfunction indexOfKey(key: string): number {\n  return keys.value.indexOf(key)\n}\n\nfunction registerRow(key: string, el: unknown): void {\n  if (el instanceof HTMLElement) {\n    rowEls.set(key, el)\n    return\n  }\n\n  // Перестановка размонтирует старый узел уже после того, как встал новый:\n  // снимаем запись, только если она протухла (приём из `GrTree`).\n  const previous = rowEls.get(key)\n  if (previous && !previous.isConnected)\n    rowEls.delete(key)\n}\n\nconst roving = useRovingFocus<string>({\n  items: () => keys.value,\n  elementFor: key => rowEls.get(key) ?? null,\n  orientation: () => (isVertical.value ? 'vertical' : 'horizontal'),\n  wrap: () => false,\n})\n\nfunction applyMove(from: number, to: number): void {\n  if (from < 0 || to < 0 || from === to)\n    return\n\n  const next = moveItem(props.modelValue, from, to)\n  emit('update:modelValue', next)\n  emit('move', from, to)\n  emit('change', next)\n}\n\nconst sort = useDragSort<string, number>({\n  items: () => keys.value,\n  elementFor: key => rowEls.get(key) ?? null,\n  orientation: () => props.orientation,\n  scroller: () => (props.maxHeight === undefined ? null : listEl.value),\n  disabled: () => props.disabled,\n  resolveTarget: (hit, source) => insertionIndex(hit, indexOfKey(source), count.value),\n  onDrop: (source, to) => applyMove(indexOfKey(source), to),\n  onUpdate: (source, target, mode) => {\n    // Объявляется только клавиатурный перенос: у мыши всё видно на экране, а\n    // поток объявлений на каждом движении указателя делает диктор бесполезным.\n    if (mode !== 'keyboard' || source === null)\n      return\n\n    const position = (target ?? indexOfKey(source)) + 1\n    announce(t('gr.sortable.moved', 'Position {position} of {count}', { position, count: count.value }))\n  },\n})\n\nconst activeIndex = computed(() => (sort.source.value === null ? -1 : indexOfKey(sort.source.value)))\n\n/** Куда встанет строка: индикатор рисуется на строке-соседе, а не отдельным узлом. */\nfunction indicatorFor(index: number): 'before' | 'after' | null {\n  const target = sort.target.value\n  if (target === null || !sort.isActive.value || index === activeIndex.value)\n    return null\n\n  if (target === index)\n    return target < activeIndex.value || activeIndex.value === -1 ? 'before' : 'after'\n\n  return null\n}\n\nfunction rowClass(index: number, key: string): string[] {\n  const grabbed = sort.mode.value === 'keyboard' && sort.source.value === key\n  const dragging = sort.mode.value === 'pointer' && sort.source.value === key\n  const indicator = indicatorFor(index)\n\n  return [\n    rowLayoutClass,\n    rowFocusClass,\n    props.disabled ? rowDisabledClass : '',\n    grabbed ? rowGrabbedClass : '',\n    dragging ? rowDraggingClass : '',\n    indicator === 'before' ? indicatorBeforeClass : '',\n    indicator === 'after' ? indicatorAfterClass : '',\n  ]\n}\n\nfunction startPointer(key: string, event: PointerEvent): void {\n  if (props.disabled)\n    return\n\n  sort.startFrom(key)(event)\n}\n\nfunction grab(key: string): void {\n  sort.grab(key)\n  if (sort.mode.value !== 'keyboard')\n    return\n\n  // Цель ставится до объявления: `setTarget` сам объявляет позицию, и обратный\n  // порядок стёр бы более полное сообщение о захвате.\n  sort.setTarget(indexOfKey(key))\n  announce(t('gr.sortable.grabbed', 'Grabbed. Position {position} of {count}', {\n    position: indexOfKey(key) + 1,\n    count: count.value,\n  }))\n}\n\nasync function drop(key: string): Promise<void> {\n  const target = sort.target.value\n  sort.drop()\n\n  announce(t('gr.sortable.dropped', 'Dropped at position {position} of {count}', {\n    position: (target ?? 0) + 1,\n    count: count.value,\n  }))\n\n  // Фокус остаётся на перенесённой строке: иначе после переноса он падает на\n  // тело документа и клавиатурный сценарий обрывается на первом же шаге.\n  await nextTick()\n  await roving.focusKey(key)\n}\n\nfunction cancel(): void {\n  if (!sort.isActive.value)\n    return\n\n  sort.cancel()\n  announce(t('gr.sortable.cancelled', 'Move cancelled'))\n}\n\nfunction moveTargetBy(delta: number): void {\n  const current = sort.target.value ?? activeIndex.value\n  const next = Math.min(count.value - 1, Math.max(0, current + delta))\n\n  if (next !== current)\n    sort.setTarget(next)\n}\n\nfunction onRowKeydown(event: KeyboardEvent, key: string): void {\n  if (props.disabled)\n    return\n\n  const forward = isVertical.value ? 'ArrowDown' : 'ArrowRight'\n  const backward = isVertical.value ? 'ArrowUp' : 'ArrowLeft'\n  const grabbed = sort.mode.value === 'keyboard'\n\n  if (event.key === 'Escape') {\n    if (!grabbed)\n      return\n\n    event.preventDefault()\n    cancel()\n    return\n  }\n\n  if (event.key === ' ' || event.key === 'Enter') {\n    event.preventDefault()\n    if (grabbed)\n      void drop(key)\n    else grab(key)\n    return\n  }\n\n  if (grabbed) {\n    // Взятая строка забирает стрелки себе: двигается она, а не фокус.\n    if (event.key === forward || event.key === backward) {\n      event.preventDefault()\n      moveTargetBy(event.key === forward ? 1 : -1)\n    }\n    return\n  }\n\n  roving.handleNavigationKeys(event)\n}\n\n/** Фокус ушёл из списка — взятая строка не может остаться взятой навсегда. */\nfunction onFocusout(event: FocusEvent): void {\n  if (sort.mode.value !== 'keyboard')\n    return\n\n  const next = event.relatedTarget as Node | null\n  if (next && listEl.value?.contains(next))\n    return\n\n  cancel()\n}\n\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.sortable.empty', 'Nothing to sort yet'))\nconst resolvedLabel = computed(() => props.ariaLabel ?? t('gr.sortable.label', 'Sortable list'))\nconst handleLabel = computed(() => t('gr.sortable.handle', 'Reorder'))\n\nconst listStyle = computed(() => (props.maxHeight === undefined\n  ? undefined\n  : { maxHeight: typeof props.maxHeight === 'number' ? `${props.maxHeight}px` : props.maxHeight, overflow: 'auto' }))\n\ndefineExpose({\n  /** Программная перестановка — та же, что делает перенос. */\n  move: (from: number, to: number) => applyMove(from, to),\n  focusItem: (index: number) => roving.focusKey(keys.value[index]),\n})\n</script>\n\n<template>\n  <GrCard :variant=\"variant\">\n    <div\n      ref=\"listEl\"\n      role=\"list\"\n      data-gr-sortable\n      :aria-label=\"resolvedLabel\"\n      :aria-disabled=\"disabled ? 'true' : undefined\"\n      :class=\"[listClass[orientation], divided ? dividedClass : '']\"\n      :style=\"listStyle\"\n      @focusout=\"onFocusout\"\n    >\n      <div\n        v-if=\"isEmpty\"\n        data-gr-sortable-empty\n        :class=\"emptyClass\"\n      >\n        <slot name=\"empty\">\n          {{ resolvedEmptyText }}\n        </slot>\n      </div>\n\n      <div\n        v-for=\"(item, index) in modelValue\"\n        v-else\n        :key=\"keys[index]\"\n        :ref=\"el => registerRow(keys[index], el)\"\n        role=\"listitem\"\n        data-gr-sortable-item\n        :tabindex=\"disabled ? -1 : roving.tabindexFor(keys[index])\"\n        :aria-roledescription=\"handleLabel\"\n        :aria-posinset=\"index + 1\"\n        :aria-setsize=\"count\"\n        :aria-grabbed=\"sort.mode.value === 'keyboard' && sort.source.value === keys[index] ? 'true' : undefined\"\n        :class=\"rowClass(index, keys[index])\"\n        @keydown=\"onRowKeydown($event, keys[index])\"\n        @focus=\"roving.setActive(keys[index])\"\n        @pointerdown=\"handleOnly ? undefined : startPointer(keys[index], $event)\"\n      >\n        <button\n          type=\"button\"\n          tabindex=\"-1\"\n          data-gr-sortable-handle\n          :class=\"[handleClass, disabled ? handleDisabledClass : '']\"\n          :aria-label=\"handleLabel\"\n          :disabled=\"disabled\"\n          @pointerdown=\"startPointer(keys[index], $event)\"\n          @click.stop\n        >\n          <slot\n            name=\"handle\"\n            :item=\"item\"\n            :index=\"index\"\n            :disabled=\"disabled\"\n          >\n            <IconGripVertical class=\"block\" aria-hidden=\"true\" />\n          </slot>\n        </button>\n\n        <div :class=\"contentClass\">\n          <slot\n            name=\"item\"\n            :item=\"item\"\n            :index=\"index\"\n            :dragging=\"sort.mode.value === 'pointer' && sort.source.value === keys[index]\"\n            :grabbed=\"sort.mode.value === 'keyboard' && sort.source.value === keys[index]\"\n          >\n            {{ item }}\n          </slot>\n        </div>\n      </div>\n    </div>\n  </GrCard>\n</template>\n"],"mappings":"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"}

package/dist/components/GrSortableList/index.js

@@ -1,3 +1,3 @@
 import { n as grSortableListSafelist, t as grSortableListConfig } from "../../chunks/config-CbEbLyDE.js";
-import { t as GrSortableList_default } from "./chunks/GrSortableList-HyKX--rO.js";
+import { t as GrSortableList_default } from "./chunks/GrSortableList-CQCaWivn.js";
 export { GrSortableList_default as GrSortableList, GrSortableList_default as default, grSortableListConfig, grSortableListSafelist };

package/dist/components/GrSplitter/chunks/{GrSplitter-MltjaADn.js → GrSplitter-C-XQzq7q.js}

@@ -1,4 +1,4 @@
-import { i as useGrComponentProp } from "../../../chunks/context-CTbuwcYs.js";
+import { i as useGrComponentProp } from "../../../chunks/context-CPMRfwVr.js";
 import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
 import { useDragGesture } from "../../../composables/useDragGesture.js";
 import { a as separatorClass, i as rootClass, r as paneClass } from "../../../chunks/config-CvbVM4ep.js";

package/dist/components/GrSplitter/chunks/{GrSplitter-MltjaADn.js.map → GrSplitter-C-XQzq7q.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrSplitter-MltjaADn.js","names":[],"sources":["../../../../src/components/GrSplitter/splitterGeometry.ts","../../../../src/components/GrSplitter/GrSplitter.vue","../../../../src/components/GrSplitter/GrSplitter.vue"],"sourcesContent":["/**\n * Арифметика раздвижных панелей. Без Vue — проверяется без монтирования.\n *\n * Всё считается в процентах ширины (или высоты) контейнера: клавиатура,\n * границы и сворачивание работают без единого замера DOM, а серверный рендер\n * совпадает с клиентским. Замер нужен ровно в одном месте — перевод координаты\n * указателя в проценты.\n */\n\nexport const GR_SPLITTER_ORIENTATIONS = ['horizontal', 'vertical'] as const\n\nexport type GrSplitterOrientation = typeof GR_SPLITTER_ORIENTATIONS[number]\n\nexport interface GrSplitterBounds {\n  /** Минимум первой панели. */\n  min: number\n  /** Максимум первой панели. */\n  max: number\n  /** Минимум второй панели: без него её можно задавить в ноль. */\n  minEnd: number\n}\n\nfunction toFinite(value: number, fallback: number): number {\n  return Number.isFinite(value) ? value : fallback\n}\n\n/**\n * Приводит долю первой панели к допустимой.\n *\n * При конфликте `min` и `minEnd` побеждает `min`: первая панель не должна\n * уезжать под свой минимум, даже если вторая при этом окажется уже своего.\n * Обратный порядок дал бы панель, которую пользователь не может вернуть.\n */\nexport function clampSize(value: number, bounds: GrSplitterBounds): number {\n  const min = Math.min(100, Math.max(0, toFinite(bounds.min, 0)))\n  const max = Math.min(100, Math.max(min, toFinite(bounds.max, 100)))\n  const minEnd = Math.min(100, Math.max(0, toFinite(bounds.minEnd, 0)))\n\n  const upper = Math.max(min, Math.min(max, 100 - minEnd))\n\n  return Math.min(upper, Math.max(min, toFinite(value, min)))\n}\n\n/** Доля, соответствующая позиции указателя. Вне контейнера — его края. */\nexport function sizeFromPointer(\n  rect: { left: number, top: number, width: number, height: number },\n  clientX: number,\n  clientY: number,\n  orientation: GrSplitterOrientation,\n): number {\n  const total = orientation === 'horizontal' ? rect.width : rect.height\n  // Схлопнутый контейнер (ещё не в раскладке, `display: none`) — делить не на что.\n  if (!(total > 0))\n    return 0\n\n  const offset = orientation === 'horizontal' ? clientX - rect.left : clientY - rect.top\n\n  return Math.min(100, Math.max(0, (offset / total) * 100))\n}\n\n/**\n * Тянуть панель ниже половины её минимума пользователь может только с одним\n * намерением — убрать её совсем. Это единственный способ свернуть панель\n * мышью: двойной клик занят сбросом к дефолту, `Enter` — клавиатурой.\n */\nexport function shouldCollapse(value: number, bounds: GrSplitterBounds): boolean {\n  const min = Math.min(100, Math.max(0, toFinite(bounds.min, 0)))\n  if (min <= 0)\n    return false\n\n  return toFinite(value, min) < min / 2\n}\n","<script setup lang=\"ts\">\nimport { computed, ref, useId, watch } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\nimport { useDragGesture } from '../../composables/useDragGesture'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport { paneClass, rootClass, separatorClass } from './grSplitterStyles'\nimport {\n  clampSize,\n  shouldCollapse,\n  sizeFromPointer,\n  type GrSplitterBounds,\n  type GrSplitterOrientation,\n} from './splitterGeometry'\n\nexport type { GrSplitterOrientation } from './splitterGeometry'\n\n/**\n * Пропы {@link GrSplitter}.\n *\n * Две панели и разделитель между ними. Размер первой панели — доля контейнера\n * в процентах: она переживает смену ширины окна и рендерится на сервере без\n * замеров.\n */\nexport interface GrSplitterProps {\n  /** Доля первой панели в процентах. Поддерживает `v-model`; без него компонент помнит размер сам. */\n  modelValue?: number\n  /** Стартовая доля и точка возврата по двойному клику. */\n  defaultSize?: number\n  /** `horizontal` — панели рядом, `vertical` — одна над другой. */\n  orientation?: GrSplitterOrientation\n  /** Минимум первой панели в процентах. */\n  min?: number\n  /** Максимум первой панели в процентах. */\n  max?: number\n  /** Минимум второй панели: без него её можно задавить в ноль. */\n  minEnd?: number\n  /** Шаг стрелок. */\n  step?: number\n  /** Шаг стрелок с `Shift`. */\n  bigStep?: number\n  /** Разрешить сворачивание первой панели. */\n  collapsible?: boolean\n  /** Первая панель свёрнута. Поддерживает `v-model:collapsed`. */\n  collapsed?: boolean\n  /** Разделитель не тянется, не фокусируется и не отвечает на клавиши. */\n  disabled?: boolean\n  /** Имя разделителя для скринридера. Не задано — из локали. */\n  ariaLabel?: string\n}\n\nexport interface GrSplitterEmits {\n  (e: 'update:modelValue', value: number): void\n  (e: 'update:collapsed', value: boolean): void\n  /** Конец жеста и каждый шаг с клавиатуры: сюда вешают сохранение раскладки. */\n  (e: 'change', value: number): void\n}\n\nconst props = withDefaults(defineProps<GrSplitterProps>(), {\n  modelValue: undefined,\n  defaultSize: 50,\n  min: 10,\n  max: 90,\n  minEnd: 10,\n  step: 1,\n  bigStep: 10,\n  collapsed: false,\n  disabled: false,\n  ariaLabel: undefined,\n  // `undefined`, а не готовые значения: иначе `componentDefaults` до них не дошли бы.\n  orientation: undefined,\n  collapsible: undefined,\n})\n\nconst emit = defineEmits<GrSplitterEmits>()\n\ndefineSlots<{\n  /** Первая панель — та, чей размер задаёт модель. */\n  start?: () => any\n  /** Вторая панель: занимает остаток. */\n  end?: () => any\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst orientation = useGrComponentProp('GrSplitter', 'orientation', () => props.orientation, 'horizontal')\nconst collapsible = useGrComponentProp('GrSplitter', 'collapsible', () => props.collapsible, false)\n\nconst startId = useId()\nconst rootEl = ref<HTMLElement | null>(null)\n\nconst bounds = computed<GrSplitterBounds>(() => ({\n  min: props.min,\n  max: props.max,\n  minEnd: props.minEnd,\n}))\n\n/**\n * Локальное состояние с синхронизацией из пропа — поддерживает и controlled\n * (`v-model`), и uncontrolled (сплиттер помнит размер сам), как `collapsed`\n * у `GrSidebar`.\n */\nconst sizeState = ref(clampSize(props.modelValue ?? props.defaultSize, bounds.value))\nwatch(() => props.modelValue, (value) => {\n  if (value !== undefined)\n    sizeState.value = clampSize(value, bounds.value)\n})\n\nconst collapsedState = ref(props.collapsed)\nwatch(() => props.collapsed, value => (collapsedState.value = value))\n\n/** Размер, к которому возвращает `Enter`: свёрнутость не должна его терять. */\nconst restoreSize = ref(sizeState.value)\n\n/** Значение до начала жеста: `pointercancel` откатывает к нему. */\nlet sizeBeforeDrag = sizeState.value\nlet collapsedBeforeDrag = false\n\nconst isCollapsed = computed(() => collapsible.value && collapsedState.value)\n\n/** Что видно на экране: свёрнутая панель — это ноль в треке, но не ноль в модели. */\nconst renderedSize = computed(() => (isCollapsed.value ? 0 : clampSize(sizeState.value, bounds.value)))\n\nconst gridStyle = computed(() => {\n  const track = `${renderedSize.value}% var(--gr-splitter-size, 6px) 1fr`\n\n  return orientation.value === 'horizontal'\n    ? { gridTemplateColumns: track }\n    : { gridTemplateRows: track }\n})\n\n/**\n * `aria-orientation` описывает **сам разделитель**, а не раскладку: панели,\n * стоящие рядом, разделяет вертикальная полоса.\n */\nconst separatorOrientation = computed(() => (orientation.value === 'horizontal' ? 'vertical' : 'horizontal'))\n\nconst label = computed(() => props.ariaLabel ?? t('gr.splitter.label', 'Resize panels'))\n\nfunction setSize(next: number, commit: boolean): void {\n  const value = clampSize(next, bounds.value)\n  const changed = value !== sizeState.value\n\n  sizeState.value = value\n  if (changed)\n    emit('update:modelValue', value)\n  if (commit)\n    emit('change', value)\n}\n\nfunction setCollapsed(value: boolean): void {\n  if (collapsedState.value === value)\n    return\n\n  collapsedState.value = value\n  emit('update:collapsed', value)\n}\n\n/**\n * Шаг размера. Свёрнутая панель на первое нажатие возвращается — двигать\n * то, чего не видно, значит менять раскладку вслепую.\n */\nfunction moveBy(delta: number): void {\n  if (isCollapsed.value) {\n    setCollapsed(false)\n    setSize(restoreSize.value, true)\n    return\n  }\n\n  restoreSize.value = clampSize(sizeState.value + delta, bounds.value)\n  setSize(sizeState.value + delta, true)\n}\n\nfunction toggleCollapsed(): void {\n  if (!collapsible.value)\n    return\n\n  if (isCollapsed.value) {\n    setCollapsed(false)\n    setSize(restoreSize.value, true)\n    return\n  }\n\n  restoreSize.value = sizeState.value\n  setCollapsed(true)\n  emit('change', 0)\n}\n\nfunction reset(): void {\n  setCollapsed(false)\n  restoreSize.value = clampSize(props.defaultSize, bounds.value)\n  setSize(props.defaultSize, true)\n}\n\n// ————— Указатель.\nfunction onPointerMove(event: PointerEvent): void {\n  const rect = rootEl.value?.getBoundingClientRect()\n  if (!rect)\n    return\n\n  // Против выделения текста под курсором во время жеста.\n  event.preventDefault()\n\n  const raw = sizeFromPointer(rect, event.clientX, event.clientY, orientation.value)\n\n  if (collapsible.value && shouldCollapse(raw, bounds.value)) {\n    if (!collapsedState.value)\n      restoreSize.value = sizeState.value\n    setCollapsed(true)\n    return\n  }\n\n  setCollapsed(false)\n  restoreSize.value = clampSize(raw, bounds.value)\n  setSize(raw, false)\n}\n\nconst { isDragging, start: onPointerDown } = useDragGesture({\n  disabled: () => props.disabled,\n  onStart: () => {\n    sizeBeforeDrag = sizeState.value\n    collapsedBeforeDrag = collapsedState.value\n  },\n  onMove: onPointerMove,\n  onEnd: () => emit('change', renderedSize.value),\n  // Оборванный жест (браузер забрал указатель) не коммитит ничего: раскладка\n  // возвращается к той, что была до нажатия.\n  onCancel: () => {\n    setCollapsed(collapsedBeforeDrag)\n    setSize(sizeBeforeDrag, false)\n  },\n})\n\n// ————— Клавиатура.\nconst decreaseKey = computed(() => (orientation.value === 'horizontal' ? 'ArrowLeft' : 'ArrowUp'))\nconst increaseKey = computed(() => (orientation.value === 'horizontal' ? 'ArrowRight' : 'ArrowDown'))\n\nfunction onKeydown(event: KeyboardEvent): void {\n  if (props.disabled)\n    return\n\n  const step = event.shiftKey ? props.bigStep : props.step\n\n  if (event.key === decreaseKey.value)\n    moveBy(-step)\n  else if (event.key === increaseKey.value)\n    moveBy(step)\n  else if (event.key === 'Home')\n    moveBy(-100)\n  else if (event.key === 'End')\n    moveBy(100)\n  else if (event.key === 'Enter')\n    toggleCollapsed()\n  else return\n\n  // Дошли сюда — клавиша наша: страница не должна ещё и прокрутиться.\n  event.preventDefault()\n}\n\nfunction onDoubleClick(): void {\n  if (props.disabled)\n    return\n\n  reset()\n}\n</script>\n\n<template>\n  <div\n    ref=\"rootEl\"\n    data-gr-splitter\n    :data-orientation=\"orientation\"\n    :data-dragging=\"isDragging ? '' : undefined\"\n    :data-collapsed=\"isCollapsed ? '' : undefined\"\n    :class=\"rootClass\"\n    :style=\"gridStyle\"\n  >\n    <div\n      :id=\"startId\"\n      data-gr-splitter-pane=\"start\"\n      :class=\"paneClass\"\n    >\n      <slot name=\"start\" />\n    </div>\n\n    <div\n      data-gr-splitter-separator\n      role=\"separator\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-orientation=\"separatorOrientation\"\n      :aria-label=\"label\"\n      :aria-controls=\"startId\"\n      :aria-valuenow=\"Math.round(renderedSize)\"\n      :aria-valuemin=\"Math.round(min)\"\n      :aria-valuemax=\"Math.round(max)\"\n      :aria-disabled=\"disabled ? 'true' : undefined\"\n      :class=\"separatorClass\"\n      @pointerdown=\"onPointerDown\"\n      @keydown=\"onKeydown\"\n      @dblclick=\"onDoubleClick\"\n    />\n\n    <div\n      data-gr-splitter-pane=\"end\"\n      :class=\"paneClass\"\n    >\n      <slot name=\"end\" />\n    </div>\n  </div>\n</template>\n\n<style>\n[data-gr-splitter-separator] {\n  background-color: var(--gr-splitter-color, var(--gr-brd));\n}\n\n/*\n * Зона захвата шире видимой полосы: шесть пикселей мышью не берутся, а делать\n * ради этого полосу толще — значит красить раскладку под удобство мыши.\n */\n[data-gr-splitter-separator]::before {\n  content: '';\n  position: absolute;\n  inset: calc(-1 * var(--gr-splitter-hit, 4px));\n}\n\n/* Насечка: короткая полоса посередине — единственный видимый намёк, что это ручка. */\n[data-gr-splitter-separator]::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  border-radius: var(--gr-radius-full);\n  background-color: var(--gr-splitter-hover-color, var(--gr-muted-fg));\n  opacity: 0;\n  transform: translate(-50%, -50%);\n  transition: opacity var(--gr-duration-fast) var(--gr-ease-out);\n}\n\n[data-gr-splitter][data-orientation='horizontal'] [data-gr-splitter-separator] {\n  cursor: col-resize;\n}\n\n[data-gr-splitter][data-orientation='horizontal'] [data-gr-splitter-separator]::after {\n  width: 2px;\n  height: var(--gr-splitter-grip, 24px);\n}\n\n[data-gr-splitter][data-orientation='vertical'] [data-gr-splitter-separator] {\n  cursor: row-resize;\n}\n\n[data-gr-splitter][data-orientation='vertical'] [data-gr-splitter-separator]::after {\n  width: var(--gr-splitter-grip, 24px);\n  height: 2px;\n}\n\n[data-gr-splitter-separator]:hover {\n  background-color: var(--gr-splitter-hover-color, var(--gr-muted-fg));\n}\n\n[data-gr-splitter-separator]:hover::after,\n[data-gr-splitter-separator]:focus-visible::after {\n  opacity: 1;\n}\n\n/* На залитой полосе насечка читается только вырезом — цветом страницы. */\n[data-gr-splitter-separator]:hover::after,\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator]::after {\n  background-color: var(--gr-bg);\n}\n\n/* Во время жеста полоса подсвечена, даже если курсор ушёл с неё. */\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator] {\n  background-color: var(--gr-splitter-active-color, var(--gr-primary));\n}\n\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator]::after {\n  opacity: 1;\n}\n\n/* Жест не должен попутно выделять текст в панелях. */\n[data-gr-splitter][data-dragging] {\n  user-select: none;\n}\n\n[data-gr-splitter-separator][aria-disabled='true'] {\n  cursor: default;\n}\n\n[data-gr-splitter-separator][aria-disabled='true']::after {\n  display: none;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref, useId, watch } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\nimport { useDragGesture } from '../../composables/useDragGesture'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport { paneClass, rootClass, separatorClass } from './grSplitterStyles'\nimport {\n  clampSize,\n  shouldCollapse,\n  sizeFromPointer,\n  type GrSplitterBounds,\n  type GrSplitterOrientation,\n} from './splitterGeometry'\n\nexport type { GrSplitterOrientation } from './splitterGeometry'\n\n/**\n * Пропы {@link GrSplitter}.\n *\n * Две панели и разделитель между ними. Размер первой панели — доля контейнера\n * в процентах: она переживает смену ширины окна и рендерится на сервере без\n * замеров.\n */\nexport interface GrSplitterProps {\n  /** Доля первой панели в процентах. Поддерживает `v-model`; без него компонент помнит размер сам. */\n  modelValue?: number\n  /** Стартовая доля и точка возврата по двойному клику. */\n  defaultSize?: number\n  /** `horizontal` — панели рядом, `vertical` — одна над другой. */\n  orientation?: GrSplitterOrientation\n  /** Минимум первой панели в процентах. */\n  min?: number\n  /** Максимум первой панели в процентах. */\n  max?: number\n  /** Минимум второй панели: без него её можно задавить в ноль. */\n  minEnd?: number\n  /** Шаг стрелок. */\n  step?: number\n  /** Шаг стрелок с `Shift`. */\n  bigStep?: number\n  /** Разрешить сворачивание первой панели. */\n  collapsible?: boolean\n  /** Первая панель свёрнута. Поддерживает `v-model:collapsed`. */\n  collapsed?: boolean\n  /** Разделитель не тянется, не фокусируется и не отвечает на клавиши. */\n  disabled?: boolean\n  /** Имя разделителя для скринридера. Не задано — из локали. */\n  ariaLabel?: string\n}\n\nexport interface GrSplitterEmits {\n  (e: 'update:modelValue', value: number): void\n  (e: 'update:collapsed', value: boolean): void\n  /** Конец жеста и каждый шаг с клавиатуры: сюда вешают сохранение раскладки. */\n  (e: 'change', value: number): void\n}\n\nconst props = withDefaults(defineProps<GrSplitterProps>(), {\n  modelValue: undefined,\n  defaultSize: 50,\n  min: 10,\n  max: 90,\n  minEnd: 10,\n  step: 1,\n  bigStep: 10,\n  collapsed: false,\n  disabled: false,\n  ariaLabel: undefined,\n  // `undefined`, а не готовые значения: иначе `componentDefaults` до них не дошли бы.\n  orientation: undefined,\n  collapsible: undefined,\n})\n\nconst emit = defineEmits<GrSplitterEmits>()\n\ndefineSlots<{\n  /** Первая панель — та, чей размер задаёт модель. */\n  start?: () => any\n  /** Вторая панель: занимает остаток. */\n  end?: () => any\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst orientation = useGrComponentProp('GrSplitter', 'orientation', () => props.orientation, 'horizontal')\nconst collapsible = useGrComponentProp('GrSplitter', 'collapsible', () => props.collapsible, false)\n\nconst startId = useId()\nconst rootEl = ref<HTMLElement | null>(null)\n\nconst bounds = computed<GrSplitterBounds>(() => ({\n  min: props.min,\n  max: props.max,\n  minEnd: props.minEnd,\n}))\n\n/**\n * Локальное состояние с синхронизацией из пропа — поддерживает и controlled\n * (`v-model`), и uncontrolled (сплиттер помнит размер сам), как `collapsed`\n * у `GrSidebar`.\n */\nconst sizeState = ref(clampSize(props.modelValue ?? props.defaultSize, bounds.value))\nwatch(() => props.modelValue, (value) => {\n  if (value !== undefined)\n    sizeState.value = clampSize(value, bounds.value)\n})\n\nconst collapsedState = ref(props.collapsed)\nwatch(() => props.collapsed, value => (collapsedState.value = value))\n\n/** Размер, к которому возвращает `Enter`: свёрнутость не должна его терять. */\nconst restoreSize = ref(sizeState.value)\n\n/** Значение до начала жеста: `pointercancel` откатывает к нему. */\nlet sizeBeforeDrag = sizeState.value\nlet collapsedBeforeDrag = false\n\nconst isCollapsed = computed(() => collapsible.value && collapsedState.value)\n\n/** Что видно на экране: свёрнутая панель — это ноль в треке, но не ноль в модели. */\nconst renderedSize = computed(() => (isCollapsed.value ? 0 : clampSize(sizeState.value, bounds.value)))\n\nconst gridStyle = computed(() => {\n  const track = `${renderedSize.value}% var(--gr-splitter-size, 6px) 1fr`\n\n  return orientation.value === 'horizontal'\n    ? { gridTemplateColumns: track }\n    : { gridTemplateRows: track }\n})\n\n/**\n * `aria-orientation` описывает **сам разделитель**, а не раскладку: панели,\n * стоящие рядом, разделяет вертикальная полоса.\n */\nconst separatorOrientation = computed(() => (orientation.value === 'horizontal' ? 'vertical' : 'horizontal'))\n\nconst label = computed(() => props.ariaLabel ?? t('gr.splitter.label', 'Resize panels'))\n\nfunction setSize(next: number, commit: boolean): void {\n  const value = clampSize(next, bounds.value)\n  const changed = value !== sizeState.value\n\n  sizeState.value = value\n  if (changed)\n    emit('update:modelValue', value)\n  if (commit)\n    emit('change', value)\n}\n\nfunction setCollapsed(value: boolean): void {\n  if (collapsedState.value === value)\n    return\n\n  collapsedState.value = value\n  emit('update:collapsed', value)\n}\n\n/**\n * Шаг размера. Свёрнутая панель на первое нажатие возвращается — двигать\n * то, чего не видно, значит менять раскладку вслепую.\n */\nfunction moveBy(delta: number): void {\n  if (isCollapsed.value) {\n    setCollapsed(false)\n    setSize(restoreSize.value, true)\n    return\n  }\n\n  restoreSize.value = clampSize(sizeState.value + delta, bounds.value)\n  setSize(sizeState.value + delta, true)\n}\n\nfunction toggleCollapsed(): void {\n  if (!collapsible.value)\n    return\n\n  if (isCollapsed.value) {\n    setCollapsed(false)\n    setSize(restoreSize.value, true)\n    return\n  }\n\n  restoreSize.value = sizeState.value\n  setCollapsed(true)\n  emit('change', 0)\n}\n\nfunction reset(): void {\n  setCollapsed(false)\n  restoreSize.value = clampSize(props.defaultSize, bounds.value)\n  setSize(props.defaultSize, true)\n}\n\n// ————— Указатель.\nfunction onPointerMove(event: PointerEvent): void {\n  const rect = rootEl.value?.getBoundingClientRect()\n  if (!rect)\n    return\n\n  // Против выделения текста под курсором во время жеста.\n  event.preventDefault()\n\n  const raw = sizeFromPointer(rect, event.clientX, event.clientY, orientation.value)\n\n  if (collapsible.value && shouldCollapse(raw, bounds.value)) {\n    if (!collapsedState.value)\n      restoreSize.value = sizeState.value\n    setCollapsed(true)\n    return\n  }\n\n  setCollapsed(false)\n  restoreSize.value = clampSize(raw, bounds.value)\n  setSize(raw, false)\n}\n\nconst { isDragging, start: onPointerDown } = useDragGesture({\n  disabled: () => props.disabled,\n  onStart: () => {\n    sizeBeforeDrag = sizeState.value\n    collapsedBeforeDrag = collapsedState.value\n  },\n  onMove: onPointerMove,\n  onEnd: () => emit('change', renderedSize.value),\n  // Оборванный жест (браузер забрал указатель) не коммитит ничего: раскладка\n  // возвращается к той, что была до нажатия.\n  onCancel: () => {\n    setCollapsed(collapsedBeforeDrag)\n    setSize(sizeBeforeDrag, false)\n  },\n})\n\n// ————— Клавиатура.\nconst decreaseKey = computed(() => (orientation.value === 'horizontal' ? 'ArrowLeft' : 'ArrowUp'))\nconst increaseKey = computed(() => (orientation.value === 'horizontal' ? 'ArrowRight' : 'ArrowDown'))\n\nfunction onKeydown(event: KeyboardEvent): void {\n  if (props.disabled)\n    return\n\n  const step = event.shiftKey ? props.bigStep : props.step\n\n  if (event.key === decreaseKey.value)\n    moveBy(-step)\n  else if (event.key === increaseKey.value)\n    moveBy(step)\n  else if (event.key === 'Home')\n    moveBy(-100)\n  else if (event.key === 'End')\n    moveBy(100)\n  else if (event.key === 'Enter')\n    toggleCollapsed()\n  else return\n\n  // Дошли сюда — клавиша наша: страница не должна ещё и прокрутиться.\n  event.preventDefault()\n}\n\nfunction onDoubleClick(): void {\n  if (props.disabled)\n    return\n\n  reset()\n}\n</script>\n\n<template>\n  <div\n    ref=\"rootEl\"\n    data-gr-splitter\n    :data-orientation=\"orientation\"\n    :data-dragging=\"isDragging ? '' : undefined\"\n    :data-collapsed=\"isCollapsed ? '' : undefined\"\n    :class=\"rootClass\"\n    :style=\"gridStyle\"\n  >\n    <div\n      :id=\"startId\"\n      data-gr-splitter-pane=\"start\"\n      :class=\"paneClass\"\n    >\n      <slot name=\"start\" />\n    </div>\n\n    <div\n      data-gr-splitter-separator\n      role=\"separator\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-orientation=\"separatorOrientation\"\n      :aria-label=\"label\"\n      :aria-controls=\"startId\"\n      :aria-valuenow=\"Math.round(renderedSize)\"\n      :aria-valuemin=\"Math.round(min)\"\n      :aria-valuemax=\"Math.round(max)\"\n      :aria-disabled=\"disabled ? 'true' : undefined\"\n      :class=\"separatorClass\"\n      @pointerdown=\"onPointerDown\"\n      @keydown=\"onKeydown\"\n      @dblclick=\"onDoubleClick\"\n    />\n\n    <div\n      data-gr-splitter-pane=\"end\"\n      :class=\"paneClass\"\n    >\n      <slot name=\"end\" />\n    </div>\n  </div>\n</template>\n\n<style>\n[data-gr-splitter-separator] {\n  background-color: var(--gr-splitter-color, var(--gr-brd));\n}\n\n/*\n * Зона захвата шире видимой полосы: шесть пикселей мышью не берутся, а делать\n * ради этого полосу толще — значит красить раскладку под удобство мыши.\n */\n[data-gr-splitter-separator]::before {\n  content: '';\n  position: absolute;\n  inset: calc(-1 * var(--gr-splitter-hit, 4px));\n}\n\n/* Насечка: короткая полоса посередине — единственный видимый намёк, что это ручка. */\n[data-gr-splitter-separator]::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  border-radius: var(--gr-radius-full);\n  background-color: var(--gr-splitter-hover-color, var(--gr-muted-fg));\n  opacity: 0;\n  transform: translate(-50%, -50%);\n  transition: opacity var(--gr-duration-fast) var(--gr-ease-out);\n}\n\n[data-gr-splitter][data-orientation='horizontal'] [data-gr-splitter-separator] {\n  cursor: col-resize;\n}\n\n[data-gr-splitter][data-orientation='horizontal'] [data-gr-splitter-separator]::after {\n  width: 2px;\n  height: var(--gr-splitter-grip, 24px);\n}\n\n[data-gr-splitter][data-orientation='vertical'] [data-gr-splitter-separator] {\n  cursor: row-resize;\n}\n\n[data-gr-splitter][data-orientation='vertical'] [data-gr-splitter-separator]::after {\n  width: var(--gr-splitter-grip, 24px);\n  height: 2px;\n}\n\n[data-gr-splitter-separator]:hover {\n  background-color: var(--gr-splitter-hover-color, var(--gr-muted-fg));\n}\n\n[data-gr-splitter-separator]:hover::after,\n[data-gr-splitter-separator]:focus-visible::after {\n  opacity: 1;\n}\n\n/* На залитой полосе насечка читается только вырезом — цветом страницы. */\n[data-gr-splitter-separator]:hover::after,\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator]::after {\n  background-color: var(--gr-bg);\n}\n\n/* Во время жеста полоса подсвечена, даже если курсор ушёл с неё. */\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator] {\n  background-color: var(--gr-splitter-active-color, var(--gr-primary));\n}\n\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator]::after {\n  opacity: 1;\n}\n\n/* Жест не должен попутно выделять текст в панелях. */\n[data-gr-splitter][data-dragging] {\n  user-select: none;\n}\n\n[data-gr-splitter-separator][aria-disabled='true'] {\n  cursor: default;\n}\n\n[data-gr-splitter-separator][aria-disabled='true']::after {\n  display: none;\n}\n</style>\n"],"mappings":"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"}
+{"version":3,"file":"GrSplitter-C-XQzq7q.js","names":[],"sources":["../../../../src/components/GrSplitter/splitterGeometry.ts","../../../../src/components/GrSplitter/GrSplitter.vue","../../../../src/components/GrSplitter/GrSplitter.vue"],"sourcesContent":["/**\n * Арифметика раздвижных панелей. Без Vue — проверяется без монтирования.\n *\n * Всё считается в процентах ширины (или высоты) контейнера: клавиатура,\n * границы и сворачивание работают без единого замера DOM, а серверный рендер\n * совпадает с клиентским. Замер нужен ровно в одном месте — перевод координаты\n * указателя в проценты.\n */\n\nexport const GR_SPLITTER_ORIENTATIONS = ['horizontal', 'vertical'] as const\n\nexport type GrSplitterOrientation = typeof GR_SPLITTER_ORIENTATIONS[number]\n\nexport interface GrSplitterBounds {\n  /** Минимум первой панели. */\n  min: number\n  /** Максимум первой панели. */\n  max: number\n  /** Минимум второй панели: без него её можно задавить в ноль. */\n  minEnd: number\n}\n\nfunction toFinite(value: number, fallback: number): number {\n  return Number.isFinite(value) ? value : fallback\n}\n\n/**\n * Приводит долю первой панели к допустимой.\n *\n * При конфликте `min` и `minEnd` побеждает `min`: первая панель не должна\n * уезжать под свой минимум, даже если вторая при этом окажется уже своего.\n * Обратный порядок дал бы панель, которую пользователь не может вернуть.\n */\nexport function clampSize(value: number, bounds: GrSplitterBounds): number {\n  const min = Math.min(100, Math.max(0, toFinite(bounds.min, 0)))\n  const max = Math.min(100, Math.max(min, toFinite(bounds.max, 100)))\n  const minEnd = Math.min(100, Math.max(0, toFinite(bounds.minEnd, 0)))\n\n  const upper = Math.max(min, Math.min(max, 100 - minEnd))\n\n  return Math.min(upper, Math.max(min, toFinite(value, min)))\n}\n\n/** Доля, соответствующая позиции указателя. Вне контейнера — его края. */\nexport function sizeFromPointer(\n  rect: { left: number, top: number, width: number, height: number },\n  clientX: number,\n  clientY: number,\n  orientation: GrSplitterOrientation,\n): number {\n  const total = orientation === 'horizontal' ? rect.width : rect.height\n  // Схлопнутый контейнер (ещё не в раскладке, `display: none`) — делить не на что.\n  if (!(total > 0))\n    return 0\n\n  const offset = orientation === 'horizontal' ? clientX - rect.left : clientY - rect.top\n\n  return Math.min(100, Math.max(0, (offset / total) * 100))\n}\n\n/**\n * Тянуть панель ниже половины её минимума пользователь может только с одним\n * намерением — убрать её совсем. Это единственный способ свернуть панель\n * мышью: двойной клик занят сбросом к дефолту, `Enter` — клавиатурой.\n */\nexport function shouldCollapse(value: number, bounds: GrSplitterBounds): boolean {\n  const min = Math.min(100, Math.max(0, toFinite(bounds.min, 0)))\n  if (min <= 0)\n    return false\n\n  return toFinite(value, min) < min / 2\n}\n","<script setup lang=\"ts\">\nimport { computed, ref, useId, watch } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\nimport { useDragGesture } from '../../composables/useDragGesture'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport { paneClass, rootClass, separatorClass } from './grSplitterStyles'\nimport {\n  clampSize,\n  shouldCollapse,\n  sizeFromPointer,\n  type GrSplitterBounds,\n  type GrSplitterOrientation,\n} from './splitterGeometry'\n\nexport type { GrSplitterOrientation } from './splitterGeometry'\n\n/**\n * Пропы {@link GrSplitter}.\n *\n * Две панели и разделитель между ними. Размер первой панели — доля контейнера\n * в процентах: она переживает смену ширины окна и рендерится на сервере без\n * замеров.\n */\nexport interface GrSplitterProps {\n  /** Доля первой панели в процентах. Поддерживает `v-model`; без него компонент помнит размер сам. */\n  modelValue?: number\n  /** Стартовая доля и точка возврата по двойному клику. */\n  defaultSize?: number\n  /** `horizontal` — панели рядом, `vertical` — одна над другой. */\n  orientation?: GrSplitterOrientation\n  /** Минимум первой панели в процентах. */\n  min?: number\n  /** Максимум первой панели в процентах. */\n  max?: number\n  /** Минимум второй панели: без него её можно задавить в ноль. */\n  minEnd?: number\n  /** Шаг стрелок. */\n  step?: number\n  /** Шаг стрелок с `Shift`. */\n  bigStep?: number\n  /** Разрешить сворачивание первой панели. */\n  collapsible?: boolean\n  /** Первая панель свёрнута. Поддерживает `v-model:collapsed`. */\n  collapsed?: boolean\n  /** Разделитель не тянется, не фокусируется и не отвечает на клавиши. */\n  disabled?: boolean\n  /** Имя разделителя для скринридера. Не задано — из локали. */\n  ariaLabel?: string\n}\n\nexport interface GrSplitterEmits {\n  (e: 'update:modelValue', value: number): void\n  (e: 'update:collapsed', value: boolean): void\n  /** Конец жеста и каждый шаг с клавиатуры: сюда вешают сохранение раскладки. */\n  (e: 'change', value: number): void\n}\n\nconst props = withDefaults(defineProps<GrSplitterProps>(), {\n  modelValue: undefined,\n  defaultSize: 50,\n  min: 10,\n  max: 90,\n  minEnd: 10,\n  step: 1,\n  bigStep: 10,\n  collapsed: false,\n  disabled: false,\n  ariaLabel: undefined,\n  // `undefined`, а не готовые значения: иначе `componentDefaults` до них не дошли бы.\n  orientation: undefined,\n  collapsible: undefined,\n})\n\nconst emit = defineEmits<GrSplitterEmits>()\n\ndefineSlots<{\n  /** Первая панель — та, чей размер задаёт модель. */\n  start?: () => any\n  /** Вторая панель: занимает остаток. */\n  end?: () => any\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst orientation = useGrComponentProp('GrSplitter', 'orientation', () => props.orientation, 'horizontal')\nconst collapsible = useGrComponentProp('GrSplitter', 'collapsible', () => props.collapsible, false)\n\nconst startId = useId()\nconst rootEl = ref<HTMLElement | null>(null)\n\nconst bounds = computed<GrSplitterBounds>(() => ({\n  min: props.min,\n  max: props.max,\n  minEnd: props.minEnd,\n}))\n\n/**\n * Локальное состояние с синхронизацией из пропа — поддерживает и controlled\n * (`v-model`), и uncontrolled (сплиттер помнит размер сам), как `collapsed`\n * у `GrSidebar`.\n */\nconst sizeState = ref(clampSize(props.modelValue ?? props.defaultSize, bounds.value))\nwatch(() => props.modelValue, (value) => {\n  if (value !== undefined)\n    sizeState.value = clampSize(value, bounds.value)\n})\n\nconst collapsedState = ref(props.collapsed)\nwatch(() => props.collapsed, value => (collapsedState.value = value))\n\n/** Размер, к которому возвращает `Enter`: свёрнутость не должна его терять. */\nconst restoreSize = ref(sizeState.value)\n\n/** Значение до начала жеста: `pointercancel` откатывает к нему. */\nlet sizeBeforeDrag = sizeState.value\nlet collapsedBeforeDrag = false\n\nconst isCollapsed = computed(() => collapsible.value && collapsedState.value)\n\n/** Что видно на экране: свёрнутая панель — это ноль в треке, но не ноль в модели. */\nconst renderedSize = computed(() => (isCollapsed.value ? 0 : clampSize(sizeState.value, bounds.value)))\n\nconst gridStyle = computed(() => {\n  const track = `${renderedSize.value}% var(--gr-splitter-size, 6px) 1fr`\n\n  return orientation.value === 'horizontal'\n    ? { gridTemplateColumns: track }\n    : { gridTemplateRows: track }\n})\n\n/**\n * `aria-orientation` описывает **сам разделитель**, а не раскладку: панели,\n * стоящие рядом, разделяет вертикальная полоса.\n */\nconst separatorOrientation = computed(() => (orientation.value === 'horizontal' ? 'vertical' : 'horizontal'))\n\nconst label = computed(() => props.ariaLabel ?? t('gr.splitter.label', 'Resize panels'))\n\nfunction setSize(next: number, commit: boolean): void {\n  const value = clampSize(next, bounds.value)\n  const changed = value !== sizeState.value\n\n  sizeState.value = value\n  if (changed)\n    emit('update:modelValue', value)\n  if (commit)\n    emit('change', value)\n}\n\nfunction setCollapsed(value: boolean): void {\n  if (collapsedState.value === value)\n    return\n\n  collapsedState.value = value\n  emit('update:collapsed', value)\n}\n\n/**\n * Шаг размера. Свёрнутая панель на первое нажатие возвращается — двигать\n * то, чего не видно, значит менять раскладку вслепую.\n */\nfunction moveBy(delta: number): void {\n  if (isCollapsed.value) {\n    setCollapsed(false)\n    setSize(restoreSize.value, true)\n    return\n  }\n\n  restoreSize.value = clampSize(sizeState.value + delta, bounds.value)\n  setSize(sizeState.value + delta, true)\n}\n\nfunction toggleCollapsed(): void {\n  if (!collapsible.value)\n    return\n\n  if (isCollapsed.value) {\n    setCollapsed(false)\n    setSize(restoreSize.value, true)\n    return\n  }\n\n  restoreSize.value = sizeState.value\n  setCollapsed(true)\n  emit('change', 0)\n}\n\nfunction reset(): void {\n  setCollapsed(false)\n  restoreSize.value = clampSize(props.defaultSize, bounds.value)\n  setSize(props.defaultSize, true)\n}\n\n// ————— Указатель.\nfunction onPointerMove(event: PointerEvent): void {\n  const rect = rootEl.value?.getBoundingClientRect()\n  if (!rect)\n    return\n\n  // Против выделения текста под курсором во время жеста.\n  event.preventDefault()\n\n  const raw = sizeFromPointer(rect, event.clientX, event.clientY, orientation.value)\n\n  if (collapsible.value && shouldCollapse(raw, bounds.value)) {\n    if (!collapsedState.value)\n      restoreSize.value = sizeState.value\n    setCollapsed(true)\n    return\n  }\n\n  setCollapsed(false)\n  restoreSize.value = clampSize(raw, bounds.value)\n  setSize(raw, false)\n}\n\nconst { isDragging, start: onPointerDown } = useDragGesture({\n  disabled: () => props.disabled,\n  onStart: () => {\n    sizeBeforeDrag = sizeState.value\n    collapsedBeforeDrag = collapsedState.value\n  },\n  onMove: onPointerMove,\n  onEnd: () => emit('change', renderedSize.value),\n  // Оборванный жест (браузер забрал указатель) не коммитит ничего: раскладка\n  // возвращается к той, что была до нажатия.\n  onCancel: () => {\n    setCollapsed(collapsedBeforeDrag)\n    setSize(sizeBeforeDrag, false)\n  },\n})\n\n// ————— Клавиатура.\nconst decreaseKey = computed(() => (orientation.value === 'horizontal' ? 'ArrowLeft' : 'ArrowUp'))\nconst increaseKey = computed(() => (orientation.value === 'horizontal' ? 'ArrowRight' : 'ArrowDown'))\n\nfunction onKeydown(event: KeyboardEvent): void {\n  if (props.disabled)\n    return\n\n  const step = event.shiftKey ? props.bigStep : props.step\n\n  if (event.key === decreaseKey.value)\n    moveBy(-step)\n  else if (event.key === increaseKey.value)\n    moveBy(step)\n  else if (event.key === 'Home')\n    moveBy(-100)\n  else if (event.key === 'End')\n    moveBy(100)\n  else if (event.key === 'Enter')\n    toggleCollapsed()\n  else return\n\n  // Дошли сюда — клавиша наша: страница не должна ещё и прокрутиться.\n  event.preventDefault()\n}\n\nfunction onDoubleClick(): void {\n  if (props.disabled)\n    return\n\n  reset()\n}\n</script>\n\n<template>\n  <div\n    ref=\"rootEl\"\n    data-gr-splitter\n    :data-orientation=\"orientation\"\n    :data-dragging=\"isDragging ? '' : undefined\"\n    :data-collapsed=\"isCollapsed ? '' : undefined\"\n    :class=\"rootClass\"\n    :style=\"gridStyle\"\n  >\n    <div\n      :id=\"startId\"\n      data-gr-splitter-pane=\"start\"\n      :class=\"paneClass\"\n    >\n      <slot name=\"start\" />\n    </div>\n\n    <div\n      data-gr-splitter-separator\n      role=\"separator\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-orientation=\"separatorOrientation\"\n      :aria-label=\"label\"\n      :aria-controls=\"startId\"\n      :aria-valuenow=\"Math.round(renderedSize)\"\n      :aria-valuemin=\"Math.round(min)\"\n      :aria-valuemax=\"Math.round(max)\"\n      :aria-disabled=\"disabled ? 'true' : undefined\"\n      :class=\"separatorClass\"\n      @pointerdown=\"onPointerDown\"\n      @keydown=\"onKeydown\"\n      @dblclick=\"onDoubleClick\"\n    />\n\n    <div\n      data-gr-splitter-pane=\"end\"\n      :class=\"paneClass\"\n    >\n      <slot name=\"end\" />\n    </div>\n  </div>\n</template>\n\n<style>\n[data-gr-splitter-separator] {\n  background-color: var(--gr-splitter-color, var(--gr-brd));\n}\n\n/*\n * Зона захвата шире видимой полосы: шесть пикселей мышью не берутся, а делать\n * ради этого полосу толще — значит красить раскладку под удобство мыши.\n */\n[data-gr-splitter-separator]::before {\n  content: '';\n  position: absolute;\n  inset: calc(-1 * var(--gr-splitter-hit, 4px));\n}\n\n/* Насечка: короткая полоса посередине — единственный видимый намёк, что это ручка. */\n[data-gr-splitter-separator]::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  border-radius: var(--gr-radius-full);\n  background-color: var(--gr-splitter-hover-color, var(--gr-muted-fg));\n  opacity: 0;\n  transform: translate(-50%, -50%);\n  transition: opacity var(--gr-duration-fast) var(--gr-ease-out);\n}\n\n[data-gr-splitter][data-orientation='horizontal'] [data-gr-splitter-separator] {\n  cursor: col-resize;\n}\n\n[data-gr-splitter][data-orientation='horizontal'] [data-gr-splitter-separator]::after {\n  width: 2px;\n  height: var(--gr-splitter-grip, 24px);\n}\n\n[data-gr-splitter][data-orientation='vertical'] [data-gr-splitter-separator] {\n  cursor: row-resize;\n}\n\n[data-gr-splitter][data-orientation='vertical'] [data-gr-splitter-separator]::after {\n  width: var(--gr-splitter-grip, 24px);\n  height: 2px;\n}\n\n[data-gr-splitter-separator]:hover {\n  background-color: var(--gr-splitter-hover-color, var(--gr-muted-fg));\n}\n\n[data-gr-splitter-separator]:hover::after,\n[data-gr-splitter-separator]:focus-visible::after {\n  opacity: 1;\n}\n\n/* На залитой полосе насечка читается только вырезом — цветом страницы. */\n[data-gr-splitter-separator]:hover::after,\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator]::after {\n  background-color: var(--gr-bg);\n}\n\n/* Во время жеста полоса подсвечена, даже если курсор ушёл с неё. */\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator] {\n  background-color: var(--gr-splitter-active-color, var(--gr-primary));\n}\n\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator]::after {\n  opacity: 1;\n}\n\n/* Жест не должен попутно выделять текст в панелях. */\n[data-gr-splitter][data-dragging] {\n  user-select: none;\n}\n\n[data-gr-splitter-separator][aria-disabled='true'] {\n  cursor: default;\n}\n\n[data-gr-splitter-separator][aria-disabled='true']::after {\n  display: none;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, ref, useId, watch } from 'vue'\n\nimport { useGrComponentProp } from '../GrConfigProvider/context'\nimport { useDragGesture } from '../../composables/useDragGesture'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport { paneClass, rootClass, separatorClass } from './grSplitterStyles'\nimport {\n  clampSize,\n  shouldCollapse,\n  sizeFromPointer,\n  type GrSplitterBounds,\n  type GrSplitterOrientation,\n} from './splitterGeometry'\n\nexport type { GrSplitterOrientation } from './splitterGeometry'\n\n/**\n * Пропы {@link GrSplitter}.\n *\n * Две панели и разделитель между ними. Размер первой панели — доля контейнера\n * в процентах: она переживает смену ширины окна и рендерится на сервере без\n * замеров.\n */\nexport interface GrSplitterProps {\n  /** Доля первой панели в процентах. Поддерживает `v-model`; без него компонент помнит размер сам. */\n  modelValue?: number\n  /** Стартовая доля и точка возврата по двойному клику. */\n  defaultSize?: number\n  /** `horizontal` — панели рядом, `vertical` — одна над другой. */\n  orientation?: GrSplitterOrientation\n  /** Минимум первой панели в процентах. */\n  min?: number\n  /** Максимум первой панели в процентах. */\n  max?: number\n  /** Минимум второй панели: без него её можно задавить в ноль. */\n  minEnd?: number\n  /** Шаг стрелок. */\n  step?: number\n  /** Шаг стрелок с `Shift`. */\n  bigStep?: number\n  /** Разрешить сворачивание первой панели. */\n  collapsible?: boolean\n  /** Первая панель свёрнута. Поддерживает `v-model:collapsed`. */\n  collapsed?: boolean\n  /** Разделитель не тянется, не фокусируется и не отвечает на клавиши. */\n  disabled?: boolean\n  /** Имя разделителя для скринридера. Не задано — из локали. */\n  ariaLabel?: string\n}\n\nexport interface GrSplitterEmits {\n  (e: 'update:modelValue', value: number): void\n  (e: 'update:collapsed', value: boolean): void\n  /** Конец жеста и каждый шаг с клавиатуры: сюда вешают сохранение раскладки. */\n  (e: 'change', value: number): void\n}\n\nconst props = withDefaults(defineProps<GrSplitterProps>(), {\n  modelValue: undefined,\n  defaultSize: 50,\n  min: 10,\n  max: 90,\n  minEnd: 10,\n  step: 1,\n  bigStep: 10,\n  collapsed: false,\n  disabled: false,\n  ariaLabel: undefined,\n  // `undefined`, а не готовые значения: иначе `componentDefaults` до них не дошли бы.\n  orientation: undefined,\n  collapsible: undefined,\n})\n\nconst emit = defineEmits<GrSplitterEmits>()\n\ndefineSlots<{\n  /** Первая панель — та, чей размер задаёт модель. */\n  start?: () => any\n  /** Вторая панель: занимает остаток. */\n  end?: () => any\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst orientation = useGrComponentProp('GrSplitter', 'orientation', () => props.orientation, 'horizontal')\nconst collapsible = useGrComponentProp('GrSplitter', 'collapsible', () => props.collapsible, false)\n\nconst startId = useId()\nconst rootEl = ref<HTMLElement | null>(null)\n\nconst bounds = computed<GrSplitterBounds>(() => ({\n  min: props.min,\n  max: props.max,\n  minEnd: props.minEnd,\n}))\n\n/**\n * Локальное состояние с синхронизацией из пропа — поддерживает и controlled\n * (`v-model`), и uncontrolled (сплиттер помнит размер сам), как `collapsed`\n * у `GrSidebar`.\n */\nconst sizeState = ref(clampSize(props.modelValue ?? props.defaultSize, bounds.value))\nwatch(() => props.modelValue, (value) => {\n  if (value !== undefined)\n    sizeState.value = clampSize(value, bounds.value)\n})\n\nconst collapsedState = ref(props.collapsed)\nwatch(() => props.collapsed, value => (collapsedState.value = value))\n\n/** Размер, к которому возвращает `Enter`: свёрнутость не должна его терять. */\nconst restoreSize = ref(sizeState.value)\n\n/** Значение до начала жеста: `pointercancel` откатывает к нему. */\nlet sizeBeforeDrag = sizeState.value\nlet collapsedBeforeDrag = false\n\nconst isCollapsed = computed(() => collapsible.value && collapsedState.value)\n\n/** Что видно на экране: свёрнутая панель — это ноль в треке, но не ноль в модели. */\nconst renderedSize = computed(() => (isCollapsed.value ? 0 : clampSize(sizeState.value, bounds.value)))\n\nconst gridStyle = computed(() => {\n  const track = `${renderedSize.value}% var(--gr-splitter-size, 6px) 1fr`\n\n  return orientation.value === 'horizontal'\n    ? { gridTemplateColumns: track }\n    : { gridTemplateRows: track }\n})\n\n/**\n * `aria-orientation` описывает **сам разделитель**, а не раскладку: панели,\n * стоящие рядом, разделяет вертикальная полоса.\n */\nconst separatorOrientation = computed(() => (orientation.value === 'horizontal' ? 'vertical' : 'horizontal'))\n\nconst label = computed(() => props.ariaLabel ?? t('gr.splitter.label', 'Resize panels'))\n\nfunction setSize(next: number, commit: boolean): void {\n  const value = clampSize(next, bounds.value)\n  const changed = value !== sizeState.value\n\n  sizeState.value = value\n  if (changed)\n    emit('update:modelValue', value)\n  if (commit)\n    emit('change', value)\n}\n\nfunction setCollapsed(value: boolean): void {\n  if (collapsedState.value === value)\n    return\n\n  collapsedState.value = value\n  emit('update:collapsed', value)\n}\n\n/**\n * Шаг размера. Свёрнутая панель на первое нажатие возвращается — двигать\n * то, чего не видно, значит менять раскладку вслепую.\n */\nfunction moveBy(delta: number): void {\n  if (isCollapsed.value) {\n    setCollapsed(false)\n    setSize(restoreSize.value, true)\n    return\n  }\n\n  restoreSize.value = clampSize(sizeState.value + delta, bounds.value)\n  setSize(sizeState.value + delta, true)\n}\n\nfunction toggleCollapsed(): void {\n  if (!collapsible.value)\n    return\n\n  if (isCollapsed.value) {\n    setCollapsed(false)\n    setSize(restoreSize.value, true)\n    return\n  }\n\n  restoreSize.value = sizeState.value\n  setCollapsed(true)\n  emit('change', 0)\n}\n\nfunction reset(): void {\n  setCollapsed(false)\n  restoreSize.value = clampSize(props.defaultSize, bounds.value)\n  setSize(props.defaultSize, true)\n}\n\n// ————— Указатель.\nfunction onPointerMove(event: PointerEvent): void {\n  const rect = rootEl.value?.getBoundingClientRect()\n  if (!rect)\n    return\n\n  // Против выделения текста под курсором во время жеста.\n  event.preventDefault()\n\n  const raw = sizeFromPointer(rect, event.clientX, event.clientY, orientation.value)\n\n  if (collapsible.value && shouldCollapse(raw, bounds.value)) {\n    if (!collapsedState.value)\n      restoreSize.value = sizeState.value\n    setCollapsed(true)\n    return\n  }\n\n  setCollapsed(false)\n  restoreSize.value = clampSize(raw, bounds.value)\n  setSize(raw, false)\n}\n\nconst { isDragging, start: onPointerDown } = useDragGesture({\n  disabled: () => props.disabled,\n  onStart: () => {\n    sizeBeforeDrag = sizeState.value\n    collapsedBeforeDrag = collapsedState.value\n  },\n  onMove: onPointerMove,\n  onEnd: () => emit('change', renderedSize.value),\n  // Оборванный жест (браузер забрал указатель) не коммитит ничего: раскладка\n  // возвращается к той, что была до нажатия.\n  onCancel: () => {\n    setCollapsed(collapsedBeforeDrag)\n    setSize(sizeBeforeDrag, false)\n  },\n})\n\n// ————— Клавиатура.\nconst decreaseKey = computed(() => (orientation.value === 'horizontal' ? 'ArrowLeft' : 'ArrowUp'))\nconst increaseKey = computed(() => (orientation.value === 'horizontal' ? 'ArrowRight' : 'ArrowDown'))\n\nfunction onKeydown(event: KeyboardEvent): void {\n  if (props.disabled)\n    return\n\n  const step = event.shiftKey ? props.bigStep : props.step\n\n  if (event.key === decreaseKey.value)\n    moveBy(-step)\n  else if (event.key === increaseKey.value)\n    moveBy(step)\n  else if (event.key === 'Home')\n    moveBy(-100)\n  else if (event.key === 'End')\n    moveBy(100)\n  else if (event.key === 'Enter')\n    toggleCollapsed()\n  else return\n\n  // Дошли сюда — клавиша наша: страница не должна ещё и прокрутиться.\n  event.preventDefault()\n}\n\nfunction onDoubleClick(): void {\n  if (props.disabled)\n    return\n\n  reset()\n}\n</script>\n\n<template>\n  <div\n    ref=\"rootEl\"\n    data-gr-splitter\n    :data-orientation=\"orientation\"\n    :data-dragging=\"isDragging ? '' : undefined\"\n    :data-collapsed=\"isCollapsed ? '' : undefined\"\n    :class=\"rootClass\"\n    :style=\"gridStyle\"\n  >\n    <div\n      :id=\"startId\"\n      data-gr-splitter-pane=\"start\"\n      :class=\"paneClass\"\n    >\n      <slot name=\"start\" />\n    </div>\n\n    <div\n      data-gr-splitter-separator\n      role=\"separator\"\n      :tabindex=\"disabled ? undefined : 0\"\n      :aria-orientation=\"separatorOrientation\"\n      :aria-label=\"label\"\n      :aria-controls=\"startId\"\n      :aria-valuenow=\"Math.round(renderedSize)\"\n      :aria-valuemin=\"Math.round(min)\"\n      :aria-valuemax=\"Math.round(max)\"\n      :aria-disabled=\"disabled ? 'true' : undefined\"\n      :class=\"separatorClass\"\n      @pointerdown=\"onPointerDown\"\n      @keydown=\"onKeydown\"\n      @dblclick=\"onDoubleClick\"\n    />\n\n    <div\n      data-gr-splitter-pane=\"end\"\n      :class=\"paneClass\"\n    >\n      <slot name=\"end\" />\n    </div>\n  </div>\n</template>\n\n<style>\n[data-gr-splitter-separator] {\n  background-color: var(--gr-splitter-color, var(--gr-brd));\n}\n\n/*\n * Зона захвата шире видимой полосы: шесть пикселей мышью не берутся, а делать\n * ради этого полосу толще — значит красить раскладку под удобство мыши.\n */\n[data-gr-splitter-separator]::before {\n  content: '';\n  position: absolute;\n  inset: calc(-1 * var(--gr-splitter-hit, 4px));\n}\n\n/* Насечка: короткая полоса посередине — единственный видимый намёк, что это ручка. */\n[data-gr-splitter-separator]::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  border-radius: var(--gr-radius-full);\n  background-color: var(--gr-splitter-hover-color, var(--gr-muted-fg));\n  opacity: 0;\n  transform: translate(-50%, -50%);\n  transition: opacity var(--gr-duration-fast) var(--gr-ease-out);\n}\n\n[data-gr-splitter][data-orientation='horizontal'] [data-gr-splitter-separator] {\n  cursor: col-resize;\n}\n\n[data-gr-splitter][data-orientation='horizontal'] [data-gr-splitter-separator]::after {\n  width: 2px;\n  height: var(--gr-splitter-grip, 24px);\n}\n\n[data-gr-splitter][data-orientation='vertical'] [data-gr-splitter-separator] {\n  cursor: row-resize;\n}\n\n[data-gr-splitter][data-orientation='vertical'] [data-gr-splitter-separator]::after {\n  width: var(--gr-splitter-grip, 24px);\n  height: 2px;\n}\n\n[data-gr-splitter-separator]:hover {\n  background-color: var(--gr-splitter-hover-color, var(--gr-muted-fg));\n}\n\n[data-gr-splitter-separator]:hover::after,\n[data-gr-splitter-separator]:focus-visible::after {\n  opacity: 1;\n}\n\n/* На залитой полосе насечка читается только вырезом — цветом страницы. */\n[data-gr-splitter-separator]:hover::after,\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator]::after {\n  background-color: var(--gr-bg);\n}\n\n/* Во время жеста полоса подсвечена, даже если курсор ушёл с неё. */\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator] {\n  background-color: var(--gr-splitter-active-color, var(--gr-primary));\n}\n\n[data-gr-splitter][data-dragging] [data-gr-splitter-separator]::after {\n  opacity: 1;\n}\n\n/* Жест не должен попутно выделять текст в панелях. */\n[data-gr-splitter][data-dragging] {\n  user-select: none;\n}\n\n[data-gr-splitter-separator][aria-disabled='true'] {\n  cursor: default;\n}\n\n[data-gr-splitter-separator][aria-disabled='true']::after {\n  display: none;\n}\n</style>\n"],"mappings":"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"}

package/dist/components/GrSplitter/index.js

@@ -1,3 +1,3 @@
 import { n as grSplitterSafelist, t as grSplitterConfig } from "../../chunks/config-CvbVM4ep.js";
-import { n as sizeFromPointer, t as GrSplitter_default } from "./chunks/GrSplitter-MltjaADn.js";
+import { n as sizeFromPointer, t as GrSplitter_default } from "./chunks/GrSplitter-C-XQzq7q.js";
 export { GrSplitter_default as GrSplitter, GrSplitter_default as default, grSplitterConfig, grSplitterSafelist, sizeFromPointer };

package/dist/components/GrStatistic/chunks/{GrStatistic-BoLkXw7F.js → GrStatistic-C1_nY4Gc.js}

@@ -1,4 +1,4 @@
-import { a as useGrComponentSize, i as useGrComponentProp } from "../../../chunks/context-CTbuwcYs.js";
+import { a as useGrComponentSize, i as useGrComponentProp } from "../../../chunks/context-CPMRfwVr.js";
 import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
 import { t as GrSkeleton_default } from "../../GrSkeleton/chunks/GrSkeleton-CgfXxPQ2.js";
 import { n as iconTag, t as iconClass } from "../../../chunks/icon-Dag2tIMs.js";
@@ -165,7 +165,7 @@ var GrStatistic_default = /* @__PURE__ */ defineComponent({
 			locale: resolvedLocale.value
 		}));
 		const isCounting = computed(() => frameValue.value !== null);
-		if (typeof process !== "undefined" && process.env.NODE_ENV !== "production") watchEffect(() => {
+		if (process.env.NODE_ENV !== "production") watchEffect(() => {
 			if (props.value === void 0 || props.value === null) console.warn(`[granularity] GrStatistic: обязательный проп \`value\` не передан — получено ${String(props.value)}.`);
 		});
 		const hasTitle = computed(() => Boolean(props.title || slots.title));