@ozdao/martyrs 0.2.571 → 0.2.574

package/dist/martyrs/src/components/Feed/Feed.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Feed.vue.js","sources":["../../../../../src/components/Feed/Feed.vue"],"sourcesContent":["<template>\n  <div v-if=\"search || date || (sort && !sort.hideButton)\" style=\"transform: scale(1);\" class=\"mn-b-thin pos-relative z-index-2 pos-relative flex-nowrap flex gap-thin\">\n\n    <BlockSearch \n      v-if=\"search\"\n      :placeholder=\"search.placeholder || 'Search...'\"\n      :class=\"search.class || 'bg-light'\"\n      @search=\"updateSearch\"\n      :autofocus=\"search.autofocus\"\n    />\n\n    <FiltersBar\n      v-if=\"filter\"\n      v-model=\"filter.selected\"\n      :filters=\"filterConfig\"\n      :class=\"filter.class || 'mobile-only'\"\n    />\n\n    <Dropdown \n      v-if=\"date\"\n      :label=\"{\n        component: ButtonDate,\n        props: { date: date }\n      }\" \n      :class=\"date.class || 'bg-light'\"\n      class=\"flex-child flex-child-shrink-0 pd-r-small pd-l-small pd-thin bg-light radius-medium\"\n      :align=\"search ? 'right' : 'left'\"\n    >\n\n      <Calendar\n        v-model:date=\"date\"\n        :locale=\"$i18n.locale\"\n        :allowRange=\"true\"\n        class=\"radius-medium w-100 o-hidden bg-light\"\n      />\n    </Dropdown> \n\n    <Dropdown \n      v-if=\"sort && !sort.hideButton\"\n      :label=\"{\n        component: ButtonSort,\n        props: { order: sort.order },\n        class: 'w-1r'\n      }\" \n      :class=\"sort.class || 'bg-light'\"\n      class=\"radius-medium aspect-1x1 h-100\"\n      :align=\"search ? 'right' : 'left'\"\n    >\n\n      <BlockSorting\n        v-model:param=\"sort.param\"\n        v-model:order=\"sort.order\"\n        :options=\"sort.options\"\n        class=\"h-100 pd-small radius-medium t-white bg-black\"\n      />\n    </Dropdown> \n\n    <!-- Actions -->\n    <template\n      v-if=\"actions.length\"\n    >\n      <template v-for=\"action in actions\" :key=\"action.key\">\n        <div \n        :class=\"action.class || 'bg-light'\"\n        class=\"flex-center flex pd-thin bg-light radius-medium aspect-1x1 h-100\"\n      >\n        <component\n          :is=\"action.component\"\n          @click=\"action.handler\"\n          class=\"w-1r h-auto\"\n        >\n        </component>\n\n      </div>\n      </template>\n    </template>\n  </div>\n\n  <TransitionGroup \n    v-if=\"isLoading && !keepSlotVisible\"\n    tag=\"ul\" \n    name=\"scaleTransition\" \n    class=\"pos-relative z-index-1\"\n   :class=\"$attrs.class\"\n  >\n    <Skeleton\n      v-if=\"isLoading && !skeleton?.hide\"\n      v-for=\"i in currentLimit\" \n      :structure=\"skeleton.structure\"\n      :horizontal=\"skeleton.horizontal\"\n      :loading=\"skeleton.apply_to_slot\"\n      :key=\"'skeleton-' + i\"\n      :class=\"replaceClasses('radius-medium bg-light pd-thin flex-child-default o-hidden d-block', skeleton.class)\"\n    />\n    <Loader v-if=\"isLoading && skeleton?.hide\" :centered=\"true\" />\n  </TransitionGroup>\n\n  <TransitionGroup \n    tag=\"ul\" \n    v-else-if=\"itemsList.length < 1\"\n    name=\"feed\"\n  >\n    <EmptyState\n      v-if=\"!isLoading && itemsList.length < 1\"\n      :title=\"states.empty.title\"\n      :description=\"states.empty.description\"\n      :action=\"states.empty.action\"\n      :callback=\"states.empty.callback\"\n      :class=\"replaceClasses('pd-medium bg-light radius-medium', states.empty.class)\"\n    />\n   </TransitionGroup>\n\n  <TransitionGroup \n    v-else-if=\"!keepSlotVisible || !isLoading\"\n    tag=\"ul\" \n    name=\"feed\"\n    :class=\"$attrs.class\"\n  >\n    <slot\n      :items=\"itemsList\"\n    >\n    </slot>\n  </TransitionGroup>\n\n  <!-- Slot visible with overlay loader -->\n  <div v-else class=\"pos-relative\">\n    <TransitionGroup \n      tag=\"ul\" \n      name=\"feed\"\n      :class=\"$attrs.class\"\n    >\n      <slot\n        :items=\"itemsList\"\n      >\n      </slot>\n    </TransitionGroup>\n    \n    <!-- Overlay loader -->\n    <div \n      v-if=\"isLoading && keepSlotVisible\"\n      class=\"pos-absolute pos-t-0 pos-l-0 w-100 h-100 flex-center bg-white-transp-90 z-index-10\"\n    >\n      <Loader :centered=\"true\"  />\n    </div>\n  </div>\n\n  <button\n    v-if=\"showLoadMore && hasMoreItems && itemsList.length > 0 && !isLoadingExtra\"\n    @click=\"loadMoreItems\"\n    class=\"col-w-100 mn-t-thin w-100 t-black bg-main button\"\n  >\n    Load More\n  </button>\n\n  <div v-else key=\"sentinel\" ref=\"sentinel\" class=\"sentinel\"></div> \n\n  <div\n    v-if=\"isLoadingExtra\"\n    class=\"col-w-100 w-100 pos-relative\"\n  >\n    <Loader :centered=\"true\" />\n  </div>\n \n\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, watch } from 'vue';\nimport { useGlobalMixins } from '@martyrs/src/modules/core/views/mixins/mixins.js';\n\nimport SkeletonEvent from '@martyrs/src/modules/icons/skeletons/SkeletonEvent.vue'\n\nimport Loader from '@martyrs/src/components/Loader/Loader.vue';\nimport Skeleton from '@martyrs/src/components/Skeleton/Skeleton.vue';\nimport EmptyState from '@martyrs/src/components/EmptyState/EmptyState.vue';\nimport Dropdown from \"@martyrs/src/components/Dropdown/Dropdown.vue\";\nimport Calendar from '@martyrs/src/components/Calendar/Calendar.vue'\nimport BottomSheet from '@martyrs/src/components/BottomSheet/BottomSheet.vue';\n\nimport BlockSearch from '@martyrs/src/modules/core/views/components/blocks/BlockSearch.vue'\nimport BlockSorting  from '@martyrs/src/modules/core/views/components/blocks/BlockSorting.vue'\n\nimport FiltersBar from '@martyrs/src/modules/core/views/components/sections/Filters.vue'\n\nimport ButtonSort  from '@martyrs/src/modules/core/views/components/elements/ButtonSort.vue'\nimport ButtonDate  from '@martyrs/src/modules/core/views/components/elements/ButtonDate.vue'\n\nimport IconFilter from '@martyrs/src/modules/icons/navigation/IconFilter.vue'\nimport IconEvents from '@martyrs/src/modules/icons/entities/IconEvents.vue'\n\nconst { replaceClasses } = useGlobalMixins();\n\nconst search = defineModel('search')\nconst sort = defineModel('sort')\nconst filter = defineModel('filter')\nconst date = defineModel('date')\nconst items = defineModel('items')\n\n// Внутреннее хранилище для случая, когда v-model:items не передан\nconst internalItems = ref([])\n\n// Элегантное решение через computed\nconst itemsList = computed({\n  get: () => items.value ?? internalItems.value,\n  set: (val) => {\n    if (items.value !== undefined) {\n      items.value = val\n    } else {\n      internalItems.value = val\n    }\n  }\n})\n\nconst filterConfig = computed(() => {\n  if (!filter.value?.options) return []\n  \n  return filter.value.options.map(opt => ({\n    key: opt.value,\n    title: opt.title,\n    type: 'options',\n    options: opt.options || [],\n    defaultValue: null\n  }))\n})\n\n// Пропсы\nconst props = defineProps({\n  showLoadMore: {\n    type: Boolean,\n    default: true\n  },\n  LoadMore: {\n    type: Boolean,\n    default: true\n  },\n  search: {\n    type: [Boolean, Object],\n    default: false\n  },\n  states: {\n    type: Object,\n    default: () => ({\n      empty: {\n        title: 'Nothing found',\n        description: 'Sorry, nothing found',\n      },\n    }),\n  },\n  actions: {\n    type: Array,\n    default: () => []\n  },\n  skeleton: {\n    type: Object,\n    default: () => ({\n      hide: false,\n      horizontal: false,\n      structure: [\n        { block: 'text', size: 'medium' },\n        { block: 'text', size: 'large' },\n        { block: 'button', size: 'small' }\n      ]\n    }),\n   \n  },\n  store: {\n    type: Object,\n    default: () => ({\n      read: Function,\n      state: Object,\n    }),\n  },\n  external: {\n    type: Boolean,\n    default: false\n  },\n  options: {\n    type: Object,\n    default: () => ({\n      category: null,\n      limit: 10, \n      skip: 0 ,\n      owner:  null,\n      creator:  null,\n      customer:  null,\n      user:  null,\n      status: null,\n      period:  null,\n      contain:  null,\n    }),\n  },\n  keepSlotVisible: {\n    type: Boolean,\n    default: false\n  },\n});\n  \nconst hasMoreItems = ref(false);\n\nlet isLoading = ref(true);\nlet isLoadingExtra = ref(false);\nlet sentinel = ref(null)\n\nlet currentSkip = ref(props.options.skip ? props.options.skip : 0);\nlet currentLimit = ref(props.options.limit ? props.options.limit : 10);\n\nlet currentSearch = ref('');\nlet isSearching = ref(false);\n\nlet requestId = 0;\n\nfunction debounce(fn, delay) {\n  let timeoutId = null;\n  return (...args) => {\n    clearTimeout(timeoutId);\n    timeoutId = setTimeout(() => fn(...args), delay);\n  };\n}\n\nconst debouncedSearch = debounce((value) => {\n  isSearching.value = true;\n  currentSearch.value = value;\n  currentSkip.value = 0;\n  currentLimit.value = 10;\n  fetchItems();\n}, 500);\n\nfunction updateSearch(search) {\n  debouncedSearch(search);\n}\n\nconst removeNullValues = (obj) => {\n  return Object.fromEntries(\n    Object.entries(obj).filter(([_, value]) => value != null)\n  );\n};\n\nconst loadMoreItems = async () => {\n  if (!hasMoreItems.value || isLoadingExtra.value) {\n    return;\n  }\n  \n  isLoadingExtra.value = true;\n  \n  const currentRequestId = ++requestId;\n\n  currentSkip.value += currentLimit.value;\n  \n  try {\n    const allParams = {\n      skip: currentSkip.value,\n      limit: currentLimit.value,\n      search: currentSearch.value,\n      dateStart: date.value?.start,\n      dateEnd: date.value?.end,\n      sortParam: sort.value?.param,\n      sortOrder: sort.value?.order,\n      ...props.options\n    };\n\n    const params = removeNullValues(allParams);\n\n    const data = await props.store.read(params);\n\n    if (currentRequestId !== requestId) {\n      return;\n    }\n\n    if (data.length === 0) {\n      hasMoreItems.value = false;\n    } else if (data.length < currentLimit.value) {\n      hasMoreItems.value = false;\n    } else {\n      hasMoreItems.value = true;\n    }\n\n    // Элегантное обновление через computed setter\n    itemsList.value = [...itemsList.value, ...data];\n    \n  } catch (error) {\n    console.error('Load more error:', error);\n  } finally {\n    if (currentRequestId === requestId) {\n      isLoadingExtra.value = false;\n    }\n  }\n};\n\nconst fetchItems = async () => {\n  isLoading.value = true;\n  \n  const currentRequestId = ++requestId;\n  \n  if (isSearching.value) {\n    itemsList.value = [];\n    isSearching.value = false;\n  }\n  \n  try {\n    const allParams = {\n      skip: currentSkip.value,\n      limit: currentLimit.value,\n      search: currentSearch.value,\n      dateStart: date.value?.start,\n      dateEnd: date.value?.end,\n      sortParam: sort.value?.param,\n      sortOrder: sort.value?.order,\n      ...props.options\n    };\n\n    const params = removeNullValues(allParams);\n\n    const data = await props.store.read(params);\n\n    if (currentRequestId !== requestId) {\n      return;\n    }\n\n    if (data.length === 0) {\n      hasMoreItems.value = false;\n    } else if (data.length < currentLimit.value) {\n      hasMoreItems.value = false;\n    } else {\n      hasMoreItems.value = true;\n    }\n\n    // Элегантное обновление через computed setter\n    itemsList.value = data;\n    \n  } catch (error) {\n    console.error('Fetch error:', error);\n  } finally {\n    if (currentRequestId === requestId) {\n      isLoading.value = false;\n    }\n  }\n};\n\nwatch(\n  [() => props.external, () => date.value, () => ({...sort.value}), () => ({...props.options})],\n  ([newExternal, newDate, newSort, newOptions], [oldExternal, oldDate, oldSort, oldOptions]) => {\n    if (\n      newExternal !== oldExternal ||\n      newDate !== oldDate ||\n      newSort?.order !== oldSort?.order ||\n      newSort?.param !== oldSort?.param ||\n      JSON.stringify(newOptions) !== JSON.stringify(oldOptions)\n    ) {\n      currentSkip.value = 0;\n      fetchItems();\n    }\n  },\n  { deep: true }\n);\n\nlet observer = null\n\nonMounted(async () => {\n  await fetchItems()\n\n  if (typeof window !== 'undefined' && !props.showLoadMore && props.LoadMore) {\n    observer = new IntersectionObserver(entries => {\n      if (entries.some(entry => entry.isIntersecting)) {\n        loadMoreItems()\n      }\n    })\n\n    if (sentinel.value) observer.observe(sentinel.value)\n  }\n});\n\nonUnmounted(() => {\n  if (observer) {\n    observer.disconnect();\n  }\n});\n</script>\n\n<style>\n.feed-move,\n.feed-enter-active,\n.feed-leave-active {\n  transition: all 0.5s ease;\n}\n\n.feed-enter-from,\n.feed-leave-to {\n  opacity: 0;\n  transform: translateY(30px);\n}\n\n.feed-leave-active {\n  position: absolute;\n}\n</style>"],"names":["_useModel","search"],"mappings":"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"}
+{"version":3,"file":"Feed.vue.js","sources":["../../../../../src/components/Feed/Feed.vue"],"sourcesContent":["<template>\n  <div v-if=\"search || date || (sort && !sort.hideButton)\" style=\"transform: scale(1);\" class=\"mn-b-thin pos-relative z-index-2 pos-relative flex-nowrap flex gap-thin\">\n\n    <BlockSearch \n      v-if=\"search\"\n      :placeholder=\"search.placeholder || 'Search...'\"\n      :class=\"search.class || 'bg-light'\"\n      @search=\"updateSearch\"\n      :autofocus=\"search.autofocus\"\n    />\n\n    <FiltersBar\n      v-if=\"filter\"\n      v-model=\"filter.selected\"\n      :filters=\"filterConfig\"\n      :class=\"filter.class || 'mobile-only'\"\n    />\n\n    <Dropdown \n      v-if=\"date\"\n      :label=\"{\n        component: ButtonDate,\n        props: { date: date }\n      }\" \n      :class=\"date.class || 'bg-light'\"\n      class=\"flex-child flex-shrink-0 pd-r-small pd-l-small pd-thin bg-light radius-medium\"\n      :align=\"search ? 'right' : 'left'\"\n    >\n\n      <Calendar\n        v-model:date=\"date\"\n        :locale=\"$i18n.locale\"\n        :allowRange=\"true\"\n        class=\"radius-medium w-100 o-hidden bg-light\"\n      />\n    </Dropdown> \n\n    <Dropdown \n      v-if=\"sort && !sort.hideButton\"\n      :label=\"{\n        component: ButtonSort,\n        props: { order: sort.order },\n        class: 'w-1r'\n      }\" \n      :class=\"sort.class || 'bg-light'\"\n      class=\"radius-medium aspect-1x1 h-100\"\n      :align=\"search ? 'right' : 'left'\"\n    >\n\n      <BlockSorting\n        v-model:param=\"sort.param\"\n        v-model:order=\"sort.order\"\n        :options=\"sort.options\"\n        class=\"h-100 pd-small radius-medium t-white bg-black\"\n      />\n    </Dropdown> \n\n    <!-- Actions -->\n    <template\n      v-if=\"actions.length\"\n    >\n      <template v-for=\"action in actions\" :key=\"action.key\">\n        <div \n        :class=\"action.class || 'bg-light'\"\n        class=\"flex-center flex pd-thin bg-light radius-medium aspect-1x1 h-100\"\n      >\n        <component\n          :is=\"action.component\"\n          @click=\"action.handler\"\n          class=\"w-1r h-auto\"\n        >\n        </component>\n\n      </div>\n      </template>\n    </template>\n  </div>\n\n  <TransitionGroup \n    v-if=\"isLoading && !keepSlotVisible\"\n    tag=\"ul\" \n    name=\"scaleTransition\" \n    class=\"pos-relative z-index-1\"\n   :class=\"$attrs.class\"\n  >\n    <Skeleton\n      v-if=\"isLoading && !skeleton?.hide\"\n      v-for=\"i in currentLimit\" \n      :structure=\"skeleton.structure\"\n      :horizontal=\"skeleton.horizontal\"\n      :loading=\"skeleton.apply_to_slot\"\n      :key=\"'skeleton-' + i\"\n      :class=\"replaceClasses('radius-medium bg-light pd-thin flex-child-default o-hidden d-block', skeleton.class)\"\n    />\n    <Loader v-if=\"isLoading && skeleton?.hide\" :centered=\"true\" />\n  </TransitionGroup>\n\n  <TransitionGroup \n    tag=\"ul\" \n    v-else-if=\"itemsList.length < 1\"\n    name=\"feed\"\n  >\n    <EmptyState\n      v-if=\"!isLoading && itemsList.length < 1\"\n      :title=\"states.empty.title\"\n      :description=\"states.empty.description\"\n      :action=\"states.empty.action\"\n      :callback=\"states.empty.callback\"\n      :class=\"replaceClasses('pd-medium bg-light radius-medium', states.empty.class)\"\n    />\n   </TransitionGroup>\n\n  <TransitionGroup \n    v-else-if=\"!keepSlotVisible || !isLoading\"\n    tag=\"ul\" \n    name=\"feed\"\n    :class=\"$attrs.class\"\n  >\n    <slot\n      :items=\"itemsList\"\n    >\n    </slot>\n  </TransitionGroup>\n\n  <!-- Slot visible with overlay loader -->\n  <div v-else class=\"pos-relative\">\n    <TransitionGroup \n      tag=\"ul\" \n      name=\"feed\"\n      :class=\"$attrs.class\"\n    >\n      <slot\n        :items=\"itemsList\"\n      >\n      </slot>\n    </TransitionGroup>\n    \n    <!-- Overlay loader -->\n    <div \n      v-if=\"isLoading && keepSlotVisible\"\n      class=\"pos-absolute pos-t-0 pos-l-0 w-100 h-100 flex-center bg-white-transp-90 z-index-10\"\n    >\n      <Loader :centered=\"true\"  />\n    </div>\n  </div>\n\n  <button\n    v-if=\"showLoadMore && hasMoreItems && itemsList.length > 0 && !isLoadingExtra\"\n    @click=\"loadMoreItems\"\n    class=\"col-w-100 mn-t-thin w-100 t-black bg-main button\"\n  >\n    Load More\n  </button>\n\n  <div v-else key=\"sentinel\" ref=\"sentinel\" class=\"sentinel\"></div> \n\n  <div\n    v-if=\"isLoadingExtra\"\n    class=\"col-w-100 w-100 pos-relative\"\n  >\n    <Loader :centered=\"true\" />\n  </div>\n \n\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, watch } from 'vue';\nimport { useGlobalMixins } from '@martyrs/src/modules/core/views/mixins/mixins.js';\n\nimport SkeletonEvent from '@martyrs/src/modules/icons/skeletons/SkeletonEvent.vue'\n\nimport Loader from '@martyrs/src/components/Loader/Loader.vue';\nimport Skeleton from '@martyrs/src/components/Skeleton/Skeleton.vue';\nimport EmptyState from '@martyrs/src/components/EmptyState/EmptyState.vue';\nimport Dropdown from \"@martyrs/src/components/Dropdown/Dropdown.vue\";\nimport Calendar from '@martyrs/src/components/Calendar/Calendar.vue'\nimport BottomSheet from '@martyrs/src/components/BottomSheet/BottomSheet.vue';\n\nimport BlockSearch from '@martyrs/src/modules/core/views/components/blocks/BlockSearch.vue'\nimport BlockSorting  from '@martyrs/src/modules/core/views/components/blocks/BlockSorting.vue'\n\nimport FiltersBar from '@martyrs/src/modules/core/views/components/sections/Filters.vue'\n\nimport ButtonSort  from '@martyrs/src/modules/core/views/components/elements/ButtonSort.vue'\nimport ButtonDate  from '@martyrs/src/modules/core/views/components/elements/ButtonDate.vue'\n\nimport IconFilter from '@martyrs/src/modules/icons/navigation/IconFilter.vue'\nimport IconEvents from '@martyrs/src/modules/icons/entities/IconEvents.vue'\n\nconst { replaceClasses } = useGlobalMixins();\n\nconst search = defineModel('search')\nconst sort = defineModel('sort')\nconst filter = defineModel('filter')\nconst date = defineModel('date')\nconst items = defineModel('items')\n\n// Внутреннее хранилище для случая, когда v-model:items не передан\nconst internalItems = ref([])\n\n// Элегантное решение через computed\nconst itemsList = computed({\n  get: () => items.value ?? internalItems.value,\n  set: (val) => {\n    if (items.value !== undefined) {\n      items.value = val\n    } else {\n      internalItems.value = val\n    }\n  }\n})\n\nconst filterConfig = computed(() => {\n  if (!filter.value?.options) return []\n  \n  return filter.value.options.map(opt => ({\n    key: opt.value,\n    title: opt.title,\n    type: 'options',\n    options: opt.options || [],\n    defaultValue: null\n  }))\n})\n\n// Пропсы\nconst props = defineProps({\n  showLoadMore: {\n    type: Boolean,\n    default: true\n  },\n  LoadMore: {\n    type: Boolean,\n    default: true\n  },\n  search: {\n    type: [Boolean, Object],\n    default: false\n  },\n  states: {\n    type: Object,\n    default: () => ({\n      empty: {\n        title: 'Nothing found',\n        description: 'Sorry, nothing found',\n      },\n    }),\n  },\n  actions: {\n    type: Array,\n    default: () => []\n  },\n  skeleton: {\n    type: Object,\n    default: () => ({\n      hide: false,\n      horizontal: false,\n      structure: [\n        { block: 'text', size: 'medium' },\n        { block: 'text', size: 'large' },\n        { block: 'button', size: 'small' }\n      ]\n    }),\n   \n  },\n  store: {\n    type: Object,\n    default: () => ({\n      read: Function,\n      state: Object,\n    }),\n  },\n  external: {\n    type: Boolean,\n    default: false\n  },\n  options: {\n    type: Object,\n    default: () => ({\n      category: null,\n      limit: 10, \n      skip: 0 ,\n      owner:  null,\n      creator:  null,\n      customer:  null,\n      user:  null,\n      status: null,\n      period:  null,\n      contain:  null,\n    }),\n  },\n  keepSlotVisible: {\n    type: Boolean,\n    default: false\n  },\n});\n  \nconst hasMoreItems = ref(false);\n\nlet isLoading = ref(true);\nlet isLoadingExtra = ref(false);\nlet sentinel = ref(null)\n\nlet currentSkip = ref(props.options.skip ? props.options.skip : 0);\nlet currentLimit = ref(props.options.limit ? props.options.limit : 10);\n\nlet currentSearch = ref('');\nlet isSearching = ref(false);\n\nlet requestId = 0;\n\nfunction debounce(fn, delay) {\n  let timeoutId = null;\n  return (...args) => {\n    clearTimeout(timeoutId);\n    timeoutId = setTimeout(() => fn(...args), delay);\n  };\n}\n\nconst debouncedSearch = debounce((value) => {\n  isSearching.value = true;\n  currentSearch.value = value;\n  currentSkip.value = 0;\n  currentLimit.value = 10;\n  fetchItems();\n}, 500);\n\nfunction updateSearch(search) {\n  debouncedSearch(search);\n}\n\nconst removeNullValues = (obj) => {\n  return Object.fromEntries(\n    Object.entries(obj).filter(([_, value]) => value != null)\n  );\n};\n\nconst loadMoreItems = async () => {\n  if (!hasMoreItems.value || isLoadingExtra.value) {\n    return;\n  }\n  \n  isLoadingExtra.value = true;\n  \n  const currentRequestId = ++requestId;\n\n  currentSkip.value += currentLimit.value;\n  \n  try {\n    const allParams = {\n      skip: currentSkip.value,\n      limit: currentLimit.value,\n      search: currentSearch.value,\n      dateStart: date.value?.start,\n      dateEnd: date.value?.end,\n      sortParam: sort.value?.param,\n      sortOrder: sort.value?.order,\n      ...props.options\n    };\n\n    const params = removeNullValues(allParams);\n\n    const data = await props.store.read(params);\n\n    if (currentRequestId !== requestId) {\n      return;\n    }\n\n    if (data.length === 0) {\n      hasMoreItems.value = false;\n    } else if (data.length < currentLimit.value) {\n      hasMoreItems.value = false;\n    } else {\n      hasMoreItems.value = true;\n    }\n\n    // Элегантное обновление через computed setter\n    itemsList.value = [...itemsList.value, ...data];\n    \n  } catch (error) {\n    console.error('Load more error:', error);\n  } finally {\n    if (currentRequestId === requestId) {\n      isLoadingExtra.value = false;\n    }\n  }\n};\n\nconst fetchItems = async () => {\n  isLoading.value = true;\n  \n  const currentRequestId = ++requestId;\n  \n  if (isSearching.value) {\n    itemsList.value = [];\n    isSearching.value = false;\n  }\n  \n  try {\n    const allParams = {\n      skip: currentSkip.value,\n      limit: currentLimit.value,\n      search: currentSearch.value,\n      dateStart: date.value?.start,\n      dateEnd: date.value?.end,\n      sortParam: sort.value?.param,\n      sortOrder: sort.value?.order,\n      ...props.options\n    };\n\n    const params = removeNullValues(allParams);\n\n    const data = await props.store.read(params);\n\n    if (currentRequestId !== requestId) {\n      return;\n    }\n\n    if (data.length === 0) {\n      hasMoreItems.value = false;\n    } else if (data.length < currentLimit.value) {\n      hasMoreItems.value = false;\n    } else {\n      hasMoreItems.value = true;\n    }\n\n    // Элегантное обновление через computed setter\n    itemsList.value = data;\n    \n  } catch (error) {\n    console.error('Fetch error:', error);\n  } finally {\n    if (currentRequestId === requestId) {\n      isLoading.value = false;\n    }\n  }\n};\n\nwatch(\n  [() => props.external, () => date.value, () => ({...sort.value}), () => ({...props.options})],\n  ([newExternal, newDate, newSort, newOptions], [oldExternal, oldDate, oldSort, oldOptions]) => {\n    if (\n      newExternal !== oldExternal ||\n      newDate !== oldDate ||\n      newSort?.order !== oldSort?.order ||\n      newSort?.param !== oldSort?.param ||\n      JSON.stringify(newOptions) !== JSON.stringify(oldOptions)\n    ) {\n      currentSkip.value = 0;\n      fetchItems();\n    }\n  },\n  { deep: true }\n);\n\nlet observer = null\n\nonMounted(async () => {\n  await fetchItems()\n\n  if (typeof window !== 'undefined' && !props.showLoadMore && props.LoadMore) {\n    observer = new IntersectionObserver(entries => {\n      if (entries.some(entry => entry.isIntersecting)) {\n        loadMoreItems()\n      }\n    })\n\n    if (sentinel.value) observer.observe(sentinel.value)\n  }\n});\n\nonUnmounted(() => {\n  if (observer) {\n    observer.disconnect();\n  }\n});\n</script>\n\n<style>\n.feed-move,\n.feed-enter-active,\n.feed-leave-active {\n  transition: all 0.5s ease;\n}\n\n.feed-enter-from,\n.feed-leave-to {\n  opacity: 0;\n  transform: translateY(30px);\n}\n\n.feed-leave-active {\n  position: absolute;\n}\n</style>"],"names":["_useModel","search"],"mappings":"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"}

package/dist/martyrs/src/components/FieldBig/FieldBig.vue.js

@@ -172,7 +172,7 @@ const _sfc_main = {
         name: unref(fieldName),
         id: unref(fieldId),
         validation: __props.validation,
-        class: "radius-medium flex-nowrap flex w-100 p-regular t-regular uppercase pd-thin"
+        class: "radius-medium flex-nowrap flex w-100 p-regular fw-regular uppercase pd-thin"
       }, {
         default: withCtx(() => [
           renderSlot(_ctx.$slots, "default"),
@@ -182,7 +182,7 @@ const _sfc_main = {
             showLoader: __props.showLoader,
             callback: __props.callback,
             callbackDelay: __props.callbackDelay,
-            class: "t-nowrap t-medium radius-small uppercase cursor-pointer flex flex-v-center pd-thin w-max hover-bg-fifth t-semi transition-linear transition-timing-1 t-black bg-main"
+            class: "t-nowrap fw-medium radius-small uppercase cursor-pointer flex flex-v-center pd-thin w-max hover:bg-fifth fw-semi ease-linear t-black bg-main"
           }, {
             default: withCtx(() => [
               __props.action ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(__props.action), 1)) : createCommentVNode("", true),

package/dist/martyrs/src/components/FieldBig/FieldBig.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldBig.vue.js","sources":["../../../../../src/components/FieldBig/FieldBig.vue"],"sourcesContent":["<template>\n  <Field\n    v-model:field=\"inputField\"\n    @update:field=\"updateInput\"\n    :placeholder=\"typing ? '' : placeholder\"\n    @input=\"handleInput\"\n    @focus=\"handleFocus\"\n    @blur=\"checkInput\"\n    :name=\"fieldName\"\n    :id=\"fieldId\"\n    :validation=\"validation\"\n    class=\"radius-medium flex-nowrap flex  w-100 p-regular t-regular uppercase pd-thin\"\n  >\n    <slot></slot>\n    <Button\n      :submit=\"handleAction\"\n      :showSucces=\"showSuccess\"\n      :showLoader=\"showLoader\"\n      :callback=\"callback\"\n      :callbackDelay=\"callbackDelay\"\n      class=\"t-nowrap t-medium radius-small uppercase cursor-pointer flex flex-v-center pd-thin w-max hover-bg-fifth t-semi transition-linear transition-timing-1 t-black bg-main\"\n    >\n      <span v-if=\"action\" class=\"desktop-only mn-r-thin\">{{action}}</span>\n      <IconArrow class=\"i-medium\"/>\n    </Button>\n</Field>\n</template>\n\n<script setup=\"props\">\n  import { ref, watchEffect, onMounted } from 'vue'\n  import Field from '@martyrs/src/components/Field/Field.vue'\n  import Button from '@martyrs/src/components/Button/Button.vue'\n  import IconArrow from '@martyrs/src/modules/icons/navigation/IconArrow.vue'\n  import { useI18n } from 'vue-i18n'\n\n  // Генерируем уникальный ID для каждого экземпляра\n  const uniqueId = Math.random().toString(36).substr(2, 9)\n\n  const props = defineProps({\n    input: String,\n    placeholder: {\n      type: String\n    },\n    action: {\n      type: String\n    },\n    placeholderTexts: {\n      type: Object,\n      default: () => ({\n        en: [\n          'Lowest THC, please!',\n          'Something with banana flavors?',\n          \"I'm in the mood for trippy vibes.\"\n        ],\n        ru: [\n          'Я хочу самый низкий THC',\n          'Я хочу чего-нибудь бананового',\n          'Я хочу курнуть хейза'\n        ],\n      })\n    },\n    typingSpeed: {\n      type: Number,\n      default: 200\n    },\n    loopTyping: {\n      type: Boolean,\n      default: false\n    },\n    enableTyping: {\n      type: Boolean,\n      default: false\n    },\n    showLoader: {\n      type: Boolean,\n      default: true\n    },\n    showSuccess: {\n      type: Boolean,\n      default: true\n    },\n    callback: {\n      type: Function,\n      default: null\n    },\n    callbackDelay: {\n      type: Number,\n      default: 750\n    },\n    name: {\n      type: String,\n      default: null\n    },\n    id: {\n      type: String,\n      default: null\n    },\n    validation: {\n      type: [Object, Boolean],\n      default: false\n    }\n  });\n\n  // Уникальные имена для полей\n  const fieldName = props.name || `field-big-${uniqueId}`\n  const fieldId = props.id || `field-big-${uniqueId}`\n\n  const { t, locale } = useI18n()\n\n  let placeholderIndex = ref(0)\n\n  let inputField = ref(props.input)\n  let inputPlaceholder = ref(props.placeholder)\n  let typing = ref(props.enableTyping)\n  let typeInterval = ref(null)\n  let userText = ref('') // Stores user input\n  let cursorVisible = ref(true)\n  let cursorInterval = null\n\n  const emit = defineEmits(['update:input',  'action']);\n\n  function emitAction() {\n    emit('action')\n  }\n\n  async function handleAction() {\n    const result = emit('action')\n    // Если обработчик вернул промис, ждем его\n    if (result && typeof result.then === 'function') {\n      return result\n    }\n    // Иначе возвращаем resolved промис\n    return Promise.resolve(result)\n  }\n  \n  function updateInput(event) {\n     emit('update:input', event)\n     userText.value = event // Stores user input\n  }\n\n  function handleInput() {\n    placeholderIndex.value = (placeholderIndex.value + 1) % props.placeholderTexts[locale.value].length\n  }\n\n  function handleFocus() {\n    typing.value = false\n\n    clearInterval(typeInterval.value)\n\n    inputPlaceholder.value = props.placeholder\n\n    if (!userText.value) {\n      inputField.value = ''\n    }\n  }\n\n  function checkInput() {\n    if (!userText.value && props.enableTyping) {\n      typing.value = true\n      inputPlaceholder.value = ''\n      startTyping()\n    }\n  }\n\n  function startTyping() {\n    let placeholderText = props.placeholderTexts[locale.value][placeholderIndex.value]\n    let i = 0\n    let typingBackwards = false\n  \n    // Start the cursor blinking\n    cursorInterval = setInterval(() => {\n      cursorVisible.value = !cursorVisible.value\n    }, 200)\n\n    typeInterval.value = setInterval(() => {\n      if (typing.value) {\n        if (!typingBackwards) {\n          inputField.value = placeholderText.substring(0, i) + (cursorVisible.value && i % 2 ? '|' : '')\n          i++\n        } else {\n          inputField.value = inputField.value.slice(0, -1)\n          inputField.value = placeholderText.substring(0, i) + (cursorVisible.value && i % 2 ? '|' : '')\n          i--\n        }\n\n        if (i > placeholderText.length && props.loopTyping) {\n          setTimeout(() => {\n            typingBackwards = true\n            inputField.value = placeholderText.substring(0, i)\n          }, 333)\n        }\n\n        if (i === 0 && typingBackwards) {\n          typingBackwards = false\n          handleInput()\n          placeholderText = props.placeholderTexts[locale.value][placeholderIndex.value]\n        }\n      }\n    }, props.typingSpeed)\n  }\n\n\n  onMounted(() => {\n    if (props.enableTyping) startTyping()\n  })\n\n  watchEffect(() => {\n    if (!typing.value) {\n      clearInterval(typeInterval.value)\n      clearInterval(cursorInterval)\n    }\n  })\n</script>\n\n<style lang=\"scss\">\n</style>"],"names":[],"mappings":"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"}
+{"version":3,"file":"FieldBig.vue.js","sources":["../../../../../src/components/FieldBig/FieldBig.vue"],"sourcesContent":["<template>\n  <Field\n    v-model:field=\"inputField\"\n    @update:field=\"updateInput\"\n    :placeholder=\"typing ? '' : placeholder\"\n    @input=\"handleInput\"\n    @focus=\"handleFocus\"\n    @blur=\"checkInput\"\n    :name=\"fieldName\"\n    :id=\"fieldId\"\n    :validation=\"validation\"\n    class=\"radius-medium flex-nowrap flex  w-100 p-regular fw-regular uppercase pd-thin\"\n  >\n    <slot></slot>\n    <Button\n      :submit=\"handleAction\"\n      :showSucces=\"showSuccess\"\n      :showLoader=\"showLoader\"\n      :callback=\"callback\"\n      :callbackDelay=\"callbackDelay\"\n      class=\"t-nowrap fw-medium radius-small uppercase cursor-pointer flex flex-v-center pd-thin w-max hover:bg-fifth fw-semi ease-linear t-black bg-main\"\n    >\n      <span v-if=\"action\" class=\"desktop-only mn-r-thin\">{{action}}</span>\n      <IconArrow class=\"i-medium\"/>\n    </Button>\n</Field>\n</template>\n\n<script setup=\"props\">\n  import { ref, watchEffect, onMounted } from 'vue'\n  import Field from '@martyrs/src/components/Field/Field.vue'\n  import Button from '@martyrs/src/components/Button/Button.vue'\n  import IconArrow from '@martyrs/src/modules/icons/navigation/IconArrow.vue'\n  import { useI18n } from 'vue-i18n'\n\n  // Генерируем уникальный ID для каждого экземпляра\n  const uniqueId = Math.random().toString(36).substr(2, 9)\n\n  const props = defineProps({\n    input: String,\n    placeholder: {\n      type: String\n    },\n    action: {\n      type: String\n    },\n    placeholderTexts: {\n      type: Object,\n      default: () => ({\n        en: [\n          'Lowest THC, please!',\n          'Something with banana flavors?',\n          \"I'm in the mood for trippy vibes.\"\n        ],\n        ru: [\n          'Я хочу самый низкий THC',\n          'Я хочу чего-нибудь бананового',\n          'Я хочу курнуть хейза'\n        ],\n      })\n    },\n    typingSpeed: {\n      type: Number,\n      default: 200\n    },\n    loopTyping: {\n      type: Boolean,\n      default: false\n    },\n    enableTyping: {\n      type: Boolean,\n      default: false\n    },\n    showLoader: {\n      type: Boolean,\n      default: true\n    },\n    showSuccess: {\n      type: Boolean,\n      default: true\n    },\n    callback: {\n      type: Function,\n      default: null\n    },\n    callbackDelay: {\n      type: Number,\n      default: 750\n    },\n    name: {\n      type: String,\n      default: null\n    },\n    id: {\n      type: String,\n      default: null\n    },\n    validation: {\n      type: [Object, Boolean],\n      default: false\n    }\n  });\n\n  // Уникальные имена для полей\n  const fieldName = props.name || `field-big-${uniqueId}`\n  const fieldId = props.id || `field-big-${uniqueId}`\n\n  const { t, locale } = useI18n()\n\n  let placeholderIndex = ref(0)\n\n  let inputField = ref(props.input)\n  let inputPlaceholder = ref(props.placeholder)\n  let typing = ref(props.enableTyping)\n  let typeInterval = ref(null)\n  let userText = ref('') // Stores user input\n  let cursorVisible = ref(true)\n  let cursorInterval = null\n\n  const emit = defineEmits(['update:input',  'action']);\n\n  function emitAction() {\n    emit('action')\n  }\n\n  async function handleAction() {\n    const result = emit('action')\n    // Если обработчик вернул промис, ждем его\n    if (result && typeof result.then === 'function') {\n      return result\n    }\n    // Иначе возвращаем resolved промис\n    return Promise.resolve(result)\n  }\n  \n  function updateInput(event) {\n     emit('update:input', event)\n     userText.value = event // Stores user input\n  }\n\n  function handleInput() {\n    placeholderIndex.value = (placeholderIndex.value + 1) % props.placeholderTexts[locale.value].length\n  }\n\n  function handleFocus() {\n    typing.value = false\n\n    clearInterval(typeInterval.value)\n\n    inputPlaceholder.value = props.placeholder\n\n    if (!userText.value) {\n      inputField.value = ''\n    }\n  }\n\n  function checkInput() {\n    if (!userText.value && props.enableTyping) {\n      typing.value = true\n      inputPlaceholder.value = ''\n      startTyping()\n    }\n  }\n\n  function startTyping() {\n    let placeholderText = props.placeholderTexts[locale.value][placeholderIndex.value]\n    let i = 0\n    let typingBackwards = false\n  \n    // Start the cursor blinking\n    cursorInterval = setInterval(() => {\n      cursorVisible.value = !cursorVisible.value\n    }, 200)\n\n    typeInterval.value = setInterval(() => {\n      if (typing.value) {\n        if (!typingBackwards) {\n          inputField.value = placeholderText.substring(0, i) + (cursorVisible.value && i % 2 ? '|' : '')\n          i++\n        } else {\n          inputField.value = inputField.value.slice(0, -1)\n          inputField.value = placeholderText.substring(0, i) + (cursorVisible.value && i % 2 ? '|' : '')\n          i--\n        }\n\n        if (i > placeholderText.length && props.loopTyping) {\n          setTimeout(() => {\n            typingBackwards = true\n            inputField.value = placeholderText.substring(0, i)\n          }, 333)\n        }\n\n        if (i === 0 && typingBackwards) {\n          typingBackwards = false\n          handleInput()\n          placeholderText = props.placeholderTexts[locale.value][placeholderIndex.value]\n        }\n      }\n    }, props.typingSpeed)\n  }\n\n\n  onMounted(() => {\n    if (props.enableTyping) startTyping()\n  })\n\n  watchEffect(() => {\n    if (!typing.value) {\n      clearInterval(typeInterval.value)\n      clearInterval(cursorInterval)\n    }\n  })\n</script>\n\n<style lang=\"scss\">\n</style>"],"names":[],"mappings":"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"}

package/dist/martyrs/src/components/FieldPhone/FieldPhone.vue.js

@@ -494,7 +494,7 @@ const _sfc_main = {
           ref: rootElement
         }, [
           withDirectives((openBlock(), createElementBlock("div", {
-            class: normalizeClass([["vti__dropdown", { open: open.value }], "br-solid br-black-transp-10 br-1px radius-thin"]),
+            class: normalizeClass([["vti__dropdown", { open: open.value }], "br-black-transp-10 br-1px radius-thin"]),
             style: normalizeStyle([__props.dropdownStyle]),
             tabindex: __props.dropdownOptions.tabindex,
             onKeydown: withKeys(reset, ["esc"])

package/dist/martyrs/src/components/FieldPhone/FieldPhone.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldPhone.vue.js","sources":["../../../../../src/components/FieldPhone/FieldPhone.vue"],"sourcesContent":["<template>\n  <div \n    :class=\"[\n      rootClass, \n      classes,\n      $attrs.class, \n      { 'bg-fourth-nano': validation }, \n      { disabled: disabled }\n    ]\" \n    :style=\"[rootStyle, styles]\" \n    ref=\"rootElement\"\n    class=\"field-wrapper vue3-reactive-tel-input\"\n  >\n    <div\n      v-click-outside=\"clickedOutside\"\n      :class=\"['vti__dropdown', { open: open }]\"\n      :style=\"[dropdownStyle]\"\n      :tabindex=\"dropdownOptions.tabindex\"\n      @keydown.esc=\"reset\"\n      class=\"br-solid br-black-transp-10 br-1px radius-thin\"\n    >\n      <span class=\"flex-nowrap flex flex-v-center p-regular vti__selection\">\n        <span v-if=\"dropdownOptions.showFlags\" v-html=\"activeCountryFlag\" class=\"mn-r-nano\" />\n        \n        <!-- Новый инпут для ввода кода страны -->\n        <input\n          v-if=\"dropdownOptions.showDialCodeInSelection\"\n          v-model=\"dialCodeInput\"\n          @input=\"onDialCodeInput\"\n          @focus=\"openDropdown\"\n          @blur=\"onDialCodeBlur\"\n          @keydown=\"keyboardNav\"\n          type=\"text\"\n          class=\"vti__country-code-input\"\n          :placeholder=\"`+${activeCountry?.dialCode || ''}`\"\n          :disabled=\"disabled\"\n          :size=\"Math.max((dialCodeInput?.length || 0) + 1, 3)\"\n          maxlength=\"5\"\n        />\n\n      </span>\n      \n      <ul \n        ref=\"list\" \n        class=\"bs-black radius-small vti__dropdown-list\"\n        v-show=\"open\" \n        :class=\"dropdownOpenDirection\"\n        :style=\"[listStyle]\"\n      >\n        <li\n          v-for=\"(pb, index) in filteredAndSortedCountries\"\n          class=\"flex-nowrap flex w-max\"\n          :class=\"['vti__dropdown-item', getItemClass(index, pb.iso2)]\"\n          :key=\"pb.iso2 + (pb.preferred ? '-preferred' : '')\"\n          @click=\"choose(pb)\"\n          @mousemove=\"selectedIndex = index\"\n        >\n          <span v-if=\"dropdownOptions.showFlags\" v-html=\"pb.flag\" class=\"mn-r-thin\"/>\n          <strong>{{ pb.name }}</strong>\n          <span v-if=\"dropdownOptions.showDialCodeInList\"> +{{ pb.dialCode }} </span>\n        </li>\n      </ul>\n    </div>\n    \n    <input\n      v-model=\"phone\"\n      inputmode=\"numeric\" \n      pattern=\"\\d*\"\n      ref=\"input\"\n      :type=\"inputOptions.type\"\n      :autocomplete=\"inputOptions.autocomplete\"\n      :autofocus=\"inputOptions.autofocus\"\n      :class=\"['vti__input', inputOptions.styleClasses, inputClass, Iclasses]\"\n      :style=\"[inputStyle, Istyles]\"\n      :disabled=\"disabled\"\n      :id=\"inputId !== '' ? inputId : inputOptions.id\"\n      :maxlength=\"inputOptions.maxlength\"\n      :name=\"inputId !== '' ? inputId : inputOptions.name\"\n      :placeholder=\"parsedPlaceholder\"\n      :readonly=\"inputOptions.readonly\"\n      :required=\"inputOptions.required\"\n      :tabindex=\"inputOptions.tabindex\"\n      @blur=\"onBlur\"\n      @focus=\"onFocus\"\n      @input=\"onInput\"\n      @keyup.enter=\"onEnter\"\n      @keyup.space=\"onSpace\"\n    />\n    <slot></slot>\n  </div>\n  \n  <!-- Validation -->\n  <transition name=\"fade\">\n    <div v-if=\"validation\" class=\"mn-t-thin mn-b-thin invalid-feedback\">\n      * {{validation.message}}\n    </div>\n  </transition>\n</template>\n\n<script setup>\n  import { ref, reactive, watch, computed, onMounted, nextTick } from 'vue';\n  import { parsePhoneNumberFromString } from 'libphonenumber-js';\n\n  import clickOutside from './click-outside.js';\n  import allCountries from './all-countries.js';\n\n  let vClickOutside = clickOutside\n\n  const props = defineProps({\n    modelValue: { type: String, default: '' },\n    badClass: { type: [String, Array, Object], default: '' },\n    goodClass: { type: [String, Array, Object], default: '' },\n    badStyle: { type: [String, Array, Object], default: '' },\n    goodStyle: { type: [String, Array, Object], default: '' },\n    badInputClass: { type: [String, Array, Object], default: '' },\n    goodInputClass: { type: [String, Array, Object], default: '' },\n    badInputStyle: { type: [String, Array, Object], default: '' },\n    goodInputStyle: { type: [String, Array, Object], default: '' },\n    allCountries: { type: Array, default: () => allCountries },\n    autoFormat: { type: Boolean, default: true },\n    validation: { type: [Boolean, Object], default: false },\n    customValidate: { type: [Boolean, RegExp], default: false },\n    defaultCountry: { type: String, default: '' },\n    disabled: { type: Boolean, default: false },\n    autoDefaultCountry: { type: Boolean, default: true },\n    ignoredCountries: { type: Array, default: () => [] },\n    invalidMsg: { type: String, default: '' },\n    mode: { type: String, default: 'auto' },\n    onlyCountries: { type: Array, default: () => [] },\n    preferredCountries: { type: Array, default: () => [] },\n    validCharactersOnly: { type: Boolean, default: false },\n    rootClass: { type: [String, Array, Object], default: '' },\n    inputClass: { type: [String, Array, Object], default: '' },\n    rootStyle: { type: [String, Array, Object], default: '' },\n    dropdownStyle: { type: [String, Array, Object], default: '' },\n    listStyle: { type: [String, Array, Object], default: '' },\n    inputStyle: { type: [String, Array, Object], default: '' },\n    inputId: { type: [String, Array, Object], default: '' },\n    Placeholder: { type: [String, Object, Function], default: '' },\n    dropdownOptions: { \n      type: Object, \n      default: () => ({\n        showDialCodeInList: true,\n        showDialCodeInSelection: false,\n        showFlags: true,\n        tabindex: 0\n      })\n    },\n    inputOptions: { \n      type: Object, \n      default: () => ({ \n        autocomplete: 'on',\n        autofocus: false,\n        id: '',\n        maxlength: 25,\n        name: 'telephone',\n        placeholder: 'Enter a phone number',\n        readonly: false,\n        required: false,\n        tabindex: 0,\n        type: 'tel',\n        styleClasses: ''\n      })\n    },\n  });\n\n  const emits = defineEmits([\n    'update:modelValue', \n    'change',\n    'validate', \n    'country-changed', \n    'open', \n    'close', \n    'blur', \n    'focus', \n    'enter', \n    'space'\n  ]);\n\n  // Reactive data\n  const phone = ref(props.modelValue || '');\n  const activeCountryCode = ref('');\n  const dialCodeInput = ref('');\n  const dialCodeFilter = ref('');\n  const open = ref(false);\n  const finishMounted = ref(false);\n  const selectedIndex = ref(null);\n  const typeToFindInput = ref('');\n  const typeToFindTimer = ref(null);\n  const dropdownOpenDirection = ref('below');\n  const parsedPlaceholder = ref(props.Placeholder !== '' ? props.Placeholder : props.inputOptions.placeholder);\n\n  // Element refs\n  const rootElement = ref(null);\n  const list = ref(null);\n  const input = ref(null);\n\n  // Lifecycle hooks\n  onMounted(() => {\n    if (props.modelValue) {\n      phone.value = props.modelValue;\n    }\n\n    cleanInvalidCharacters();\n\n    initializeCountry()\n      .then(() => {\n        if (!phone.value && props.inputOptions?.showDialCode && activeCountryCode.value) {\n          phone.value = `+${activeCountryCode.value}`;\n        }\n        \n        // Инициализируем dialCodeInput\n        if (activeCountry.value && props.dropdownOptions.showDialCodeInSelection) {\n          dialCodeInput.value = `+${activeCountry.value.dialCode}`;\n        }\n        \n        emits('validate', phoneObject.value);\n      })\n      .catch(console.error)\n      .then(() => {\n        finishMounted.value = true;\n      });\n  });\n\n  // Computed properties\n  const activeCountry = computed(() => {\n    return findCountry(activeCountryCode.value);\n  });\n\n  const activeCountryFlag = computed(() => {\n    return activeCountry.value ? activeCountry.value.flag : null;\n  });\n\n  const parsedMode = computed(() => {\n    if (props.mode === 'auto') {\n      if (!phone.value || phone.value[0] !== '+') {\n        return 'national';\n      }\n      return 'international';\n    }\n    if (!['international', 'national'].includes(props.mode)) {\n      console.error('Invalid value of prop \"mode\"');\n      return 'international';\n    }\n    return props.mode;\n  });\n\n  const filteredCountries = computed(() => {\n    let countries = props.allCountries;\n\n    // Фильтрация по onlyCountries/ignoredCountries\n    if (props.onlyCountries && props.onlyCountries.length) {\n      countries = countries.filter(({ iso2 }) => \n        props.onlyCountries.includes(iso2.toUpperCase())\n      );\n    } else if (props.ignoredCountries && props.ignoredCountries.length) {\n      countries = countries.filter(({ iso2 }) =>\n        !props.ignoredCountries.includes(iso2.toUpperCase()) && \n        !props.ignoredCountries.includes(iso2.toLowerCase())\n      );\n    }\n\n    // Фильтрация по введенному коду страны\n    if (dialCodeFilter.value) {\n      const filterValue = dialCodeFilter.value.replace('+', '');\n      countries = countries.filter(country => \n        country.dialCode.startsWith(filterValue)\n      );\n    }\n\n    return countries;\n  });\n\n  const filteredAndSortedCountries = computed(() => {\n    const preferredCountries = getCountries(props.preferredCountries)\n      .filter(country => {\n        if (!dialCodeFilter.value) return true;\n        const filterValue = dialCodeFilter.value.replace('+', '');\n        return country.dialCode.startsWith(filterValue);\n      })\n      .map(country => ({ ...country, preferred: true }));\n\n    return [...preferredCountries, ...filteredCountries.value];\n  });\n\n  const phoneObject = computed(() => {\n    let result = {};\n\n    if (phone.value?.[0] === '+') {\n      result = parsePhoneNumberFromString(phone.value) || {};\n    } else {\n      result = parsePhoneNumberFromString(phone.value, activeCountryCode.value) || {};\n    }\n\n    const { metadata, ...phoneDetails } = result;\n\n    let valid = result.isValid?.();\n    let formatted = phone.value;\n\n    if (valid) {\n      formatted = result.format?.(parsedMode.value.toUpperCase(), { nationalPrefix: false });\n    }\n\n    if (result.country && (props.ignoredCountries.length || props.onlyCountries.length)) {\n      if (!findCountry(result.country)) {\n        valid = false;\n        result = { ...result, country: null };\n      }\n    }\n\n    return {\n      ...phoneDetails,\n      countryCode: result.country,\n      valid,\n      country: activeCountry.value,\n      formatted,\n    };\n  });\n\n  const classes = computed(() => {\n    return phoneObject.value.valid === true ? props.goodClass : \n           phoneObject.value.valid === false ? props.badClass : undefined;\n  });\n\n  const styles = computed(() => {\n    return phoneObject.value.valid === true ? props.goodStyle : \n           phoneObject.value.valid === false ? props.badStyle : undefined;\n  });\n\n  const Iclasses = computed(() => {\n    return phoneObject.value.valid === true ? props.goodInputClass : \n           phoneObject.value.valid === false ? props.badInputClass : undefined;\n  });\n\n  const Istyles = computed(() => {\n    return phoneObject.value.valid === true ? props.goodInputStyle : \n           phoneObject.value.valid === false ? props.badInputStyle : undefined;\n  });\n\n  // Watchers\n  watch(activeCountry, (newValue, oldValue) => {\n    if (!newValue && oldValue?.iso2) {\n      activeCountryCode.value = oldValue.iso2;\n      return;\n    }\n    if (newValue?.iso2) {\n      emits('country-changed', newValue);\n      resetPlaceholder();\n      // Обновляем dialCodeInput при смене страны\n      dialCodeInput.value = `+${newValue.dialCode}`;\n    }\n  });\n\n  watch(() => phoneObject.value.countryCode, (newValue) => {\n    activeCountryCode.value = newValue;\n  });\n\n  watch(() => phoneObject.value.valid, () => {\n    emits('validate', phoneObject.value);\n  });\n\n  watch(() => phoneObject.value.formatted, (newValue) => {\n    if (!props.autoFormat || props.customValidate) {\n      return;\n    }\n    emitInput(newValue);\n\n    nextTick(() => {\n      if (newValue && !props.modelValue) {\n        phone.value = newValue;\n      }\n    });\n  });\n\n  watch(() => props.inputOptions.placeholder, () => {\n    resetPlaceholder();\n  });\n\n  watch(() => props.modelValue, (newValue, oldValue) => {\n    if (!testCharacters()) {\n      nextTick(() => {\n        phone.value = oldValue;\n        onInput();\n      });\n    } else {\n      phone.value = newValue;\n    }\n  });\n\n  watch(open, (isDropdownOpened) => {\n    if (isDropdownOpened) {\n      setDropdownPosition();\n      emits('open');\n    } else {\n      emits('close');\n    }\n  });\n\n  // Methods\n  function onDialCodeInput() {\n    // Убеждаемся, что символ + всегда есть в начале\n    if (!dialCodeInput.value.startsWith('+')) {\n      dialCodeInput.value = '+' + dialCodeInput.value.replace(/^\\+*/, '');\n    }\n    \n    // Разрешаем только + и цифры\n    dialCodeInput.value = dialCodeInput.value.replace(/[^+\\d]/g, '');\n    \n    // Убеждаемся что + только в начале\n    const plusCount = (dialCodeInput.value.match(/\\+/g) || []).length;\n    if (plusCount > 1) {\n      dialCodeInput.value = '+' + dialCodeInput.value.replace(/\\+/g, '');\n    }\n    \n    dialCodeFilter.value = dialCodeInput.value;\n    open.value = true;\n    \n    // Автовыбор страны если код точно совпадает\n    const exactMatch = filteredCountries.value.find(country => \n      `+${country.dialCode}` === dialCodeInput.value\n    );\n    \n    if (exactMatch && filteredAndSortedCountries.value.length === 1) {\n      choose(exactMatch);\n    }\n  }\n\n  function onDialCodeBlur() {\n    setTimeout(() => {\n      if (!dialCodeInput.value && activeCountry.value) {\n        dialCodeInput.value = `+${activeCountry.value.dialCode}`;\n      }\n    }, 200);\n  }\n\n  function openDropdown() {\n    if (!props.disabled) {\n      open.value = true;\n    }\n  }\n\n  function setCaretPosition(ctrl, pos) {\n    if (ctrl.setSelectionRange) {\n      ctrl.focus();\n      ctrl.setSelectionRange(pos, pos);\n    } else if (ctrl.createTextRange) {\n      const range = ctrl.createTextRange();\n      range.collapse(true);\n      range.moveEnd('character', pos);\n      range.moveStart('character', pos);\n      range.select();\n    }\n  }\n\n  function resetPlaceholder() {\n    parsedPlaceholder.value = props.inputOptions.placeholder;\n  }\n\n  function initializeCountry() {\n    return new Promise((resolve) => {\n      if (phone.value?.[0] === '+') { \n        resolve(); \n        return; \n      }\n      \n      if (props.defaultCountry) { \n        choose(props.defaultCountry); \n        resolve(); \n        return; \n      }\n      \n      const fallbackCountry = props.preferredCountries[0] || filteredCountries.value[0];\n      \n      if (props.autoDefaultCountry) {\n        fetch('https://ip2c.org/s')\n          .then((response) => response.text())\n          .then((response) => {\n            const result = (response || '').toString();\n            if (!result || result[0] !== '1') {\n              throw new Error('unable to fetch the country');\n            }\n            return result.substr(2, 2);\n          })\n          .then((res) => { \n            choose(res || activeCountryCode.value); \n          })\n          .catch((error) => { \n            console.warn(error); \n            choose(fallbackCountry); \n          })\n          .finally(() => { \n            resolve(); \n          });\n      } else {\n        choose(fallbackCountry);\n        resolve();\n      }\n    });\n  }\n\n  function getCountries(list = []) {\n    return list.map((countryCode) => findCountry(countryCode)).filter(Boolean);\n  }\n\n  function findCountry(iso = '') {\n    return filteredCountries.value.find((country) => country.iso2 === iso.toUpperCase());\n  }\n\n  function getItemClass(index, iso2) {\n    const highlighted = selectedIndex.value === index;\n    const lastPreferred = index === props.preferredCountries.length - 1;\n    const preferred = props.preferredCountries.some((c) => c.toUpperCase() === iso2);\n    return { highlighted, 'last-preferred': lastPreferred, preferred };\n  }\n\n  function choose(country) {\n    let parsedCountry = typeof country === 'string' ? findCountry(country) : country;\n    if (!parsedCountry) return;\n    \n    if (phone.value?.[0] === '+' && parsedCountry.iso2 && phoneObject.value.nationalNumber) {\n      activeCountryCode.value = parsedCountry.iso2;\n      phone.value = parsePhoneNumberFromString(\n        phoneObject.value.nationalNumber, \n        parsedCountry.iso2\n      ).formatInternational();\n    } else {\n      activeCountryCode.value = parsedCountry.iso2;\n    }\n\n    dialCodeInput.value = `+${parsedCountry.dialCode}`;\n    dialCodeFilter.value = '';\n    \n    // Закрываем дропдаун\n    open.value = false;\n    \n    // Переводим фокус на основной инпут\n    nextTick(() => {\n      if (input.value) {\n        input.value.focus();\n      }\n    });\n    \n    emitInput(phone.value);\n  }\n\n  function cleanInvalidCharacters() {\n    const currentPhone = phone.value;\n\n    if (props.validCharactersOnly) {\n      const results = phone.value.match(/[()\\-+0-9\\s]*/g);\n      phone.value = results.join('');\n    }\n\n    if (props.customValidate && props.customValidate instanceof RegExp) {\n      const results = phone.value.match(props.customValidate);\n      phone.value = results ? results.join('') : '';\n    }\n\n    if (currentPhone !== phone.value) {\n      emitInput(phone.value);\n    }\n  }\n\n  function testCharacters() {\n    if (props.validCharactersOnly) {\n      const result = /^[()\\-+0-9\\s]*$/.test(phone.value);\n      if (!result) return false;\n    }\n    if (props.customValidate) {\n      return testCustomValidate();\n    }\n    return true;\n  }\n\n  function testCustomValidate() {\n    return props.customValidate instanceof RegExp ? props.customValidate.test(phone.value) : false;\n  }\n\n  function onInput() {\n    input.value.setCustomValidity(phoneObject.valid ? '' : props.invalidMsg);\n    emitInput(phone.value);\n  }\n\n  function emitInput(value) {\n    emits('update:modelValue', value);\n\n    if (phoneObject.value.valid) { \n      emits('change', phoneObject.value.number);\n      emits('country', phoneObject.value.number);\n    } else {\n      emits('country', null);\n    }\n  }\n\n  function onBlur() {\n    emits('blur');\n  }\n\n  function onFocus() {\n    setCaretPosition(input.value, phone.value.length);\n    emits('focus');\n  }\n\n  function onEnter() {\n    emits('enter');\n  }\n\n  function onSpace() {\n    emits('space');\n  }\n\n  function focus() {\n    input.value.focus();\n  }\n\n  function toggleDropdown() {\n    if (props.disabled) return;\n    open.value = !open.value;\n  }\n\n  function clickedOutside() {\n    open.value = false;\n    dialCodeFilter.value = '';\n  }\n\n  function keyboardNav(e) {\n    if (e.keyCode === 40) { // down arrow\n      e.preventDefault();\n      open.value = true;\n      selectedIndex.value = selectedIndex.value === null ? 0 : \n        Math.min(filteredAndSortedCountries.value.length - 1, selectedIndex.value + 1);\n      nextTick(() => {\n        const selEle = list.value.children[selectedIndex.value];\n        if (selEle.offsetTop + selEle.clientHeight > list.value.scrollTop + list.value.clientHeight) {\n          list.value.scrollTop = selEle.offsetTop - list.value.clientHeight + selEle.clientHeight;\n        }\n      });\n    } else if (e.keyCode === 38) { // up arrow\n      e.preventDefault();\n      open.value = true;\n      selectedIndex.value = selectedIndex.value === null ? \n        filteredAndSortedCountries.value.length - 1 : Math.max(0, selectedIndex.value - 1);\n      nextTick(() => {\n        const selEle = list.value.children[selectedIndex.value];\n        if (selEle.offsetTop < list.value.scrollTop) {\n          list.value.scrollTop = selEle.offsetTop;\n        }\n      });\n    } else if (e.keyCode === 13) { // enter key\n      e.preventDefault();\n      if (selectedIndex.value !== null) {\n        choose(filteredAndSortedCountries.value[selectedIndex.value]);\n      }\n    } else { \n      // Поиск по названию страны\n      if (e.target.classList.contains('vti__country-code-input')) return;\n      \n      typeToFindInput.value += e.key;\n      clearTimeout(typeToFindTimer);\n      typeToFindTimer = setTimeout(() => {\n        typeToFindInput.value = '';\n      }, 700);\n      \n      nextTick(() => {\n        const typedCountryI = filteredAndSortedCountries.value\n          .slice(props.preferredCountries.length)\n          .findIndex((c) => c.name.toLowerCase().startsWith(typeToFindInput.value));\n        if (typedCountryI >= 0) {\n          selectedIndex.value = props.preferredCountries.length + typedCountryI;\n          const selEle = list.value.children[selectedIndex.value];\n          const needToScroll = selEle.offsetTop < list.value.scrollTop || \n            selEle.offsetTop + selEle.clientHeight > list.value.scrollTop + list.value.clientHeight;\n          if (needToScroll) {\n            list.value.scrollTop = selEle.offsetTop - list.value.clientHeight / 2;\n          }\n        }\n      });\n    }\n  }\n\n  function reset() {\n    selectedIndex.value = filteredAndSortedCountries.value\n      .map(c => c.iso2).indexOf(activeCountryCode.value);\n    open.value = false;\n  }\n\n  function setDropdownPosition() {\n    const spaceBelow = window.innerHeight - rootElement.value.getBoundingClientRect().bottom;\n    const hasEnoughSpaceBelow = spaceBelow > 200;\n    dropdownOpenDirection.value = hasEnoughSpaceBelow ? 'below' : 'above';\n  }\n</script>\n\n<style lang=\"scss\">\n.vue3-reactive-tel-input {\n  display: flex;\n}\n\n.vue3-reactive-tel-input.disabled .dropdown,\n.vue3-reactive-tel-input.disabled .selection,\n.vue3-reactive-tel-input.disabled input {\n  cursor: no-drop;\n}\n\n.vti__dropdown {\n  display: flex;\n  flex-direction: column;\n  align-content: center;\n  justify-content: center;\n  position: relative;\n  padding: 0.5rem;\n  cursor: pointer;\n}\n\n.vti__dropdown.show {\n  max-height: 300px;\n  overflow: scroll;\n}\n\n.vti__dropdown-list {\n  z-index: 1;\n  padding: 0;\n  margin: 0;\n  text-align: left;\n  list-style: none;\n  max-height: 200px;\n  overflow-y: scroll;\n  position: absolute;\n  left: -1px;\n  background-color: #fff;\n  width: fit-content;\n}\n\n.vti__dropdown-list.below {\n  top: 33px;\n}\n\n.vti__dropdown-list.above {\n  top: auto;\n  bottom: 100%;\n}\n\n.vti__dropdown-item {\n  cursor: pointer;\n  padding: 4px 15px;\n}\n\n.vti__dropdown-item.highlighted {\n  background-color: #f0f0f0;\n}\n\n.vti__dropdown-item.last-preferred {\n  border-bottom: 1px solid #cacaca;\n}\n\n.vti__input {\n  color: inherit;\n  border: none;\n  border-radius: 0 2px 2px 0;\n  width: 100%;\n  outline: 0;\n  padding-left: 7px;\n}\n\n.vti__country-code-input {\n  max-width: 70px;\n  border: none;\n  outline: none;\n  background: transparent;\n  font-size: inherit;\n  color: inherit;\n  text-align: center;\n}\n</style>"],"names":["parsePhoneNumberFromString","list"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0GE,QAAI,gBAAgB;AAEpB,UAAM,QAAQ;AA0Dd,UAAM,QAAQ;AAcd,UAAM,QAAQ,IAAI,MAAM,cAAc,EAAE;AACxC,UAAM,oBAAoB,IAAI,EAAE;AAChC,UAAM,gBAAgB,IAAI,EAAE;AAC5B,UAAM,iBAAiB,IAAI,EAAE;AAC7B,UAAM,OAAO,IAAI,KAAK;AACtB,UAAM,gBAAgB,IAAI,KAAK;AAC/B,UAAM,gBAAgB,IAAI,IAAI;AAC9B,UAAM,kBAAkB,IAAI,EAAE;AAC9B,UAAM,kBAAkB,IAAI,IAAI;AAChC,UAAM,wBAAwB,IAAI,OAAO;AACzC,UAAM,oBAAoB,IAAI,MAAM,gBAAgB,KAAK,MAAM,cAAc,MAAM,aAAa,WAAW;AAG3G,UAAM,cAAc,IAAI,IAAI;AAC5B,UAAM,OAAO,IAAI,IAAI;AACrB,UAAM,QAAQ,IAAI,IAAI;AAGtB,cAAU,MAAM;AACd,UAAI,MAAM,YAAY;AACpB,cAAM,QAAQ,MAAM;AAAA,MACtB;AAEA,6BAAsB;AAEtB,wBAAiB,EACd,KAAK,MAAM;AACV,YAAI,CAAC,MAAM,SAAS,MAAM,cAAc,gBAAgB,kBAAkB,OAAO;AAC/E,gBAAM,QAAQ,IAAI,kBAAkB,KAAK;AAAA,QAC3C;AAGA,YAAI,cAAc,SAAS,MAAM,gBAAgB,yBAAyB;AACxE,wBAAc,QAAQ,IAAI,cAAc,MAAM,QAAQ;AAAA,QACxD;AAEA,cAAM,YAAY,YAAY,KAAK;AAAA,MACrC,CAAC,EACA,MAAM,QAAQ,KAAK,EACnB,KAAK,MAAM;AACV,sBAAc,QAAQ;AAAA,MACxB,CAAC;AAAA,IACL,CAAC;AAGD,UAAM,gBAAgB,SAAS,MAAM;AACnC,aAAO,YAAY,kBAAkB,KAAK;AAAA,IAC5C,CAAC;AAED,UAAM,oBAAoB,SAAS,MAAM;AACvC,aAAO,cAAc,QAAQ,cAAc,MAAM,OAAO;AAAA,IAC1D,CAAC;AAED,UAAM,aAAa,SAAS,MAAM;AAChC,UAAI,MAAM,SAAS,QAAQ;AACzB,YAAI,CAAC,MAAM,SAAS,MAAM,MAAM,CAAC,MAAM,KAAK;AAC1C,iBAAO;AAAA,QACT;AACA,eAAO;AAAA,MACT;AACA,UAAI,CAAC,CAAC,iBAAiB,UAAU,EAAE,SAAS,MAAM,IAAI,GAAG;AACvD,gBAAQ,MAAM,8BAA8B;AAC5C,eAAO;AAAA,MACT;AACA,aAAO,MAAM;AAAA,IACf,CAAC;AAED,UAAM,oBAAoB,SAAS,MAAM;AACvC,UAAI,YAAY,MAAM;AAGtB,UAAI,MAAM,iBAAiB,MAAM,cAAc,QAAQ;AACrD,oBAAY,UAAU;AAAA,UAAO,CAAC,EAAE,KAAI,MAClC,MAAM,cAAc,SAAS,KAAK,YAAW,CAAE;AAAA,QACvD;AAAA,MACI,WAAW,MAAM,oBAAoB,MAAM,iBAAiB,QAAQ;AAClE,oBAAY,UAAU;AAAA,UAAO,CAAC,EAAE,KAAI,MAClC,CAAC,MAAM,iBAAiB,SAAS,KAAK,YAAW,CAAE,KACnD,CAAC,MAAM,iBAAiB,SAAS,KAAK,YAAW,CAAE;AAAA,QAC3D;AAAA,MACI;AAGA,UAAI,eAAe,OAAO;AACxB,cAAM,cAAc,eAAe,MAAM,QAAQ,KAAK,EAAE;AACxD,oBAAY,UAAU;AAAA,UAAO,aAC3B,QAAQ,SAAS,WAAW,WAAW;AAAA,QAC/C;AAAA,MACI;AAEA,aAAO;AAAA,IACT,CAAC;AAED,UAAM,6BAA6B,SAAS,MAAM;AAChD,YAAM,qBAAqB,aAAa,MAAM,kBAAkB,EAC7D,OAAO,aAAW;AACjB,YAAI,CAAC,eAAe,MAAO,QAAO;AAClC,cAAM,cAAc,eAAe,MAAM,QAAQ,KAAK,EAAE;AACxD,eAAO,QAAQ,SAAS,WAAW,WAAW;AAAA,MAChD,CAAC,EACA,IAAI,cAAY,EAAE,GAAG,SAAS,WAAW,KAAI,EAAG;AAEnD,aAAO,CAAC,GAAG,oBAAoB,GAAG,kBAAkB,KAAK;AAAA,IAC3D,CAAC;AAED,UAAM,cAAc,SAAS,MAAM;AACjC,UAAI,SAAS,CAAA;AAEb,UAAI,MAAM,QAAQ,CAAC,MAAM,KAAK;AAC5B,iBAASA,iBAA2B,MAAM,KAAK,KAAK,CAAA;AAAA,MACtD,OAAO;AACL,iBAASA,iBAA2B,MAAM,OAAO,kBAAkB,KAAK,KAAK,CAAA;AAAA,MAC/E;AAEA,YAAM,EAAE,UAAU,GAAG,aAAY,IAAK;AAEtC,UAAI,QAAQ,OAAO,UAAO;AAC1B,UAAI,YAAY,MAAM;AAEtB,UAAI,OAAO;AACT,oBAAY,OAAO,SAAS,WAAW,MAAM,eAAe,EAAE,gBAAgB,OAAO;AAAA,MACvF;AAEA,UAAI,OAAO,YAAY,MAAM,iBAAiB,UAAU,MAAM,cAAc,SAAS;AACnF,YAAI,CAAC,YAAY,OAAO,OAAO,GAAG;AAChC,kBAAQ;AACR,mBAAS,EAAE,GAAG,QAAQ,SAAS,KAAI;AAAA,QACrC;AAAA,MACF;AAEA,aAAO;AAAA,QACL,GAAG;AAAA,QACH,aAAa,OAAO;AAAA,QACpB;AAAA,QACA,SAAS,cAAc;AAAA,QACvB;AAAA,MACN;AAAA,IACE,CAAC;AAED,UAAM,UAAU,SAAS,MAAM;AAC7B,aAAO,YAAY,MAAM,UAAU,OAAO,MAAM,YACzC,YAAY,MAAM,UAAU,QAAQ,MAAM,WAAW;AAAA,IAC9D,CAAC;AAED,UAAM,SAAS,SAAS,MAAM;AAC5B,aAAO,YAAY,MAAM,UAAU,OAAO,MAAM,YACzC,YAAY,MAAM,UAAU,QAAQ,MAAM,WAAW;AAAA,IAC9D,CAAC;AAED,UAAM,WAAW,SAAS,MAAM;AAC9B,aAAO,YAAY,MAAM,UAAU,OAAO,MAAM,iBACzC,YAAY,MAAM,UAAU,QAAQ,MAAM,gBAAgB;AAAA,IACnE,CAAC;AAED,UAAM,UAAU,SAAS,MAAM;AAC7B,aAAO,YAAY,MAAM,UAAU,OAAO,MAAM,iBACzC,YAAY,MAAM,UAAU,QAAQ,MAAM,gBAAgB;AAAA,IACnE,CAAC;AAGD,UAAM,eAAe,CAAC,UAAU,aAAa;AAC3C,UAAI,CAAC,YAAY,UAAU,MAAM;AAC/B,0BAAkB,QAAQ,SAAS;AACnC;AAAA,MACF;AACA,UAAI,UAAU,MAAM;AAClB,cAAM,mBAAmB,QAAQ;AACjC,yBAAgB;AAEhB,sBAAc,QAAQ,IAAI,SAAS,QAAQ;AAAA,MAC7C;AAAA,IACF,CAAC;AAED,UAAM,MAAM,YAAY,MAAM,aAAa,CAAC,aAAa;AACvD,wBAAkB,QAAQ;AAAA,IAC5B,CAAC;AAED,UAAM,MAAM,YAAY,MAAM,OAAO,MAAM;AACzC,YAAM,YAAY,YAAY,KAAK;AAAA,IACrC,CAAC;AAED,UAAM,MAAM,YAAY,MAAM,WAAW,CAAC,aAAa;AACrD,UAAI,CAAC,MAAM,cAAc,MAAM,gBAAgB;AAC7C;AAAA,MACF;AACA,gBAAU,QAAQ;AAElB,eAAS,MAAM;AACb,YAAI,YAAY,CAAC,MAAM,YAAY;AACjC,gBAAM,QAAQ;AAAA,QAChB;AAAA,MACF,CAAC;AAAA,IACH,CAAC;AAED,UAAM,MAAM,MAAM,aAAa,aAAa,MAAM;AAChD,uBAAgB;AAAA,IAClB,CAAC;AAED,UAAM,MAAM,MAAM,YAAY,CAAC,UAAU,aAAa;AACpD,UAAI,CAAC,eAAc,GAAI;AACrB,iBAAS,MAAM;AACb,gBAAM,QAAQ;AACd,kBAAO;AAAA,QACT,CAAC;AAAA,MACH,OAAO;AACL,cAAM,QAAQ;AAAA,MAChB;AAAA,IACF,CAAC;AAED,UAAM,MAAM,CAAC,qBAAqB;AAChC,UAAI,kBAAkB;AACpB,4BAAmB;AACnB,cAAM,MAAM;AAAA,MACd,OAAO;AACL,cAAM,OAAO;AAAA,MACf;AAAA,IACF,CAAC;AAGD,aAAS,kBAAkB;AAEzB,UAAI,CAAC,cAAc,MAAM,WAAW,GAAG,GAAG;AACxC,sBAAc,QAAQ,MAAM,cAAc,MAAM,QAAQ,QAAQ,EAAE;AAAA,MACpE;AAGA,oBAAc,QAAQ,cAAc,MAAM,QAAQ,WAAW,EAAE;AAG/D,YAAM,aAAa,cAAc,MAAM,MAAM,KAAK,KAAK,CAAA,GAAI;AAC3D,UAAI,YAAY,GAAG;AACjB,sBAAc,QAAQ,MAAM,cAAc,MAAM,QAAQ,OAAO,EAAE;AAAA,MACnE;AAEA,qBAAe,QAAQ,cAAc;AACrC,WAAK,QAAQ;AAGb,YAAM,aAAa,kBAAkB,MAAM;AAAA,QAAK,aAC9C,IAAI,QAAQ,QAAQ,OAAO,cAAc;AAAA,MAC/C;AAEI,UAAI,cAAc,2BAA2B,MAAM,WAAW,GAAG;AAC/D,eAAO,UAAU;AAAA,MACnB;AAAA,IACF;AAEA,aAAS,iBAAiB;AACxB,iBAAW,MAAM;AACf,YAAI,CAAC,cAAc,SAAS,cAAc,OAAO;AAC/C,wBAAc,QAAQ,IAAI,cAAc,MAAM,QAAQ;AAAA,QACxD;AAAA,MACF,GAAG,GAAG;AAAA,IACR;AAEA,aAAS,eAAe;AACtB,UAAI,CAAC,MAAM,UAAU;AACnB,aAAK,QAAQ;AAAA,MACf;AAAA,IACF;AAEA,aAAS,iBAAiB,MAAM,KAAK;AACnC,UAAI,KAAK,mBAAmB;AAC1B,aAAK,MAAK;AACV,aAAK,kBAAkB,KAAK,GAAG;AAAA,MACjC,WAAW,KAAK,iBAAiB;AAC/B,cAAM,QAAQ,KAAK,gBAAe;AAClC,cAAM,SAAS,IAAI;AACnB,cAAM,QAAQ,aAAa,GAAG;AAC9B,cAAM,UAAU,aAAa,GAAG;AAChC,cAAM,OAAM;AAAA,MACd;AAAA,IACF;AAEA,aAAS,mBAAmB;AAC1B,wBAAkB,QAAQ,MAAM,aAAa;AAAA,IAC/C;AAEA,aAAS,oBAAoB;AAC3B,aAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,YAAI,MAAM,QAAQ,CAAC,MAAM,KAAK;AAC5B;AACA;AAAA,QACF;AAEA,YAAI,MAAM,gBAAgB;AACxB,iBAAO,MAAM,cAAc;AAC3B;AACA;AAAA,QACF;AAEA,cAAM,kBAAkB,MAAM,mBAAmB,CAAC,KAAK,kBAAkB,MAAM,CAAC;AAEhF,YAAI,MAAM,oBAAoB;AAC5B,gBAAM,oBAAoB,EACvB,KAAK,CAAC,aAAa,SAAS,KAAI,CAAE,EAClC,KAAK,CAAC,aAAa;AAClB,kBAAM,UAAU,YAAY,IAAI,SAAQ;AACxC,gBAAI,CAAC,UAAU,OAAO,CAAC,MAAM,KAAK;AAChC,oBAAM,IAAI,MAAM,6BAA6B;AAAA,YAC/C;AACA,mBAAO,OAAO,OAAO,GAAG,CAAC;AAAA,UAC3B,CAAC,EACA,KAAK,CAAC,QAAQ;AACb,mBAAO,OAAO,kBAAkB,KAAK;AAAA,UACvC,CAAC,EACA,MAAM,CAAC,UAAU;AAChB,oBAAQ,KAAK,KAAK;AAClB,mBAAO,eAAe;AAAA,UACxB,CAAC,EACA,QAAQ,MAAM;AACb;UACF,CAAC;AAAA,QACL,OAAO;AACL,iBAAO,eAAe;AACtB,kBAAO;AAAA,QACT;AAAA,MACF,CAAC;AAAA,IACH;AAEA,aAAS,aAAaC,QAAO,IAAI;AAC/B,aAAOA,MAAK,IAAI,CAAC,gBAAgB,YAAY,WAAW,CAAC,EAAE,OAAO,OAAO;AAAA,IAC3E;AAEA,aAAS,YAAY,MAAM,IAAI;AAC7B,aAAO,kBAAkB,MAAM,KAAK,CAAC,YAAY,QAAQ,SAAS,IAAI,aAAa;AAAA,IACrF;AAEA,aAAS,aAAa,OAAO,MAAM;AACjC,YAAM,cAAc,cAAc,UAAU;AAC5C,YAAM,gBAAgB,UAAU,MAAM,mBAAmB,SAAS;AAClE,YAAM,YAAY,MAAM,mBAAmB,KAAK,CAAC,MAAM,EAAE,YAAW,MAAO,IAAI;AAC/E,aAAO,EAAE,aAAa,kBAAkB,eAAe,UAAS;AAAA,IAClE;AAEA,aAAS,OAAO,SAAS;AACvB,UAAI,gBAAgB,OAAO,YAAY,WAAW,YAAY,OAAO,IAAI;AACzE,UAAI,CAAC,cAAe;AAEpB,UAAI,MAAM,QAAQ,CAAC,MAAM,OAAO,cAAc,QAAQ,YAAY,MAAM,gBAAgB;AACtF,0BAAkB,QAAQ,cAAc;AACxC,cAAM,QAAQD;AAAAA,UACZ,YAAY,MAAM;AAAA,UAClB,cAAc;AAAA,QACtB,EAAQ,oBAAmB;AAAA,MACvB,OAAO;AACL,0BAAkB,QAAQ,cAAc;AAAA,MAC1C;AAEA,oBAAc,QAAQ,IAAI,cAAc,QAAQ;AAChD,qBAAe,QAAQ;AAGvB,WAAK,QAAQ;AAGb,eAAS,MAAM;AACb,YAAI,MAAM,OAAO;AACf,gBAAM,MAAM,MAAK;AAAA,QACnB;AAAA,MACF,CAAC;AAED,gBAAU,MAAM,KAAK;AAAA,IACvB;AAEA,aAAS,yBAAyB;AAChC,YAAM,eAAe,MAAM;AAE3B,UAAI,MAAM,qBAAqB;AAC7B,cAAM,UAAU,MAAM,MAAM,MAAM,gBAAgB;AAClD,cAAM,QAAQ,QAAQ,KAAK,EAAE;AAAA,MAC/B;AAEA,UAAI,MAAM,kBAAkB,MAAM,0BAA0B,QAAQ;AAClE,cAAM,UAAU,MAAM,MAAM,MAAM,MAAM,cAAc;AACtD,cAAM,QAAQ,UAAU,QAAQ,KAAK,EAAE,IAAI;AAAA,MAC7C;AAEA,UAAI,iBAAiB,MAAM,OAAO;AAChC,kBAAU,MAAM,KAAK;AAAA,MACvB;AAAA,IACF;AAEA,aAAS,iBAAiB;AACxB,UAAI,MAAM,qBAAqB;AAC7B,cAAM,SAAS,kBAAkB,KAAK,MAAM,KAAK;AACjD,YAAI,CAAC,OAAQ,QAAO;AAAA,MACtB;AACA,UAAI,MAAM,gBAAgB;AACxB,eAAO,mBAAkB;AAAA,MAC3B;AACA,aAAO;AAAA,IACT;AAEA,aAAS,qBAAqB;AAC5B,aAAO,MAAM,0BAA0B,SAAS,MAAM,eAAe,KAAK,MAAM,KAAK,IAAI;AAAA,IAC3F;AAEA,aAAS,UAAU;AACjB,YAAM,MAAM,kBAAkB,YAAY,QAAQ,KAAK,MAAM,UAAU;AACvE,gBAAU,MAAM,KAAK;AAAA,IACvB;AAEA,aAAS,UAAU,OAAO;AACxB,YAAM,qBAAqB,KAAK;AAEhC,UAAI,YAAY,MAAM,OAAO;AAC3B,cAAM,UAAU,YAAY,MAAM,MAAM;AACxC,cAAM,WAAW,YAAY,MAAM,MAAM;AAAA,MAC3C,OAAO;AACL,cAAM,WAAW,IAAI;AAAA,MACvB;AAAA,IACF;AAEA,aAAS,SAAS;AAChB,YAAM,MAAM;AAAA,IACd;AAEA,aAAS,UAAU;AACjB,uBAAiB,MAAM,OAAO,MAAM,MAAM,MAAM;AAChD,YAAM,OAAO;AAAA,IACf;AAEA,aAAS,UAAU;AACjB,YAAM,OAAO;AAAA,IACf;AAEA,aAAS,UAAU;AACjB,YAAM,OAAO;AAAA,IACf;AAWA,aAAS,iBAAiB;AACxB,WAAK,QAAQ;AACb,qBAAe,QAAQ;AAAA,IACzB;AAEA,aAAS,YAAY,GAAG;AACtB,UAAI,EAAE,YAAY,IAAI;AACpB,UAAE,eAAc;AAChB,aAAK,QAAQ;AACb,sBAAc,QAAQ,cAAc,UAAU,OAAO,IACnD,KAAK,IAAI,2BAA2B,MAAM,SAAS,GAAG,cAAc,QAAQ,CAAC;AAC/E,iBAAS,MAAM;AACb,gBAAM,SAAS,KAAK,MAAM,SAAS,cAAc,KAAK;AACtD,cAAI,OAAO,YAAY,OAAO,eAAe,KAAK,MAAM,YAAY,KAAK,MAAM,cAAc;AAC3F,iBAAK,MAAM,YAAY,OAAO,YAAY,KAAK,MAAM,eAAe,OAAO;AAAA,UAC7E;AAAA,QACF,CAAC;AAAA,MACH,WAAW,EAAE,YAAY,IAAI;AAC3B,UAAE,eAAc;AAChB,aAAK,QAAQ;AACb,sBAAc,QAAQ,cAAc,UAAU,OAC5C,2BAA2B,MAAM,SAAS,IAAI,KAAK,IAAI,GAAG,cAAc,QAAQ,CAAC;AACnF,iBAAS,MAAM;AACb,gBAAM,SAAS,KAAK,MAAM,SAAS,cAAc,KAAK;AACtD,cAAI,OAAO,YAAY,KAAK,MAAM,WAAW;AAC3C,iBAAK,MAAM,YAAY,OAAO;AAAA,UAChC;AAAA,QACF,CAAC;AAAA,MACH,WAAW,EAAE,YAAY,IAAI;AAC3B,UAAE,eAAc;AAChB,YAAI,cAAc,UAAU,MAAM;AAChC,iBAAO,2BAA2B,MAAM,cAAc,KAAK,CAAC;AAAA,QAC9D;AAAA,MACF,OAAO;AAEL,YAAI,EAAE,OAAO,UAAU,SAAS,yBAAyB,EAAG;AAE5D,wBAAgB,SAAS,EAAE;AAC3B,qBAAa,eAAe;AAC5B,0BAAkB,WAAW,MAAM;AACjC,0BAAgB,QAAQ;AAAA,QAC1B,GAAG,GAAG;AAEN,iBAAS,MAAM;AACb,gBAAM,gBAAgB,2BAA2B,MAC9C,MAAM,MAAM,mBAAmB,MAAM,EACrC,UAAU,CAAC,MAAM,EAAE,KAAK,YAAW,EAAG,WAAW,gBAAgB,KAAK,CAAC;AAC1E,cAAI,iBAAiB,GAAG;AACtB,0BAAc,QAAQ,MAAM,mBAAmB,SAAS;AACxD,kBAAM,SAAS,KAAK,MAAM,SAAS,cAAc,KAAK;AACtD,kBAAM,eAAe,OAAO,YAAY,KAAK,MAAM,aACjD,OAAO,YAAY,OAAO,eAAe,KAAK,MAAM,YAAY,KAAK,MAAM;AAC7E,gBAAI,cAAc;AAChB,mBAAK,MAAM,YAAY,OAAO,YAAY,KAAK,MAAM,eAAe;AAAA,YACtE;AAAA,UACF;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AAEA,aAAS,QAAQ;AACf,oBAAc,QAAQ,2BAA2B,MAC9C,IAAI,OAAK,EAAE,IAAI,EAAE,QAAQ,kBAAkB,KAAK;AACnD,WAAK,QAAQ;AAAA,IACf;AAEA,aAAS,sBAAsB;AAC7B,YAAM,aAAa,OAAO,cAAc,YAAY,MAAM,sBAAqB,EAAG;AAClF,YAAM,sBAAsB,aAAa;AACzC,4BAAsB,QAAQ,sBAAsB,UAAU;AAAA,IAChE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"FieldPhone.vue.js","sources":["../../../../../src/components/FieldPhone/FieldPhone.vue"],"sourcesContent":["<template>\n  <div \n    :class=\"[\n      rootClass, \n      classes,\n      $attrs.class, \n      { 'bg-fourth-nano': validation }, \n      { disabled: disabled }\n    ]\" \n    :style=\"[rootStyle, styles]\" \n    ref=\"rootElement\"\n    class=\"field-wrapper vue3-reactive-tel-input\"\n  >\n    <div\n      v-click-outside=\"clickedOutside\"\n      :class=\"['vti__dropdown', { open: open }]\"\n      :style=\"[dropdownStyle]\"\n      :tabindex=\"dropdownOptions.tabindex\"\n      @keydown.esc=\"reset\"\n      class=\"br-black-transp-10 br-1px radius-thin\"\n    >\n      <span class=\"flex-nowrap flex flex-v-center p-regular vti__selection\">\n        <span v-if=\"dropdownOptions.showFlags\" v-html=\"activeCountryFlag\" class=\"mn-r-nano\" />\n        \n        <!-- Новый инпут для ввода кода страны -->\n        <input\n          v-if=\"dropdownOptions.showDialCodeInSelection\"\n          v-model=\"dialCodeInput\"\n          @input=\"onDialCodeInput\"\n          @focus=\"openDropdown\"\n          @blur=\"onDialCodeBlur\"\n          @keydown=\"keyboardNav\"\n          type=\"text\"\n          class=\"vti__country-code-input\"\n          :placeholder=\"`+${activeCountry?.dialCode || ''}`\"\n          :disabled=\"disabled\"\n          :size=\"Math.max((dialCodeInput?.length || 0) + 1, 3)\"\n          maxlength=\"5\"\n        />\n\n      </span>\n      \n      <ul \n        ref=\"list\" \n        class=\"bs-black radius-small vti__dropdown-list\"\n        v-show=\"open\" \n        :class=\"dropdownOpenDirection\"\n        :style=\"[listStyle]\"\n      >\n        <li\n          v-for=\"(pb, index) in filteredAndSortedCountries\"\n          class=\"flex-nowrap flex w-max\"\n          :class=\"['vti__dropdown-item', getItemClass(index, pb.iso2)]\"\n          :key=\"pb.iso2 + (pb.preferred ? '-preferred' : '')\"\n          @click=\"choose(pb)\"\n          @mousemove=\"selectedIndex = index\"\n        >\n          <span v-if=\"dropdownOptions.showFlags\" v-html=\"pb.flag\" class=\"mn-r-thin\"/>\n          <strong>{{ pb.name }}</strong>\n          <span v-if=\"dropdownOptions.showDialCodeInList\"> +{{ pb.dialCode }} </span>\n        </li>\n      </ul>\n    </div>\n    \n    <input\n      v-model=\"phone\"\n      inputmode=\"numeric\" \n      pattern=\"\\d*\"\n      ref=\"input\"\n      :type=\"inputOptions.type\"\n      :autocomplete=\"inputOptions.autocomplete\"\n      :autofocus=\"inputOptions.autofocus\"\n      :class=\"['vti__input', inputOptions.styleClasses, inputClass, Iclasses]\"\n      :style=\"[inputStyle, Istyles]\"\n      :disabled=\"disabled\"\n      :id=\"inputId !== '' ? inputId : inputOptions.id\"\n      :maxlength=\"inputOptions.maxlength\"\n      :name=\"inputId !== '' ? inputId : inputOptions.name\"\n      :placeholder=\"parsedPlaceholder\"\n      :readonly=\"inputOptions.readonly\"\n      :required=\"inputOptions.required\"\n      :tabindex=\"inputOptions.tabindex\"\n      @blur=\"onBlur\"\n      @focus=\"onFocus\"\n      @input=\"onInput\"\n      @keyup.enter=\"onEnter\"\n      @keyup.space=\"onSpace\"\n    />\n    <slot></slot>\n  </div>\n  \n  <!-- Validation -->\n  <transition name=\"fade\">\n    <div v-if=\"validation\" class=\"mn-t-thin mn-b-thin invalid-feedback\">\n      * {{validation.message}}\n    </div>\n  </transition>\n</template>\n\n<script setup>\n  import { ref, reactive, watch, computed, onMounted, nextTick } from 'vue';\n  import { parsePhoneNumberFromString } from 'libphonenumber-js';\n\n  import clickOutside from './click-outside.js';\n  import allCountries from './all-countries.js';\n\n  let vClickOutside = clickOutside\n\n  const props = defineProps({\n    modelValue: { type: String, default: '' },\n    badClass: { type: [String, Array, Object], default: '' },\n    goodClass: { type: [String, Array, Object], default: '' },\n    badStyle: { type: [String, Array, Object], default: '' },\n    goodStyle: { type: [String, Array, Object], default: '' },\n    badInputClass: { type: [String, Array, Object], default: '' },\n    goodInputClass: { type: [String, Array, Object], default: '' },\n    badInputStyle: { type: [String, Array, Object], default: '' },\n    goodInputStyle: { type: [String, Array, Object], default: '' },\n    allCountries: { type: Array, default: () => allCountries },\n    autoFormat: { type: Boolean, default: true },\n    validation: { type: [Boolean, Object], default: false },\n    customValidate: { type: [Boolean, RegExp], default: false },\n    defaultCountry: { type: String, default: '' },\n    disabled: { type: Boolean, default: false },\n    autoDefaultCountry: { type: Boolean, default: true },\n    ignoredCountries: { type: Array, default: () => [] },\n    invalidMsg: { type: String, default: '' },\n    mode: { type: String, default: 'auto' },\n    onlyCountries: { type: Array, default: () => [] },\n    preferredCountries: { type: Array, default: () => [] },\n    validCharactersOnly: { type: Boolean, default: false },\n    rootClass: { type: [String, Array, Object], default: '' },\n    inputClass: { type: [String, Array, Object], default: '' },\n    rootStyle: { type: [String, Array, Object], default: '' },\n    dropdownStyle: { type: [String, Array, Object], default: '' },\n    listStyle: { type: [String, Array, Object], default: '' },\n    inputStyle: { type: [String, Array, Object], default: '' },\n    inputId: { type: [String, Array, Object], default: '' },\n    Placeholder: { type: [String, Object, Function], default: '' },\n    dropdownOptions: { \n      type: Object, \n      default: () => ({\n        showDialCodeInList: true,\n        showDialCodeInSelection: false,\n        showFlags: true,\n        tabindex: 0\n      })\n    },\n    inputOptions: { \n      type: Object, \n      default: () => ({ \n        autocomplete: 'on',\n        autofocus: false,\n        id: '',\n        maxlength: 25,\n        name: 'telephone',\n        placeholder: 'Enter a phone number',\n        readonly: false,\n        required: false,\n        tabindex: 0,\n        type: 'tel',\n        styleClasses: ''\n      })\n    },\n  });\n\n  const emits = defineEmits([\n    'update:modelValue', \n    'change',\n    'validate', \n    'country-changed', \n    'open', \n    'close', \n    'blur', \n    'focus', \n    'enter', \n    'space'\n  ]);\n\n  // Reactive data\n  const phone = ref(props.modelValue || '');\n  const activeCountryCode = ref('');\n  const dialCodeInput = ref('');\n  const dialCodeFilter = ref('');\n  const open = ref(false);\n  const finishMounted = ref(false);\n  const selectedIndex = ref(null);\n  const typeToFindInput = ref('');\n  const typeToFindTimer = ref(null);\n  const dropdownOpenDirection = ref('below');\n  const parsedPlaceholder = ref(props.Placeholder !== '' ? props.Placeholder : props.inputOptions.placeholder);\n\n  // Element refs\n  const rootElement = ref(null);\n  const list = ref(null);\n  const input = ref(null);\n\n  // Lifecycle hooks\n  onMounted(() => {\n    if (props.modelValue) {\n      phone.value = props.modelValue;\n    }\n\n    cleanInvalidCharacters();\n\n    initializeCountry()\n      .then(() => {\n        if (!phone.value && props.inputOptions?.showDialCode && activeCountryCode.value) {\n          phone.value = `+${activeCountryCode.value}`;\n        }\n        \n        // Инициализируем dialCodeInput\n        if (activeCountry.value && props.dropdownOptions.showDialCodeInSelection) {\n          dialCodeInput.value = `+${activeCountry.value.dialCode}`;\n        }\n        \n        emits('validate', phoneObject.value);\n      })\n      .catch(console.error)\n      .then(() => {\n        finishMounted.value = true;\n      });\n  });\n\n  // Computed properties\n  const activeCountry = computed(() => {\n    return findCountry(activeCountryCode.value);\n  });\n\n  const activeCountryFlag = computed(() => {\n    return activeCountry.value ? activeCountry.value.flag : null;\n  });\n\n  const parsedMode = computed(() => {\n    if (props.mode === 'auto') {\n      if (!phone.value || phone.value[0] !== '+') {\n        return 'national';\n      }\n      return 'international';\n    }\n    if (!['international', 'national'].includes(props.mode)) {\n      console.error('Invalid value of prop \"mode\"');\n      return 'international';\n    }\n    return props.mode;\n  });\n\n  const filteredCountries = computed(() => {\n    let countries = props.allCountries;\n\n    // Фильтрация по onlyCountries/ignoredCountries\n    if (props.onlyCountries && props.onlyCountries.length) {\n      countries = countries.filter(({ iso2 }) => \n        props.onlyCountries.includes(iso2.toUpperCase())\n      );\n    } else if (props.ignoredCountries && props.ignoredCountries.length) {\n      countries = countries.filter(({ iso2 }) =>\n        !props.ignoredCountries.includes(iso2.toUpperCase()) && \n        !props.ignoredCountries.includes(iso2.toLowerCase())\n      );\n    }\n\n    // Фильтрация по введенному коду страны\n    if (dialCodeFilter.value) {\n      const filterValue = dialCodeFilter.value.replace('+', '');\n      countries = countries.filter(country => \n        country.dialCode.startsWith(filterValue)\n      );\n    }\n\n    return countries;\n  });\n\n  const filteredAndSortedCountries = computed(() => {\n    const preferredCountries = getCountries(props.preferredCountries)\n      .filter(country => {\n        if (!dialCodeFilter.value) return true;\n        const filterValue = dialCodeFilter.value.replace('+', '');\n        return country.dialCode.startsWith(filterValue);\n      })\n      .map(country => ({ ...country, preferred: true }));\n\n    return [...preferredCountries, ...filteredCountries.value];\n  });\n\n  const phoneObject = computed(() => {\n    let result = {};\n\n    if (phone.value?.[0] === '+') {\n      result = parsePhoneNumberFromString(phone.value) || {};\n    } else {\n      result = parsePhoneNumberFromString(phone.value, activeCountryCode.value) || {};\n    }\n\n    const { metadata, ...phoneDetails } = result;\n\n    let valid = result.isValid?.();\n    let formatted = phone.value;\n\n    if (valid) {\n      formatted = result.format?.(parsedMode.value.toUpperCase(), { nationalPrefix: false });\n    }\n\n    if (result.country && (props.ignoredCountries.length || props.onlyCountries.length)) {\n      if (!findCountry(result.country)) {\n        valid = false;\n        result = { ...result, country: null };\n      }\n    }\n\n    return {\n      ...phoneDetails,\n      countryCode: result.country,\n      valid,\n      country: activeCountry.value,\n      formatted,\n    };\n  });\n\n  const classes = computed(() => {\n    return phoneObject.value.valid === true ? props.goodClass : \n           phoneObject.value.valid === false ? props.badClass : undefined;\n  });\n\n  const styles = computed(() => {\n    return phoneObject.value.valid === true ? props.goodStyle : \n           phoneObject.value.valid === false ? props.badStyle : undefined;\n  });\n\n  const Iclasses = computed(() => {\n    return phoneObject.value.valid === true ? props.goodInputClass : \n           phoneObject.value.valid === false ? props.badInputClass : undefined;\n  });\n\n  const Istyles = computed(() => {\n    return phoneObject.value.valid === true ? props.goodInputStyle : \n           phoneObject.value.valid === false ? props.badInputStyle : undefined;\n  });\n\n  // Watchers\n  watch(activeCountry, (newValue, oldValue) => {\n    if (!newValue && oldValue?.iso2) {\n      activeCountryCode.value = oldValue.iso2;\n      return;\n    }\n    if (newValue?.iso2) {\n      emits('country-changed', newValue);\n      resetPlaceholder();\n      // Обновляем dialCodeInput при смене страны\n      dialCodeInput.value = `+${newValue.dialCode}`;\n    }\n  });\n\n  watch(() => phoneObject.value.countryCode, (newValue) => {\n    activeCountryCode.value = newValue;\n  });\n\n  watch(() => phoneObject.value.valid, () => {\n    emits('validate', phoneObject.value);\n  });\n\n  watch(() => phoneObject.value.formatted, (newValue) => {\n    if (!props.autoFormat || props.customValidate) {\n      return;\n    }\n    emitInput(newValue);\n\n    nextTick(() => {\n      if (newValue && !props.modelValue) {\n        phone.value = newValue;\n      }\n    });\n  });\n\n  watch(() => props.inputOptions.placeholder, () => {\n    resetPlaceholder();\n  });\n\n  watch(() => props.modelValue, (newValue, oldValue) => {\n    if (!testCharacters()) {\n      nextTick(() => {\n        phone.value = oldValue;\n        onInput();\n      });\n    } else {\n      phone.value = newValue;\n    }\n  });\n\n  watch(open, (isDropdownOpened) => {\n    if (isDropdownOpened) {\n      setDropdownPosition();\n      emits('open');\n    } else {\n      emits('close');\n    }\n  });\n\n  // Methods\n  function onDialCodeInput() {\n    // Убеждаемся, что символ + всегда есть в начале\n    if (!dialCodeInput.value.startsWith('+')) {\n      dialCodeInput.value = '+' + dialCodeInput.value.replace(/^\\+*/, '');\n    }\n    \n    // Разрешаем только + и цифры\n    dialCodeInput.value = dialCodeInput.value.replace(/[^+\\d]/g, '');\n    \n    // Убеждаемся что + только в начале\n    const plusCount = (dialCodeInput.value.match(/\\+/g) || []).length;\n    if (plusCount > 1) {\n      dialCodeInput.value = '+' + dialCodeInput.value.replace(/\\+/g, '');\n    }\n    \n    dialCodeFilter.value = dialCodeInput.value;\n    open.value = true;\n    \n    // Автовыбор страны если код точно совпадает\n    const exactMatch = filteredCountries.value.find(country => \n      `+${country.dialCode}` === dialCodeInput.value\n    );\n    \n    if (exactMatch && filteredAndSortedCountries.value.length === 1) {\n      choose(exactMatch);\n    }\n  }\n\n  function onDialCodeBlur() {\n    setTimeout(() => {\n      if (!dialCodeInput.value && activeCountry.value) {\n        dialCodeInput.value = `+${activeCountry.value.dialCode}`;\n      }\n    }, 200);\n  }\n\n  function openDropdown() {\n    if (!props.disabled) {\n      open.value = true;\n    }\n  }\n\n  function setCaretPosition(ctrl, pos) {\n    if (ctrl.setSelectionRange) {\n      ctrl.focus();\n      ctrl.setSelectionRange(pos, pos);\n    } else if (ctrl.createTextRange) {\n      const range = ctrl.createTextRange();\n      range.collapse(true);\n      range.moveEnd('character', pos);\n      range.moveStart('character', pos);\n      range.select();\n    }\n  }\n\n  function resetPlaceholder() {\n    parsedPlaceholder.value = props.inputOptions.placeholder;\n  }\n\n  function initializeCountry() {\n    return new Promise((resolve) => {\n      if (phone.value?.[0] === '+') { \n        resolve(); \n        return; \n      }\n      \n      if (props.defaultCountry) { \n        choose(props.defaultCountry); \n        resolve(); \n        return; \n      }\n      \n      const fallbackCountry = props.preferredCountries[0] || filteredCountries.value[0];\n      \n      if (props.autoDefaultCountry) {\n        fetch('https://ip2c.org/s')\n          .then((response) => response.text())\n          .then((response) => {\n            const result = (response || '').toString();\n            if (!result || result[0] !== '1') {\n              throw new Error('unable to fetch the country');\n            }\n            return result.substr(2, 2);\n          })\n          .then((res) => { \n            choose(res || activeCountryCode.value); \n          })\n          .catch((error) => { \n            console.warn(error); \n            choose(fallbackCountry); \n          })\n          .finally(() => { \n            resolve(); \n          });\n      } else {\n        choose(fallbackCountry);\n        resolve();\n      }\n    });\n  }\n\n  function getCountries(list = []) {\n    return list.map((countryCode) => findCountry(countryCode)).filter(Boolean);\n  }\n\n  function findCountry(iso = '') {\n    return filteredCountries.value.find((country) => country.iso2 === iso.toUpperCase());\n  }\n\n  function getItemClass(index, iso2) {\n    const highlighted = selectedIndex.value === index;\n    const lastPreferred = index === props.preferredCountries.length - 1;\n    const preferred = props.preferredCountries.some((c) => c.toUpperCase() === iso2);\n    return { highlighted, 'last-preferred': lastPreferred, preferred };\n  }\n\n  function choose(country) {\n    let parsedCountry = typeof country === 'string' ? findCountry(country) : country;\n    if (!parsedCountry) return;\n    \n    if (phone.value?.[0] === '+' && parsedCountry.iso2 && phoneObject.value.nationalNumber) {\n      activeCountryCode.value = parsedCountry.iso2;\n      phone.value = parsePhoneNumberFromString(\n        phoneObject.value.nationalNumber, \n        parsedCountry.iso2\n      ).formatInternational();\n    } else {\n      activeCountryCode.value = parsedCountry.iso2;\n    }\n\n    dialCodeInput.value = `+${parsedCountry.dialCode}`;\n    dialCodeFilter.value = '';\n    \n    // Закрываем дропдаун\n    open.value = false;\n    \n    // Переводим фокус на основной инпут\n    nextTick(() => {\n      if (input.value) {\n        input.value.focus();\n      }\n    });\n    \n    emitInput(phone.value);\n  }\n\n  function cleanInvalidCharacters() {\n    const currentPhone = phone.value;\n\n    if (props.validCharactersOnly) {\n      const results = phone.value.match(/[()\\-+0-9\\s]*/g);\n      phone.value = results.join('');\n    }\n\n    if (props.customValidate && props.customValidate instanceof RegExp) {\n      const results = phone.value.match(props.customValidate);\n      phone.value = results ? results.join('') : '';\n    }\n\n    if (currentPhone !== phone.value) {\n      emitInput(phone.value);\n    }\n  }\n\n  function testCharacters() {\n    if (props.validCharactersOnly) {\n      const result = /^[()\\-+0-9\\s]*$/.test(phone.value);\n      if (!result) return false;\n    }\n    if (props.customValidate) {\n      return testCustomValidate();\n    }\n    return true;\n  }\n\n  function testCustomValidate() {\n    return props.customValidate instanceof RegExp ? props.customValidate.test(phone.value) : false;\n  }\n\n  function onInput() {\n    input.value.setCustomValidity(phoneObject.valid ? '' : props.invalidMsg);\n    emitInput(phone.value);\n  }\n\n  function emitInput(value) {\n    emits('update:modelValue', value);\n\n    if (phoneObject.value.valid) { \n      emits('change', phoneObject.value.number);\n      emits('country', phoneObject.value.number);\n    } else {\n      emits('country', null);\n    }\n  }\n\n  function onBlur() {\n    emits('blur');\n  }\n\n  function onFocus() {\n    setCaretPosition(input.value, phone.value.length);\n    emits('focus');\n  }\n\n  function onEnter() {\n    emits('enter');\n  }\n\n  function onSpace() {\n    emits('space');\n  }\n\n  function focus() {\n    input.value.focus();\n  }\n\n  function toggleDropdown() {\n    if (props.disabled) return;\n    open.value = !open.value;\n  }\n\n  function clickedOutside() {\n    open.value = false;\n    dialCodeFilter.value = '';\n  }\n\n  function keyboardNav(e) {\n    if (e.keyCode === 40) { // down arrow\n      e.preventDefault();\n      open.value = true;\n      selectedIndex.value = selectedIndex.value === null ? 0 : \n        Math.min(filteredAndSortedCountries.value.length - 1, selectedIndex.value + 1);\n      nextTick(() => {\n        const selEle = list.value.children[selectedIndex.value];\n        if (selEle.offsetTop + selEle.clientHeight > list.value.scrollTop + list.value.clientHeight) {\n          list.value.scrollTop = selEle.offsetTop - list.value.clientHeight + selEle.clientHeight;\n        }\n      });\n    } else if (e.keyCode === 38) { // up arrow\n      e.preventDefault();\n      open.value = true;\n      selectedIndex.value = selectedIndex.value === null ? \n        filteredAndSortedCountries.value.length - 1 : Math.max(0, selectedIndex.value - 1);\n      nextTick(() => {\n        const selEle = list.value.children[selectedIndex.value];\n        if (selEle.offsetTop < list.value.scrollTop) {\n          list.value.scrollTop = selEle.offsetTop;\n        }\n      });\n    } else if (e.keyCode === 13) { // enter key\n      e.preventDefault();\n      if (selectedIndex.value !== null) {\n        choose(filteredAndSortedCountries.value[selectedIndex.value]);\n      }\n    } else { \n      // Поиск по названию страны\n      if (e.target.classList.contains('vti__country-code-input')) return;\n      \n      typeToFindInput.value += e.key;\n      clearTimeout(typeToFindTimer);\n      typeToFindTimer = setTimeout(() => {\n        typeToFindInput.value = '';\n      }, 700);\n      \n      nextTick(() => {\n        const typedCountryI = filteredAndSortedCountries.value\n          .slice(props.preferredCountries.length)\n          .findIndex((c) => c.name.toLowerCase().startsWith(typeToFindInput.value));\n        if (typedCountryI >= 0) {\n          selectedIndex.value = props.preferredCountries.length + typedCountryI;\n          const selEle = list.value.children[selectedIndex.value];\n          const needToScroll = selEle.offsetTop < list.value.scrollTop || \n            selEle.offsetTop + selEle.clientHeight > list.value.scrollTop + list.value.clientHeight;\n          if (needToScroll) {\n            list.value.scrollTop = selEle.offsetTop - list.value.clientHeight / 2;\n          }\n        }\n      });\n    }\n  }\n\n  function reset() {\n    selectedIndex.value = filteredAndSortedCountries.value\n      .map(c => c.iso2).indexOf(activeCountryCode.value);\n    open.value = false;\n  }\n\n  function setDropdownPosition() {\n    const spaceBelow = window.innerHeight - rootElement.value.getBoundingClientRect().bottom;\n    const hasEnoughSpaceBelow = spaceBelow > 200;\n    dropdownOpenDirection.value = hasEnoughSpaceBelow ? 'below' : 'above';\n  }\n</script>\n\n<style lang=\"scss\">\n.vue3-reactive-tel-input {\n  display: flex;\n}\n\n.vue3-reactive-tel-input.disabled .dropdown,\n.vue3-reactive-tel-input.disabled .selection,\n.vue3-reactive-tel-input.disabled input {\n  cursor: no-drop;\n}\n\n.vti__dropdown {\n  display: flex;\n  flex-direction: column;\n  align-content: center;\n  justify-content: center;\n  position: relative;\n  padding: 0.5rem;\n  cursor: pointer;\n}\n\n.vti__dropdown.show {\n  max-height: 300px;\n  overflow: scroll;\n}\n\n.vti__dropdown-list {\n  z-index: 1;\n  padding: 0;\n  margin: 0;\n  text-align: left;\n  list-style: none;\n  max-height: 200px;\n  overflow-y: scroll;\n  position: absolute;\n  left: -1px;\n  background-color: #fff;\n  width: fit-content;\n}\n\n.vti__dropdown-list.below {\n  top: 33px;\n}\n\n.vti__dropdown-list.above {\n  top: auto;\n  bottom: 100%;\n}\n\n.vti__dropdown-item {\n  cursor: pointer;\n  padding: 4px 15px;\n}\n\n.vti__dropdown-item.highlighted {\n  background-color: #f0f0f0;\n}\n\n.vti__dropdown-item.last-preferred {\n  border-bottom: 1px solid #cacaca;\n}\n\n.vti__input {\n  color: inherit;\n  border: none;\n  border-radius: 0 2px 2px 0;\n  width: 100%;\n  outline: 0;\n  padding-left: 7px;\n}\n\n.vti__country-code-input {\n  max-width: 70px;\n  border: none;\n  outline: none;\n  background: transparent;\n  font-size: inherit;\n  color: inherit;\n  text-align: center;\n}\n</style>"],"names":["parsePhoneNumberFromString","list"],"mappings":"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"}

package/dist/martyrs/src/components/FieldTags/BlockTags.vue.js

@@ -81,7 +81,7 @@ const _sfc_main = {
         filteredSuggestedItems.value.length > 0 ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(filteredSuggestedItems.value, (tag2, index) => {
           return openBlock(), createElementBlock("span", {
             onClick: ($event) => addTag(tag2),
-            class: normalizeClass(["cursor-pointer t-medium ti-tag-toDefactor", { "mn-r-micro": index !== filteredSuggestedItems.value.length - 1 }])
+            class: normalizeClass(["cursor-pointer fw-medium ti-tag-toDefactor", { "mn-r-micro": index !== filteredSuggestedItems.value.length - 1 }])
           }, toDisplayString(tag2.text), 11, _hoisted_1);
         }), 256)) : (openBlock(), createElementBlock("span", _hoisted_2, "You added all suggested tags"))
       ]);

package/dist/martyrs/src/components/FieldTags/BlockTags.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockTags.vue.js","sources":["../../../../../src/components/FieldTags/BlockTags.vue"],"sourcesContent":["<template>\n  <div>\n    <FieldTags\n      v-model=\"selectedTags\"\n      :autocomplete-items=\"filteredItems\"\n      :add-on-key=\"[13, ':', ';', ',']\"\n      :separators=\"[';', ',']\"\n      :max-tags=\"20\"\n      :maxlength=\"20\"\n      :placeholder=\"'Please add tags'\"\n      @tags-changed=\"handleTagsChanged\"\n      class=\"mn-b-thin bg-light radius-medium pd-small\"\n    />\n    \n    <input\n      v-model=\"tag\"\n      @keydown.enter=\"addTagFromInput\"\n      placeholder=\"Type to filter suggestions\"\n      class=\"hidden-input\"\n      style=\"position: absolute; left: -9999px;\"\n    />\n\n    <p class=\"p-small mn-b-thin\">Suggested:</p>\n\n    <span \n      v-if=\"filteredSuggestedItems.length > 0\" \n      v-for=\"(tag,index) in filteredSuggestedItems\" \n      @click=\"addTag(tag)\"\n      class=\"cursor-pointer t-medium ti-tag-toDefactor\"\n      :class=\"{'mn-r-micro':index !== filteredSuggestedItems.length - 1}\"\n    >\n      {{ tag.text }}\n    </span>\n    <span v-else>You added all suggested tags</span> \n  </div>\n</template>\n\n<script setup>\nimport FieldTags from '@martyrs/src/components/FieldTags/FieldTags.vue'\nimport { ref, computed, onMounted } from 'vue';\n\nconst emits = defineEmits(['tags-changed']);\nconst props = defineProps({\n  tags: {\n    type: Array\n  },\n  tagsSuggested: {\n    type: Array,\n    default: [\n      { text: 'story' },\n      { text: 'news' },\n      { text: 'guide' },\n      { text: 'discussion' },\n      { text: 'photos' },\n    ]\n  }\n});\n\nconst tag = ref('');\nconst selectedTags = ref([]);\nconst autocompleteItems = ref(props.tagsSuggested);\n\n// Initialize tags\nif (props.tags) {\n  selectedTags.value = props.tags.map(tag => \n    typeof tag === 'string' ? { text: tag } : tag\n  );\n}\n\n// Filter autocomplete items based on current input\nconst filteredItems = computed(() => {\n  return autocompleteItems.value;\n});\n\nconst filteredSuggestedItems = computed(() => {\n    return autocompleteItems.value.filter(item => {\n      return !selectedTags.value.some(tag => tag.text === item.text);\n    });\n  })\n\nfunction addTag (tagToAdd) {\n  selectedTags.value.push(tagToAdd)\n  emits('tags-changed', selectedTags.value.map(t => t.text));\n}\n\nfunction addTagFromInput() {\n  if (tag.value) {\n    addTag({ text: tag.value });\n    tag.value = '';\n  }\n}\n\nfunction handleTagsChanged(newTags) {\n  selectedTags.value = newTags;\n  emits('tags-changed', newTags.map(t => typeof t === 'string' ? t : t.text));\n}\n\n\n\n</script>\n\n<style>\n  .ti-tag-toDefactor {\n    background-color: rgb(var(--main));\n    color: rgb(var(--black));\n    border-radius: 4rem;\n    padding: 1px 8px 2px;\n    margin: 2px;\n    font-size: .85em;\n  }\n</style>"],"names":["tag"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyCA,UAAM,QAAQ;AACd,UAAM,QAAQ;AAgBd,UAAM,MAAM,IAAI,EAAE;AAClB,UAAM,eAAe,IAAI,EAAE;AAC3B,UAAM,oBAAoB,IAAI,MAAM,aAAa;AAGjD,QAAI,MAAM,MAAM;AACd,mBAAa,QAAQ,MAAM,KAAK;AAAA,QAAI,CAAAA,SAClC,OAAOA,SAAQ,WAAW,EAAE,MAAMA,KAAG,IAAKA;AAAA,MAC9C;AAAA,IACA;AAGA,UAAM,gBAAgB,SAAS,MAAM;AACnC,aAAO,kBAAkB;AAAA,IAC3B,CAAC;AAED,UAAM,yBAAyB,SAAS,MAAM;AAC1C,aAAO,kBAAkB,MAAM,OAAO,UAAQ;AAC5C,eAAO,CAAC,aAAa,MAAM,KAAK,CAAAA,SAAOA,KAAI,SAAS,KAAK,IAAI;AAAA,MAC/D,CAAC;AAAA,IACH,CAAC;AAEH,aAAS,OAAQ,UAAU;AACzB,mBAAa,MAAM,KAAK,QAAQ;AAChC,YAAM,gBAAgB,aAAa,MAAM,IAAI,OAAK,EAAE,IAAI,CAAC;AAAA,IAC3D;AAEA,aAAS,kBAAkB;AACzB,UAAI,IAAI,OAAO;AACb,eAAO,EAAE,MAAM,IAAI,MAAK,CAAE;AAC1B,YAAI,QAAQ;AAAA,MACd;AAAA,IACF;AAEA,aAAS,kBAAkB,SAAS;AAClC,mBAAa,QAAQ;AACrB,YAAM,gBAAgB,QAAQ,IAAI,OAAK,OAAO,MAAM,WAAW,IAAI,EAAE,IAAI,CAAC;AAAA,IAC5E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"BlockTags.vue.js","sources":["../../../../../src/components/FieldTags/BlockTags.vue"],"sourcesContent":["<template>\n  <div>\n    <FieldTags\n      v-model=\"selectedTags\"\n      :autocomplete-items=\"filteredItems\"\n      :add-on-key=\"[13, ':', ';', ',']\"\n      :separators=\"[';', ',']\"\n      :max-tags=\"20\"\n      :maxlength=\"20\"\n      :placeholder=\"'Please add tags'\"\n      @tags-changed=\"handleTagsChanged\"\n      class=\"mn-b-thin bg-light radius-medium pd-small\"\n    />\n    \n    <input\n      v-model=\"tag\"\n      @keydown.enter=\"addTagFromInput\"\n      placeholder=\"Type to filter suggestions\"\n      class=\"hidden-input\"\n      style=\"position: absolute; left: -9999px;\"\n    />\n\n    <p class=\"p-small mn-b-thin\">Suggested:</p>\n\n    <span \n      v-if=\"filteredSuggestedItems.length > 0\" \n      v-for=\"(tag,index) in filteredSuggestedItems\" \n      @click=\"addTag(tag)\"\n      class=\"cursor-pointer fw-medium ti-tag-toDefactor\"\n      :class=\"{'mn-r-micro':index !== filteredSuggestedItems.length - 1}\"\n    >\n      {{ tag.text }}\n    </span>\n    <span v-else>You added all suggested tags</span> \n  </div>\n</template>\n\n<script setup>\nimport FieldTags from '@martyrs/src/components/FieldTags/FieldTags.vue'\nimport { ref, computed, onMounted } from 'vue';\n\nconst emits = defineEmits(['tags-changed']);\nconst props = defineProps({\n  tags: {\n    type: Array\n  },\n  tagsSuggested: {\n    type: Array,\n    default: [\n      { text: 'story' },\n      { text: 'news' },\n      { text: 'guide' },\n      { text: 'discussion' },\n      { text: 'photos' },\n    ]\n  }\n});\n\nconst tag = ref('');\nconst selectedTags = ref([]);\nconst autocompleteItems = ref(props.tagsSuggested);\n\n// Initialize tags\nif (props.tags) {\n  selectedTags.value = props.tags.map(tag => \n    typeof tag === 'string' ? { text: tag } : tag\n  );\n}\n\n// Filter autocomplete items based on current input\nconst filteredItems = computed(() => {\n  return autocompleteItems.value;\n});\n\nconst filteredSuggestedItems = computed(() => {\n    return autocompleteItems.value.filter(item => {\n      return !selectedTags.value.some(tag => tag.text === item.text);\n    });\n  })\n\nfunction addTag (tagToAdd) {\n  selectedTags.value.push(tagToAdd)\n  emits('tags-changed', selectedTags.value.map(t => t.text));\n}\n\nfunction addTagFromInput() {\n  if (tag.value) {\n    addTag({ text: tag.value });\n    tag.value = '';\n  }\n}\n\nfunction handleTagsChanged(newTags) {\n  selectedTags.value = newTags;\n  emits('tags-changed', newTags.map(t => typeof t === 'string' ? t : t.text));\n}\n\n\n\n</script>\n\n<style>\n  .ti-tag-toDefactor {\n    background-color: rgb(var(--main));\n    color: rgb(var(--black));\n    border-radius: 4rem;\n    padding: 1px 8px 2px;\n    margin: 2px;\n    font-size: .85em;\n  }\n</style>"],"names":["tag"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyCA,UAAM,QAAQ;AACd,UAAM,QAAQ;AAgBd,UAAM,MAAM,IAAI,EAAE;AAClB,UAAM,eAAe,IAAI,EAAE;AAC3B,UAAM,oBAAoB,IAAI,MAAM,aAAa;AAGjD,QAAI,MAAM,MAAM;AACd,mBAAa,QAAQ,MAAM,KAAK;AAAA,QAAI,CAAAA,SAClC,OAAOA,SAAQ,WAAW,EAAE,MAAMA,KAAG,IAAKA;AAAA,MAC9C;AAAA,IACA;AAGA,UAAM,gBAAgB,SAAS,MAAM;AACnC,aAAO,kBAAkB;AAAA,IAC3B,CAAC;AAED,UAAM,yBAAyB,SAAS,MAAM;AAC1C,aAAO,kBAAkB,MAAM,OAAO,UAAQ;AAC5C,eAAO,CAAC,aAAa,MAAM,KAAK,CAAAA,SAAOA,KAAI,SAAS,KAAK,IAAI;AAAA,MAC/D,CAAC;AAAA,IACH,CAAC;AAEH,aAAS,OAAQ,UAAU;AACzB,mBAAa,MAAM,KAAK,QAAQ;AAChC,YAAM,gBAAgB,aAAa,MAAM,IAAI,OAAK,EAAE,IAAI,CAAC;AAAA,IAC3D;AAEA,aAAS,kBAAkB;AACzB,UAAI,IAAI,OAAO;AACb,eAAO,EAAE,MAAM,IAAI,MAAK,CAAE;AAC1B,YAAI,QAAQ;AAAA,MACd;AAAA,IACF;AAEA,aAAS,kBAAkB,SAAS;AAClC,mBAAa,QAAQ;AACrB,YAAM,gBAAgB,QAAQ,IAAI,OAAK,OAAO,MAAM,WAAW,IAAI,EAAE,IAAI,CAAC;AAAA,IAC5E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Loader/{Loader.vue.js → Loader.vue2.js}

@@ -1,5 +1,5 @@
 import { createElementBlock, openBlock, normalizeClass, createElementVNode, createCommentVNode, toDisplayString } from "vue";
-/* empty css            */
+/* empty css           */
 import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
 const _sfc_main = {
   props: {
@@ -23,7 +23,7 @@ const _hoisted_1 = {
 };
 const _hoisted_2 = {
   key: 1,
-  class: "uppercase t-semi w-m-10r status-text"
+  class: "uppercase fw-semi w-m-10r status-text"
 };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", {
@@ -57,4 +57,4 @@ const Loader = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]])
 export {
   Loader as default
 };
-//# sourceMappingURL=Loader.vue.js.map
+//# sourceMappingURL=Loader.vue2.js.map

package/dist/martyrs/src/components/Loader/Loader.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loader.vue2.js","sources":["../../../../../src/components/Loader/Loader.vue"],"sourcesContent":["<template>\n  <div class=\"circular-loader pos-relative z-index-1 w-100 h-100 w-max-2r h-max-2r\" :class=\"{ 'circular-loader-centered': centered }\">\n    <svg viewBox=\"25 25 50 50\">\n      <circle class=\"circular-loader-fill\" cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" stroke-width=\"4\" stroke-miterlimit=\"10\" />\n      <circle class=\"circular-loader-circle\" cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" stroke-width=\"4\" stroke-miterlimit=\"10\" />\n    </svg>\n    <div v-if=\"progress\" class=\"progress-text\">{{ progress }}</div>\n    <div v-if=\"status\" class=\"uppercase fw-semi w-m-10r status-text\">{{ status }}</div>\n  </div>\n</template>\n\n<script>\nexport default {\n  props: {\n    progress: {\n      type: Number,\n      default: null,\n    },\n    status: {\n      type: String,\n      default: null,\n    },\n    centered: {\n      type: Boolean,\n      default: false\n    },\n  },\n};\n</script>\n\n<style>\n.circular-loader-centered {\n  top: calc(50% - 1rem);\n  left: calc(50% - 1rem);\n}\n\n.circular-loader svg {\n  animation: rotate 2s linear infinite;\n}\n\n.circular-loader-circle {\n  stroke-dasharray: 1, 200;\n  stroke-dashoffset: 0;\n  stroke-linecap: round;\n  stroke: rgb(var(--main));\n  animation: dash 1.5s ease-in-out infinite;\n}\n\n.circular-loader-fill {\n  stroke-linecap: round;\n  stroke: rgba(var(--black),0.2);\n}\n\n.progress-text {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  font-size: 0.8rem;\n  color: rgb(var(--main));;\n}\n\n.status-text {\n  position: absolute;\n  top: 120%;\n  left: calc(50% - 5rem);\n  font-size: 0.8rem;\n  width: 10rem !important;\n  text-align: center;\n}\n\n@keyframes rotate {\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes dash {\n  0% {\n    stroke-dasharray: 1, 200;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 89, 200;\n    stroke-dashoffset: -35;\n  }\n  100% {\n    stroke-dasharray: 1, 200;\n    stroke-dashoffset: -124;\n  }\n}\n</style>"],"names":["_createElementBlock","_normalizeClass","_createElementVNode","_toDisplayString","_createCommentVNode"],"mappings":";;;AAYA,MAAK,YAAU;AAAA,EACb,OAAO;AAAA,IACL,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA;IAEX,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;;AAGf;;EA3BA,KAAA;AAAA,EAMyB,OAAM;;;EAN/B,KAAA;AAAA,EAOuB,OAAM;;;sBAN3BA,mBAOM,OAAA;AAAA,IAPD,OADPC,eAAA,CACa,wEAAsE,EAAA,4BAAuC,OAAA,UAAQ,CAAA;AAAA;8BAC9HC,mBAGM,OAAA,EAHD,SAAQ,iBAAa;AAAA,MACxBA,mBAAkH,UAAA;AAAA,QAA1G,OAAM;AAAA,QAAuB,IAAG;AAAA,QAAK,IAAG;AAAA,QAAK,GAAE;AAAA,QAAK,MAAK;AAAA,QAAO,gBAAa;AAAA,QAAI,qBAAkB;AAAA;MAC3GA,mBAAoH,UAAA;AAAA,QAA5G,OAAM;AAAA,QAAyB,IAAG;AAAA,QAAK,IAAG;AAAA,QAAK,GAAE;AAAA,QAAK,MAAK;AAAA,QAAO,gBAAa;AAAA,QAAI,qBAAkB;AAAA;;IAEpG,OAAA,yBAAXF,mBAA+D,OAA/D,YAA+DG,gBAAjB,OAAA,QAAQ,GAAA,CAAA,KAN1DC,mBAAA,IAAA,IAAA;AAAA,IAOe,OAAA,uBAAXJ,mBAAmF,OAAnF,YAAmFG,gBAAf,OAAA,MAAM,GAAA,CAAA,KAP9EC,mBAAA,IAAA,IAAA;AAAA;;;"}

package/dist/martyrs/src/components/LocationMarker/LocationMarker.vue.js

@@ -1,6 +1,6 @@
 import { ref, onMounted, watchEffect, createElementBlock, openBlock, createElementVNode, createVNode, Transition, withCtx, createBlock } from "vue";
 import { Loader } from "../../../../node_modules/.pnpm/@googlemaps_js-api-loader@1.16.8/node_modules/@googlemaps/js-api-loader/dist/index.js";
-import Loader$1 from "../Loader/Loader.vue.js";
+import Loader$1 from "../Loader/Loader.vue2.js";
 /* empty css                    */
 const _hoisted_1 = { class: "pos-relative" };
 const _hoisted_2 = {

package/dist/martyrs/src/components/Media/Media.vue.js

@@ -1,5 +1,5 @@
 import { ref, computed, onMounted, onUnmounted, createElementBlock, openBlock, createCommentVNode, mergeProps, createElementVNode, createVNode } from "vue";
-import Loader from "../Loader/Loader.vue.js";
+import Loader from "../Loader/Loader.vue2.js";
 import _sfc_main$1 from "../../modules/icons/entities/IconGallery.vue.js";
 /* empty css           */
 import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";

package/dist/martyrs/src/components/Menu/{Menu.vue.js → Menu.vue2.js}

@@ -1,5 +1,5 @@
 import { createElementBlock, openBlock, renderSlot } from "vue";
-/* empty css          */
+/* empty css         */
 const _hoisted_1 = { class: "mobile-menu-section pd-r-zero pd-t-thin pd-b-thin pd-medium radius-medium" };
 const _sfc_main = {
   __name: "Menu",
@@ -14,4 +14,4 @@ const _sfc_main = {
 export {
   _sfc_main as default
 };
-//# sourceMappingURL=Menu.vue.js.map
+//# sourceMappingURL=Menu.vue2.js.map

package/dist/martyrs/src/components/Menu/Menu.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Menu/MenuItem.vue.js

@@ -34,7 +34,7 @@ const _sfc_main = defineComponent({
             h(
               "div",
               {
-                class: ["mn-b-thin", "mn-t-thin", "flex-center", "flex", "mn-r-small", "flex-child", "flex-child-shrink-0", "i-big", "bg-main", "radius-thin"]
+                class: ["mn-b-thin", "mn-t-thin", "flex-center", "flex", "mn-r-small", "flex-child", "flex-shrink-0", "i-big", "bg-main", "radius-thin"]
               },
               iconSlot
             )
@@ -48,7 +48,7 @@ const _sfc_main = defineComponent({
               h(
                 "span",
                 {
-                  class: ["p-medium", "t-medium", "mn-r-auto"]
+                  class: ["p-medium", "fw-medium", "mn-r-auto"]
                 },
                 textSlot
               )

package/dist/martyrs/src/components/Menu/MenuItem.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.vue.js","sources":["../../../../../src/components/Menu/MenuItem.vue"],"sourcesContent":["<script>\n  import { h, ref, inject, defineComponent } from 'vue';\n  \n  import IconChevronRight from '@martyrs/src/modules/icons/navigation/IconChevronRight.vue';  \n  export default defineComponent({\n    props: {\n    },\n    setup(props, { slots }) {\n      return () => {\n        const defaultSlotContent = slots.default ? slots.default() : [];\n        const iconSlot = [];\n        const textSlot = [];\n        // Changing the logic to place slots based on whether the type starts with 'Icon' or not\n        defaultSlotContent.forEach((vnode) => {\n          let compType = vnode.toString()\n          if (vnode.props && vnode.props.icon) {  // Check if the type starts with 'Icon'\n            iconSlot.push(vnode);\n          } else {\n            textSlot.push(vnode);\n          }\n        });\n        return h(\n          'div',\n          {\n            class: [\n              'w-100',\n              't-left',\n              'flex-nowrap',\n              'flex-v-center',\n              'flex',\n              'border-bottom-except-last'\n            ]\n          },\n          [\n            // Conditionally include the div for iconSlot\n            ...iconSlot.length ? [\n              h(\n                'div',\n                {\n                  class: ['mn-b-thin', 'mn-t-thin', 'flex-center', 'flex', 'mn-r-small','flex-child','flex-child-shrink-0', 'i-big', 'bg-main', 'radius-thin']\n                },\n                iconSlot\n              )\n            ] : [],\n            h(\n              'div',\n              {\n                class: ['w-100', 'mn-b-thin', 'mn-t-thin', 'mn-r-small', 'i-big', 'flex-v-center', 'flex']\n              },\n              [\n                h(\n                  'span',\n                  {\n                    class: ['p-medium', 't-medium', 'mn-r-auto']\n                  },\n                  textSlot\n                )\n              ]\n            ),\n            h(IconChevronRight, { class: \"i-medium mn-r-medium\", type: \"chevron\"})\n          ]\n        );\n      };\n    }\n  });\n</script>\n\n<style>\n.border-bottom-except-last {\n  border-bottom: 1px solid rgba(var(--black) 0.1);\n}\n\n.border-bottom-except-last:last-child {\n  border-bottom: none;\n}\n</style>"],"names":["IconChevronRight"],"mappings":";;;AAIO,MAAA,YAAa,gBAAa;AAAA,EAC7B,OAAO;EAEP,MAAM,OAAO,EAAE,SAAS;AACtB,WAAO,MAAM;AACX,YAAM,qBAAqB,MAAM,UAAU,MAAM,QAAO,IAAK,CAAA;AAC7D,YAAM,WAAW,CAAA;AACjB,YAAM,WAAW,CAAA;AAEjB,yBAAmB,QAAQ,CAAC,UAAU;AACrB,cAAM,SAAQ;AAC7B,YAAI,MAAM,SAAS,MAAM,MAAM,MAAM;AACnC,mBAAS,KAAK,KAAK;AAAA,QACrB,OAAO;AACL,mBAAS,KAAK,KAAK;AAAA,QACrB;AAAA,MACF,CAAC;AACD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,UACE,OAAO;AAAA,YACL;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA;QAEF;AAAA;AAAA,UAEE,GAAG,SAAS,SAAS;AAAA,YACnB;AAAA,cACE;AAAA,cACA;AAAA,gBACE,OAAO,CAAC,aAAa,aAAa,eAAe,QAAQ,cAAa,cAAa,uBAAuB,SAAS,WAAW,aAAa;AAAA;cAE7I;AAAA,YACF;AAAA,cACE,CAAA;AAAA,UACJ;AAAA,YACE;AAAA,YACA;AAAA,cACE,OAAO,CAAC,SAAS,aAAa,aAAa,cAAc,SAAS,iBAAiB,MAAM;AAAA;YAE3F;AAAA,cACE;AAAA,gBACE;AAAA,gBACA;AAAA,kBACE,OAAO,CAAC,YAAY,YAAY,WAAW;AAAA;gBAE7C;AAAA,cACF;AAAA,YACF;AAAA;UAEF,EAAEA,UAAkB,EAAE,OAAO,wBAAwB,MAAM,UAAS,CAAC;AAAA,QACvE;AAAA;IAEJ;AAAA,EACF;AACF,CAAC;"}
+{"version":3,"file":"MenuItem.vue.js","sources":["../../../../../src/components/Menu/MenuItem.vue"],"sourcesContent":["<script>\n  import { h, ref, inject, defineComponent } from 'vue';\n  \n  import IconChevronRight from '@martyrs/src/modules/icons/navigation/IconChevronRight.vue';  \n  export default defineComponent({\n    props: {\n    },\n    setup(props, { slots }) {\n      return () => {\n        const defaultSlotContent = slots.default ? slots.default() : [];\n        const iconSlot = [];\n        const textSlot = [];\n        // Changing the logic to place slots based on whether the type starts with 'Icon' or not\n        defaultSlotContent.forEach((vnode) => {\n          let compType = vnode.toString()\n          if (vnode.props && vnode.props.icon) {  // Check if the type starts with 'Icon'\n            iconSlot.push(vnode);\n          } else {\n            textSlot.push(vnode);\n          }\n        });\n        return h(\n          'div',\n          {\n            class: [\n              'w-100',\n              't-left',\n              'flex-nowrap',\n              'flex-v-center',\n              'flex',\n              'border-bottom-except-last'\n            ]\n          },\n          [\n            // Conditionally include the div for iconSlot\n            ...iconSlot.length ? [\n              h(\n                'div',\n                {\n                  class: ['mn-b-thin', 'mn-t-thin', 'flex-center', 'flex', 'mn-r-small','flex-child','flex-shrink-0', 'i-big', 'bg-main', 'radius-thin']\n                },\n                iconSlot\n              )\n            ] : [],\n            h(\n              'div',\n              {\n                class: ['w-100', 'mn-b-thin', 'mn-t-thin', 'mn-r-small', 'i-big', 'flex-v-center', 'flex']\n              },\n              [\n                h(\n                  'span',\n                  {\n                    class: ['p-medium', 'fw-medium', 'mn-r-auto']\n                  },\n                  textSlot\n                )\n              ]\n            ),\n            h(IconChevronRight, { class: \"i-medium mn-r-medium\", type: \"chevron\"})\n          ]\n        );\n      };\n    }\n  });\n</script>\n\n<style>\n.border-bottom-except-last {\n  border-bottom: 1px solid rgba(var(--black) 0.1);\n}\n\n.border-bottom-except-last:last-child {\n  border-bottom: none;\n}\n</style>"],"names":["IconChevronRight"],"mappings":";;;AAIO,MAAA,YAAa,gBAAa;AAAA,EAC7B,OAAO;EAEP,MAAM,OAAO,EAAE,SAAS;AACtB,WAAO,MAAM;AACX,YAAM,qBAAqB,MAAM,UAAU,MAAM,QAAO,IAAK,CAAA;AAC7D,YAAM,WAAW,CAAA;AACjB,YAAM,WAAW,CAAA;AAEjB,yBAAmB,QAAQ,CAAC,UAAU;AACrB,cAAM,SAAQ;AAC7B,YAAI,MAAM,SAAS,MAAM,MAAM,MAAM;AACnC,mBAAS,KAAK,KAAK;AAAA,QACrB,OAAO;AACL,mBAAS,KAAK,KAAK;AAAA,QACrB;AAAA,MACF,CAAC;AACD,aAAO;AAAA,QACL;AAAA,QACA;AAAA,UACE,OAAO;AAAA,YACL;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA;QAEF;AAAA;AAAA,UAEE,GAAG,SAAS,SAAS;AAAA,YACnB;AAAA,cACE;AAAA,cACA;AAAA,gBACE,OAAO,CAAC,aAAa,aAAa,eAAe,QAAQ,cAAa,cAAa,iBAAiB,SAAS,WAAW,aAAa;AAAA;cAEvI;AAAA,YACF;AAAA,cACE,CAAA;AAAA,UACJ;AAAA,YACE;AAAA,YACA;AAAA,cACE,OAAO,CAAC,SAAS,aAAa,aAAa,cAAc,SAAS,iBAAiB,MAAM;AAAA;YAE3F;AAAA,cACE;AAAA,gBACE;AAAA,gBACA;AAAA,kBACE,OAAO,CAAC,YAAY,aAAa,WAAW;AAAA;gBAE9C;AAAA,cACF;AAAA,YACF;AAAA;UAEF,EAAEA,UAAkB,EAAE,OAAO,wBAAwB,MAAM,UAAS,CAAC;AAAA,QACvE;AAAA;IAEJ;AAAA,EACF;AACF,CAAC;"}

package/dist/martyrs/src/components/PhotoViewer/PhotoViewer.vue.js

@@ -4,7 +4,7 @@ import IconNext from "../../modules/icons/navigation/IconChevronRight.vue.js";
 /* empty css                 */
 import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
 const _hoisted_1 = ["src", "onLoad"];
-const _hoisted_2 = { class: "pos-absolute pos-l-small bs-small pos-t-small radius-small pd-thin bg-white t-black t-medium" };
+const _hoisted_2 = { class: "pos-absolute pos-l-small bs-small pos-t-small radius-small pd-thin bg-white t-black fw-medium" };
 const _hoisted_3 = { class: "pos-absolute pos-b-small radius-small pd-thin bg-light thumbnails-container" };
 const _hoisted_4 = ["src", "onClick"];
 const _sfc_main = {
@@ -233,7 +233,7 @@ const _sfc_main = {
     };
   }
 };
-const PhotoViewer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-791644bb"]]);
+const PhotoViewer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-af6d2cdb"]]);
 export {
   PhotoViewer as default
 };

package/dist/martyrs/src/components/PhotoViewer/PhotoViewer.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PhotoViewer.vue.js","sources":["../../../../../src/components/PhotoViewer/PhotoViewer.vue"],"sourcesContent":["<script setup>\n  import { ref, computed, onMounted, onBeforeUnmount, watch } from 'vue';\n\n  import IconChevronLeft from '@martyrs/src/modules/icons/navigation/IconChevronLeft.vue';\n  import IconChevronRight from '@martyrs/src/modules/icons/navigation/IconChevronRight.vue';\n\n  const props = defineProps({\n    photoUrl: String,\n    photos: Array,\n    initialIndex: Number,\n    show: Boolean,\n  });\n\n  const currentIndex = ref(0);\n  const translateX = ref(0);\n  const isDragging = ref(false);\n  const scale = ref(1);\n  const pos = ref({ x: 0, y: 0 });\n  const image = ref(null);\n  const thumbnailsRef = ref(null);\n\n  let startX = 0, startDist = 0, startScale = 1, dragX = 0, wheelTimer, dragTimer;\n\n  const photos = computed(() => props.photos?.length ? props.photos : props.photoUrl ? [props.photoUrl] : []);\n\n  const sliderStyle = computed(() => ({\n    transform: `translate3d(${translateX.value}px, 0, 0)`,\n    transition: isDragging.value ? 'none' : 'transform 0.3s',\n    backfaceVisibility: 'hidden'\n  }));\n\n  const imgStyle = computed(() => ({\n    transform: `scale3d(${scale.value}, ${scale.value}, 1) translate3d(${pos.value.x}px, ${pos.value.y}px, 0)`,\n    backfaceVisibility: 'hidden'\n  }));\n\n  const reset = () => {\n    scale.value = 1;\n    pos.value = { x: 0, y: 0 };\n  };\n\n  const goTo = (index) => {\n    currentIndex.value = index;\n    translateX.value = -index * window.innerWidth;\n    reset();\n  };\n\n  const jumpTo = (index) => {\n    isDragging.value = true;\n    goTo(index);\n    requestAnimationFrame(() => isDragging.value = false);\n  };\n\n  const scrollToThumb = (el) => {\n    if (el && thumbnailsRef.value) {\n      const container = thumbnailsRef.value;\n      const thumb = el;\n      const left = thumb.offsetLeft - container.offsetWidth / 2 + thumb.offsetWidth / 2;\n      container.scrollTo({ left, behavior: 'smooth' });\n    }\n  };\n\n  const getXY = (e) => {\n    const t = e.touches?.[0] || e;\n    return [t.clientX, t.clientY];\n  };\n\n  const constrain = () => {\n    if (scale.value <= 1 || !image.value) return reset();\n    \n    const { naturalWidth: nw, naturalHeight: nh } = image.value;\n    const [cw, ch] = [window.innerWidth, window.innerHeight];\n    const r = Math.min(cw / nw, ch / nh, 1);\n    \n    const maxX = Math.max(0, (nw * r * scale.value - cw) / 2 / scale.value);\n    const maxY = Math.max(0, (nh * r * scale.value - ch) / 2 / scale.value);\n    \n    pos.value.x = Math.max(-maxX, Math.min(maxX, pos.value.x));\n    pos.value.y = Math.max(-maxY, Math.min(maxY, pos.value.y));\n  };\n\n  const zoom = (newScale, fx, fy) => {\n    if (!image.value) return;\n    \n    newScale = Math.max(1, Math.min(3, newScale));\n    const rect = image.value.getBoundingClientRect();\n    const [mx, my] = [fx - rect.left - rect.width / 2, fy - rect.top - rect.height / 2];\n    const change = newScale / scale.value;\n    \n    pos.value.x -= (mx / scale.value) * (change - 1);\n    pos.value.y -= (my / scale.value) * (change - 1);\n    scale.value = newScale;\n    constrain();\n  };\n\n  const startDrag = (e) => {\n    if (e.type === 'mousedown') e.preventDefault();\n    isDragging.value = true;\n    let [x, y] = getXY(e);\n    \n    const handleMove = scale.value > 1\n      ? (e) => {\n          if (!isDragging.value) return;\n          if (e.type === 'touchmove') e.preventDefault();\n          const [cx, cy] = getXY(e);\n          pos.value.x += (cx - x) / scale.value;\n          pos.value.y += (cy - y) / scale.value;\n          constrain();\n          [x, y] = [cx, cy];\n        }\n      : (e) => {\n          if (!isDragging.value) return;\n          if (e.type === 'touchmove') e.preventDefault();\n          dragX = getXY(e)[0] - startX;\n          translateX.value = dragX - currentIndex.value * window.innerWidth;\n        };\n    \n    const handleEnd = () => {\n      isDragging.value = false;\n      if (scale.value <= 1 && Math.abs(dragX) > window.innerWidth / 4) {\n        goTo(Math.max(0, Math.min(photos.value.length - 1, currentIndex.value + (dragX > 0 ? -1 : 1))));\n      } else if (scale.value <= 1) {\n        goTo(currentIndex.value);\n      }\n      dragX = 0;\n      document.removeEventListener('mousemove', handleMove, { passive: true });\n      document.removeEventListener('mouseup', handleEnd, { passive: true });\n      document.removeEventListener('touchmove', handleMove, { passive: false });\n      document.removeEventListener('touchend', handleEnd, { passive: true });\n    };\n    \n    if (scale.value <= 1) startX = x;\n    document.addEventListener('mousemove', handleMove, { passive: true });\n    document.addEventListener('mouseup', handleEnd, { passive: true });\n    document.addEventListener('touchmove', handleMove, { passive: false });\n    document.addEventListener('touchend', handleEnd, { passive: true });\n  };\n\n  const handleTouchStart = (e) => {\n    if (e.touches.length === 2) {\n      clearTimeout(dragTimer);\n      const [t1, t2] = e.touches;\n      startDist = Math.hypot(t1.clientX - t2.clientX, t1.clientY - t2.clientY);\n      startScale = scale.value;\n    } else {\n      dragTimer = setTimeout(() => startDrag(e), 50);\n    }\n  };\n\n  const handleTouchMove = (e) => {\n    if (e.touches.length === 2 && !isDragging.value) {\n      clearTimeout(dragTimer);\n      e.preventDefault();\n      const [t1, t2] = e.touches;\n      const dist = Math.hypot(t1.clientX - t2.clientX, t1.clientY - t2.clientY);\n      zoom(startScale * (dist / startDist), (t1.clientX + t2.clientX) / 2, (t1.clientY + t2.clientY) / 2);\n    }\n  };\n\n  const handleTouchEnd = () => {\n    clearTimeout(dragTimer);\n    startDist = 0;\n  };\n\n  const handleWheel = (e) => {\n    clearTimeout(wheelTimer);\n    wheelTimer = setTimeout(() => zoom(scale.value + (e.deltaY > 0 ? -0.1 : 0.1), e.clientX, e.clientY), 10);\n  };\n\n  const handleKey = (e) => {\n    const dir = { ArrowLeft: -1, ArrowRight: 1 }[e.key];\n    if (dir) goTo(Math.max(0, Math.min(photos.value.length - 1, currentIndex.value + dir)));\n  };\n\n  watch(() => props.initialIndex, (i) => i != null && jumpTo(i));\n\n  onMounted(() => {\n    window.addEventListener('keydown', handleKey, { passive: true });\n    jumpTo(props.initialIndex || 0);\n  });\n\n  onBeforeUnmount(() => {\n    window.removeEventListener('keydown', handleKey);\n    clearTimeout(wheelTimer);\n    clearTimeout(dragTimer);\n  });\n</script>\n\n<template>\n  <div class=\"photo-viewer w-min-100\" @wheel.prevent=\"handleWheel\">\n    <div \n      class=\"slider-track\" \n      :style=\"sliderStyle\"\n      @mousedown=\"startDrag\" \n      @touchstart=\"handleTouchStart\"\n      @touchmove=\"handleTouchMove\"\n      @touchend=\"handleTouchEnd\"\n    >\n      <div \n        v-for=\"(photo, index) in photos\" \n        :key=\"index\"\n        class=\"slide\"\n      >\n        <img \n          :src=\"photo\" \n          :style=\"index === currentIndex ? imgStyle : null\"\n          :ref=\"el => index === currentIndex && (image = el)\"\n          @load=\"() => index === currentIndex && reset()\" \n        />\n      </div>\n    </div>\n    \n    <template \n      v-if=\"photos.length > 1\"\n    >\n\n      <span class=\"pos-absolute pos-l-small bs-small pos-t-small radius-small pd-thin bg-white t-black t-medium\">\n        {{ currentIndex + 1 }} / {{ photos.length }}\n      </span>\n      \n      <button \n        v-if=\"currentIndex > 0\" \n        @click=\"goTo(currentIndex - 1)\" \n        class=\"cursor-pointer hover-scale-1 bs-small pos-absolute pos-t-50 pos-l-small bg-white radius-small pd-thin\"\n      >\n        <IconChevronLeft fill=\"rgb(var(--black)\" class=\"i-medium\"/>\n      </button>\n\n      <button \n        v-if=\"currentIndex < photos.length - 1\" \n        @click=\"goTo(currentIndex + 1)\" \n        class=\"cursor-pointer hover-scale-1 bs-small pos-absolute pos-t-50 pos-r-small bg-white radius-small pd-thin\"\n      >\n        <IconChevronRight fill=\"rgb(var(--black)\" class=\"i-medium\"/>\n      </button>\n      \n      <div class=\"pos-absolute pos-b-small radius-small pd-thin bg-light  thumbnails-container\">\n        <div class=\"thumbnails\" ref=\"thumbnailsRef\">\n          <img \n            v-for=\"(photo, i) in photos\" \n            :key=\"i\"\n            :src=\"photo\"\n            @click=\"jumpTo(i)\"\n            :class=\"['thumbnail', { active: i === currentIndex }]\"\n            :ref=\"el => i === currentIndex && scrollToThumb(el)\" \n          />\n        </div>\n      </div>\n    </template>\n\n  </div>\n</template>\n\n<style scoped>\n.photo-viewer {\n  width: 100%;\n  height: 100%;\n  position: relative;\n  background: #fff;\n  overflow: hidden;\n  user-select: none;\n  touch-action: none;\n}\n\n.slider-track {\n  display: flex;\n  height: 100%;\n  cursor: grab;\n  backface-visibility: hidden;\n}\n\n.slider-track:active {\n  cursor: grabbing;\n}\n\n.slide {\n  flex: 0 0 100%;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n\n.slide img {\n  width: 100%;\n  height: 100%;\n  object-fit: scale-down;\n  transform-origin: center;\n  pointer-events: none;\n  backface-visibility: hidden;\n}\n\n.thumbnails-container {\n  left: 50%;\n  transform: translateX(-50%);\n  max-width: 100%;\n  z-index: 1;\n}\n\n.thumbnails {\n  display: flex;\n  gap: 0.25rem;\n  overflow-x: auto;\n  scrollbar-width: none;\n}\n\n.thumbnails::-webkit-scrollbar {\n  display: none;\n}\n\n.thumbnail {\n  width: 4rem;\n  height: 4rem;\n  object-fit: cover;\n  cursor: pointer;\n  transition: opacity 0.2s;\n  border-radius: 0.25rem;\n  flex-shrink: 0;\n}\n\n.thumbnail.active {\n  opacity: 1;\n  border: 1px solid rgb(var(--second));\n}\n\n\n@media (max-width: 768px) {\n  .nav-arrow { display: none; }\n  .thumbnail { width: 3rem; height: 3rem; }\n}\n</style>"],"names":["e"],"mappings":"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"}
+{"version":3,"file":"PhotoViewer.vue.js","sources":["../../../../../src/components/PhotoViewer/PhotoViewer.vue"],"sourcesContent":["<script setup>\n  import { ref, computed, onMounted, onBeforeUnmount, watch } from 'vue';\n\n  import IconChevronLeft from '@martyrs/src/modules/icons/navigation/IconChevronLeft.vue';\n  import IconChevronRight from '@martyrs/src/modules/icons/navigation/IconChevronRight.vue';\n\n  const props = defineProps({\n    photoUrl: String,\n    photos: Array,\n    initialIndex: Number,\n    show: Boolean,\n  });\n\n  const currentIndex = ref(0);\n  const translateX = ref(0);\n  const isDragging = ref(false);\n  const scale = ref(1);\n  const pos = ref({ x: 0, y: 0 });\n  const image = ref(null);\n  const thumbnailsRef = ref(null);\n\n  let startX = 0, startDist = 0, startScale = 1, dragX = 0, wheelTimer, dragTimer;\n\n  const photos = computed(() => props.photos?.length ? props.photos : props.photoUrl ? [props.photoUrl] : []);\n\n  const sliderStyle = computed(() => ({\n    transform: `translate3d(${translateX.value}px, 0, 0)`,\n    transition: isDragging.value ? 'none' : 'transform 0.3s',\n    backfaceVisibility: 'hidden'\n  }));\n\n  const imgStyle = computed(() => ({\n    transform: `scale3d(${scale.value}, ${scale.value}, 1) translate3d(${pos.value.x}px, ${pos.value.y}px, 0)`,\n    backfaceVisibility: 'hidden'\n  }));\n\n  const reset = () => {\n    scale.value = 1;\n    pos.value = { x: 0, y: 0 };\n  };\n\n  const goTo = (index) => {\n    currentIndex.value = index;\n    translateX.value = -index * window.innerWidth;\n    reset();\n  };\n\n  const jumpTo = (index) => {\n    isDragging.value = true;\n    goTo(index);\n    requestAnimationFrame(() => isDragging.value = false);\n  };\n\n  const scrollToThumb = (el) => {\n    if (el && thumbnailsRef.value) {\n      const container = thumbnailsRef.value;\n      const thumb = el;\n      const left = thumb.offsetLeft - container.offsetWidth / 2 + thumb.offsetWidth / 2;\n      container.scrollTo({ left, behavior: 'smooth' });\n    }\n  };\n\n  const getXY = (e) => {\n    const t = e.touches?.[0] || e;\n    return [t.clientX, t.clientY];\n  };\n\n  const constrain = () => {\n    if (scale.value <= 1 || !image.value) return reset();\n    \n    const { naturalWidth: nw, naturalHeight: nh } = image.value;\n    const [cw, ch] = [window.innerWidth, window.innerHeight];\n    const r = Math.min(cw / nw, ch / nh, 1);\n    \n    const maxX = Math.max(0, (nw * r * scale.value - cw) / 2 / scale.value);\n    const maxY = Math.max(0, (nh * r * scale.value - ch) / 2 / scale.value);\n    \n    pos.value.x = Math.max(-maxX, Math.min(maxX, pos.value.x));\n    pos.value.y = Math.max(-maxY, Math.min(maxY, pos.value.y));\n  };\n\n  const zoom = (newScale, fx, fy) => {\n    if (!image.value) return;\n    \n    newScale = Math.max(1, Math.min(3, newScale));\n    const rect = image.value.getBoundingClientRect();\n    const [mx, my] = [fx - rect.left - rect.width / 2, fy - rect.top - rect.height / 2];\n    const change = newScale / scale.value;\n    \n    pos.value.x -= (mx / scale.value) * (change - 1);\n    pos.value.y -= (my / scale.value) * (change - 1);\n    scale.value = newScale;\n    constrain();\n  };\n\n  const startDrag = (e) => {\n    if (e.type === 'mousedown') e.preventDefault();\n    isDragging.value = true;\n    let [x, y] = getXY(e);\n    \n    const handleMove = scale.value > 1\n      ? (e) => {\n          if (!isDragging.value) return;\n          if (e.type === 'touchmove') e.preventDefault();\n          const [cx, cy] = getXY(e);\n          pos.value.x += (cx - x) / scale.value;\n          pos.value.y += (cy - y) / scale.value;\n          constrain();\n          [x, y] = [cx, cy];\n        }\n      : (e) => {\n          if (!isDragging.value) return;\n          if (e.type === 'touchmove') e.preventDefault();\n          dragX = getXY(e)[0] - startX;\n          translateX.value = dragX - currentIndex.value * window.innerWidth;\n        };\n    \n    const handleEnd = () => {\n      isDragging.value = false;\n      if (scale.value <= 1 && Math.abs(dragX) > window.innerWidth / 4) {\n        goTo(Math.max(0, Math.min(photos.value.length - 1, currentIndex.value + (dragX > 0 ? -1 : 1))));\n      } else if (scale.value <= 1) {\n        goTo(currentIndex.value);\n      }\n      dragX = 0;\n      document.removeEventListener('mousemove', handleMove, { passive: true });\n      document.removeEventListener('mouseup', handleEnd, { passive: true });\n      document.removeEventListener('touchmove', handleMove, { passive: false });\n      document.removeEventListener('touchend', handleEnd, { passive: true });\n    };\n    \n    if (scale.value <= 1) startX = x;\n    document.addEventListener('mousemove', handleMove, { passive: true });\n    document.addEventListener('mouseup', handleEnd, { passive: true });\n    document.addEventListener('touchmove', handleMove, { passive: false });\n    document.addEventListener('touchend', handleEnd, { passive: true });\n  };\n\n  const handleTouchStart = (e) => {\n    if (e.touches.length === 2) {\n      clearTimeout(dragTimer);\n      const [t1, t2] = e.touches;\n      startDist = Math.hypot(t1.clientX - t2.clientX, t1.clientY - t2.clientY);\n      startScale = scale.value;\n    } else {\n      dragTimer = setTimeout(() => startDrag(e), 50);\n    }\n  };\n\n  const handleTouchMove = (e) => {\n    if (e.touches.length === 2 && !isDragging.value) {\n      clearTimeout(dragTimer);\n      e.preventDefault();\n      const [t1, t2] = e.touches;\n      const dist = Math.hypot(t1.clientX - t2.clientX, t1.clientY - t2.clientY);\n      zoom(startScale * (dist / startDist), (t1.clientX + t2.clientX) / 2, (t1.clientY + t2.clientY) / 2);\n    }\n  };\n\n  const handleTouchEnd = () => {\n    clearTimeout(dragTimer);\n    startDist = 0;\n  };\n\n  const handleWheel = (e) => {\n    clearTimeout(wheelTimer);\n    wheelTimer = setTimeout(() => zoom(scale.value + (e.deltaY > 0 ? -0.1 : 0.1), e.clientX, e.clientY), 10);\n  };\n\n  const handleKey = (e) => {\n    const dir = { ArrowLeft: -1, ArrowRight: 1 }[e.key];\n    if (dir) goTo(Math.max(0, Math.min(photos.value.length - 1, currentIndex.value + dir)));\n  };\n\n  watch(() => props.initialIndex, (i) => i != null && jumpTo(i));\n\n  onMounted(() => {\n    window.addEventListener('keydown', handleKey, { passive: true });\n    jumpTo(props.initialIndex || 0);\n  });\n\n  onBeforeUnmount(() => {\n    window.removeEventListener('keydown', handleKey);\n    clearTimeout(wheelTimer);\n    clearTimeout(dragTimer);\n  });\n</script>\n\n<template>\n  <div class=\"photo-viewer w-min-100\" @wheel.prevent=\"handleWheel\">\n    <div \n      class=\"slider-track\" \n      :style=\"sliderStyle\"\n      @mousedown=\"startDrag\" \n      @touchstart=\"handleTouchStart\"\n      @touchmove=\"handleTouchMove\"\n      @touchend=\"handleTouchEnd\"\n    >\n      <div \n        v-for=\"(photo, index) in photos\" \n        :key=\"index\"\n        class=\"slide\"\n      >\n        <img \n          :src=\"photo\" \n          :style=\"index === currentIndex ? imgStyle : null\"\n          :ref=\"el => index === currentIndex && (image = el)\"\n          @load=\"() => index === currentIndex && reset()\" \n        />\n      </div>\n    </div>\n    \n    <template \n      v-if=\"photos.length > 1\"\n    >\n\n      <span class=\"pos-absolute pos-l-small bs-small pos-t-small radius-small pd-thin bg-white t-black fw-medium\">\n        {{ currentIndex + 1 }} / {{ photos.length }}\n      </span>\n      \n      <button \n        v-if=\"currentIndex > 0\" \n        @click=\"goTo(currentIndex - 1)\" \n        class=\"cursor-pointer hover-scale-1 bs-small pos-absolute pos-t-50 pos-l-small bg-white radius-small pd-thin\"\n      >\n        <IconChevronLeft fill=\"rgb(var(--black)\" class=\"i-medium\"/>\n      </button>\n\n      <button \n        v-if=\"currentIndex < photos.length - 1\" \n        @click=\"goTo(currentIndex + 1)\" \n        class=\"cursor-pointer hover-scale-1 bs-small pos-absolute pos-t-50 pos-r-small bg-white radius-small pd-thin\"\n      >\n        <IconChevronRight fill=\"rgb(var(--black)\" class=\"i-medium\"/>\n      </button>\n      \n      <div class=\"pos-absolute pos-b-small radius-small pd-thin bg-light  thumbnails-container\">\n        <div class=\"thumbnails\" ref=\"thumbnailsRef\">\n          <img \n            v-for=\"(photo, i) in photos\" \n            :key=\"i\"\n            :src=\"photo\"\n            @click=\"jumpTo(i)\"\n            :class=\"['thumbnail', { active: i === currentIndex }]\"\n            :ref=\"el => i === currentIndex && scrollToThumb(el)\" \n          />\n        </div>\n      </div>\n    </template>\n\n  </div>\n</template>\n\n<style scoped>\n.photo-viewer {\n  width: 100%;\n  height: 100%;\n  position: relative;\n  background: #fff;\n  overflow: hidden;\n  user-select: none;\n  touch-action: none;\n}\n\n.slider-track {\n  display: flex;\n  height: 100%;\n  cursor: grab;\n  backface-visibility: hidden;\n}\n\n.slider-track:active {\n  cursor: grabbing;\n}\n\n.slide {\n  flex: 0 0 100%;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n\n.slide img {\n  width: 100%;\n  height: 100%;\n  object-fit: scale-down;\n  transform-origin: center;\n  pointer-events: none;\n  backface-visibility: hidden;\n}\n\n.thumbnails-container {\n  left: 50%;\n  transform: translateX(-50%);\n  max-width: 100%;\n  z-index: 1;\n}\n\n.thumbnails {\n  display: flex;\n  gap: 0.25rem;\n  overflow-x: auto;\n  scrollbar-width: none;\n}\n\n.thumbnails::-webkit-scrollbar {\n  display: none;\n}\n\n.thumbnail {\n  width: 4rem;\n  height: 4rem;\n  object-fit: cover;\n  cursor: pointer;\n  transition: opacity 0.2s;\n  border-radius: 0.25rem;\n  flex-shrink: 0;\n}\n\n.thumbnail.active {\n  opacity: 1;\n  border: 1px solid rgb(var(--second));\n}\n\n\n@media (max-width: 768px) {\n  .nav-arrow { display: none; }\n  .thumbnail { width: 3rem; height: 3rem; }\n}\n</style>"],"names":["e"],"mappings":"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"}

package/dist/martyrs/src/components/Radio/Radio.vue.js

@@ -2,7 +2,7 @@ import { createElementBlock, openBlock, createElementVNode, createCommentVNode,
 const _hoisted_1 = { class: "flex-v-center flex-nowrap flex" };
 const _hoisted_2 = {
   key: 0,
-  class: "br-solid br-2px br-grey-transp-25 pos-absolute pos-t-0 pos-r-0 radius-extra w-100 h-100"
+  class: "br-2px br-grey-transp-25 pos-absolute pos-t-0 pos-r-0 radius-extra w-100 h-100"
 };
 const _hoisted_3 = {
   key: 0,