@feugene/granularity 0.12.0 → 0.13.0

package/dist/components/GrFormField/chunks/GrFormField-CXCDBd99.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrFormField-CXCDBd99.js","names":[],"sources":["../../../../src/components/GrFormField/GrFormField.vue","../../../../src/components/GrFormField/GrFormField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, provide, ref, useId, useSlots } from 'vue'\n\nimport { useGrFormContext } from '../GrForm/context'\nimport { GR_FORM_FIELD_KEY } from './context'\n\ntype LabelClass = string | string[] | Record<string, boolean>\n\nconst props = withDefaults(\n  defineProps<{\n    label?: string\n    /**\n     * Имя поля в модели `GrForm` (в т.ч. dot-path `address.city`). Когда поле внутри\n     * `GrForm` и задан `name`, ошибка и признак обязательности берутся из формы по\n     * этому имени, а потеря фокуса триггерит валидацию поля.\n     */\n    name?: string\n    /** Явный id контрола. Если не задан — генерируется автоматически. */\n    forId?: string\n    /** Явная ошибка. Перекрывает ошибку из `GrForm` (ручной режим без формы — тоже здесь). */\n    error?: string\n    /** Подсказка под лейблом/над контролом (можно также через слот `#hint`). */\n    hint?: string\n    /** Помечает поле обязательным (маркер `*` + `aria-required` у контрола). */\n    required?: boolean\n    labelClass?: LabelClass\n  }>(),\n  {\n    label: undefined,\n    name: undefined,\n    forId: undefined,\n    error: undefined,\n    hint: undefined,\n    required: false,\n    labelClass: undefined,\n  },\n)\n\nconst slots = useSlots()\n\n// Контекст `GrForm` (если поле внутри формы). Контролы про форму не знают —\n// оркестрация подключается здесь, на уровне поля.\nconst form = useGrFormContext()\nconst boundToForm = computed(() => Boolean(form && props.name && form.hasField(props.name)))\n\n// Автогенерация id: контрол внутри читает его через inject и связывается с\n// лейблом (`for`) без ручного дублирования `forId`.\nconst generatedId = useId()\nconst fieldId = computed(() => props.forId ?? generatedId)\n\nconst errorId = useId()\nconst hintId = useId()\n\n// Ошибка: явный проп `error` имеет приоритет, иначе — из формы по `name`.\nconst resolvedError = computed(() => {\n  if (props.error) return props.error\n  if (boundToForm.value && props.name) return form!.errors.value[props.name]\n  return undefined\n})\n\n// Обязательность: проп `required` ИЛИ наличие `required`-правила в форме.\nconst isRequired = computed(() => {\n  if (props.required) return true\n  if (boundToForm.value && props.name) return form!.requiredFields.value.has(props.name)\n  return false\n})\n\nconst hasHint = computed(() => Boolean(props.hint) || Boolean(slots.hint))\nconst hasError = computed(() => Boolean(resolvedError.value))\n\n// `aria-describedby` контрола: подсказка и/или ошибка.\nconst describedById = computed(() => {\n  const ids = [hasHint.value ? hintId : null, hasError.value ? errorId : null].filter(Boolean)\n  return ids.length ? ids.join(' ') : undefined\n})\n\nprovide(GR_FORM_FIELD_KEY, {\n  id: fieldId,\n  describedById,\n  invalid: hasError,\n  required: isRequired,\n})\n\n// ————— Интеграция с формой: регистрация (scroll-to-error) + валидация по blur.\nconst fieldRootEl = ref<HTMLElement | null>(null)\nlet unregister: (() => void) | undefined\n\nonMounted(() => {\n  if (form && props.name) unregister = form.registerField(props.name, () => fieldRootEl.value)\n})\nonBeforeUnmount(() => unregister?.())\n\n// `focusout` всплывает от любого фокусируемого контрола внутри поля (native и\n// кастомного) — единый способ поймать blur без правок самих контролов.\nfunction onFocusOut(): void {\n  if (form && props.name) void form.validateField(props.name, 'blur')\n}\n</script>\n\n<template>\n  <div\n    ref=\"fieldRootEl\"\n    data-gr-form-field\n    class=\"flex flex-col gap-2\"\n    @focusout=\"onFocusOut\"\n  >\n    <label\n      v-if=\"props.label\"\n      :for=\"fieldId\"\n      class=\"text-sm text-[var(--gr-muted-fg)]\"\n      :class=\"props.labelClass\"\n    >\n      {{ props.label }}\n      <span v-if=\"isRequired\" data-gr-form-field-required aria-hidden=\"true\" class=\"text-[var(--gr-danger)]\">*</span>\n    </label>\n\n    <p\n      v-if=\"hasHint\"\n      :id=\"hintId\"\n      data-gr-form-field-hint\n      class=\"text-xs text-[var(--gr-muted-fg)]\"\n    >\n      <slot name=\"hint\">\n        {{ props.hint }}\n      </slot>\n    </p>\n\n    <slot />\n\n    <div\n      v-if=\"hasError\"\n      :id=\"errorId\"\n      data-gr-form-field-error\n      role=\"alert\"\n      class=\"text-sm text-[var(--gr-danger)]\"\n    >\n      {{ resolvedError }}\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, provide, ref, useId, useSlots } from 'vue'\n\nimport { useGrFormContext } from '../GrForm/context'\nimport { GR_FORM_FIELD_KEY } from './context'\n\ntype LabelClass = string | string[] | Record<string, boolean>\n\nconst props = withDefaults(\n  defineProps<{\n    label?: string\n    /**\n     * Имя поля в модели `GrForm` (в т.ч. dot-path `address.city`). Когда поле внутри\n     * `GrForm` и задан `name`, ошибка и признак обязательности берутся из формы по\n     * этому имени, а потеря фокуса триггерит валидацию поля.\n     */\n    name?: string\n    /** Явный id контрола. Если не задан — генерируется автоматически. */\n    forId?: string\n    /** Явная ошибка. Перекрывает ошибку из `GrForm` (ручной режим без формы — тоже здесь). */\n    error?: string\n    /** Подсказка под лейблом/над контролом (можно также через слот `#hint`). */\n    hint?: string\n    /** Помечает поле обязательным (маркер `*` + `aria-required` у контрола). */\n    required?: boolean\n    labelClass?: LabelClass\n  }>(),\n  {\n    label: undefined,\n    name: undefined,\n    forId: undefined,\n    error: undefined,\n    hint: undefined,\n    required: false,\n    labelClass: undefined,\n  },\n)\n\nconst slots = useSlots()\n\n// Контекст `GrForm` (если поле внутри формы). Контролы про форму не знают —\n// оркестрация подключается здесь, на уровне поля.\nconst form = useGrFormContext()\nconst boundToForm = computed(() => Boolean(form && props.name && form.hasField(props.name)))\n\n// Автогенерация id: контрол внутри читает его через inject и связывается с\n// лейблом (`for`) без ручного дублирования `forId`.\nconst generatedId = useId()\nconst fieldId = computed(() => props.forId ?? generatedId)\n\nconst errorId = useId()\nconst hintId = useId()\n\n// Ошибка: явный проп `error` имеет приоритет, иначе — из формы по `name`.\nconst resolvedError = computed(() => {\n  if (props.error) return props.error\n  if (boundToForm.value && props.name) return form!.errors.value[props.name]\n  return undefined\n})\n\n// Обязательность: проп `required` ИЛИ наличие `required`-правила в форме.\nconst isRequired = computed(() => {\n  if (props.required) return true\n  if (boundToForm.value && props.name) return form!.requiredFields.value.has(props.name)\n  return false\n})\n\nconst hasHint = computed(() => Boolean(props.hint) || Boolean(slots.hint))\nconst hasError = computed(() => Boolean(resolvedError.value))\n\n// `aria-describedby` контрола: подсказка и/или ошибка.\nconst describedById = computed(() => {\n  const ids = [hasHint.value ? hintId : null, hasError.value ? errorId : null].filter(Boolean)\n  return ids.length ? ids.join(' ') : undefined\n})\n\nprovide(GR_FORM_FIELD_KEY, {\n  id: fieldId,\n  describedById,\n  invalid: hasError,\n  required: isRequired,\n})\n\n// ————— Интеграция с формой: регистрация (scroll-to-error) + валидация по blur.\nconst fieldRootEl = ref<HTMLElement | null>(null)\nlet unregister: (() => void) | undefined\n\nonMounted(() => {\n  if (form && props.name) unregister = form.registerField(props.name, () => fieldRootEl.value)\n})\nonBeforeUnmount(() => unregister?.())\n\n// `focusout` всплывает от любого фокусируемого контрола внутри поля (native и\n// кастомного) — единый способ поймать blur без правок самих контролов.\nfunction onFocusOut(): void {\n  if (form && props.name) void form.validateField(props.name, 'blur')\n}\n</script>\n\n<template>\n  <div\n    ref=\"fieldRootEl\"\n    data-gr-form-field\n    class=\"flex flex-col gap-2\"\n    @focusout=\"onFocusOut\"\n  >\n    <label\n      v-if=\"props.label\"\n      :for=\"fieldId\"\n      class=\"text-sm text-[var(--gr-muted-fg)]\"\n      :class=\"props.labelClass\"\n    >\n      {{ props.label }}\n      <span v-if=\"isRequired\" data-gr-form-field-required aria-hidden=\"true\" class=\"text-[var(--gr-danger)]\">*</span>\n    </label>\n\n    <p\n      v-if=\"hasHint\"\n      :id=\"hintId\"\n      data-gr-form-field-hint\n      class=\"text-xs text-[var(--gr-muted-fg)]\"\n    >\n      <slot name=\"hint\">\n        {{ props.hint }}\n      </slot>\n    </p>\n\n    <slot />\n\n    <div\n      v-if=\"hasError\"\n      :id=\"errorId\"\n      data-gr-form-field-error\n      role=\"alert\"\n      class=\"text-sm text-[var(--gr-danger)]\"\n    >\n      {{ resolvedError }}\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAQA,MAAM,QAAQ;EA8Bd,MAAM,QAAQ,SAAS;EAIvB,MAAM,OAAO,iBAAiB;EAC9B,MAAM,cAAc,eAAe,QAAQ,QAAQ,MAAM,QAAQ,KAAK,SAAS,MAAM,IAAI,CAAC,CAAC;EAI3F,MAAM,cAAc,MAAM;EAC1B,MAAM,UAAU,eAAe,MAAM,SAAS,WAAW;EAEzD,MAAM,UAAU,MAAM;EACtB,MAAM,SAAS,MAAM;EAGrB,MAAM,gBAAgB,eAAe;GACnC,IAAI,MAAM,OAAO,OAAO,MAAM;GAC9B,IAAI,YAAY,SAAS,MAAM,MAAM,OAAO,KAAM,OAAO,MAAM,MAAM;EAEvE,CAAC;EAGD,MAAM,aAAa,eAAe;GAChC,IAAI,MAAM,UAAU,OAAO;GAC3B,IAAI,YAAY,SAAS,MAAM,MAAM,OAAO,KAAM,eAAe,MAAM,IAAI,MAAM,IAAI;GACrF,OAAO;EACT,CAAC;EAED,MAAM,UAAU,eAAe,QAAQ,MAAM,IAAI,KAAK,QAAQ,MAAM,IAAI,CAAC;EACzE,MAAM,WAAW,eAAe,QAAQ,cAAc,KAAK,CAAC;EAQ5D,QAAQ,mBAAmB;GACzB,IAAI;GACJ,eAPoB,eAAe;IACnC,MAAM,MAAM,CAAC,QAAQ,QAAQ,SAAS,MAAM,SAAS,QAAQ,UAAU,IAAI,CAAC,CAAC,OAAO,OAAO;IAC3F,OAAO,IAAI,SAAS,IAAI,KAAK,GAAG,IAAI,KAAA;GACtC,CAIE;GACA,SAAS;GACT,UAAU;EACZ,CAAC;EAGD,MAAM,cAAc,IAAwB,IAAI;EAChD,IAAI;EAEJ,gBAAgB;GACd,IAAI,QAAQ,MAAM,MAAM,aAAa,KAAK,cAAc,MAAM,YAAY,YAAY,KAAK;EAC7F,CAAC;EACD,sBAAsB,aAAa,CAAC;EAIpC,SAAS,aAAmB;GAC1B,IAAI,QAAQ,MAAM,MAAM,KAAU,cAAc,MAAM,MAAM,MAAM;EACpE;;uBAIE,mBAsCM,OAAA;aArCA;IAAJ,KAAI;IACJ,sBAAA;IACA,OAAM;IACL,YAAU;;IAGH,MAAM,SAAA,UAAA,GADd,mBAQQ,SAAA;;KANL,KAAK,QAAA;KACN,OAAK,eAAA,CAAC,qCACE,MAAM,UAAU,CAAA;wCAErB,MAAM,KAAK,IAAG,KACjB,CAAA,GAAY,WAAA,SAAA,UAAA,GAAZ,mBAA+G,QAA/G,YAAuG,GAAC,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,IAAA,UAAA,KAAA,mBAAA,IAAA,IAAA;IAIlG,QAAA,SAAA,UAAA,GADR,mBASI,KAAA;;KAPD,IAAI,MAAA,MAAA;KACL,2BAAA;KACA,OAAM;QAEN,WAEO,KAAA,QAAA,QAAA,CAAA,SAAA,CAAA,gBAAA,gBADF,MAAM,IAAI,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,GAAA,UAAA,KAAA,mBAAA,IAAA,IAAA;IAIjB,WAAQ,KAAA,QAAA,SAAA;IAGA,SAAA,SAAA,UAAA,GADR,mBAQM,OAAA;;KANH,IAAI,MAAA,OAAA;KACL,4BAAA;KACA,MAAK;KACL,OAAM;uBAEH,cAAA,KAAa,GAAA,GAAA,UAAA,KAAA,mBAAA,IAAA,IAAA"}

package/dist/components/GrFormField/index.js

@@ -1,4 +1,4 @@
 import { n as useGrFormFieldContext, t as GR_FORM_FIELD_KEY } from "../../chunks/context-DdNIxa1w.js";
-import { t as GrFormField_default } from "./chunks/GrFormField-DnfMHx_U.js";
+import { t as GrFormField_default } from "./chunks/GrFormField-CXCDBd99.js";
 import { t as grFormFieldConfig } from "../../chunks/config-PFg39mYo.js";
 export { GR_FORM_FIELD_KEY, GrFormField_default as GrFormField, GrFormField_default as default, grFormFieldConfig, useGrFormFieldContext };

package/dist/components/GrFormFile/chunks/{GrFormFile-CXcqqdvV.js → GrFormFile-CqacSbUl.js}

@@ -1,10 +1,10 @@
 import { t as x_default } from "../../../chunks/x-2KXnqxiD.js";
-import { t as useGranularityTranslations } from "../../../chunks/granularityI18n-DoV7Ca2m.js";
-import { t as _plugin_vue_export_helper_default } from "../../../chunks/_plugin-vue_export-helper-BOaGB7Aw.js";
-import { t as GrButton_default } from "../../GrButton/chunks/GrButton-BlffdeJr.js";
-import { t as GrIcon_default } from "../../GrIcon/chunks/GrIcon-D9AWQLk2.js";
+import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-SH0I--GW.js";
 import { l as runFileValidators, o as acceptValidator, u as FileValidationError } from "../../../chunks/fileValidation-C3WFaWU2.js";
 import { vDropzone } from "../../../directives/dropzone.js";
+import { t as _plugin_vue_export_helper_default } from "../../../chunks/_plugin-vue_export-helper-BOaGB7Aw.js";
+import { t as GrButton_default } from "../../GrButton/chunks/GrButton-DCi4CUpo.js";
+import { t as GrIcon_default } from "../../GrIcon/chunks/GrIcon-D9AWQLk2.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, markRaw, nextTick, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, unref, watch, withCtx, withDirectives, withModifiers } from "vue";
 import '../../../GrFormFile.css';//#region ~icons/lucide/upload
 var _hoisted_1$1 = {
@@ -41,7 +41,7 @@ var _hoisted_6 = { class: "ml-2" };
 var _hoisted_7 = ["title"];
 var _hoisted_8 = {
 	key: 3,
-	class: "text-sm text-[var(--muted-fg)]",
+	class: "text-sm text-[var(--gr-muted-fg)]",
 	"data-gr-form-file-placeholder": ""
 };
 var _hoisted_9 = {
@@ -283,7 +283,7 @@ var GrFormFile_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 					}, 8, ["disabled"])) : createCommentVNode("", true),
 					!__props.multiple && hasFiles.value ? (openBlock(), createElementBlock("span", {
 						key: 2,
-						class: "text-sm text-[var(--muted-fg)] truncate max-w-[240px]",
+						class: "text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]",
 						"data-gr-form-file-single-name": "",
 						title: files.value[0]?.name
 					}, toDisplayString(files.value[0]?.name), 9, _hoisted_7)) : createCommentVNode("", true),
@@ -295,12 +295,12 @@ var GrFormFile_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 						class: "flex items-center gap-2",
 						"data-gr-form-file-item": ""
 					}, [createElementVNode("span", {
-						class: "text-sm text-[var(--muted-fg)] truncate max-w-[240px]",
+						class: "text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]",
 						title: file.name,
 						"data-gr-form-file-item-name": ""
 					}, toDisplayString(file.name), 9, _hoisted_10), createElementVNode("button", {
 						type: "button",
-						class: "text-xs text-[var(--muted-fg)] hover:text-[var(--fg)]",
+						class: "text-xs text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)]",
 						"data-gr-form-file-item-remove": "",
 						disabled: __props.disabled,
 						onClick: withModifiers(($event) => removeAt(index), ["prevent"])
@@ -315,6 +315,6 @@ var GrFormFile_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 			])], 2)), [[unref(vDropzone), dropzone.value]]);
 		};
 	}
-}), [["__scopeId", "data-v-ff219d2a"]]);
+}), [["__scopeId", "data-v-e96c4b59"]]);
 //#endregion
 export { GrFormFile_default as t };

package/dist/components/GrFormFile/chunks/GrFormFile-CqacSbUl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrFormFile-CqacSbUl.js","names":[],"sources":["../../../../src/components/GrFormFile/GrFormFile.vue","../../../../src/components/GrFormFile/GrFormFile.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, nextTick, ref, watch } from 'vue'\n\nimport IconUpload from '~icons/lucide/upload'\nimport IconX from '~icons/lucide/x'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport { vDropzone } from '../../directives'\nimport { acceptValidator, FileValidationError, runFileValidators } from '../../fileValidation'\nimport type { FileValidationIssue, FileValidator } from '../../fileValidation'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\ndefineOptions({\n  name: 'GrFormFile',\n})\n\nexport type GrFormFileError = FileValidationIssue\n\n/**\n * Пропы `GrFormFile` — форма-поле для выбора файлов с встроенной валидацией,\n * drag&drop (через `v-dropzone`) и списком выбранных файлов.\n *\n * Все `*Text`/`placeholder` — i18n-friendly, принимают готовые строки локали.\n */\nexport interface GrFormFileProps {\n  modelValue: File | File[] | null\n  multiple?: boolean\n  disabled?: boolean\n  /** W3C `accept` для `<input type=\"file\">` + sugar к `acceptValidator(...)`. */\n  accept?: string\n  validators?: FileValidator[]\n  uploadText?: string\n  changeText?: string\n  removeText?: string\n  clearAllText?: string\n  placeholder?: string\n  /** Дополнительная (кастомная) валидация на стороне потребителя. */\n  validate?: (files: File[]) => GrFormFileError[] | Promise<GrFormFileError[]>\n}\n\nconst props = withDefaults(\n  defineProps<GrFormFileProps>(),\n  {\n    multiple: false,\n    disabled: false,\n    accept: undefined,\n    uploadText: undefined,\n    changeText: undefined,\n    removeText: undefined,\n    clearAllText: undefined,\n    placeholder: undefined,\n    validators: undefined,\n    validate: undefined,\n  },\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: File | File[] | null): void\n  (e: 'change', value: File | File[] | null): void\n  (e: 'clear'): void\n  (e: 'validation', errors: GrFormFileError[]): void\n  (e: 'update:errors', errors: GrFormFileError[]): void\n}>()\n\nconst { t } = useGranularityTranslations()\nconst resolvedUploadText = computed(() => props.uploadText ?? t('gr.formFile.upload', 'Upload file'))\nconst resolvedChangeText = computed(() => props.changeText ?? t('gr.formFile.change', 'Change file'))\nconst resolvedRemoveText = computed(() => props.removeText ?? t('gr.formFile.remove', 'Remove'))\nconst resolvedClearAllText = computed(() => props.clearAllText ?? t('gr.formFile.clearAll', 'Clear all'))\nconst resolvedPlaceholder = computed(() => props.placeholder ?? t('gr.formFile.placeholder', 'No files selected'))\n\nconst inputRef = ref<HTMLInputElement | null>(null)\nconst localErrors = ref<GrFormFileError[]>([])\n\nconst files = computed<File[]>(() => {\n  if (props.multiple) {\n    return Array.isArray(props.modelValue) ? props.modelValue : []\n  }\n\n  return props.modelValue instanceof File ? [props.modelValue] : []\n})\n\nconst hasFiles = computed(() => files.value.length > 0)\n\nfunction clearInputValue() {\n  if (!inputRef.value) return\n  inputRef.value.value = ''\n}\n\nfunction setErrors(next: GrFormFileError[]) {\n  localErrors.value = next\n  emit('validation', next)\n  emit('update:errors', next)\n}\n\nfunction clearErrors() {\n  if (localErrors.value.length === 0) return\n  setErrors([])\n}\n\nfunction openDialog() {\n  if (props.disabled) return\n  inputRef.value?.click()\n}\n\nfunction emitModel(nextFiles: File[]) {\n  const value: File | File[] | null = props.multiple\n    ? nextFiles\n    : (nextFiles[0] ?? null)\n\n  emit('update:modelValue', value)\n  emit('change', value)\n}\n\nasync function applyFiles(nextFiles: File[]) {\n  const isPromiseLike = (value: unknown): value is PromiseLike<any> => {\n    return !!value && typeof (value as any).then === 'function'\n  }\n\n  const customValidator: FileValidator | undefined = props.validate\n    ? async ({ files }) => (await props.validate?.(files)) ?? []\n    : undefined\n\n  const validators: FileValidator[] = [\n    acceptValidator(props.accept),\n    ...(props.validators ?? []),\n    ...(customValidator ? [customValidator] : []),\n  ]\n\n  const res = runFileValidators(nextFiles, validators, {\n    source: 'input',\n    multiple: props.multiple,\n  })\n\n  const { files: picked, issues } = isPromiseLike(res) ? await res : res\n\n  if (issues.length > 0) {\n    setErrors(issues)\n    clearInputValue()\n    await nextTick()\n    return\n  }\n\n  clearErrors()\n  emitModel(picked)\n  clearInputValue()\n  await nextTick()\n}\n\nasync function onInputChange(event: Event) {\n  if (props.disabled) return\n\n  const target = event.target as HTMLInputElement | null\n  const nextFiles = target?.files ? Array.prototype.slice.call(target.files) as File[] : []\n\n  // Reset value so selecting the same file twice triggers change.\n  if (target) target.value = ''\n  await nextTick()\n\n  await applyFiles(nextFiles)\n}\n\nfunction clearAll() {\n  if (props.disabled) return\n  clearErrors()\n  clearInputValue()\n  emit('clear')\n\n  emit('update:modelValue', props.multiple ? [] : null)\n  emit('change', props.multiple ? [] : null)\n}\n\nfunction removeAt(index: number) {\n  if (props.disabled) return\n  if (!props.multiple) {\n    clearAll()\n    return\n  }\n\n  const next = files.value.slice()\n  next.splice(index, 1)\n\n  emit('update:modelValue', next)\n  emit('change', next)\n}\n\nfunction issueMessage(issue: GrFormFileError): string {\n  if (issue.fileName) return `${issue.fileName}: ${issue.message}`\n  return issue.message\n}\n\nconst dropzone = computed(() => {\n  const customValidator: FileValidator | undefined = props.validate\n    ? async ({ files }) => (await props.validate?.(files)) ?? []\n    : undefined\n\n  const validators: FileValidator[] = [\n    acceptValidator(props.accept),\n    ...(props.validators ?? []),\n    ...(customValidator ? [customValidator] : []),\n  ]\n\n  return {\n    enabled: !props.disabled,\n    multiple: props.multiple,\n    validators,\n    onFiles: async (dropped: File[]) => {\n      // `v-dropzone` уже выполнил валидаторы и нормализацию по `multiple`.\n      clearErrors()\n      emitModel(dropped)\n      clearInputValue()\n      await nextTick()\n    },\n    onError: (error: unknown) => {\n      if (error instanceof FileValidationError) {\n        setErrors(error.issues)\n      }\n      else {\n        setErrors([\n          {\n            code: 'accept',\n            message: t('gr.formFile.validateError', 'Failed to validate dropped files'),\n          },\n        ])\n      }\n    },\n  }\n})\n\nwatch(\n  () => props.modelValue,\n  (value) => {\n    if (!inputRef.value) return\n\n    if (!value || (Array.isArray(value) && value.length === 0)) {\n      // Позволяет выбрать тот же файл снова после внешнего сброса.\n      inputRef.value.value = ''\n    }\n  },\n)\n</script>\n\n<template>\n  <div\n    v-dropzone=\"dropzone\"\n    data-gr-form-file\n    class=\"rounded-[var(--gr-radius-md)]\"\n    :class=\"disabled ? 'opacity-60 cursor-not-allowed' : ''\"\n  >\n    <input\n      ref=\"inputRef\"\n      data-gr-form-file-input\n      type=\"file\"\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      class=\"absolute opacity-0 w-px h-px pointer-events-none\"\n      :multiple=\"multiple\"\n      :accept=\"accept\"\n      :disabled=\"disabled\"\n      @change=\"onInputChange\"\n    >\n\n    <div class=\"flex flex-col gap-2\">\n      <div class=\"flex flex-wrap items-center gap-3\">\n        <GrButton\n          variant=\"secondary\"\n          size=\"sm\"\n          data-gr-form-file-upload-btn\n          :disabled=\"disabled\"\n          @click.prevent=\"openDialog\"\n        >\n          <GrIcon size=\"sm\" aria-hidden=\"true\">\n            <IconUpload />\n          </GrIcon>\n          <span class=\"ml-2\">{{ hasFiles ? resolvedChangeText : resolvedUploadText }}</span>\n        </GrButton>\n\n        <GrButton\n          v-if=\"hasFiles && !multiple\"\n          variant=\"secondary\"\n          size=\"sm\"\n          data-gr-form-file-clear-btn\n          :disabled=\"disabled\"\n          @click.prevent=\"clearAll\"\n        >\n          <GrIcon size=\"sm\" aria-hidden=\"true\">\n            <IconX />\n          </GrIcon>\n          <span class=\"ml-2\">{{ resolvedRemoveText }}</span>\n        </GrButton>\n\n        <GrButton\n          v-if=\"multiple && hasFiles\"\n          variant=\"secondary\"\n          size=\"sm\"\n          data-gr-form-file-clear-all-btn\n          :disabled=\"disabled\"\n          @click.prevent=\"clearAll\"\n        >\n          <GrIcon size=\"sm\" aria-hidden=\"true\">\n            <IconX />\n          </GrIcon>\n          <span class=\"ml-2\">{{ resolvedClearAllText }}</span>\n        </GrButton>\n\n        <span\n          v-if=\"!multiple && hasFiles\"\n          class=\"text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]\"\n          data-gr-form-file-single-name\n          :title=\"files[0]?.name\"\n        >\n          {{ files[0]?.name }}\n        </span>\n\n        <span\n          v-if=\"!hasFiles\"\n          class=\"text-sm text-[var(--gr-muted-fg)]\"\n          data-gr-form-file-placeholder\n        >\n          {{ resolvedPlaceholder }}\n        </span>\n      </div>\n\n      <div v-if=\"multiple && hasFiles\" class=\"flex flex-col gap-2\">\n        <div\n          v-for=\"(file, index) in files\"\n          :key=\"`${file.name}-${file.size}-${index}`\"\n          class=\"flex items-center gap-2\"\n          data-gr-form-file-item\n        >\n          <span\n            class=\"text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]\"\n            :title=\"file.name\"\n            data-gr-form-file-item-name\n          >\n            {{ file.name }}\n          </span>\n\n          <button\n            type=\"button\"\n            class=\"text-xs text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)]\"\n            data-gr-form-file-item-remove\n            :disabled=\"disabled\"\n            @click.prevent=\"removeAt(index)\"\n          >\n            {{ removeText }}\n          </button>\n        </div>\n      </div>\n\n      <slot name=\"errors\" :errors=\"localErrors\">\n        <div v-if=\"localErrors.length\" class=\"text-sm text-[var(--gr-danger)]\" data-gr-form-file-errors>\n          <div v-for=\"(e, i) in localErrors\" :key=\"i\" data-gr-form-file-error>\n            {{ issueMessage(e) }}\n          </div>\n        </div>\n      </slot>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n[data-gr-form-file].gr-dropzone--over {\n  outline: 2px solid var(--gr-ring);\n  outline-offset: 2px;\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, ref, watch } from 'vue'\n\nimport IconUpload from '~icons/lucide/upload'\nimport IconX from '~icons/lucide/x'\n\nimport GrButton from '../GrButton/GrButton.vue'\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport { vDropzone } from '../../directives'\nimport { acceptValidator, FileValidationError, runFileValidators } from '../../fileValidation'\nimport type { FileValidationIssue, FileValidator } from '../../fileValidation'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\ndefineOptions({\n  name: 'GrFormFile',\n})\n\nexport type GrFormFileError = FileValidationIssue\n\n/**\n * Пропы `GrFormFile` — форма-поле для выбора файлов с встроенной валидацией,\n * drag&drop (через `v-dropzone`) и списком выбранных файлов.\n *\n * Все `*Text`/`placeholder` — i18n-friendly, принимают готовые строки локали.\n */\nexport interface GrFormFileProps {\n  modelValue: File | File[] | null\n  multiple?: boolean\n  disabled?: boolean\n  /** W3C `accept` для `<input type=\"file\">` + sugar к `acceptValidator(...)`. */\n  accept?: string\n  validators?: FileValidator[]\n  uploadText?: string\n  changeText?: string\n  removeText?: string\n  clearAllText?: string\n  placeholder?: string\n  /** Дополнительная (кастомная) валидация на стороне потребителя. */\n  validate?: (files: File[]) => GrFormFileError[] | Promise<GrFormFileError[]>\n}\n\nconst props = withDefaults(\n  defineProps<GrFormFileProps>(),\n  {\n    multiple: false,\n    disabled: false,\n    accept: undefined,\n    uploadText: undefined,\n    changeText: undefined,\n    removeText: undefined,\n    clearAllText: undefined,\n    placeholder: undefined,\n    validators: undefined,\n    validate: undefined,\n  },\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: File | File[] | null): void\n  (e: 'change', value: File | File[] | null): void\n  (e: 'clear'): void\n  (e: 'validation', errors: GrFormFileError[]): void\n  (e: 'update:errors', errors: GrFormFileError[]): void\n}>()\n\nconst { t } = useGranularityTranslations()\nconst resolvedUploadText = computed(() => props.uploadText ?? t('gr.formFile.upload', 'Upload file'))\nconst resolvedChangeText = computed(() => props.changeText ?? t('gr.formFile.change', 'Change file'))\nconst resolvedRemoveText = computed(() => props.removeText ?? t('gr.formFile.remove', 'Remove'))\nconst resolvedClearAllText = computed(() => props.clearAllText ?? t('gr.formFile.clearAll', 'Clear all'))\nconst resolvedPlaceholder = computed(() => props.placeholder ?? t('gr.formFile.placeholder', 'No files selected'))\n\nconst inputRef = ref<HTMLInputElement | null>(null)\nconst localErrors = ref<GrFormFileError[]>([])\n\nconst files = computed<File[]>(() => {\n  if (props.multiple) {\n    return Array.isArray(props.modelValue) ? props.modelValue : []\n  }\n\n  return props.modelValue instanceof File ? [props.modelValue] : []\n})\n\nconst hasFiles = computed(() => files.value.length > 0)\n\nfunction clearInputValue() {\n  if (!inputRef.value) return\n  inputRef.value.value = ''\n}\n\nfunction setErrors(next: GrFormFileError[]) {\n  localErrors.value = next\n  emit('validation', next)\n  emit('update:errors', next)\n}\n\nfunction clearErrors() {\n  if (localErrors.value.length === 0) return\n  setErrors([])\n}\n\nfunction openDialog() {\n  if (props.disabled) return\n  inputRef.value?.click()\n}\n\nfunction emitModel(nextFiles: File[]) {\n  const value: File | File[] | null = props.multiple\n    ? nextFiles\n    : (nextFiles[0] ?? null)\n\n  emit('update:modelValue', value)\n  emit('change', value)\n}\n\nasync function applyFiles(nextFiles: File[]) {\n  const isPromiseLike = (value: unknown): value is PromiseLike<any> => {\n    return !!value && typeof (value as any).then === 'function'\n  }\n\n  const customValidator: FileValidator | undefined = props.validate\n    ? async ({ files }) => (await props.validate?.(files)) ?? []\n    : undefined\n\n  const validators: FileValidator[] = [\n    acceptValidator(props.accept),\n    ...(props.validators ?? []),\n    ...(customValidator ? [customValidator] : []),\n  ]\n\n  const res = runFileValidators(nextFiles, validators, {\n    source: 'input',\n    multiple: props.multiple,\n  })\n\n  const { files: picked, issues } = isPromiseLike(res) ? await res : res\n\n  if (issues.length > 0) {\n    setErrors(issues)\n    clearInputValue()\n    await nextTick()\n    return\n  }\n\n  clearErrors()\n  emitModel(picked)\n  clearInputValue()\n  await nextTick()\n}\n\nasync function onInputChange(event: Event) {\n  if (props.disabled) return\n\n  const target = event.target as HTMLInputElement | null\n  const nextFiles = target?.files ? Array.prototype.slice.call(target.files) as File[] : []\n\n  // Reset value so selecting the same file twice triggers change.\n  if (target) target.value = ''\n  await nextTick()\n\n  await applyFiles(nextFiles)\n}\n\nfunction clearAll() {\n  if (props.disabled) return\n  clearErrors()\n  clearInputValue()\n  emit('clear')\n\n  emit('update:modelValue', props.multiple ? [] : null)\n  emit('change', props.multiple ? [] : null)\n}\n\nfunction removeAt(index: number) {\n  if (props.disabled) return\n  if (!props.multiple) {\n    clearAll()\n    return\n  }\n\n  const next = files.value.slice()\n  next.splice(index, 1)\n\n  emit('update:modelValue', next)\n  emit('change', next)\n}\n\nfunction issueMessage(issue: GrFormFileError): string {\n  if (issue.fileName) return `${issue.fileName}: ${issue.message}`\n  return issue.message\n}\n\nconst dropzone = computed(() => {\n  const customValidator: FileValidator | undefined = props.validate\n    ? async ({ files }) => (await props.validate?.(files)) ?? []\n    : undefined\n\n  const validators: FileValidator[] = [\n    acceptValidator(props.accept),\n    ...(props.validators ?? []),\n    ...(customValidator ? [customValidator] : []),\n  ]\n\n  return {\n    enabled: !props.disabled,\n    multiple: props.multiple,\n    validators,\n    onFiles: async (dropped: File[]) => {\n      // `v-dropzone` уже выполнил валидаторы и нормализацию по `multiple`.\n      clearErrors()\n      emitModel(dropped)\n      clearInputValue()\n      await nextTick()\n    },\n    onError: (error: unknown) => {\n      if (error instanceof FileValidationError) {\n        setErrors(error.issues)\n      }\n      else {\n        setErrors([\n          {\n            code: 'accept',\n            message: t('gr.formFile.validateError', 'Failed to validate dropped files'),\n          },\n        ])\n      }\n    },\n  }\n})\n\nwatch(\n  () => props.modelValue,\n  (value) => {\n    if (!inputRef.value) return\n\n    if (!value || (Array.isArray(value) && value.length === 0)) {\n      // Позволяет выбрать тот же файл снова после внешнего сброса.\n      inputRef.value.value = ''\n    }\n  },\n)\n</script>\n\n<template>\n  <div\n    v-dropzone=\"dropzone\"\n    data-gr-form-file\n    class=\"rounded-[var(--gr-radius-md)]\"\n    :class=\"disabled ? 'opacity-60 cursor-not-allowed' : ''\"\n  >\n    <input\n      ref=\"inputRef\"\n      data-gr-form-file-input\n      type=\"file\"\n      tabindex=\"-1\"\n      aria-hidden=\"true\"\n      class=\"absolute opacity-0 w-px h-px pointer-events-none\"\n      :multiple=\"multiple\"\n      :accept=\"accept\"\n      :disabled=\"disabled\"\n      @change=\"onInputChange\"\n    >\n\n    <div class=\"flex flex-col gap-2\">\n      <div class=\"flex flex-wrap items-center gap-3\">\n        <GrButton\n          variant=\"secondary\"\n          size=\"sm\"\n          data-gr-form-file-upload-btn\n          :disabled=\"disabled\"\n          @click.prevent=\"openDialog\"\n        >\n          <GrIcon size=\"sm\" aria-hidden=\"true\">\n            <IconUpload />\n          </GrIcon>\n          <span class=\"ml-2\">{{ hasFiles ? resolvedChangeText : resolvedUploadText }}</span>\n        </GrButton>\n\n        <GrButton\n          v-if=\"hasFiles && !multiple\"\n          variant=\"secondary\"\n          size=\"sm\"\n          data-gr-form-file-clear-btn\n          :disabled=\"disabled\"\n          @click.prevent=\"clearAll\"\n        >\n          <GrIcon size=\"sm\" aria-hidden=\"true\">\n            <IconX />\n          </GrIcon>\n          <span class=\"ml-2\">{{ resolvedRemoveText }}</span>\n        </GrButton>\n\n        <GrButton\n          v-if=\"multiple && hasFiles\"\n          variant=\"secondary\"\n          size=\"sm\"\n          data-gr-form-file-clear-all-btn\n          :disabled=\"disabled\"\n          @click.prevent=\"clearAll\"\n        >\n          <GrIcon size=\"sm\" aria-hidden=\"true\">\n            <IconX />\n          </GrIcon>\n          <span class=\"ml-2\">{{ resolvedClearAllText }}</span>\n        </GrButton>\n\n        <span\n          v-if=\"!multiple && hasFiles\"\n          class=\"text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]\"\n          data-gr-form-file-single-name\n          :title=\"files[0]?.name\"\n        >\n          {{ files[0]?.name }}\n        </span>\n\n        <span\n          v-if=\"!hasFiles\"\n          class=\"text-sm text-[var(--gr-muted-fg)]\"\n          data-gr-form-file-placeholder\n        >\n          {{ resolvedPlaceholder }}\n        </span>\n      </div>\n\n      <div v-if=\"multiple && hasFiles\" class=\"flex flex-col gap-2\">\n        <div\n          v-for=\"(file, index) in files\"\n          :key=\"`${file.name}-${file.size}-${index}`\"\n          class=\"flex items-center gap-2\"\n          data-gr-form-file-item\n        >\n          <span\n            class=\"text-sm text-[var(--gr-muted-fg)] truncate max-w-[240px]\"\n            :title=\"file.name\"\n            data-gr-form-file-item-name\n          >\n            {{ file.name }}\n          </span>\n\n          <button\n            type=\"button\"\n            class=\"text-xs text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)]\"\n            data-gr-form-file-item-remove\n            :disabled=\"disabled\"\n            @click.prevent=\"removeAt(index)\"\n          >\n            {{ removeText }}\n          </button>\n        </div>\n      </div>\n\n      <slot name=\"errors\" :errors=\"localErrors\">\n        <div v-if=\"localErrors.length\" class=\"text-sm text-[var(--gr-danger)]\" data-gr-form-file-errors>\n          <div v-for=\"(e, i) in localErrors\" :key=\"i\" data-gr-form-file-error>\n            {{ issueMessage(e) }}\n          </div>\n        </div>\n      </slot>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n[data-gr-form-file].gr-dropzone--over {\n  outline: 2px solid var(--gr-ring);\n  outline-offset: 2px;\n}\n</style>\n"],"mappings":"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"}

package/dist/components/GrFormFile/index.js

@@ -1,3 +1,3 @@
-import { t as GrFormFile_default } from "./chunks/GrFormFile-CXcqqdvV.js";
+import { t as GrFormFile_default } from "./chunks/GrFormFile-CqacSbUl.js";
 import { t as grFormFileConfig } from "../../chunks/config-D7GZO-Dx.js";
 export { GrFormFile_default as GrFormFile, GrFormFile_default as default, grFormFileConfig };

package/dist/components/GrFormSection/chunks/{GrFormSection-Ce21jcgo.js → GrFormSection-C3w9DQJf.js}

@@ -26,7 +26,7 @@ var GrFormSection_default = /* @__PURE__ */ defineComponent({
 			}, toDisplayString(__props.title), 9, _hoisted_2), __props.description ? (openBlock(), createElementBlock("div", {
 				key: 0,
 				id: unref(descriptionId),
-				class: "mt-1 text-[13px] text-[var(--muted-fg)]"
+				class: "mt-1 text-[13px] text-[var(--gr-muted-fg)]"
 			}, toDisplayString(__props.description), 9, _hoisted_3)) : createCommentVNode("", true)]), renderSlot(_ctx.$slots, "default")], 8, _hoisted_1);
 		};
 	}

package/dist/components/GrFormSection/chunks/GrFormSection-C3w9DQJf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrFormSection-C3w9DQJf.js","names":[],"sources":["../../../../src/components/GrFormSection/GrFormSection.vue","../../../../src/components/GrFormSection/GrFormSection.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\n/**\n * GrFormSection — секция формы с заголовком, опциональным описанием и контентом.\n *\n * - `section` связан с заголовком через `aria-labelledby` и c описанием\n *   (если есть) через `aria-describedby` — для a11y.\n */\nexport interface GrFormSectionProps {\n  title: string\n  description?: string\n}\n\nwithDefaults(defineProps<GrFormSectionProps>(), {\n  description: undefined,\n})\n\nconst titleId = useId()\nconst descriptionId = useId()\n</script>\n\n<template>\n  <section\n    data-gr-form-section\n    class=\"grid gap-4\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"description ? descriptionId : undefined\"\n  >\n    <div>\n      <div :id=\"titleId\" class=\"text-[14px] font-700\">\n        {{ title }}\n      </div>\n      <div\n        v-if=\"description\"\n        :id=\"descriptionId\"\n        class=\"mt-1 text-[13px] text-[var(--gr-muted-fg)]\"\n      >\n        {{ description }}\n      </div>\n    </div>\n    <slot />\n  </section>\n</template>\n","<script setup lang=\"ts\">\nimport { useId } from 'vue'\n\n/**\n * GrFormSection — секция формы с заголовком, опциональным описанием и контентом.\n *\n * - `section` связан с заголовком через `aria-labelledby` и c описанием\n *   (если есть) через `aria-describedby` — для a11y.\n */\nexport interface GrFormSectionProps {\n  title: string\n  description?: string\n}\n\nwithDefaults(defineProps<GrFormSectionProps>(), {\n  description: undefined,\n})\n\nconst titleId = useId()\nconst descriptionId = useId()\n</script>\n\n<template>\n  <section\n    data-gr-form-section\n    class=\"grid gap-4\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"description ? descriptionId : undefined\"\n  >\n    <div>\n      <div :id=\"titleId\" class=\"text-[14px] font-700\">\n        {{ title }}\n      </div>\n      <div\n        v-if=\"description\"\n        :id=\"descriptionId\"\n        class=\"mt-1 text-[13px] text-[var(--gr-muted-fg)]\"\n      >\n        {{ description }}\n      </div>\n    </div>\n    <slot />\n  </section>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAkBA,MAAM,UAAU,MAAM;EACtB,MAAM,gBAAgB,MAAM;;uBAI1B,mBAmBU,WAAA;IAlBR,wBAAA;IACA,OAAM;IACL,mBAAiB,MAAA,OAAA;IACjB,oBAAkB,QAAA,cAAc,MAAA,aAAA,IAAgB,KAAA;OAEjD,mBAWM,OAAA,MAAA,CAVJ,mBAEM,OAAA;IAFA,IAAI,MAAA,OAAA;IAAS,OAAM;sBACpB,QAAA,KAAK,GAAA,GAAA,UAAA,GAGF,QAAA,eAAA,UAAA,GADR,mBAMM,OAAA;;IAJH,IAAI,MAAA,aAAA;IACL,OAAM;sBAEH,QAAA,WAAW,GAAA,GAAA,UAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA,GAGlB,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,GAAA,UAAA"}

package/dist/components/GrFormSection/index.js

@@ -1,3 +1,3 @@
-import { t as GrFormSection_default } from "./chunks/GrFormSection-Ce21jcgo.js";
+import { t as GrFormSection_default } from "./chunks/GrFormSection-C3w9DQJf.js";
 import { t as grFormSectionConfig } from "../../chunks/config-B0qIpo8m.js";
 export { GrFormSection_default as GrFormSection, GrFormSection_default as default, grFormSectionConfig };

package/dist/components/GrImageViewer/chunks/{GrImageViewer-Dla9IBkd.js → GrImageViewer-DDLJkvIU.js}

@@ -1,4 +1,4 @@
-import { t as useGranularityTranslations } from "../../../chunks/granularityI18n-DoV7Ca2m.js";
+import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-SH0I--GW.js";
 import { i as Ge, n as Se, r as he, s as Ye, t as useScrollLock } from "../../../chunks/useScrollLock-K7kaP2Ud.js";
 import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, nextTick, normalizeClass, normalizeProps, normalizeStyle, onBeforeUnmount, openBlock, ref, renderSlot, toDisplayString, unref, watch, withCtx } from "vue";
 //#region src/components/GrImageViewer/composables/useZoomPan.ts

package/dist/components/GrImageViewer/chunks/{GrImageViewer-Dla9IBkd.js.map → GrImageViewer-DDLJkvIU.js.map}

@@ -1 +1 @@
-{"version":3,"file":"GrImageViewer-Dla9IBkd.js","names":["$slots"],"sources":["../../../../src/components/GrImageViewer/composables/useZoomPan.ts","../../../../src/components/GrImageViewer/composables/useWheelGesture.ts","../../../../src/components/GrImageViewer/composables/useViewerKeyboard.ts","../../../../src/components/GrImageViewer/GrImageViewer.vue","../../../../src/components/GrImageViewer/GrImageViewer.vue"],"sourcesContent":["import { computed, ref, type Ref } from 'vue'\n\nconst TRAILING_ZERO_DECIMAL_RE = /\\.0$/\n\nexport function formatPercent(value: number): string {\n  if (Number.isInteger(value))\n    return String(value)\n  return value.toFixed(1).replace(TRAILING_ZERO_DECIMAL_RE, '')\n}\n\nexport interface UseZoomPanOptions {\n  minScale: () => number\n  maxScale: () => number\n  zoomRate: () => number\n  draggable: () => boolean\n  /** Ссылка на `<img>` — для измерения layout-размера и подписки ResizeObserver. */\n  imageEl: Ref<HTMLImageElement | null>\n  /** Колбэк на поворот (эмит `rotate`). */\n  onRotate: (deg: number) => void\n}\n\n/**\n * useZoomPan — состояние и логика масштаба/поворота/панорамирования картинки,\n * а также метрики (натуральный/вписанный/фактический размер, реальный масштаб).\n * Вынесено из монолитного `GrImageViewer.vue`.\n */\nexport function useZoomPan(options: UseZoomPanOptions) {\n  const scale = ref(1)\n  const rotation = ref(0)\n  const offsetX = ref(0)\n  const offsetY = ref(0)\n\n  const isDragging = ref(false)\n  let dragStartX = 0\n  let dragStartY = 0\n  let dragOffsetStartX = 0\n  let dragOffsetStartY = 0\n\n  // Натуральный размер (из `<img>`) и layout-размер вписанного (`object-contain`) изображения.\n  const naturalWidth = ref(0)\n  const naturalHeight = ref(0)\n  const fittedWidth = ref(0)\n  const fittedHeight = ref(0)\n\n  let resizeObserver: ResizeObserver | null = null\n\n  const imageStyle = computed(() => ({\n    transform: `translate3d(${offsetX.value}px, ${offsetY.value}px, 0) scale(${scale.value}) rotate(${rotation.value}deg)`,\n  }))\n\n  const zoomValueText = computed(() => formatPercent(scale.value * 100))\n\n  // Фактический размер изображения на экране вдоль его осей (footprint), c учётом scale.\n  const renderedWidth = computed(() => Math.round(fittedWidth.value * scale.value))\n  const renderedHeight = computed(() => Math.round(fittedHeight.value * scale.value))\n\n  // Реальный масштаб относительно натурального размера (доля). Не зависит от rotation.\n  const realScale = computed(() => {\n    if (!naturalWidth.value)\n      return 0\n    return (fittedWidth.value * scale.value) / naturalWidth.value\n  })\n  const realScalePercent = computed(() => formatPercent(realScale.value * 100))\n\n  function setScale(value: number): void {\n    const clamped = Math.min(options.maxScale(), Math.max(options.minScale(), value))\n    scale.value = Number(clamped.toFixed(4))\n  }\n\n  function zoomIn(): void {\n    setScale(scale.value * options.zoomRate())\n  }\n\n  function zoomOut(): void {\n    setScale(scale.value / options.zoomRate())\n  }\n\n  function rotateLeft(): void {\n    rotation.value -= 90\n    options.onRotate(rotation.value)\n  }\n\n  function rotateRight(): void {\n    rotation.value += 90\n    options.onRotate(rotation.value)\n  }\n\n  function resetTransform(): void {\n    scale.value = 1\n    rotation.value = 0\n    offsetX.value = 0\n    offsetY.value = 0\n    isDragging.value = false\n  }\n\n  function resetImageMetrics(): void {\n    naturalWidth.value = 0\n    naturalHeight.value = 0\n    fittedWidth.value = 0\n    fittedHeight.value = 0\n  }\n\n  function measureFitted(): void {\n    const el = options.imageEl.value\n    if (!el)\n      return\n    // offsetWidth/Height — layout-размер вписанного изображения, без CSS transform.\n    fittedWidth.value = el.offsetWidth\n    fittedHeight.value = el.offsetHeight\n  }\n\n  function onImageLoad(event: Event): void {\n    const el = event.target as HTMLImageElement\n    naturalWidth.value = el.naturalWidth\n    naturalHeight.value = el.naturalHeight\n    measureFitted()\n  }\n\n  function startObservingImage(): void {\n    const el = options.imageEl.value\n    if (!el || typeof ResizeObserver === 'undefined')\n      return\n\n    if (!resizeObserver)\n      resizeObserver = new ResizeObserver(() => measureFitted())\n\n    resizeObserver.observe(el)\n\n    // Если картинка уже в кэше и `load` не сработал — считаем метрики сразу.\n    if (el.complete && el.naturalWidth) {\n      naturalWidth.value = el.naturalWidth\n      naturalHeight.value = el.naturalHeight\n    }\n\n    measureFitted()\n  }\n\n  function stopObservingImage(): void {\n    resizeObserver?.disconnect()\n  }\n\n  function onPointerDown(event: PointerEvent): void {\n    // Тянем только основной кнопкой и только если drag включён.\n    if (!options.draggable() || event.button !== 0)\n      return\n\n    event.preventDefault()\n    isDragging.value = true\n    dragStartX = event.clientX\n    dragStartY = event.clientY\n    dragOffsetStartX = offsetX.value\n    dragOffsetStartY = offsetY.value\n\n    // Захватываем указатель, чтобы движение/отпускание ловились за пределами картинки.\n    ;(event.currentTarget as Element).setPointerCapture?.(event.pointerId)\n  }\n\n  function onPointerMove(event: PointerEvent): void {\n    if (!isDragging.value)\n      return\n    offsetX.value = dragOffsetStartX + (event.clientX - dragStartX)\n    offsetY.value = dragOffsetStartY + (event.clientY - dragStartY)\n  }\n\n  function onPointerUp(event: PointerEvent): void {\n    if (!isDragging.value)\n      return\n    isDragging.value = false\n    ;(event.currentTarget as Element).releasePointerCapture?.(event.pointerId)\n  }\n\n  return {\n    scale,\n    rotation,\n    offsetX,\n    offsetY,\n    isDragging,\n    naturalWidth,\n    naturalHeight,\n    fittedWidth,\n    fittedHeight,\n    imageStyle,\n    zoomValueText,\n    renderedWidth,\n    renderedHeight,\n    realScale,\n    realScalePercent,\n    setScale,\n    zoomIn,\n    zoomOut,\n    rotateLeft,\n    rotateRight,\n    resetTransform,\n    resetImageMetrics,\n    measureFitted,\n    onImageLoad,\n    startObservingImage,\n    stopObservingImage,\n    onPointerDown,\n    onPointerMove,\n    onPointerUp,\n  }\n}\n","import { ref } from 'vue'\n\n// Чувствительность масштабирования колесом/трекпадом: чем больше — тем резче реакция.\nconst WHEEL_ZOOM_SENSITIVITY = 0.0015\n// Сколько ms простоя после последнего wheel-события считаем «зум завершён»\n// (после этого возвращаем плавный CSS-переход).\nconst WHEEL_IDLE_MS = 120\n\nexport interface UseWheelGestureOptions {\n  /** Разрешён ли зум колесом (проп `wheelZoom` + наличие изображений). */\n  enabled: () => boolean\n  /** Применить множитель масштаба (накопленный за кадр). */\n  applyZoomFactor: (factor: number) => void\n}\n\n/**\n * useWheelGesture — масштабирование колесом мыши / жестом трекпада с батчингом\n * по `requestAnimationFrame` (рендер не чаще кадра — без «дёрганья»/наслоения) и\n * временным отключением CSS-перехода на время жеста (`isWheelZooming`).\n */\nexport function useWheelGesture(options: UseWheelGestureOptions) {\n  const isWheelZooming = ref(false)\n\n  let pendingWheelDelta = 0\n  let wheelFrameId: number | null = null\n  let wheelIdleTimer: ReturnType<typeof setTimeout> | null = null\n\n  function cancelWheelFrame(): void {\n    if (wheelFrameId !== null) {\n      cancelAnimationFrame(wheelFrameId)\n      wheelFrameId = null\n    }\n  }\n\n  function endWheelZoom(): void {\n    if (wheelIdleTimer !== null) {\n      clearTimeout(wheelIdleTimer)\n      wheelIdleTimer = null\n    }\n\n    isWheelZooming.value = false\n    pendingWheelDelta = 0\n    cancelWheelFrame()\n  }\n\n  // Применяем накопленный за кадр deltaY одним обновлением scale.\n  function flushWheelZoom(): void {\n    wheelFrameId = null\n\n    const delta = pendingWheelDelta\n    pendingWheelDelta = 0\n\n    if (!delta)\n      return\n\n    // Экспоненциальный шаг — плавно и одинаково для колеса и трекпада.\n    // delta < 0 (scroll up) — приближение, delta > 0 — отдаление.\n    const factor = Math.exp(-delta * WHEEL_ZOOM_SENSITIVITY)\n    options.applyZoomFactor(factor)\n  }\n\n  function onWheel(event: WheelEvent): void {\n    if (!options.enabled())\n      return\n\n    // Не даём странице/оверлею проскроллиться — колесо отдаём под зум.\n    event.preventDefault()\n\n    // Во время непрерывного зума отключаем CSS-переход: плавность даёт само\n    // покадровое обновление, а transition на микрошагах вызывает лаг/наслоение.\n    isWheelZooming.value = true\n\n    pendingWheelDelta += event.deltaY\n\n    if (wheelFrameId === null)\n      wheelFrameId = requestAnimationFrame(flushWheelZoom)\n\n    if (wheelIdleTimer !== null)\n      clearTimeout(wheelIdleTimer)\n\n    // По завершении жеста возвращаем плавный переход для дискретных зумов.\n    wheelIdleTimer = setTimeout(() => {\n      wheelIdleTimer = null\n      isWheelZooming.value = false\n    }, WHEEL_IDLE_MS)\n  }\n\n  return { isWheelZooming, onWheel, endWheelZoom }\n}\n","export interface ViewerKeyboardActions {\n  close: () => void\n  prev: () => void\n  next: () => void\n  zoomIn: () => void\n  zoomOut: () => void\n  reset: () => void\n}\n\nexport interface UseViewerKeyboardOptions {\n  /** Закрывать ли по Escape (проп `closeOnPressEscape`). */\n  closeOnEscape: () => boolean\n  actions: ViewerKeyboardActions\n}\n\n/**\n * useViewerKeyboard — клавиатурное управление просмотрщиком:\n * Esc — закрыть, стрелки — переключение, `+`/`-`/`0` — зум/сброс.\n */\nexport function useViewerKeyboard(options: UseViewerKeyboardOptions) {\n  const { actions } = options\n\n  function onKeydown(event: KeyboardEvent): void {\n    switch (event.key) {\n      case 'Escape':\n        if (!options.closeOnEscape())\n          return\n        event.preventDefault()\n        actions.close()\n        return\n\n      case 'ArrowLeft':\n        event.preventDefault()\n        actions.prev()\n        return\n\n      case 'ArrowRight':\n        event.preventDefault()\n        actions.next()\n        return\n\n      case '+':\n      case '=':\n      case 'Add':\n        event.preventDefault()\n        actions.zoomIn()\n        return\n\n      case '-':\n      case '_':\n      case 'Subtract':\n        event.preventDefault()\n        actions.zoomOut()\n        return\n\n      case '0':\n        event.preventDefault()\n        actions.reset()\n        break\n\n      default:\n    }\n  }\n\n  return { onKeydown }\n}\n","<script setup lang=\"ts\">\nimport { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'\nimport { Dialog, DialogPanel, TransitionChild, TransitionRoot } from '@headlessui/vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useScrollLock } from '../../composables/internal/useScrollLock'\nimport { useZoomPan } from './composables/useZoomPan'\nimport { useWheelGesture } from './composables/useWheelGesture'\nimport { useViewerKeyboard } from './composables/useViewerKeyboard'\n\n/**\n * Usage:\n *\n * <GrImageViewer\n *   v-model=\"open\"\n *   :url-list=\"images\"\n *   :initial-index=\"0\"\n *   show-progress\n *   hide-on-click-modal\n * />\n *\n * Логика вынесена в composables: `useZoomPan` (масштаб/поворот/пан + метрики),\n * `useWheelGesture` (зум колесом/трекпадом с rAF-батчингом), `useViewerKeyboard`\n * (клавиатура). Сам SFC отвечает за оверлей, индекс изображений и композицию.\n */\nconst props = withDefaults(\n  defineProps<{\n    modelValue: boolean\n    urlList: string[]\n    initialIndex?: number\n    zoomRate?: number\n    minScale?: number\n    maxScale?: number\n    hideOnClickModal?: boolean\n    closeOnPressEscape?: boolean\n    showProgress?: boolean\n    showZoomValue?: boolean\n    /** Включает масштабирование колесом мыши / жестом на трекпаде. По умолчанию включено. */\n    wheelZoom?: boolean\n    /** Включает перетаскивание (pan) картинки мышью. При наведении курсор «рука». По умолчанию выключено. */\n    draggable?: boolean\n    zIndex?: number\n    /** i18n: aria-label кнопки закрытия. */\n    closeLabel?: string\n    /** i18n: aria-label кнопки «предыдущее изображение». */\n    prevLabel?: string\n    /** i18n: aria-label кнопки «следующее изображение». */\n    nextLabel?: string\n    /** i18n: aria-label кнопки «увеличить». */\n    zoomInLabel?: string\n    /** i18n: aria-label кнопки «уменьшить». */\n    zoomOutLabel?: string\n    /** i18n: aria-label кнопки «сбросить масштаб». */\n    resetZoomLabel?: string\n    /** i18n: aria-label кнопки «повернуть влево». */\n    rotateLeftLabel?: string\n    /** i18n: aria-label кнопки «повернуть вправо». */\n    rotateRightLabel?: string\n    /** i18n: текст в пустом состоянии (нет изображений). */\n    emptyText?: string\n  }>(),\n  {\n    initialIndex: 0,\n    zoomRate: 1.2,\n    minScale: 0.5,\n    maxScale: 5,\n    hideOnClickModal: false,\n    closeOnPressEscape: true,\n    showProgress: false,\n    showZoomValue: true,\n    wheelZoom: true,\n    draggable: false,\n    zIndex: undefined,\n    closeLabel: undefined,\n    prevLabel: undefined,\n    nextLabel: undefined,\n    zoomInLabel: undefined,\n    zoomOutLabel: undefined,\n    resetZoomLabel: undefined,\n    rotateLeftLabel: undefined,\n    rotateRightLabel: undefined,\n    emptyText: undefined,\n  },\n)\n\nconst { t } = useGranularityTranslations()\nconst resolvedCloseLabel = computed(() => props.closeLabel ?? t('gr.imageViewer.close', 'Close image viewer'))\nconst resolvedPrevLabel = computed(() => props.prevLabel ?? t('gr.imageViewer.prev', 'Previous image'))\nconst resolvedNextLabel = computed(() => props.nextLabel ?? t('gr.imageViewer.next', 'Next image'))\nconst resolvedZoomInLabel = computed(() => props.zoomInLabel ?? t('gr.imageViewer.zoomIn', 'Zoom in'))\nconst resolvedZoomOutLabel = computed(() => props.zoomOutLabel ?? t('gr.imageViewer.zoomOut', 'Zoom out'))\nconst resolvedResetZoomLabel = computed(() => props.resetZoomLabel ?? t('gr.imageViewer.resetZoom', 'Reset zoom'))\nconst resolvedRotateLeftLabel = computed(() => props.rotateLeftLabel ?? t('gr.imageViewer.rotateLeft', 'Rotate left'))\nconst resolvedRotateRightLabel = computed(() => props.rotateRightLabel ?? t('gr.imageViewer.rotateRight', 'Rotate right'))\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.imageViewer.empty', 'No image'))\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: boolean): void\n  (e: 'close'): void\n  (e: 'switch', newIndex: number): void\n  (e: 'rotate', deg: number): void\n}>()\n\ntype GrImageViewerToolbarActions = {\n  close: () => void\n  prev: () => void\n  next: () => void\n  zoomIn: () => void\n  zoomOut: () => void\n  reset: () => void\n  rotateLeft: () => void\n  rotateRight: () => void\n}\n\ntype GrImageViewerSlotProps = {\n  index: number\n  displayIndex: number\n  total: number\n  scale: number\n  rotation: number\n  /** Натуральный (исходный) размер картинки, px. 0 пока изображение не загружено. */\n  naturalWidth: number\n  naturalHeight: number\n  /** Фактический размер изображения на экране c учётом scale, px (footprint вдоль осей картинки). */\n  renderedWidth: number\n  renderedHeight: number\n  /** Реальный масштаб относительно натурального размера (доля): renderedWidth / naturalWidth. */\n  realScale: number\n  /** Реальный масштаб в процентах, отформатированный (например `67`). */\n  realScalePercent: string\n  actions: GrImageViewerToolbarActions\n}\n\nconst DEFAULT_Z_INDEX = 2000\n\nconst open = computed(() => props.modelValue)\n\n// SSR-guard для teleport + общий reference-counted scroll-lock (как в GrModal/GrDrawer).\nconst isClient = typeof window !== 'undefined'\nconst { lock: lockBodyScroll, unlock: unlockBodyScroll } = useScrollLock()\n\nconst total = computed(() => props.urlList.length)\nconst hasImages = computed(() => total.value > 0)\n\nconst currentIndex = ref(0)\nconst imageEl = ref<HTMLImageElement | null>(null)\n\n// Масштаб / поворот / панорамирование + метрики изображения.\nconst {\n  scale,\n  rotation,\n  isDragging,\n  naturalWidth,\n  naturalHeight,\n  renderedWidth,\n  renderedHeight,\n  realScale,\n  realScalePercent,\n  imageStyle,\n  zoomValueText,\n  setScale,\n  zoomIn,\n  zoomOut,\n  rotateLeft,\n  rotateRight,\n  resetTransform,\n  resetImageMetrics,\n  onImageLoad,\n  startObservingImage,\n  stopObservingImage,\n  onPointerDown,\n  onPointerMove,\n  onPointerUp,\n} = useZoomPan({\n  minScale: () => props.minScale,\n  maxScale: () => props.maxScale,\n  zoomRate: () => props.zoomRate,\n  draggable: () => props.draggable,\n  imageEl,\n  onRotate: deg => emit('rotate', deg),\n})\n\n// Зум колесом мыши / жестом трекпада.\nconst { isWheelZooming, onWheel, endWheelZoom } = useWheelGesture({\n  enabled: () => props.wheelZoom && hasImages.value,\n  applyZoomFactor: factor => setScale(scale.value * factor),\n})\n\nconst currentUrl = computed(() => (hasImages.value ? props.urlList[currentIndex.value] : undefined))\nconst displayIndex = computed(() => (hasImages.value ? currentIndex.value + 1 : 0))\n\nconst viewerStyle = computed(() => ({\n  zIndex: String(Number.isFinite(props.zIndex) ? props.zIndex : DEFAULT_Z_INDEX),\n}))\n\n// Плавный CSS-переход только для дискретных зумов; при wheel-зуме/перетаскивании отключаем.\nconst imageTransitionClass = computed(() =>\n  isWheelZooming.value || isDragging.value ? '' : 'transition-transform duration-150 ease-out',\n)\n\n// Курсор «рука» (grab/grabbing), только если включён drag.\nconst imageCursorClass = computed(() => {\n  if (!props.draggable)\n    return ''\n  return isDragging.value ? 'cursor-grabbing' : 'cursor-grab'\n})\n\nfunction normalizeIndex(value: number): number {\n  if (!hasImages.value)\n    return 0\n  const normalized = Number.isFinite(value) ? Math.trunc(value) : 0\n  return ((normalized % total.value) + total.value) % total.value\n}\n\nfunction setIndex(nextIndex: number, options?: { emitSwitch?: boolean }): void {\n  const normalizedIndex = normalizeIndex(nextIndex)\n  if (normalizedIndex === currentIndex.value)\n    return\n\n  currentIndex.value = normalizedIndex\n  resetTransform()\n  resetImageMetrics()\n  endWheelZoom()\n\n  if (options?.emitSwitch !== false)\n    emit('switch', normalizedIndex)\n}\n\nfunction syncIndexFromInitial(): void {\n  if (!hasImages.value) {\n    currentIndex.value = 0\n    return\n  }\n  currentIndex.value = normalizeIndex(props.initialIndex)\n  resetTransform()\n  resetImageMetrics()\n  endWheelZoom()\n}\n\nfunction preloadAt(index: number): void {\n  const url = props.urlList[index]\n  if (!url)\n    return\n  const image = new Image()\n  image.decoding = 'async'\n  image.src = url\n}\n\nfunction closeViewer(): void {\n  emit('update:modelValue', false)\n  emit('close')\n}\n\nfunction prev(): void {\n  setIndex(currentIndex.value - 1)\n}\n\nfunction next(): void {\n  setIndex(currentIndex.value + 1)\n}\n\nconst toolbarActions: GrImageViewerToolbarActions = {\n  close: closeViewer,\n  prev,\n  next,\n  zoomIn,\n  zoomOut,\n  reset: resetTransform,\n  rotateLeft,\n  rotateRight,\n}\n\nconst toolbarSlotProps = computed<GrImageViewerSlotProps>(() => ({\n  index: currentIndex.value,\n  displayIndex: displayIndex.value,\n  total: total.value,\n  scale: scale.value,\n  rotation: rotation.value,\n  naturalWidth: naturalWidth.value,\n  naturalHeight: naturalHeight.value,\n  renderedWidth: renderedWidth.value,\n  renderedHeight: renderedHeight.value,\n  realScale: realScale.value,\n  realScalePercent: realScalePercent.value,\n  actions: toolbarActions,\n}))\n\nfunction onBackdropClick(): void {\n  if (!props.hideOnClickModal)\n    return\n  closeViewer()\n}\n\nconst { onKeydown } = useViewerKeyboard({\n  closeOnEscape: () => props.closeOnPressEscape,\n  actions: { close: closeViewer, prev, next, zoomIn, zoomOut, reset: resetTransform },\n})\n\nwatch(\n  () => props.modelValue,\n  async (isOpen) => {\n    if (!isOpen) {\n      unlockBodyScroll()\n      stopObservingImage()\n      endWheelZoom()\n      isDragging.value = false\n      return\n    }\n\n    lockBodyScroll()\n    syncIndexFromInitial()\n    await nextTick()\n    startObservingImage()\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => props.initialIndex,\n  () => {\n    if (!props.modelValue)\n      return\n    syncIndexFromInitial()\n  },\n)\n\nwatch(\n  () => props.urlList,\n  () => {\n    if (!props.modelValue)\n      return\n    syncIndexFromInitial()\n  },\n  { deep: true },\n)\n\nwatch(\n  currentIndex,\n  (index) => {\n    if (!hasImages.value || total.value < 2)\n      return\n    preloadAt(normalizeIndex(index - 1))\n    preloadAt(normalizeIndex(index + 1))\n  },\n  { immediate: true },\n)\n\nonBeforeUnmount(() => {\n  unlockBodyScroll()\n  stopObservingImage()\n  endWheelZoom()\n})\n</script>\n\n<template>\n  <teleport to=\"body\" :disabled=\"!isClient\">\n    <TransitionRoot :show=\"open\" as=\"template\">\n      <Dialog\n        as=\"div\"\n        class=\"fixed inset-0\"\n        :style=\"viewerStyle\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        :static=\"true\"\n        @keydown=\"onKeydown\"\n      >\n        <div class=\"fixed inset-0 overflow-hidden\">\n          <TransitionChild\n            as=\"template\"\n            enter=\"duration-150 ease-out\"\n            enter-from=\"opacity-0\"\n            enter-to=\"opacity-100\"\n            leave=\"duration-120 ease-in\"\n            leave-from=\"opacity-100\"\n            leave-to=\"opacity-0\"\n          >\n            <div\n              data-gr-image-viewer-overlay\n              class=\"absolute inset-0 bg-black/60 backdrop-blur-sm\"\n              aria-hidden=\"true\"\n              @click=\"onBackdropClick\"\n            />\n          </TransitionChild>\n\n          <TransitionChild\n            as=\"template\"\n            enter=\"duration-180 ease-out\"\n            enter-from=\"opacity-0 scale-98\"\n            enter-to=\"opacity-100 scale-100\"\n            leave=\"duration-130 ease-in\"\n            leave-from=\"opacity-100 scale-100\"\n            leave-to=\"opacity-0 scale-98\"\n          >\n            <DialogPanel\n              data-gr-image-viewer-panel\n              class=\"relative z-10 h-full w-full outline-none\"\n              tabindex=\"-1\"\n            >\n              <div class=\"pointer-events-none absolute inset-x-0 top-0 z-30 px-3 py-3 sm:px-6\">\n                <div class=\"pointer-events-auto flex items-center justify-between gap-3\">\n                  <div class=\"flex items-center gap-2\">\n                    <div\n                      v-if=\"showProgress\"\n                      data-gr-image-viewer-progress\n                      class=\"rounded-full bg-black/35 px-3 py-1 text-xs font-600 text-white/95 sm:text-sm\"\n                    >\n                      {{ displayIndex }} / {{ total }}\n                    </div>\n\n                    <div\n                      v-if=\"showZoomValue\"\n                      data-gr-image-viewer-zoom-value\n                      class=\"rounded-full bg-black/35 px-3 py-1 text-xs font-700 text-white/95 sm:text-sm\"\n                    >\n                      {{ zoomValueText }}%\n                    </div>\n                  </div>\n\n                  <button\n                    type=\"button\"\n                    data-gr-image-viewer-close\n                    :aria-label=\"resolvedCloseLabel\"\n                    class=\"h-11 w-11 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                    @click=\"closeViewer\"\n                  >\n                    <span aria-hidden=\"true\" class=\"text-lg leading-none\">✕</span>\n                  </button>\n                </div>\n              </div>\n\n              <div\n                class=\"relative z-10 h-full w-full flex items-center justify-center px-16 py-16 sm:px-24 sm:py-20\"\n                @wheel=\"onWheel\"\n              >\n                <button\n                  v-if=\"total > 1\"\n                  type=\"button\"\n                  data-gr-image-viewer-prev\n                  :aria-label=\"resolvedPrevLabel\"\n                  class=\"absolute left-3 top-1/2 z-20 h-12 w-12 -translate-y-1/2 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80 sm:left-6\"\n                  @click=\"prev\"\n                >\n                  <span aria-hidden=\"true\" class=\"text-xl leading-none\">‹</span>\n                </button>\n\n                <button\n                  v-if=\"total > 1\"\n                  type=\"button\"\n                  data-gr-image-viewer-next\n                  :aria-label=\"resolvedNextLabel\"\n                  class=\"absolute right-3 top-1/2 z-20 h-12 w-12 -translate-y-1/2 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80 sm:right-6\"\n                  @click=\"next\"\n                >\n                  <span aria-hidden=\"true\" class=\"text-xl leading-none\">›</span>\n                </button>\n\n                <div class=\"h-full w-full flex items-center justify-center\">\n                  <img\n                    v-if=\"currentUrl\"\n                    ref=\"imageEl\"\n                    data-gr-image-viewer-image\n                    :src=\"currentUrl\"\n                    alt=\"\"\n                    draggable=\"false\"\n                    class=\"max-h-full max-w-full select-none object-contain will-change-transform\"\n                    :class=\"[imageTransitionClass, imageCursorClass]\"\n                    :style=\"imageStyle\"\n                    @load=\"onImageLoad\"\n                    @pointerdown=\"onPointerDown\"\n                    @pointermove=\"onPointerMove\"\n                    @pointerup=\"onPointerUp\"\n                    @pointercancel=\"onPointerUp\"\n                  >\n\n                  <div\n                    v-else\n                    class=\"rounded-[var(--gr-radius-xl)] border border-white/20 bg-black/25 px-4 py-3 text-sm text-white/80\"\n                  >\n                    {{ resolvedEmptyText }}\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"pointer-events-none absolute inset-x-0 bottom-0 z-30 px-3 pb-3 sm:px-6 sm:pb-6\">\n                <div class=\"pointer-events-auto mx-auto w-full max-w-max\">\n                  <slot\n                    name=\"toolbar\"\n                    v-bind=\"toolbarSlotProps\"\n                  >\n                    <div class=\"rounded-full border border-white/20 bg-black/35 p-1 backdrop-blur-sm flex items-center gap-1\">\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-out\n                        :aria-label=\"resolvedZoomOutLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"zoomOut\"\n                      >\n                        −\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-reset\n                        :aria-label=\"resolvedResetZoomLabel\"\n                        class=\"h-11 min-w-11 px-3 flex items-center justify-center rounded-full text-xs font-700 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"resetTransform\"\n                      >\n                        100%\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-in\n                        :aria-label=\"resolvedZoomInLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"zoomIn\"\n                      >\n                        +\n                      </button>\n\n                      <template v-if=\"$slots['toolbar-actions']\">\n                        <div class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n\n                        <slot\n                          name=\"toolbar-actions\"\n                          v-bind=\"toolbarSlotProps\"\n                        />\n\n                        <div class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n                      </template>\n\n                      <div v-else class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-rotate-left\n                        :aria-label=\"resolvedRotateLeftLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"rotateLeft\"\n                      >\n                        ↺\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-rotate-right\n                        :aria-label=\"resolvedRotateRightLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"rotateRight\"\n                      >\n                        ↻\n                      </button>\n                    </div>\n                  </slot>\n                </div>\n              </div>\n            </DialogPanel>\n          </TransitionChild>\n        </div>\n      </Dialog>\n    </TransitionRoot>\n  </teleport>\n</template>","<script setup lang=\"ts\">\nimport { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'\nimport { Dialog, DialogPanel, TransitionChild, TransitionRoot } from '@headlessui/vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useScrollLock } from '../../composables/internal/useScrollLock'\nimport { useZoomPan } from './composables/useZoomPan'\nimport { useWheelGesture } from './composables/useWheelGesture'\nimport { useViewerKeyboard } from './composables/useViewerKeyboard'\n\n/**\n * Usage:\n *\n * <GrImageViewer\n *   v-model=\"open\"\n *   :url-list=\"images\"\n *   :initial-index=\"0\"\n *   show-progress\n *   hide-on-click-modal\n * />\n *\n * Логика вынесена в composables: `useZoomPan` (масштаб/поворот/пан + метрики),\n * `useWheelGesture` (зум колесом/трекпадом с rAF-батчингом), `useViewerKeyboard`\n * (клавиатура). Сам SFC отвечает за оверлей, индекс изображений и композицию.\n */\nconst props = withDefaults(\n  defineProps<{\n    modelValue: boolean\n    urlList: string[]\n    initialIndex?: number\n    zoomRate?: number\n    minScale?: number\n    maxScale?: number\n    hideOnClickModal?: boolean\n    closeOnPressEscape?: boolean\n    showProgress?: boolean\n    showZoomValue?: boolean\n    /** Включает масштабирование колесом мыши / жестом на трекпаде. По умолчанию включено. */\n    wheelZoom?: boolean\n    /** Включает перетаскивание (pan) картинки мышью. При наведении курсор «рука». По умолчанию выключено. */\n    draggable?: boolean\n    zIndex?: number\n    /** i18n: aria-label кнопки закрытия. */\n    closeLabel?: string\n    /** i18n: aria-label кнопки «предыдущее изображение». */\n    prevLabel?: string\n    /** i18n: aria-label кнопки «следующее изображение». */\n    nextLabel?: string\n    /** i18n: aria-label кнопки «увеличить». */\n    zoomInLabel?: string\n    /** i18n: aria-label кнопки «уменьшить». */\n    zoomOutLabel?: string\n    /** i18n: aria-label кнопки «сбросить масштаб». */\n    resetZoomLabel?: string\n    /** i18n: aria-label кнопки «повернуть влево». */\n    rotateLeftLabel?: string\n    /** i18n: aria-label кнопки «повернуть вправо». */\n    rotateRightLabel?: string\n    /** i18n: текст в пустом состоянии (нет изображений). */\n    emptyText?: string\n  }>(),\n  {\n    initialIndex: 0,\n    zoomRate: 1.2,\n    minScale: 0.5,\n    maxScale: 5,\n    hideOnClickModal: false,\n    closeOnPressEscape: true,\n    showProgress: false,\n    showZoomValue: true,\n    wheelZoom: true,\n    draggable: false,\n    zIndex: undefined,\n    closeLabel: undefined,\n    prevLabel: undefined,\n    nextLabel: undefined,\n    zoomInLabel: undefined,\n    zoomOutLabel: undefined,\n    resetZoomLabel: undefined,\n    rotateLeftLabel: undefined,\n    rotateRightLabel: undefined,\n    emptyText: undefined,\n  },\n)\n\nconst { t } = useGranularityTranslations()\nconst resolvedCloseLabel = computed(() => props.closeLabel ?? t('gr.imageViewer.close', 'Close image viewer'))\nconst resolvedPrevLabel = computed(() => props.prevLabel ?? t('gr.imageViewer.prev', 'Previous image'))\nconst resolvedNextLabel = computed(() => props.nextLabel ?? t('gr.imageViewer.next', 'Next image'))\nconst resolvedZoomInLabel = computed(() => props.zoomInLabel ?? t('gr.imageViewer.zoomIn', 'Zoom in'))\nconst resolvedZoomOutLabel = computed(() => props.zoomOutLabel ?? t('gr.imageViewer.zoomOut', 'Zoom out'))\nconst resolvedResetZoomLabel = computed(() => props.resetZoomLabel ?? t('gr.imageViewer.resetZoom', 'Reset zoom'))\nconst resolvedRotateLeftLabel = computed(() => props.rotateLeftLabel ?? t('gr.imageViewer.rotateLeft', 'Rotate left'))\nconst resolvedRotateRightLabel = computed(() => props.rotateRightLabel ?? t('gr.imageViewer.rotateRight', 'Rotate right'))\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.imageViewer.empty', 'No image'))\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: boolean): void\n  (e: 'close'): void\n  (e: 'switch', newIndex: number): void\n  (e: 'rotate', deg: number): void\n}>()\n\ntype GrImageViewerToolbarActions = {\n  close: () => void\n  prev: () => void\n  next: () => void\n  zoomIn: () => void\n  zoomOut: () => void\n  reset: () => void\n  rotateLeft: () => void\n  rotateRight: () => void\n}\n\ntype GrImageViewerSlotProps = {\n  index: number\n  displayIndex: number\n  total: number\n  scale: number\n  rotation: number\n  /** Натуральный (исходный) размер картинки, px. 0 пока изображение не загружено. */\n  naturalWidth: number\n  naturalHeight: number\n  /** Фактический размер изображения на экране c учётом scale, px (footprint вдоль осей картинки). */\n  renderedWidth: number\n  renderedHeight: number\n  /** Реальный масштаб относительно натурального размера (доля): renderedWidth / naturalWidth. */\n  realScale: number\n  /** Реальный масштаб в процентах, отформатированный (например `67`). */\n  realScalePercent: string\n  actions: GrImageViewerToolbarActions\n}\n\nconst DEFAULT_Z_INDEX = 2000\n\nconst open = computed(() => props.modelValue)\n\n// SSR-guard для teleport + общий reference-counted scroll-lock (как в GrModal/GrDrawer).\nconst isClient = typeof window !== 'undefined'\nconst { lock: lockBodyScroll, unlock: unlockBodyScroll } = useScrollLock()\n\nconst total = computed(() => props.urlList.length)\nconst hasImages = computed(() => total.value > 0)\n\nconst currentIndex = ref(0)\nconst imageEl = ref<HTMLImageElement | null>(null)\n\n// Масштаб / поворот / панорамирование + метрики изображения.\nconst {\n  scale,\n  rotation,\n  isDragging,\n  naturalWidth,\n  naturalHeight,\n  renderedWidth,\n  renderedHeight,\n  realScale,\n  realScalePercent,\n  imageStyle,\n  zoomValueText,\n  setScale,\n  zoomIn,\n  zoomOut,\n  rotateLeft,\n  rotateRight,\n  resetTransform,\n  resetImageMetrics,\n  onImageLoad,\n  startObservingImage,\n  stopObservingImage,\n  onPointerDown,\n  onPointerMove,\n  onPointerUp,\n} = useZoomPan({\n  minScale: () => props.minScale,\n  maxScale: () => props.maxScale,\n  zoomRate: () => props.zoomRate,\n  draggable: () => props.draggable,\n  imageEl,\n  onRotate: deg => emit('rotate', deg),\n})\n\n// Зум колесом мыши / жестом трекпада.\nconst { isWheelZooming, onWheel, endWheelZoom } = useWheelGesture({\n  enabled: () => props.wheelZoom && hasImages.value,\n  applyZoomFactor: factor => setScale(scale.value * factor),\n})\n\nconst currentUrl = computed(() => (hasImages.value ? props.urlList[currentIndex.value] : undefined))\nconst displayIndex = computed(() => (hasImages.value ? currentIndex.value + 1 : 0))\n\nconst viewerStyle = computed(() => ({\n  zIndex: String(Number.isFinite(props.zIndex) ? props.zIndex : DEFAULT_Z_INDEX),\n}))\n\n// Плавный CSS-переход только для дискретных зумов; при wheel-зуме/перетаскивании отключаем.\nconst imageTransitionClass = computed(() =>\n  isWheelZooming.value || isDragging.value ? '' : 'transition-transform duration-150 ease-out',\n)\n\n// Курсор «рука» (grab/grabbing), только если включён drag.\nconst imageCursorClass = computed(() => {\n  if (!props.draggable)\n    return ''\n  return isDragging.value ? 'cursor-grabbing' : 'cursor-grab'\n})\n\nfunction normalizeIndex(value: number): number {\n  if (!hasImages.value)\n    return 0\n  const normalized = Number.isFinite(value) ? Math.trunc(value) : 0\n  return ((normalized % total.value) + total.value) % total.value\n}\n\nfunction setIndex(nextIndex: number, options?: { emitSwitch?: boolean }): void {\n  const normalizedIndex = normalizeIndex(nextIndex)\n  if (normalizedIndex === currentIndex.value)\n    return\n\n  currentIndex.value = normalizedIndex\n  resetTransform()\n  resetImageMetrics()\n  endWheelZoom()\n\n  if (options?.emitSwitch !== false)\n    emit('switch', normalizedIndex)\n}\n\nfunction syncIndexFromInitial(): void {\n  if (!hasImages.value) {\n    currentIndex.value = 0\n    return\n  }\n  currentIndex.value = normalizeIndex(props.initialIndex)\n  resetTransform()\n  resetImageMetrics()\n  endWheelZoom()\n}\n\nfunction preloadAt(index: number): void {\n  const url = props.urlList[index]\n  if (!url)\n    return\n  const image = new Image()\n  image.decoding = 'async'\n  image.src = url\n}\n\nfunction closeViewer(): void {\n  emit('update:modelValue', false)\n  emit('close')\n}\n\nfunction prev(): void {\n  setIndex(currentIndex.value - 1)\n}\n\nfunction next(): void {\n  setIndex(currentIndex.value + 1)\n}\n\nconst toolbarActions: GrImageViewerToolbarActions = {\n  close: closeViewer,\n  prev,\n  next,\n  zoomIn,\n  zoomOut,\n  reset: resetTransform,\n  rotateLeft,\n  rotateRight,\n}\n\nconst toolbarSlotProps = computed<GrImageViewerSlotProps>(() => ({\n  index: currentIndex.value,\n  displayIndex: displayIndex.value,\n  total: total.value,\n  scale: scale.value,\n  rotation: rotation.value,\n  naturalWidth: naturalWidth.value,\n  naturalHeight: naturalHeight.value,\n  renderedWidth: renderedWidth.value,\n  renderedHeight: renderedHeight.value,\n  realScale: realScale.value,\n  realScalePercent: realScalePercent.value,\n  actions: toolbarActions,\n}))\n\nfunction onBackdropClick(): void {\n  if (!props.hideOnClickModal)\n    return\n  closeViewer()\n}\n\nconst { onKeydown } = useViewerKeyboard({\n  closeOnEscape: () => props.closeOnPressEscape,\n  actions: { close: closeViewer, prev, next, zoomIn, zoomOut, reset: resetTransform },\n})\n\nwatch(\n  () => props.modelValue,\n  async (isOpen) => {\n    if (!isOpen) {\n      unlockBodyScroll()\n      stopObservingImage()\n      endWheelZoom()\n      isDragging.value = false\n      return\n    }\n\n    lockBodyScroll()\n    syncIndexFromInitial()\n    await nextTick()\n    startObservingImage()\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => props.initialIndex,\n  () => {\n    if (!props.modelValue)\n      return\n    syncIndexFromInitial()\n  },\n)\n\nwatch(\n  () => props.urlList,\n  () => {\n    if (!props.modelValue)\n      return\n    syncIndexFromInitial()\n  },\n  { deep: true },\n)\n\nwatch(\n  currentIndex,\n  (index) => {\n    if (!hasImages.value || total.value < 2)\n      return\n    preloadAt(normalizeIndex(index - 1))\n    preloadAt(normalizeIndex(index + 1))\n  },\n  { immediate: true },\n)\n\nonBeforeUnmount(() => {\n  unlockBodyScroll()\n  stopObservingImage()\n  endWheelZoom()\n})\n</script>\n\n<template>\n  <teleport to=\"body\" :disabled=\"!isClient\">\n    <TransitionRoot :show=\"open\" as=\"template\">\n      <Dialog\n        as=\"div\"\n        class=\"fixed inset-0\"\n        :style=\"viewerStyle\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        :static=\"true\"\n        @keydown=\"onKeydown\"\n      >\n        <div class=\"fixed inset-0 overflow-hidden\">\n          <TransitionChild\n            as=\"template\"\n            enter=\"duration-150 ease-out\"\n            enter-from=\"opacity-0\"\n            enter-to=\"opacity-100\"\n            leave=\"duration-120 ease-in\"\n            leave-from=\"opacity-100\"\n            leave-to=\"opacity-0\"\n          >\n            <div\n              data-gr-image-viewer-overlay\n              class=\"absolute inset-0 bg-black/60 backdrop-blur-sm\"\n              aria-hidden=\"true\"\n              @click=\"onBackdropClick\"\n            />\n          </TransitionChild>\n\n          <TransitionChild\n            as=\"template\"\n            enter=\"duration-180 ease-out\"\n            enter-from=\"opacity-0 scale-98\"\n            enter-to=\"opacity-100 scale-100\"\n            leave=\"duration-130 ease-in\"\n            leave-from=\"opacity-100 scale-100\"\n            leave-to=\"opacity-0 scale-98\"\n          >\n            <DialogPanel\n              data-gr-image-viewer-panel\n              class=\"relative z-10 h-full w-full outline-none\"\n              tabindex=\"-1\"\n            >\n              <div class=\"pointer-events-none absolute inset-x-0 top-0 z-30 px-3 py-3 sm:px-6\">\n                <div class=\"pointer-events-auto flex items-center justify-between gap-3\">\n                  <div class=\"flex items-center gap-2\">\n                    <div\n                      v-if=\"showProgress\"\n                      data-gr-image-viewer-progress\n                      class=\"rounded-full bg-black/35 px-3 py-1 text-xs font-600 text-white/95 sm:text-sm\"\n                    >\n                      {{ displayIndex }} / {{ total }}\n                    </div>\n\n                    <div\n                      v-if=\"showZoomValue\"\n                      data-gr-image-viewer-zoom-value\n                      class=\"rounded-full bg-black/35 px-3 py-1 text-xs font-700 text-white/95 sm:text-sm\"\n                    >\n                      {{ zoomValueText }}%\n                    </div>\n                  </div>\n\n                  <button\n                    type=\"button\"\n                    data-gr-image-viewer-close\n                    :aria-label=\"resolvedCloseLabel\"\n                    class=\"h-11 w-11 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                    @click=\"closeViewer\"\n                  >\n                    <span aria-hidden=\"true\" class=\"text-lg leading-none\">✕</span>\n                  </button>\n                </div>\n              </div>\n\n              <div\n                class=\"relative z-10 h-full w-full flex items-center justify-center px-16 py-16 sm:px-24 sm:py-20\"\n                @wheel=\"onWheel\"\n              >\n                <button\n                  v-if=\"total > 1\"\n                  type=\"button\"\n                  data-gr-image-viewer-prev\n                  :aria-label=\"resolvedPrevLabel\"\n                  class=\"absolute left-3 top-1/2 z-20 h-12 w-12 -translate-y-1/2 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80 sm:left-6\"\n                  @click=\"prev\"\n                >\n                  <span aria-hidden=\"true\" class=\"text-xl leading-none\">‹</span>\n                </button>\n\n                <button\n                  v-if=\"total > 1\"\n                  type=\"button\"\n                  data-gr-image-viewer-next\n                  :aria-label=\"resolvedNextLabel\"\n                  class=\"absolute right-3 top-1/2 z-20 h-12 w-12 -translate-y-1/2 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80 sm:right-6\"\n                  @click=\"next\"\n                >\n                  <span aria-hidden=\"true\" class=\"text-xl leading-none\">›</span>\n                </button>\n\n                <div class=\"h-full w-full flex items-center justify-center\">\n                  <img\n                    v-if=\"currentUrl\"\n                    ref=\"imageEl\"\n                    data-gr-image-viewer-image\n                    :src=\"currentUrl\"\n                    alt=\"\"\n                    draggable=\"false\"\n                    class=\"max-h-full max-w-full select-none object-contain will-change-transform\"\n                    :class=\"[imageTransitionClass, imageCursorClass]\"\n                    :style=\"imageStyle\"\n                    @load=\"onImageLoad\"\n                    @pointerdown=\"onPointerDown\"\n                    @pointermove=\"onPointerMove\"\n                    @pointerup=\"onPointerUp\"\n                    @pointercancel=\"onPointerUp\"\n                  >\n\n                  <div\n                    v-else\n                    class=\"rounded-[var(--gr-radius-xl)] border border-white/20 bg-black/25 px-4 py-3 text-sm text-white/80\"\n                  >\n                    {{ resolvedEmptyText }}\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"pointer-events-none absolute inset-x-0 bottom-0 z-30 px-3 pb-3 sm:px-6 sm:pb-6\">\n                <div class=\"pointer-events-auto mx-auto w-full max-w-max\">\n                  <slot\n                    name=\"toolbar\"\n                    v-bind=\"toolbarSlotProps\"\n                  >\n                    <div class=\"rounded-full border border-white/20 bg-black/35 p-1 backdrop-blur-sm flex items-center gap-1\">\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-out\n                        :aria-label=\"resolvedZoomOutLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"zoomOut\"\n                      >\n                        −\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-reset\n                        :aria-label=\"resolvedResetZoomLabel\"\n                        class=\"h-11 min-w-11 px-3 flex items-center justify-center rounded-full text-xs font-700 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"resetTransform\"\n                      >\n                        100%\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-in\n                        :aria-label=\"resolvedZoomInLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"zoomIn\"\n                      >\n                        +\n                      </button>\n\n                      <template v-if=\"$slots['toolbar-actions']\">\n                        <div class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n\n                        <slot\n                          name=\"toolbar-actions\"\n                          v-bind=\"toolbarSlotProps\"\n                        />\n\n                        <div class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n                      </template>\n\n                      <div v-else class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-rotate-left\n                        :aria-label=\"resolvedRotateLeftLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"rotateLeft\"\n                      >\n                        ↺\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-rotate-right\n                        :aria-label=\"resolvedRotateRightLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"rotateRight\"\n                      >\n                        ↻\n                      </button>\n                    </div>\n                  </slot>\n                </div>\n              </div>\n            </DialogPanel>\n          </TransitionChild>\n        </div>\n      </Dialog>\n    </TransitionRoot>\n  </teleport>\n</template>"],"mappings":"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"}
+{"version":3,"file":"GrImageViewer-DDLJkvIU.js","names":["$slots"],"sources":["../../../../src/components/GrImageViewer/composables/useZoomPan.ts","../../../../src/components/GrImageViewer/composables/useWheelGesture.ts","../../../../src/components/GrImageViewer/composables/useViewerKeyboard.ts","../../../../src/components/GrImageViewer/GrImageViewer.vue","../../../../src/components/GrImageViewer/GrImageViewer.vue"],"sourcesContent":["import { computed, ref, type Ref } from 'vue'\n\nconst TRAILING_ZERO_DECIMAL_RE = /\\.0$/\n\nexport function formatPercent(value: number): string {\n  if (Number.isInteger(value))\n    return String(value)\n  return value.toFixed(1).replace(TRAILING_ZERO_DECIMAL_RE, '')\n}\n\nexport interface UseZoomPanOptions {\n  minScale: () => number\n  maxScale: () => number\n  zoomRate: () => number\n  draggable: () => boolean\n  /** Ссылка на `<img>` — для измерения layout-размера и подписки ResizeObserver. */\n  imageEl: Ref<HTMLImageElement | null>\n  /** Колбэк на поворот (эмит `rotate`). */\n  onRotate: (deg: number) => void\n}\n\n/**\n * useZoomPan — состояние и логика масштаба/поворота/панорамирования картинки,\n * а также метрики (натуральный/вписанный/фактический размер, реальный масштаб).\n * Вынесено из монолитного `GrImageViewer.vue`.\n */\nexport function useZoomPan(options: UseZoomPanOptions) {\n  const scale = ref(1)\n  const rotation = ref(0)\n  const offsetX = ref(0)\n  const offsetY = ref(0)\n\n  const isDragging = ref(false)\n  let dragStartX = 0\n  let dragStartY = 0\n  let dragOffsetStartX = 0\n  let dragOffsetStartY = 0\n\n  // Натуральный размер (из `<img>`) и layout-размер вписанного (`object-contain`) изображения.\n  const naturalWidth = ref(0)\n  const naturalHeight = ref(0)\n  const fittedWidth = ref(0)\n  const fittedHeight = ref(0)\n\n  let resizeObserver: ResizeObserver | null = null\n\n  const imageStyle = computed(() => ({\n    transform: `translate3d(${offsetX.value}px, ${offsetY.value}px, 0) scale(${scale.value}) rotate(${rotation.value}deg)`,\n  }))\n\n  const zoomValueText = computed(() => formatPercent(scale.value * 100))\n\n  // Фактический размер изображения на экране вдоль его осей (footprint), c учётом scale.\n  const renderedWidth = computed(() => Math.round(fittedWidth.value * scale.value))\n  const renderedHeight = computed(() => Math.round(fittedHeight.value * scale.value))\n\n  // Реальный масштаб относительно натурального размера (доля). Не зависит от rotation.\n  const realScale = computed(() => {\n    if (!naturalWidth.value)\n      return 0\n    return (fittedWidth.value * scale.value) / naturalWidth.value\n  })\n  const realScalePercent = computed(() => formatPercent(realScale.value * 100))\n\n  function setScale(value: number): void {\n    const clamped = Math.min(options.maxScale(), Math.max(options.minScale(), value))\n    scale.value = Number(clamped.toFixed(4))\n  }\n\n  function zoomIn(): void {\n    setScale(scale.value * options.zoomRate())\n  }\n\n  function zoomOut(): void {\n    setScale(scale.value / options.zoomRate())\n  }\n\n  function rotateLeft(): void {\n    rotation.value -= 90\n    options.onRotate(rotation.value)\n  }\n\n  function rotateRight(): void {\n    rotation.value += 90\n    options.onRotate(rotation.value)\n  }\n\n  function resetTransform(): void {\n    scale.value = 1\n    rotation.value = 0\n    offsetX.value = 0\n    offsetY.value = 0\n    isDragging.value = false\n  }\n\n  function resetImageMetrics(): void {\n    naturalWidth.value = 0\n    naturalHeight.value = 0\n    fittedWidth.value = 0\n    fittedHeight.value = 0\n  }\n\n  function measureFitted(): void {\n    const el = options.imageEl.value\n    if (!el)\n      return\n    // offsetWidth/Height — layout-размер вписанного изображения, без CSS transform.\n    fittedWidth.value = el.offsetWidth\n    fittedHeight.value = el.offsetHeight\n  }\n\n  function onImageLoad(event: Event): void {\n    const el = event.target as HTMLImageElement\n    naturalWidth.value = el.naturalWidth\n    naturalHeight.value = el.naturalHeight\n    measureFitted()\n  }\n\n  function startObservingImage(): void {\n    const el = options.imageEl.value\n    if (!el || typeof ResizeObserver === 'undefined')\n      return\n\n    if (!resizeObserver)\n      resizeObserver = new ResizeObserver(() => measureFitted())\n\n    resizeObserver.observe(el)\n\n    // Если картинка уже в кэше и `load` не сработал — считаем метрики сразу.\n    if (el.complete && el.naturalWidth) {\n      naturalWidth.value = el.naturalWidth\n      naturalHeight.value = el.naturalHeight\n    }\n\n    measureFitted()\n  }\n\n  function stopObservingImage(): void {\n    resizeObserver?.disconnect()\n  }\n\n  function onPointerDown(event: PointerEvent): void {\n    // Тянем только основной кнопкой и только если drag включён.\n    if (!options.draggable() || event.button !== 0)\n      return\n\n    event.preventDefault()\n    isDragging.value = true\n    dragStartX = event.clientX\n    dragStartY = event.clientY\n    dragOffsetStartX = offsetX.value\n    dragOffsetStartY = offsetY.value\n\n    // Захватываем указатель, чтобы движение/отпускание ловились за пределами картинки.\n    ;(event.currentTarget as Element).setPointerCapture?.(event.pointerId)\n  }\n\n  function onPointerMove(event: PointerEvent): void {\n    if (!isDragging.value)\n      return\n    offsetX.value = dragOffsetStartX + (event.clientX - dragStartX)\n    offsetY.value = dragOffsetStartY + (event.clientY - dragStartY)\n  }\n\n  function onPointerUp(event: PointerEvent): void {\n    if (!isDragging.value)\n      return\n    isDragging.value = false\n    ;(event.currentTarget as Element).releasePointerCapture?.(event.pointerId)\n  }\n\n  return {\n    scale,\n    rotation,\n    offsetX,\n    offsetY,\n    isDragging,\n    naturalWidth,\n    naturalHeight,\n    fittedWidth,\n    fittedHeight,\n    imageStyle,\n    zoomValueText,\n    renderedWidth,\n    renderedHeight,\n    realScale,\n    realScalePercent,\n    setScale,\n    zoomIn,\n    zoomOut,\n    rotateLeft,\n    rotateRight,\n    resetTransform,\n    resetImageMetrics,\n    measureFitted,\n    onImageLoad,\n    startObservingImage,\n    stopObservingImage,\n    onPointerDown,\n    onPointerMove,\n    onPointerUp,\n  }\n}\n","import { ref } from 'vue'\n\n// Чувствительность масштабирования колесом/трекпадом: чем больше — тем резче реакция.\nconst WHEEL_ZOOM_SENSITIVITY = 0.0015\n// Сколько ms простоя после последнего wheel-события считаем «зум завершён»\n// (после этого возвращаем плавный CSS-переход).\nconst WHEEL_IDLE_MS = 120\n\nexport interface UseWheelGestureOptions {\n  /** Разрешён ли зум колесом (проп `wheelZoom` + наличие изображений). */\n  enabled: () => boolean\n  /** Применить множитель масштаба (накопленный за кадр). */\n  applyZoomFactor: (factor: number) => void\n}\n\n/**\n * useWheelGesture — масштабирование колесом мыши / жестом трекпада с батчингом\n * по `requestAnimationFrame` (рендер не чаще кадра — без «дёрганья»/наслоения) и\n * временным отключением CSS-перехода на время жеста (`isWheelZooming`).\n */\nexport function useWheelGesture(options: UseWheelGestureOptions) {\n  const isWheelZooming = ref(false)\n\n  let pendingWheelDelta = 0\n  let wheelFrameId: number | null = null\n  let wheelIdleTimer: ReturnType<typeof setTimeout> | null = null\n\n  function cancelWheelFrame(): void {\n    if (wheelFrameId !== null) {\n      cancelAnimationFrame(wheelFrameId)\n      wheelFrameId = null\n    }\n  }\n\n  function endWheelZoom(): void {\n    if (wheelIdleTimer !== null) {\n      clearTimeout(wheelIdleTimer)\n      wheelIdleTimer = null\n    }\n\n    isWheelZooming.value = false\n    pendingWheelDelta = 0\n    cancelWheelFrame()\n  }\n\n  // Применяем накопленный за кадр deltaY одним обновлением scale.\n  function flushWheelZoom(): void {\n    wheelFrameId = null\n\n    const delta = pendingWheelDelta\n    pendingWheelDelta = 0\n\n    if (!delta)\n      return\n\n    // Экспоненциальный шаг — плавно и одинаково для колеса и трекпада.\n    // delta < 0 (scroll up) — приближение, delta > 0 — отдаление.\n    const factor = Math.exp(-delta * WHEEL_ZOOM_SENSITIVITY)\n    options.applyZoomFactor(factor)\n  }\n\n  function onWheel(event: WheelEvent): void {\n    if (!options.enabled())\n      return\n\n    // Не даём странице/оверлею проскроллиться — колесо отдаём под зум.\n    event.preventDefault()\n\n    // Во время непрерывного зума отключаем CSS-переход: плавность даёт само\n    // покадровое обновление, а transition на микрошагах вызывает лаг/наслоение.\n    isWheelZooming.value = true\n\n    pendingWheelDelta += event.deltaY\n\n    if (wheelFrameId === null)\n      wheelFrameId = requestAnimationFrame(flushWheelZoom)\n\n    if (wheelIdleTimer !== null)\n      clearTimeout(wheelIdleTimer)\n\n    // По завершении жеста возвращаем плавный переход для дискретных зумов.\n    wheelIdleTimer = setTimeout(() => {\n      wheelIdleTimer = null\n      isWheelZooming.value = false\n    }, WHEEL_IDLE_MS)\n  }\n\n  return { isWheelZooming, onWheel, endWheelZoom }\n}\n","export interface ViewerKeyboardActions {\n  close: () => void\n  prev: () => void\n  next: () => void\n  zoomIn: () => void\n  zoomOut: () => void\n  reset: () => void\n}\n\nexport interface UseViewerKeyboardOptions {\n  /** Закрывать ли по Escape (проп `closeOnPressEscape`). */\n  closeOnEscape: () => boolean\n  actions: ViewerKeyboardActions\n}\n\n/**\n * useViewerKeyboard — клавиатурное управление просмотрщиком:\n * Esc — закрыть, стрелки — переключение, `+`/`-`/`0` — зум/сброс.\n */\nexport function useViewerKeyboard(options: UseViewerKeyboardOptions) {\n  const { actions } = options\n\n  function onKeydown(event: KeyboardEvent): void {\n    switch (event.key) {\n      case 'Escape':\n        if (!options.closeOnEscape())\n          return\n        event.preventDefault()\n        actions.close()\n        return\n\n      case 'ArrowLeft':\n        event.preventDefault()\n        actions.prev()\n        return\n\n      case 'ArrowRight':\n        event.preventDefault()\n        actions.next()\n        return\n\n      case '+':\n      case '=':\n      case 'Add':\n        event.preventDefault()\n        actions.zoomIn()\n        return\n\n      case '-':\n      case '_':\n      case 'Subtract':\n        event.preventDefault()\n        actions.zoomOut()\n        return\n\n      case '0':\n        event.preventDefault()\n        actions.reset()\n        break\n\n      default:\n    }\n  }\n\n  return { onKeydown }\n}\n","<script setup lang=\"ts\">\nimport { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'\nimport { Dialog, DialogPanel, TransitionChild, TransitionRoot } from '@headlessui/vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useScrollLock } from '../../composables/internal/useScrollLock'\nimport { useZoomPan } from './composables/useZoomPan'\nimport { useWheelGesture } from './composables/useWheelGesture'\nimport { useViewerKeyboard } from './composables/useViewerKeyboard'\n\n/**\n * Usage:\n *\n * <GrImageViewer\n *   v-model=\"open\"\n *   :url-list=\"images\"\n *   :initial-index=\"0\"\n *   show-progress\n *   hide-on-click-modal\n * />\n *\n * Логика вынесена в composables: `useZoomPan` (масштаб/поворот/пан + метрики),\n * `useWheelGesture` (зум колесом/трекпадом с rAF-батчингом), `useViewerKeyboard`\n * (клавиатура). Сам SFC отвечает за оверлей, индекс изображений и композицию.\n */\nconst props = withDefaults(\n  defineProps<{\n    modelValue: boolean\n    urlList: string[]\n    initialIndex?: number\n    zoomRate?: number\n    minScale?: number\n    maxScale?: number\n    hideOnClickModal?: boolean\n    closeOnPressEscape?: boolean\n    showProgress?: boolean\n    showZoomValue?: boolean\n    /** Включает масштабирование колесом мыши / жестом на трекпаде. По умолчанию включено. */\n    wheelZoom?: boolean\n    /** Включает перетаскивание (pan) картинки мышью. При наведении курсор «рука». По умолчанию выключено. */\n    draggable?: boolean\n    zIndex?: number\n    /** i18n: aria-label кнопки закрытия. */\n    closeLabel?: string\n    /** i18n: aria-label кнопки «предыдущее изображение». */\n    prevLabel?: string\n    /** i18n: aria-label кнопки «следующее изображение». */\n    nextLabel?: string\n    /** i18n: aria-label кнопки «увеличить». */\n    zoomInLabel?: string\n    /** i18n: aria-label кнопки «уменьшить». */\n    zoomOutLabel?: string\n    /** i18n: aria-label кнопки «сбросить масштаб». */\n    resetZoomLabel?: string\n    /** i18n: aria-label кнопки «повернуть влево». */\n    rotateLeftLabel?: string\n    /** i18n: aria-label кнопки «повернуть вправо». */\n    rotateRightLabel?: string\n    /** i18n: текст в пустом состоянии (нет изображений). */\n    emptyText?: string\n  }>(),\n  {\n    initialIndex: 0,\n    zoomRate: 1.2,\n    minScale: 0.5,\n    maxScale: 5,\n    hideOnClickModal: false,\n    closeOnPressEscape: true,\n    showProgress: false,\n    showZoomValue: true,\n    wheelZoom: true,\n    draggable: false,\n    zIndex: undefined,\n    closeLabel: undefined,\n    prevLabel: undefined,\n    nextLabel: undefined,\n    zoomInLabel: undefined,\n    zoomOutLabel: undefined,\n    resetZoomLabel: undefined,\n    rotateLeftLabel: undefined,\n    rotateRightLabel: undefined,\n    emptyText: undefined,\n  },\n)\n\nconst { t } = useGranularityTranslations()\nconst resolvedCloseLabel = computed(() => props.closeLabel ?? t('gr.imageViewer.close', 'Close image viewer'))\nconst resolvedPrevLabel = computed(() => props.prevLabel ?? t('gr.imageViewer.prev', 'Previous image'))\nconst resolvedNextLabel = computed(() => props.nextLabel ?? t('gr.imageViewer.next', 'Next image'))\nconst resolvedZoomInLabel = computed(() => props.zoomInLabel ?? t('gr.imageViewer.zoomIn', 'Zoom in'))\nconst resolvedZoomOutLabel = computed(() => props.zoomOutLabel ?? t('gr.imageViewer.zoomOut', 'Zoom out'))\nconst resolvedResetZoomLabel = computed(() => props.resetZoomLabel ?? t('gr.imageViewer.resetZoom', 'Reset zoom'))\nconst resolvedRotateLeftLabel = computed(() => props.rotateLeftLabel ?? t('gr.imageViewer.rotateLeft', 'Rotate left'))\nconst resolvedRotateRightLabel = computed(() => props.rotateRightLabel ?? t('gr.imageViewer.rotateRight', 'Rotate right'))\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.imageViewer.empty', 'No image'))\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: boolean): void\n  (e: 'close'): void\n  (e: 'switch', newIndex: number): void\n  (e: 'rotate', deg: number): void\n}>()\n\ntype GrImageViewerToolbarActions = {\n  close: () => void\n  prev: () => void\n  next: () => void\n  zoomIn: () => void\n  zoomOut: () => void\n  reset: () => void\n  rotateLeft: () => void\n  rotateRight: () => void\n}\n\ntype GrImageViewerSlotProps = {\n  index: number\n  displayIndex: number\n  total: number\n  scale: number\n  rotation: number\n  /** Натуральный (исходный) размер картинки, px. 0 пока изображение не загружено. */\n  naturalWidth: number\n  naturalHeight: number\n  /** Фактический размер изображения на экране c учётом scale, px (footprint вдоль осей картинки). */\n  renderedWidth: number\n  renderedHeight: number\n  /** Реальный масштаб относительно натурального размера (доля): renderedWidth / naturalWidth. */\n  realScale: number\n  /** Реальный масштаб в процентах, отформатированный (например `67`). */\n  realScalePercent: string\n  actions: GrImageViewerToolbarActions\n}\n\nconst DEFAULT_Z_INDEX = 2000\n\nconst open = computed(() => props.modelValue)\n\n// SSR-guard для teleport + общий reference-counted scroll-lock (как в GrModal/GrDrawer).\nconst isClient = typeof window !== 'undefined'\nconst { lock: lockBodyScroll, unlock: unlockBodyScroll } = useScrollLock()\n\nconst total = computed(() => props.urlList.length)\nconst hasImages = computed(() => total.value > 0)\n\nconst currentIndex = ref(0)\nconst imageEl = ref<HTMLImageElement | null>(null)\n\n// Масштаб / поворот / панорамирование + метрики изображения.\nconst {\n  scale,\n  rotation,\n  isDragging,\n  naturalWidth,\n  naturalHeight,\n  renderedWidth,\n  renderedHeight,\n  realScale,\n  realScalePercent,\n  imageStyle,\n  zoomValueText,\n  setScale,\n  zoomIn,\n  zoomOut,\n  rotateLeft,\n  rotateRight,\n  resetTransform,\n  resetImageMetrics,\n  onImageLoad,\n  startObservingImage,\n  stopObservingImage,\n  onPointerDown,\n  onPointerMove,\n  onPointerUp,\n} = useZoomPan({\n  minScale: () => props.minScale,\n  maxScale: () => props.maxScale,\n  zoomRate: () => props.zoomRate,\n  draggable: () => props.draggable,\n  imageEl,\n  onRotate: deg => emit('rotate', deg),\n})\n\n// Зум колесом мыши / жестом трекпада.\nconst { isWheelZooming, onWheel, endWheelZoom } = useWheelGesture({\n  enabled: () => props.wheelZoom && hasImages.value,\n  applyZoomFactor: factor => setScale(scale.value * factor),\n})\n\nconst currentUrl = computed(() => (hasImages.value ? props.urlList[currentIndex.value] : undefined))\nconst displayIndex = computed(() => (hasImages.value ? currentIndex.value + 1 : 0))\n\nconst viewerStyle = computed(() => ({\n  zIndex: String(Number.isFinite(props.zIndex) ? props.zIndex : DEFAULT_Z_INDEX),\n}))\n\n// Плавный CSS-переход только для дискретных зумов; при wheel-зуме/перетаскивании отключаем.\nconst imageTransitionClass = computed(() =>\n  isWheelZooming.value || isDragging.value ? '' : 'transition-transform duration-150 ease-out',\n)\n\n// Курсор «рука» (grab/grabbing), только если включён drag.\nconst imageCursorClass = computed(() => {\n  if (!props.draggable)\n    return ''\n  return isDragging.value ? 'cursor-grabbing' : 'cursor-grab'\n})\n\nfunction normalizeIndex(value: number): number {\n  if (!hasImages.value)\n    return 0\n  const normalized = Number.isFinite(value) ? Math.trunc(value) : 0\n  return ((normalized % total.value) + total.value) % total.value\n}\n\nfunction setIndex(nextIndex: number, options?: { emitSwitch?: boolean }): void {\n  const normalizedIndex = normalizeIndex(nextIndex)\n  if (normalizedIndex === currentIndex.value)\n    return\n\n  currentIndex.value = normalizedIndex\n  resetTransform()\n  resetImageMetrics()\n  endWheelZoom()\n\n  if (options?.emitSwitch !== false)\n    emit('switch', normalizedIndex)\n}\n\nfunction syncIndexFromInitial(): void {\n  if (!hasImages.value) {\n    currentIndex.value = 0\n    return\n  }\n  currentIndex.value = normalizeIndex(props.initialIndex)\n  resetTransform()\n  resetImageMetrics()\n  endWheelZoom()\n}\n\nfunction preloadAt(index: number): void {\n  const url = props.urlList[index]\n  if (!url)\n    return\n  const image = new Image()\n  image.decoding = 'async'\n  image.src = url\n}\n\nfunction closeViewer(): void {\n  emit('update:modelValue', false)\n  emit('close')\n}\n\nfunction prev(): void {\n  setIndex(currentIndex.value - 1)\n}\n\nfunction next(): void {\n  setIndex(currentIndex.value + 1)\n}\n\nconst toolbarActions: GrImageViewerToolbarActions = {\n  close: closeViewer,\n  prev,\n  next,\n  zoomIn,\n  zoomOut,\n  reset: resetTransform,\n  rotateLeft,\n  rotateRight,\n}\n\nconst toolbarSlotProps = computed<GrImageViewerSlotProps>(() => ({\n  index: currentIndex.value,\n  displayIndex: displayIndex.value,\n  total: total.value,\n  scale: scale.value,\n  rotation: rotation.value,\n  naturalWidth: naturalWidth.value,\n  naturalHeight: naturalHeight.value,\n  renderedWidth: renderedWidth.value,\n  renderedHeight: renderedHeight.value,\n  realScale: realScale.value,\n  realScalePercent: realScalePercent.value,\n  actions: toolbarActions,\n}))\n\nfunction onBackdropClick(): void {\n  if (!props.hideOnClickModal)\n    return\n  closeViewer()\n}\n\nconst { onKeydown } = useViewerKeyboard({\n  closeOnEscape: () => props.closeOnPressEscape,\n  actions: { close: closeViewer, prev, next, zoomIn, zoomOut, reset: resetTransform },\n})\n\nwatch(\n  () => props.modelValue,\n  async (isOpen) => {\n    if (!isOpen) {\n      unlockBodyScroll()\n      stopObservingImage()\n      endWheelZoom()\n      isDragging.value = false\n      return\n    }\n\n    lockBodyScroll()\n    syncIndexFromInitial()\n    await nextTick()\n    startObservingImage()\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => props.initialIndex,\n  () => {\n    if (!props.modelValue)\n      return\n    syncIndexFromInitial()\n  },\n)\n\nwatch(\n  () => props.urlList,\n  () => {\n    if (!props.modelValue)\n      return\n    syncIndexFromInitial()\n  },\n  { deep: true },\n)\n\nwatch(\n  currentIndex,\n  (index) => {\n    if (!hasImages.value || total.value < 2)\n      return\n    preloadAt(normalizeIndex(index - 1))\n    preloadAt(normalizeIndex(index + 1))\n  },\n  { immediate: true },\n)\n\nonBeforeUnmount(() => {\n  unlockBodyScroll()\n  stopObservingImage()\n  endWheelZoom()\n})\n</script>\n\n<template>\n  <teleport to=\"body\" :disabled=\"!isClient\">\n    <TransitionRoot :show=\"open\" as=\"template\">\n      <Dialog\n        as=\"div\"\n        class=\"fixed inset-0\"\n        :style=\"viewerStyle\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        :static=\"true\"\n        @keydown=\"onKeydown\"\n      >\n        <div class=\"fixed inset-0 overflow-hidden\">\n          <TransitionChild\n            as=\"template\"\n            enter=\"duration-150 ease-out\"\n            enter-from=\"opacity-0\"\n            enter-to=\"opacity-100\"\n            leave=\"duration-120 ease-in\"\n            leave-from=\"opacity-100\"\n            leave-to=\"opacity-0\"\n          >\n            <div\n              data-gr-image-viewer-overlay\n              class=\"absolute inset-0 bg-black/60 backdrop-blur-sm\"\n              aria-hidden=\"true\"\n              @click=\"onBackdropClick\"\n            />\n          </TransitionChild>\n\n          <TransitionChild\n            as=\"template\"\n            enter=\"duration-180 ease-out\"\n            enter-from=\"opacity-0 scale-98\"\n            enter-to=\"opacity-100 scale-100\"\n            leave=\"duration-130 ease-in\"\n            leave-from=\"opacity-100 scale-100\"\n            leave-to=\"opacity-0 scale-98\"\n          >\n            <DialogPanel\n              data-gr-image-viewer-panel\n              class=\"relative z-10 h-full w-full outline-none\"\n              tabindex=\"-1\"\n            >\n              <div class=\"pointer-events-none absolute inset-x-0 top-0 z-30 px-3 py-3 sm:px-6\">\n                <div class=\"pointer-events-auto flex items-center justify-between gap-3\">\n                  <div class=\"flex items-center gap-2\">\n                    <div\n                      v-if=\"showProgress\"\n                      data-gr-image-viewer-progress\n                      class=\"rounded-full bg-black/35 px-3 py-1 text-xs font-600 text-white/95 sm:text-sm\"\n                    >\n                      {{ displayIndex }} / {{ total }}\n                    </div>\n\n                    <div\n                      v-if=\"showZoomValue\"\n                      data-gr-image-viewer-zoom-value\n                      class=\"rounded-full bg-black/35 px-3 py-1 text-xs font-700 text-white/95 sm:text-sm\"\n                    >\n                      {{ zoomValueText }}%\n                    </div>\n                  </div>\n\n                  <button\n                    type=\"button\"\n                    data-gr-image-viewer-close\n                    :aria-label=\"resolvedCloseLabel\"\n                    class=\"h-11 w-11 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                    @click=\"closeViewer\"\n                  >\n                    <span aria-hidden=\"true\" class=\"text-lg leading-none\">✕</span>\n                  </button>\n                </div>\n              </div>\n\n              <div\n                class=\"relative z-10 h-full w-full flex items-center justify-center px-16 py-16 sm:px-24 sm:py-20\"\n                @wheel=\"onWheel\"\n              >\n                <button\n                  v-if=\"total > 1\"\n                  type=\"button\"\n                  data-gr-image-viewer-prev\n                  :aria-label=\"resolvedPrevLabel\"\n                  class=\"absolute left-3 top-1/2 z-20 h-12 w-12 -translate-y-1/2 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80 sm:left-6\"\n                  @click=\"prev\"\n                >\n                  <span aria-hidden=\"true\" class=\"text-xl leading-none\">‹</span>\n                </button>\n\n                <button\n                  v-if=\"total > 1\"\n                  type=\"button\"\n                  data-gr-image-viewer-next\n                  :aria-label=\"resolvedNextLabel\"\n                  class=\"absolute right-3 top-1/2 z-20 h-12 w-12 -translate-y-1/2 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80 sm:right-6\"\n                  @click=\"next\"\n                >\n                  <span aria-hidden=\"true\" class=\"text-xl leading-none\">›</span>\n                </button>\n\n                <div class=\"h-full w-full flex items-center justify-center\">\n                  <img\n                    v-if=\"currentUrl\"\n                    ref=\"imageEl\"\n                    data-gr-image-viewer-image\n                    :src=\"currentUrl\"\n                    alt=\"\"\n                    draggable=\"false\"\n                    class=\"max-h-full max-w-full select-none object-contain will-change-transform\"\n                    :class=\"[imageTransitionClass, imageCursorClass]\"\n                    :style=\"imageStyle\"\n                    @load=\"onImageLoad\"\n                    @pointerdown=\"onPointerDown\"\n                    @pointermove=\"onPointerMove\"\n                    @pointerup=\"onPointerUp\"\n                    @pointercancel=\"onPointerUp\"\n                  >\n\n                  <div\n                    v-else\n                    class=\"rounded-[var(--gr-radius-xl)] border border-white/20 bg-black/25 px-4 py-3 text-sm text-white/80\"\n                  >\n                    {{ resolvedEmptyText }}\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"pointer-events-none absolute inset-x-0 bottom-0 z-30 px-3 pb-3 sm:px-6 sm:pb-6\">\n                <div class=\"pointer-events-auto mx-auto w-full max-w-max\">\n                  <slot\n                    name=\"toolbar\"\n                    v-bind=\"toolbarSlotProps\"\n                  >\n                    <div class=\"rounded-full border border-white/20 bg-black/35 p-1 backdrop-blur-sm flex items-center gap-1\">\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-out\n                        :aria-label=\"resolvedZoomOutLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"zoomOut\"\n                      >\n                        −\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-reset\n                        :aria-label=\"resolvedResetZoomLabel\"\n                        class=\"h-11 min-w-11 px-3 flex items-center justify-center rounded-full text-xs font-700 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"resetTransform\"\n                      >\n                        100%\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-in\n                        :aria-label=\"resolvedZoomInLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"zoomIn\"\n                      >\n                        +\n                      </button>\n\n                      <template v-if=\"$slots['toolbar-actions']\">\n                        <div class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n\n                        <slot\n                          name=\"toolbar-actions\"\n                          v-bind=\"toolbarSlotProps\"\n                        />\n\n                        <div class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n                      </template>\n\n                      <div v-else class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-rotate-left\n                        :aria-label=\"resolvedRotateLeftLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"rotateLeft\"\n                      >\n                        ↺\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-rotate-right\n                        :aria-label=\"resolvedRotateRightLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"rotateRight\"\n                      >\n                        ↻\n                      </button>\n                    </div>\n                  </slot>\n                </div>\n              </div>\n            </DialogPanel>\n          </TransitionChild>\n        </div>\n      </Dialog>\n    </TransitionRoot>\n  </teleport>\n</template>","<script setup lang=\"ts\">\nimport { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'\nimport { Dialog, DialogPanel, TransitionChild, TransitionRoot } from '@headlessui/vue'\n\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\nimport { useScrollLock } from '../../composables/internal/useScrollLock'\nimport { useZoomPan } from './composables/useZoomPan'\nimport { useWheelGesture } from './composables/useWheelGesture'\nimport { useViewerKeyboard } from './composables/useViewerKeyboard'\n\n/**\n * Usage:\n *\n * <GrImageViewer\n *   v-model=\"open\"\n *   :url-list=\"images\"\n *   :initial-index=\"0\"\n *   show-progress\n *   hide-on-click-modal\n * />\n *\n * Логика вынесена в composables: `useZoomPan` (масштаб/поворот/пан + метрики),\n * `useWheelGesture` (зум колесом/трекпадом с rAF-батчингом), `useViewerKeyboard`\n * (клавиатура). Сам SFC отвечает за оверлей, индекс изображений и композицию.\n */\nconst props = withDefaults(\n  defineProps<{\n    modelValue: boolean\n    urlList: string[]\n    initialIndex?: number\n    zoomRate?: number\n    minScale?: number\n    maxScale?: number\n    hideOnClickModal?: boolean\n    closeOnPressEscape?: boolean\n    showProgress?: boolean\n    showZoomValue?: boolean\n    /** Включает масштабирование колесом мыши / жестом на трекпаде. По умолчанию включено. */\n    wheelZoom?: boolean\n    /** Включает перетаскивание (pan) картинки мышью. При наведении курсор «рука». По умолчанию выключено. */\n    draggable?: boolean\n    zIndex?: number\n    /** i18n: aria-label кнопки закрытия. */\n    closeLabel?: string\n    /** i18n: aria-label кнопки «предыдущее изображение». */\n    prevLabel?: string\n    /** i18n: aria-label кнопки «следующее изображение». */\n    nextLabel?: string\n    /** i18n: aria-label кнопки «увеличить». */\n    zoomInLabel?: string\n    /** i18n: aria-label кнопки «уменьшить». */\n    zoomOutLabel?: string\n    /** i18n: aria-label кнопки «сбросить масштаб». */\n    resetZoomLabel?: string\n    /** i18n: aria-label кнопки «повернуть влево». */\n    rotateLeftLabel?: string\n    /** i18n: aria-label кнопки «повернуть вправо». */\n    rotateRightLabel?: string\n    /** i18n: текст в пустом состоянии (нет изображений). */\n    emptyText?: string\n  }>(),\n  {\n    initialIndex: 0,\n    zoomRate: 1.2,\n    minScale: 0.5,\n    maxScale: 5,\n    hideOnClickModal: false,\n    closeOnPressEscape: true,\n    showProgress: false,\n    showZoomValue: true,\n    wheelZoom: true,\n    draggable: false,\n    zIndex: undefined,\n    closeLabel: undefined,\n    prevLabel: undefined,\n    nextLabel: undefined,\n    zoomInLabel: undefined,\n    zoomOutLabel: undefined,\n    resetZoomLabel: undefined,\n    rotateLeftLabel: undefined,\n    rotateRightLabel: undefined,\n    emptyText: undefined,\n  },\n)\n\nconst { t } = useGranularityTranslations()\nconst resolvedCloseLabel = computed(() => props.closeLabel ?? t('gr.imageViewer.close', 'Close image viewer'))\nconst resolvedPrevLabel = computed(() => props.prevLabel ?? t('gr.imageViewer.prev', 'Previous image'))\nconst resolvedNextLabel = computed(() => props.nextLabel ?? t('gr.imageViewer.next', 'Next image'))\nconst resolvedZoomInLabel = computed(() => props.zoomInLabel ?? t('gr.imageViewer.zoomIn', 'Zoom in'))\nconst resolvedZoomOutLabel = computed(() => props.zoomOutLabel ?? t('gr.imageViewer.zoomOut', 'Zoom out'))\nconst resolvedResetZoomLabel = computed(() => props.resetZoomLabel ?? t('gr.imageViewer.resetZoom', 'Reset zoom'))\nconst resolvedRotateLeftLabel = computed(() => props.rotateLeftLabel ?? t('gr.imageViewer.rotateLeft', 'Rotate left'))\nconst resolvedRotateRightLabel = computed(() => props.rotateRightLabel ?? t('gr.imageViewer.rotateRight', 'Rotate right'))\nconst resolvedEmptyText = computed(() => props.emptyText ?? t('gr.imageViewer.empty', 'No image'))\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: boolean): void\n  (e: 'close'): void\n  (e: 'switch', newIndex: number): void\n  (e: 'rotate', deg: number): void\n}>()\n\ntype GrImageViewerToolbarActions = {\n  close: () => void\n  prev: () => void\n  next: () => void\n  zoomIn: () => void\n  zoomOut: () => void\n  reset: () => void\n  rotateLeft: () => void\n  rotateRight: () => void\n}\n\ntype GrImageViewerSlotProps = {\n  index: number\n  displayIndex: number\n  total: number\n  scale: number\n  rotation: number\n  /** Натуральный (исходный) размер картинки, px. 0 пока изображение не загружено. */\n  naturalWidth: number\n  naturalHeight: number\n  /** Фактический размер изображения на экране c учётом scale, px (footprint вдоль осей картинки). */\n  renderedWidth: number\n  renderedHeight: number\n  /** Реальный масштаб относительно натурального размера (доля): renderedWidth / naturalWidth. */\n  realScale: number\n  /** Реальный масштаб в процентах, отформатированный (например `67`). */\n  realScalePercent: string\n  actions: GrImageViewerToolbarActions\n}\n\nconst DEFAULT_Z_INDEX = 2000\n\nconst open = computed(() => props.modelValue)\n\n// SSR-guard для teleport + общий reference-counted scroll-lock (как в GrModal/GrDrawer).\nconst isClient = typeof window !== 'undefined'\nconst { lock: lockBodyScroll, unlock: unlockBodyScroll } = useScrollLock()\n\nconst total = computed(() => props.urlList.length)\nconst hasImages = computed(() => total.value > 0)\n\nconst currentIndex = ref(0)\nconst imageEl = ref<HTMLImageElement | null>(null)\n\n// Масштаб / поворот / панорамирование + метрики изображения.\nconst {\n  scale,\n  rotation,\n  isDragging,\n  naturalWidth,\n  naturalHeight,\n  renderedWidth,\n  renderedHeight,\n  realScale,\n  realScalePercent,\n  imageStyle,\n  zoomValueText,\n  setScale,\n  zoomIn,\n  zoomOut,\n  rotateLeft,\n  rotateRight,\n  resetTransform,\n  resetImageMetrics,\n  onImageLoad,\n  startObservingImage,\n  stopObservingImage,\n  onPointerDown,\n  onPointerMove,\n  onPointerUp,\n} = useZoomPan({\n  minScale: () => props.minScale,\n  maxScale: () => props.maxScale,\n  zoomRate: () => props.zoomRate,\n  draggable: () => props.draggable,\n  imageEl,\n  onRotate: deg => emit('rotate', deg),\n})\n\n// Зум колесом мыши / жестом трекпада.\nconst { isWheelZooming, onWheel, endWheelZoom } = useWheelGesture({\n  enabled: () => props.wheelZoom && hasImages.value,\n  applyZoomFactor: factor => setScale(scale.value * factor),\n})\n\nconst currentUrl = computed(() => (hasImages.value ? props.urlList[currentIndex.value] : undefined))\nconst displayIndex = computed(() => (hasImages.value ? currentIndex.value + 1 : 0))\n\nconst viewerStyle = computed(() => ({\n  zIndex: String(Number.isFinite(props.zIndex) ? props.zIndex : DEFAULT_Z_INDEX),\n}))\n\n// Плавный CSS-переход только для дискретных зумов; при wheel-зуме/перетаскивании отключаем.\nconst imageTransitionClass = computed(() =>\n  isWheelZooming.value || isDragging.value ? '' : 'transition-transform duration-150 ease-out',\n)\n\n// Курсор «рука» (grab/grabbing), только если включён drag.\nconst imageCursorClass = computed(() => {\n  if (!props.draggable)\n    return ''\n  return isDragging.value ? 'cursor-grabbing' : 'cursor-grab'\n})\n\nfunction normalizeIndex(value: number): number {\n  if (!hasImages.value)\n    return 0\n  const normalized = Number.isFinite(value) ? Math.trunc(value) : 0\n  return ((normalized % total.value) + total.value) % total.value\n}\n\nfunction setIndex(nextIndex: number, options?: { emitSwitch?: boolean }): void {\n  const normalizedIndex = normalizeIndex(nextIndex)\n  if (normalizedIndex === currentIndex.value)\n    return\n\n  currentIndex.value = normalizedIndex\n  resetTransform()\n  resetImageMetrics()\n  endWheelZoom()\n\n  if (options?.emitSwitch !== false)\n    emit('switch', normalizedIndex)\n}\n\nfunction syncIndexFromInitial(): void {\n  if (!hasImages.value) {\n    currentIndex.value = 0\n    return\n  }\n  currentIndex.value = normalizeIndex(props.initialIndex)\n  resetTransform()\n  resetImageMetrics()\n  endWheelZoom()\n}\n\nfunction preloadAt(index: number): void {\n  const url = props.urlList[index]\n  if (!url)\n    return\n  const image = new Image()\n  image.decoding = 'async'\n  image.src = url\n}\n\nfunction closeViewer(): void {\n  emit('update:modelValue', false)\n  emit('close')\n}\n\nfunction prev(): void {\n  setIndex(currentIndex.value - 1)\n}\n\nfunction next(): void {\n  setIndex(currentIndex.value + 1)\n}\n\nconst toolbarActions: GrImageViewerToolbarActions = {\n  close: closeViewer,\n  prev,\n  next,\n  zoomIn,\n  zoomOut,\n  reset: resetTransform,\n  rotateLeft,\n  rotateRight,\n}\n\nconst toolbarSlotProps = computed<GrImageViewerSlotProps>(() => ({\n  index: currentIndex.value,\n  displayIndex: displayIndex.value,\n  total: total.value,\n  scale: scale.value,\n  rotation: rotation.value,\n  naturalWidth: naturalWidth.value,\n  naturalHeight: naturalHeight.value,\n  renderedWidth: renderedWidth.value,\n  renderedHeight: renderedHeight.value,\n  realScale: realScale.value,\n  realScalePercent: realScalePercent.value,\n  actions: toolbarActions,\n}))\n\nfunction onBackdropClick(): void {\n  if (!props.hideOnClickModal)\n    return\n  closeViewer()\n}\n\nconst { onKeydown } = useViewerKeyboard({\n  closeOnEscape: () => props.closeOnPressEscape,\n  actions: { close: closeViewer, prev, next, zoomIn, zoomOut, reset: resetTransform },\n})\n\nwatch(\n  () => props.modelValue,\n  async (isOpen) => {\n    if (!isOpen) {\n      unlockBodyScroll()\n      stopObservingImage()\n      endWheelZoom()\n      isDragging.value = false\n      return\n    }\n\n    lockBodyScroll()\n    syncIndexFromInitial()\n    await nextTick()\n    startObservingImage()\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => props.initialIndex,\n  () => {\n    if (!props.modelValue)\n      return\n    syncIndexFromInitial()\n  },\n)\n\nwatch(\n  () => props.urlList,\n  () => {\n    if (!props.modelValue)\n      return\n    syncIndexFromInitial()\n  },\n  { deep: true },\n)\n\nwatch(\n  currentIndex,\n  (index) => {\n    if (!hasImages.value || total.value < 2)\n      return\n    preloadAt(normalizeIndex(index - 1))\n    preloadAt(normalizeIndex(index + 1))\n  },\n  { immediate: true },\n)\n\nonBeforeUnmount(() => {\n  unlockBodyScroll()\n  stopObservingImage()\n  endWheelZoom()\n})\n</script>\n\n<template>\n  <teleport to=\"body\" :disabled=\"!isClient\">\n    <TransitionRoot :show=\"open\" as=\"template\">\n      <Dialog\n        as=\"div\"\n        class=\"fixed inset-0\"\n        :style=\"viewerStyle\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        :static=\"true\"\n        @keydown=\"onKeydown\"\n      >\n        <div class=\"fixed inset-0 overflow-hidden\">\n          <TransitionChild\n            as=\"template\"\n            enter=\"duration-150 ease-out\"\n            enter-from=\"opacity-0\"\n            enter-to=\"opacity-100\"\n            leave=\"duration-120 ease-in\"\n            leave-from=\"opacity-100\"\n            leave-to=\"opacity-0\"\n          >\n            <div\n              data-gr-image-viewer-overlay\n              class=\"absolute inset-0 bg-black/60 backdrop-blur-sm\"\n              aria-hidden=\"true\"\n              @click=\"onBackdropClick\"\n            />\n          </TransitionChild>\n\n          <TransitionChild\n            as=\"template\"\n            enter=\"duration-180 ease-out\"\n            enter-from=\"opacity-0 scale-98\"\n            enter-to=\"opacity-100 scale-100\"\n            leave=\"duration-130 ease-in\"\n            leave-from=\"opacity-100 scale-100\"\n            leave-to=\"opacity-0 scale-98\"\n          >\n            <DialogPanel\n              data-gr-image-viewer-panel\n              class=\"relative z-10 h-full w-full outline-none\"\n              tabindex=\"-1\"\n            >\n              <div class=\"pointer-events-none absolute inset-x-0 top-0 z-30 px-3 py-3 sm:px-6\">\n                <div class=\"pointer-events-auto flex items-center justify-between gap-3\">\n                  <div class=\"flex items-center gap-2\">\n                    <div\n                      v-if=\"showProgress\"\n                      data-gr-image-viewer-progress\n                      class=\"rounded-full bg-black/35 px-3 py-1 text-xs font-600 text-white/95 sm:text-sm\"\n                    >\n                      {{ displayIndex }} / {{ total }}\n                    </div>\n\n                    <div\n                      v-if=\"showZoomValue\"\n                      data-gr-image-viewer-zoom-value\n                      class=\"rounded-full bg-black/35 px-3 py-1 text-xs font-700 text-white/95 sm:text-sm\"\n                    >\n                      {{ zoomValueText }}%\n                    </div>\n                  </div>\n\n                  <button\n                    type=\"button\"\n                    data-gr-image-viewer-close\n                    :aria-label=\"resolvedCloseLabel\"\n                    class=\"h-11 w-11 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                    @click=\"closeViewer\"\n                  >\n                    <span aria-hidden=\"true\" class=\"text-lg leading-none\">✕</span>\n                  </button>\n                </div>\n              </div>\n\n              <div\n                class=\"relative z-10 h-full w-full flex items-center justify-center px-16 py-16 sm:px-24 sm:py-20\"\n                @wheel=\"onWheel\"\n              >\n                <button\n                  v-if=\"total > 1\"\n                  type=\"button\"\n                  data-gr-image-viewer-prev\n                  :aria-label=\"resolvedPrevLabel\"\n                  class=\"absolute left-3 top-1/2 z-20 h-12 w-12 -translate-y-1/2 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80 sm:left-6\"\n                  @click=\"prev\"\n                >\n                  <span aria-hidden=\"true\" class=\"text-xl leading-none\">‹</span>\n                </button>\n\n                <button\n                  v-if=\"total > 1\"\n                  type=\"button\"\n                  data-gr-image-viewer-next\n                  :aria-label=\"resolvedNextLabel\"\n                  class=\"absolute right-3 top-1/2 z-20 h-12 w-12 -translate-y-1/2 flex items-center justify-center rounded-full border border-white/20 bg-black/35 text-white transition-colors hover:bg-black/55 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80 sm:right-6\"\n                  @click=\"next\"\n                >\n                  <span aria-hidden=\"true\" class=\"text-xl leading-none\">›</span>\n                </button>\n\n                <div class=\"h-full w-full flex items-center justify-center\">\n                  <img\n                    v-if=\"currentUrl\"\n                    ref=\"imageEl\"\n                    data-gr-image-viewer-image\n                    :src=\"currentUrl\"\n                    alt=\"\"\n                    draggable=\"false\"\n                    class=\"max-h-full max-w-full select-none object-contain will-change-transform\"\n                    :class=\"[imageTransitionClass, imageCursorClass]\"\n                    :style=\"imageStyle\"\n                    @load=\"onImageLoad\"\n                    @pointerdown=\"onPointerDown\"\n                    @pointermove=\"onPointerMove\"\n                    @pointerup=\"onPointerUp\"\n                    @pointercancel=\"onPointerUp\"\n                  >\n\n                  <div\n                    v-else\n                    class=\"rounded-[var(--gr-radius-xl)] border border-white/20 bg-black/25 px-4 py-3 text-sm text-white/80\"\n                  >\n                    {{ resolvedEmptyText }}\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"pointer-events-none absolute inset-x-0 bottom-0 z-30 px-3 pb-3 sm:px-6 sm:pb-6\">\n                <div class=\"pointer-events-auto mx-auto w-full max-w-max\">\n                  <slot\n                    name=\"toolbar\"\n                    v-bind=\"toolbarSlotProps\"\n                  >\n                    <div class=\"rounded-full border border-white/20 bg-black/35 p-1 backdrop-blur-sm flex items-center gap-1\">\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-out\n                        :aria-label=\"resolvedZoomOutLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"zoomOut\"\n                      >\n                        −\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-reset\n                        :aria-label=\"resolvedResetZoomLabel\"\n                        class=\"h-11 min-w-11 px-3 flex items-center justify-center rounded-full text-xs font-700 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"resetTransform\"\n                      >\n                        100%\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-zoom-in\n                        :aria-label=\"resolvedZoomInLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"zoomIn\"\n                      >\n                        +\n                      </button>\n\n                      <template v-if=\"$slots['toolbar-actions']\">\n                        <div class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n\n                        <slot\n                          name=\"toolbar-actions\"\n                          v-bind=\"toolbarSlotProps\"\n                        />\n\n                        <div class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n                      </template>\n\n                      <div v-else class=\"mx-1 h-6 w-px bg-white/25\" aria-hidden=\"true\" />\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-rotate-left\n                        :aria-label=\"resolvedRotateLeftLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"rotateLeft\"\n                      >\n                        ↺\n                      </button>\n\n                      <button\n                        type=\"button\"\n                        data-gr-image-viewer-rotate-right\n                        :aria-label=\"resolvedRotateRightLabel\"\n                        class=\"h-11 min-w-11 px-2 flex items-center justify-center rounded-full text-sm font-600 text-white transition-colors hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/80\"\n                        @click=\"rotateRight\"\n                      >\n                        ↻\n                      </button>\n                    </div>\n                  </slot>\n                </div>\n              </div>\n            </DialogPanel>\n          </TransitionChild>\n        </div>\n      </Dialog>\n    </TransitionRoot>\n  </teleport>\n</template>"],"mappings":"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"}

package/dist/components/GrImageViewer/index.js

@@ -1,3 +1,3 @@
-import { t as GrImageViewer_default } from "./chunks/GrImageViewer-Dla9IBkd.js";
+import { t as GrImageViewer_default } from "./chunks/GrImageViewer-DDLJkvIU.js";
 import { t as grImageViewerConfig } from "../../chunks/config-HZto2PVy.js";
 export { GrImageViewer_default as GrImageViewer, GrImageViewer_default as default, grImageViewerConfig };