@ozdao/martyrs 0.2.481 → 0.2.482

package/dist/martyrs/src/components/Skeleton/Skeleton.vue.cjs

@@ -64,7 +64,7 @@ const _sfc_main = {
     });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", {
-        class: vue.normalizeClass(["skeleton-wrapper", { "skeleton-wrapper--loading": __props.loading }])
+        class: vue.normalizeClass(["w-100 pos-relative", { "skeleton-wrapper--loading": __props.loading }])
       }, [
         hasDefaultSlot.value && !__props.structure.length ? vue.renderSlot(_ctx.$slots, "default", { key: 0 }, void 0, true) : __props.structure.length ? (vue.openBlock(), vue.createElementBlock("div", {
           key: 1,
@@ -76,7 +76,8 @@ const _sfc_main = {
               class: vue.normalizeClass(["skeleton-item", [
                 `skeleton-item--${item.block}`,
                 `skeleton-item--${item.size || "medium"}`,
-                { "skeleton-item--rounded": item.rounded }
+                { "skeleton-item--rounded": item.rounded },
+                item.class
               ]]),
               style: vue.normalizeStyle(item.style)
             }, null, 6);
@@ -90,6 +91,6 @@ const _sfc_main = {
     };
   }
 };
-const Skeleton = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-70b3339a"]]);
+const Skeleton = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-b175ac0f"]]);
 exports.default = Skeleton;
 //# sourceMappingURL=Skeleton.vue.cjs.map

package/dist/martyrs/src/components/Skeleton/Skeleton.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.vue.cjs","sources":["../../../../../src/components/Skeleton/Skeleton.vue"],"sourcesContent":["<template>\n  <div class=\"skeleton-wrapper\" :class=\"{ 'skeleton-wrapper--loading': loading }\">\n    <!-- Используем слот по умолчанию, если он есть -->\n    <slot v-if=\"hasDefaultSlot && !structure.length\"></slot>\n    \n    <!-- Создаем скелетон на основе переданной структуры, если слот пустой -->\n    <div v-else-if=\"structure.length\" class=\"skeleton-structure\" :class=\"{ 'skeleton-structure--horizontal': horizontal }\">\n      <div \n        v-for=\"(item, index) in structure\" \n        :key=\"index\" \n        class=\"skeleton-item\"\n        :class=\"[\n          `skeleton-item--${item.block}`,\n          `skeleton-item--${item.size || 'medium'}`,\n          { 'skeleton-item--rounded': item.rounded }\n        ]\"\n        :style=\"item.style\"\n      ></div>\n    </div>\n    \n    <!-- Если слот пустой и структура не определена - показываем дефолтный скелетон -->\n    <div v-else class=\"skeleton-default\">\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--small\"></div>\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--medium\"></div>\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--large\"></div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, useSlots, computed, onMounted } from 'vue';\n\nconst slots = useSlots();\n\nconst props = defineProps({\n  // Флаг загрузки, определяет, нужно ли показывать скелетон\n  loading: {\n    type: Boolean,\n    default: false\n  },\n  // Структура скелетона, если не используется слот\n  structure: {\n    type: Array,\n    default: () => []\n  },\n  // Горизонтальное расположение элементов (для карточек пользователей)\n  horizontal: {\n    type: Boolean,\n    default: false\n  },\n  // Цвет фона карточки (светлый фон)\n  cardColor: {\n    type: String,\n    default: 'rgb(var(--light))'\n  },\n  // Цвет блоков скелетона (серый)\n  blockColor: {\n    type: String,\n    default: 'rgba(var(--white),0.25)'\n  },\n  // Цвет анимированной полосы (белый с прозрачностью)\n  highlightColor: {\n    type: String,\n    default: 'rgba(var(--white), 0.9)'\n  },\n  // Скорость анимации в секундах\n  animationDuration: {\n    type: Number,\n    default: 1.5\n  },\n  // Радиус закругления\n  borderRadius: {\n    type: String,\n    default: '0.5rem'\n  }\n});\n\n// Проверяем наличие слота по умолчанию\nconst hasDefaultSlot = computed(() => Boolean(slots.default));\n\n// Применяем CSS переменные для настройки стилей\nonMounted(() => {\n  const root = document.documentElement;\n  root.style.setProperty('--skeleton-card-color', props.cardColor);\n  root.style.setProperty('--skeleton-block-color', props.blockColor);\n  root.style.setProperty('--skeleton-highlight-color', props.highlightColor);\n  root.style.setProperty('--skeleton-animation-duration', `${props.animationDuration}s`);\n  root.style.setProperty('--skeleton-border-radius', props.borderRadius);\n});\n</script>\n\n<style scoped>\n.skeleton-wrapper {\n  width: 100%;\n  position: relative;\n  background-color: var(--skeleton-card-color);\n  padding: 1rem;\n}\n\n/* Стили для режима загрузки */\n.skeleton-wrapper--loading ::v-deep(*) {\n  color: transparent !important;\n  border-color: transparent !important;\n  position: relative;\n}\n\n.skeleton-wrapper--loading ::v-deep(img),\n.skeleton-wrapper--loading ::v-deep(svg),\n.skeleton-wrapper--loading ::v-deep(button),\n.skeleton-wrapper--loading ::v-deep(a) {\n  opacity: 0;\n}\n\n.skeleton-wrapper--loading ::v-deep(*::before),\n.skeleton-wrapper--loading ::v-deep(*::after) {\n  display: none !important;\n}\n\n.skeleton-wrapper--loading ::v-deep(*) {\n  position: relative;\n  background-color: var(--skeleton-block-color) !important;\n  border-radius: var(--skeleton-border-radius);\n  overflow: hidden;\n}\n\n.skeleton-wrapper--loading ::v-deep(*)::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: -100%;\n  width: 100%;\n  height: 100%;\n  display: block !important;\n  animation: shimmer var(--skeleton-animation-duration) infinite;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    var(--skeleton-highlight-color) 50%,\n    transparent 100%\n  );\n}\n\n/* Стили для структурного скелетона */\n.skeleton-structure {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  width: 100%;\n}\n\n/* Горизонтальный скелетон для карточек пользователей */\n.skeleton-structure--horizontal {\n  flex-direction: row;\n  align-items: center;\n  flex-wrap: nowrap;\n}\n\n.skeleton-item {\n  background-color: var(--skeleton-block-color);\n  border-radius: var(--skeleton-border-radius);\n  position: relative;\n  overflow: hidden;\n}\n\n.skeleton-item::after {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: -100%;\n  width: 100%;\n  height: 100%;\n  animation: shimmer var(--skeleton-animation-duration) infinite;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    var(--skeleton-highlight-color) 50%,\n    transparent 100%\n  );\n}\n\n/* Типы блоков */\n.skeleton-item--text {\n  height: 1rem;\n  width: 100%;\n}\n\n.skeleton-item--text-group {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  flex: 1;\n}\n\n.skeleton-item--image {\n  width: 100%;\n  aspect-ratio: 16 / 9;\n}\n\n.skeleton-item--avatar {\n  width: 4rem;\n  height: 4rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n\n.skeleton-item--button {\n  height: 3rem;\n  width: 8rem;\n}\n\n.skeleton-item--circle {\n  border-radius: 50%;\n}\n\n.skeleton-item--action {\n  width: 2rem;\n  height: 2rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n\n.skeleton-item--actions-group {\n  display: flex;\n  gap: 0.5rem;\n  margin-left: auto;\n}\n\n.skeleton-item--square {\n  aspect-ratio: 1 / 1;\n}\n\n/* Размеры */\n.skeleton-item--small {\n  width: 30%;\n}\n\n.skeleton-item--medium {\n  width: 60%;\n}\n\n.skeleton-item--large {\n  width: 100%;\n}\n\n.skeleton-item--rounded {\n  border-radius: 50%;\n}\n\n/* Дефолтный скелетон */\n.skeleton-default {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  width: 100%;\n}\n\n/* Анимация движения полосы */\n@keyframes shimmer {\n  0% {\n    left: -100%;\n  }\n  100% {\n    left: 100%;\n  }\n}\n</style>"],"names":["useSlots","computed","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCA,UAAM,QAAQA,IAAAA,SAAU;AAExB,UAAM,QAAQ;AA4Cd,UAAM,iBAAiBC,IAAAA,SAAS,MAAM,QAAQ,MAAM,OAAO,CAAC;AAG5DC,QAAAA,UAAU,MAAM;AACd,YAAM,OAAO,SAAS;AACtB,WAAK,MAAM,YAAY,yBAAyB,MAAM,SAAS;AAC/D,WAAK,MAAM,YAAY,0BAA0B,MAAM,UAAU;AACjE,WAAK,MAAM,YAAY,8BAA8B,MAAM,cAAc;AACzE,WAAK,MAAM,YAAY,iCAAiC,GAAG,MAAM,iBAAiB,GAAG;AACrF,WAAK,MAAM,YAAY,4BAA4B,MAAM,YAAY;AAAA,IACvE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Skeleton.vue.cjs","sources":["../../../../../src/components/Skeleton/Skeleton.vue"],"sourcesContent":["<template>\n  <div class=\"w-100 pos-relative\" :class=\"{ 'skeleton-wrapper--loading': loading }\">\n    <!-- Используем слот по умолчанию, если он есть -->\n    <slot v-if=\"hasDefaultSlot && !structure.length\"></slot>\n    \n    <div \n      v-else-if=\"structure.length\" \n      class=\"skeleton-structure\"\n       :class=\"{ 'skeleton-structure--horizontal': horizontal }\"\n    >\n      <div \n        v-for=\"(item, index) in structure\" \n        :key=\"index\" \n        class=\"skeleton-item\"\n        :class=\"[\n          `skeleton-item--${item.block}`,\n          `skeleton-item--${item.size || 'medium'}`,\n          { 'skeleton-item--rounded': item.rounded },\n          item.class\n        ]\"\n        :style=\"item.style\"\n      />\n    </div>\n    \n    <!-- Если слот пустой и структура не определена - показываем дефолтный скелетон -->\n    <div v-else class=\"skeleton-default\">\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--small\"></div>\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--medium\"></div>\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--large\"></div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, useSlots, computed, onMounted } from 'vue';\n\nconst slots = useSlots();\n\nconst props = defineProps({\n  // Флаг загрузки, определяет, нужно ли показывать скелетон\n  loading: {\n    type: Boolean,\n    default: false\n  },\n  // Структура скелетона, если не используется слот\n  structure: {\n    type: Array,\n    default: () => []\n  },\n  // Горизонтальное расположение элементов (для карточек пользователей)\n  horizontal: {\n    type: Boolean,\n    default: false\n  },\n  // Цвет фона карточки (светлый фон)\n  cardColor: {\n    type: String,\n    default: 'rgb(var(--light))'\n  },\n  // Цвет блоков скелетона (серый)\n  blockColor: {\n    type: String,\n    default: 'rgba(var(--white),0.25)'\n  },\n  // Цвет анимированной полосы (белый с прозрачностью)\n  highlightColor: {\n    type: String,\n    default: 'rgba(var(--white), 0.9)'\n  },\n  // Скорость анимации в секундах\n  animationDuration: {\n    type: Number,\n    default: 1.5\n  },\n  // Радиус закругления\n  borderRadius: {\n    type: String,\n    default: '0.5rem'\n  }\n});\n\n// Проверяем наличие слота по умолчанию\nconst hasDefaultSlot = computed(() => Boolean(slots.default));\n\n// Применяем CSS переменные для настройки стилей\nonMounted(() => {\n  const root = document.documentElement;\n  root.style.setProperty('--skeleton-card-color', props.cardColor);\n  root.style.setProperty('--skeleton-block-color', props.blockColor);\n  root.style.setProperty('--skeleton-highlight-color', props.highlightColor);\n  root.style.setProperty('--skeleton-animation-duration', `${props.animationDuration}s`);\n  root.style.setProperty('--skeleton-border-radius', props.borderRadius);\n});\n</script>\n\n<style scoped>\n/* Стили для режима загрузки */\n.skeleton-wrapper--loading ::v-deep(*) {\n  color: transparent !important;\n  border-color: transparent !important;\n  position: relative;\n}\n\n.skeleton-wrapper--loading ::v-deep(img),\n.skeleton-wrapper--loading ::v-deep(svg),\n.skeleton-wrapper--loading ::v-deep(button),\n.skeleton-wrapper--loading ::v-deep(a) {\n  opacity: 0;\n}\n\n.skeleton-wrapper--loading ::v-deep(*::before),\n.skeleton-wrapper--loading ::v-deep(*::after) {\n  display: none !important;\n}\n\n.skeleton-wrapper--loading ::v-deep(*) {\n  position: relative;\n  background-color: var(--skeleton-block-color) !important;\n  border-radius: var(--skeleton-border-radius);\n  overflow: hidden;\n}\n\n.skeleton-wrapper--loading ::v-deep(*)::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: -100%;\n  width: 100%;\n  height: 100%;\n  display: block !important;\n  animation: shimmer var(--skeleton-animation-duration) infinite;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    var(--skeleton-highlight-color) 50%,\n    transparent 100%\n  );\n}\n\n/* Стили для структурного скелетона */\n.skeleton-structure {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  width: 100%;\n}\n\n/* Горизонтальный скелетон для карточек пользователей */\n.skeleton-structure--horizontal {\n  flex-direction: row;\n  align-items: center;\n  flex-wrap: nowrap;\n}\n\n.skeleton-item {\n  background-color: var(--skeleton-block-color);\n  border-radius: var(--skeleton-border-radius);\n  position: relative;\n  overflow: hidden;\n}\n\n.skeleton-item::after {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: -100%;\n  width: 100%;\n  height: 100%;\n  animation: shimmer var(--skeleton-animation-duration) infinite;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    var(--skeleton-highlight-color) 50%,\n    transparent 100%\n  );\n}\n\n/* Типы блоков */\n.skeleton-item--text {\n  height: 1rem;\n  width: 100%;\n}\n\n.skeleton-item--text-group {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  flex: 1;\n}\n\n.skeleton-item--image {\n  width: 100%;\n  aspect-ratio: 16 / 9;\n}\n\n.skeleton-item--avatar {\n  width: 4rem;\n  height: 4rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n\n.skeleton-item--button {\n  height: 3rem;\n  width: 8rem;\n}\n\n.skeleton-item--circle {\n  border-radius: 50%;\n}\n\n.skeleton-item--action {\n  width: 2rem;\n  height: 2rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n\n.skeleton-item--actions-group {\n  display: flex;\n  gap: 0.5rem;\n  margin-left: auto;\n}\n\n.skeleton-item--square {\n  aspect-ratio: 1 / 1;\n}\n\n/* Размеры */\n.skeleton-item--small {\n  width: 30%;\n}\n\n.skeleton-item--medium {\n  width: 60%;\n}\n\n.skeleton-item--large {\n  width: 100%;\n}\n\n.skeleton-item--rounded {\n  border-radius: 50%;\n}\n\n/* Дефолтный скелетон */\n.skeleton-default {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  width: 100%;\n}\n\n/* Анимация движения полосы */\n@keyframes shimmer {\n  0% {\n    left: -100%;\n  }\n  100% {\n    left: 100%;\n  }\n}\n</style>"],"names":["useSlots","computed","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,UAAM,QAAQA,IAAAA,SAAU;AAExB,UAAM,QAAQ;AA4Cd,UAAM,iBAAiBC,IAAAA,SAAS,MAAM,QAAQ,MAAM,OAAO,CAAC;AAG5DC,QAAAA,UAAU,MAAM;AACd,YAAM,OAAO,SAAS;AACtB,WAAK,MAAM,YAAY,yBAAyB,MAAM,SAAS;AAC/D,WAAK,MAAM,YAAY,0BAA0B,MAAM,UAAU;AACjE,WAAK,MAAM,YAAY,8BAA8B,MAAM,cAAc;AACzE,WAAK,MAAM,YAAY,iCAAiC,GAAG,MAAM,iBAAiB,GAAG;AACrF,WAAK,MAAM,YAAY,4BAA4B,MAAM,YAAY;AAAA,IACvE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -62,7 +62,7 @@ const _sfc_main = {
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["skeleton-wrapper", { "skeleton-wrapper--loading": __props.loading }])
+        class: normalizeClass(["w-100 pos-relative", { "skeleton-wrapper--loading": __props.loading }])
       }, [
         hasDefaultSlot.value && !__props.structure.length ? renderSlot(_ctx.$slots, "default", { key: 0 }, void 0, true) : __props.structure.length ? (openBlock(), createElementBlock("div", {
           key: 1,
@@ -74,7 +74,8 @@ const _sfc_main = {
               class: normalizeClass(["skeleton-item", [
                 `skeleton-item--${item.block}`,
                 `skeleton-item--${item.size || "medium"}`,
-                { "skeleton-item--rounded": item.rounded }
+                { "skeleton-item--rounded": item.rounded },
+                item.class
               ]]),
               style: normalizeStyle(item.style)
             }, null, 6);
@@ -88,7 +89,7 @@ const _sfc_main = {
     };
   }
 };
-const Skeleton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-70b3339a"]]);
+const Skeleton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b175ac0f"]]);
 export {
   Skeleton as default
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.vue.js","sources":["../../../../../src/components/Skeleton/Skeleton.vue"],"sourcesContent":["<template>\n  <div class=\"skeleton-wrapper\" :class=\"{ 'skeleton-wrapper--loading': loading }\">\n    <!-- Используем слот по умолчанию, если он есть -->\n    <slot v-if=\"hasDefaultSlot && !structure.length\"></slot>\n    \n    <!-- Создаем скелетон на основе переданной структуры, если слот пустой -->\n    <div v-else-if=\"structure.length\" class=\"skeleton-structure\" :class=\"{ 'skeleton-structure--horizontal': horizontal }\">\n      <div \n        v-for=\"(item, index) in structure\" \n        :key=\"index\" \n        class=\"skeleton-item\"\n        :class=\"[\n          `skeleton-item--${item.block}`,\n          `skeleton-item--${item.size || 'medium'}`,\n          { 'skeleton-item--rounded': item.rounded }\n        ]\"\n        :style=\"item.style\"\n      ></div>\n    </div>\n    \n    <!-- Если слот пустой и структура не определена - показываем дефолтный скелетон -->\n    <div v-else class=\"skeleton-default\">\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--small\"></div>\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--medium\"></div>\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--large\"></div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, useSlots, computed, onMounted } from 'vue';\n\nconst slots = useSlots();\n\nconst props = defineProps({\n  // Флаг загрузки, определяет, нужно ли показывать скелетон\n  loading: {\n    type: Boolean,\n    default: false\n  },\n  // Структура скелетона, если не используется слот\n  structure: {\n    type: Array,\n    default: () => []\n  },\n  // Горизонтальное расположение элементов (для карточек пользователей)\n  horizontal: {\n    type: Boolean,\n    default: false\n  },\n  // Цвет фона карточки (светлый фон)\n  cardColor: {\n    type: String,\n    default: 'rgb(var(--light))'\n  },\n  // Цвет блоков скелетона (серый)\n  blockColor: {\n    type: String,\n    default: 'rgba(var(--white),0.25)'\n  },\n  // Цвет анимированной полосы (белый с прозрачностью)\n  highlightColor: {\n    type: String,\n    default: 'rgba(var(--white), 0.9)'\n  },\n  // Скорость анимации в секундах\n  animationDuration: {\n    type: Number,\n    default: 1.5\n  },\n  // Радиус закругления\n  borderRadius: {\n    type: String,\n    default: '0.5rem'\n  }\n});\n\n// Проверяем наличие слота по умолчанию\nconst hasDefaultSlot = computed(() => Boolean(slots.default));\n\n// Применяем CSS переменные для настройки стилей\nonMounted(() => {\n  const root = document.documentElement;\n  root.style.setProperty('--skeleton-card-color', props.cardColor);\n  root.style.setProperty('--skeleton-block-color', props.blockColor);\n  root.style.setProperty('--skeleton-highlight-color', props.highlightColor);\n  root.style.setProperty('--skeleton-animation-duration', `${props.animationDuration}s`);\n  root.style.setProperty('--skeleton-border-radius', props.borderRadius);\n});\n</script>\n\n<style scoped>\n.skeleton-wrapper {\n  width: 100%;\n  position: relative;\n  background-color: var(--skeleton-card-color);\n  padding: 1rem;\n}\n\n/* Стили для режима загрузки */\n.skeleton-wrapper--loading ::v-deep(*) {\n  color: transparent !important;\n  border-color: transparent !important;\n  position: relative;\n}\n\n.skeleton-wrapper--loading ::v-deep(img),\n.skeleton-wrapper--loading ::v-deep(svg),\n.skeleton-wrapper--loading ::v-deep(button),\n.skeleton-wrapper--loading ::v-deep(a) {\n  opacity: 0;\n}\n\n.skeleton-wrapper--loading ::v-deep(*::before),\n.skeleton-wrapper--loading ::v-deep(*::after) {\n  display: none !important;\n}\n\n.skeleton-wrapper--loading ::v-deep(*) {\n  position: relative;\n  background-color: var(--skeleton-block-color) !important;\n  border-radius: var(--skeleton-border-radius);\n  overflow: hidden;\n}\n\n.skeleton-wrapper--loading ::v-deep(*)::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: -100%;\n  width: 100%;\n  height: 100%;\n  display: block !important;\n  animation: shimmer var(--skeleton-animation-duration) infinite;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    var(--skeleton-highlight-color) 50%,\n    transparent 100%\n  );\n}\n\n/* Стили для структурного скелетона */\n.skeleton-structure {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  width: 100%;\n}\n\n/* Горизонтальный скелетон для карточек пользователей */\n.skeleton-structure--horizontal {\n  flex-direction: row;\n  align-items: center;\n  flex-wrap: nowrap;\n}\n\n.skeleton-item {\n  background-color: var(--skeleton-block-color);\n  border-radius: var(--skeleton-border-radius);\n  position: relative;\n  overflow: hidden;\n}\n\n.skeleton-item::after {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: -100%;\n  width: 100%;\n  height: 100%;\n  animation: shimmer var(--skeleton-animation-duration) infinite;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    var(--skeleton-highlight-color) 50%,\n    transparent 100%\n  );\n}\n\n/* Типы блоков */\n.skeleton-item--text {\n  height: 1rem;\n  width: 100%;\n}\n\n.skeleton-item--text-group {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  flex: 1;\n}\n\n.skeleton-item--image {\n  width: 100%;\n  aspect-ratio: 16 / 9;\n}\n\n.skeleton-item--avatar {\n  width: 4rem;\n  height: 4rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n\n.skeleton-item--button {\n  height: 3rem;\n  width: 8rem;\n}\n\n.skeleton-item--circle {\n  border-radius: 50%;\n}\n\n.skeleton-item--action {\n  width: 2rem;\n  height: 2rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n\n.skeleton-item--actions-group {\n  display: flex;\n  gap: 0.5rem;\n  margin-left: auto;\n}\n\n.skeleton-item--square {\n  aspect-ratio: 1 / 1;\n}\n\n/* Размеры */\n.skeleton-item--small {\n  width: 30%;\n}\n\n.skeleton-item--medium {\n  width: 60%;\n}\n\n.skeleton-item--large {\n  width: 100%;\n}\n\n.skeleton-item--rounded {\n  border-radius: 50%;\n}\n\n/* Дефолтный скелетон */\n.skeleton-default {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  width: 100%;\n}\n\n/* Анимация движения полосы */\n@keyframes shimmer {\n  0% {\n    left: -100%;\n  }\n  100% {\n    left: 100%;\n  }\n}\n</style>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCA,UAAM,QAAQ,SAAU;AAExB,UAAM,QAAQ;AA4Cd,UAAM,iBAAiB,SAAS,MAAM,QAAQ,MAAM,OAAO,CAAC;AAG5D,cAAU,MAAM;AACd,YAAM,OAAO,SAAS;AACtB,WAAK,MAAM,YAAY,yBAAyB,MAAM,SAAS;AAC/D,WAAK,MAAM,YAAY,0BAA0B,MAAM,UAAU;AACjE,WAAK,MAAM,YAAY,8BAA8B,MAAM,cAAc;AACzE,WAAK,MAAM,YAAY,iCAAiC,GAAG,MAAM,iBAAiB,GAAG;AACrF,WAAK,MAAM,YAAY,4BAA4B,MAAM,YAAY;AAAA,IACvE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Skeleton.vue.js","sources":["../../../../../src/components/Skeleton/Skeleton.vue"],"sourcesContent":["<template>\n  <div class=\"w-100 pos-relative\" :class=\"{ 'skeleton-wrapper--loading': loading }\">\n    <!-- Используем слот по умолчанию, если он есть -->\n    <slot v-if=\"hasDefaultSlot && !structure.length\"></slot>\n    \n    <div \n      v-else-if=\"structure.length\" \n      class=\"skeleton-structure\"\n       :class=\"{ 'skeleton-structure--horizontal': horizontal }\"\n    >\n      <div \n        v-for=\"(item, index) in structure\" \n        :key=\"index\" \n        class=\"skeleton-item\"\n        :class=\"[\n          `skeleton-item--${item.block}`,\n          `skeleton-item--${item.size || 'medium'}`,\n          { 'skeleton-item--rounded': item.rounded },\n          item.class\n        ]\"\n        :style=\"item.style\"\n      />\n    </div>\n    \n    <!-- Если слот пустой и структура не определена - показываем дефолтный скелетон -->\n    <div v-else class=\"skeleton-default\">\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--small\"></div>\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--medium\"></div>\n      <div class=\"skeleton-item skeleton-item--text skeleton-item--large\"></div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, useSlots, computed, onMounted } from 'vue';\n\nconst slots = useSlots();\n\nconst props = defineProps({\n  // Флаг загрузки, определяет, нужно ли показывать скелетон\n  loading: {\n    type: Boolean,\n    default: false\n  },\n  // Структура скелетона, если не используется слот\n  structure: {\n    type: Array,\n    default: () => []\n  },\n  // Горизонтальное расположение элементов (для карточек пользователей)\n  horizontal: {\n    type: Boolean,\n    default: false\n  },\n  // Цвет фона карточки (светлый фон)\n  cardColor: {\n    type: String,\n    default: 'rgb(var(--light))'\n  },\n  // Цвет блоков скелетона (серый)\n  blockColor: {\n    type: String,\n    default: 'rgba(var(--white),0.25)'\n  },\n  // Цвет анимированной полосы (белый с прозрачностью)\n  highlightColor: {\n    type: String,\n    default: 'rgba(var(--white), 0.9)'\n  },\n  // Скорость анимации в секундах\n  animationDuration: {\n    type: Number,\n    default: 1.5\n  },\n  // Радиус закругления\n  borderRadius: {\n    type: String,\n    default: '0.5rem'\n  }\n});\n\n// Проверяем наличие слота по умолчанию\nconst hasDefaultSlot = computed(() => Boolean(slots.default));\n\n// Применяем CSS переменные для настройки стилей\nonMounted(() => {\n  const root = document.documentElement;\n  root.style.setProperty('--skeleton-card-color', props.cardColor);\n  root.style.setProperty('--skeleton-block-color', props.blockColor);\n  root.style.setProperty('--skeleton-highlight-color', props.highlightColor);\n  root.style.setProperty('--skeleton-animation-duration', `${props.animationDuration}s`);\n  root.style.setProperty('--skeleton-border-radius', props.borderRadius);\n});\n</script>\n\n<style scoped>\n/* Стили для режима загрузки */\n.skeleton-wrapper--loading ::v-deep(*) {\n  color: transparent !important;\n  border-color: transparent !important;\n  position: relative;\n}\n\n.skeleton-wrapper--loading ::v-deep(img),\n.skeleton-wrapper--loading ::v-deep(svg),\n.skeleton-wrapper--loading ::v-deep(button),\n.skeleton-wrapper--loading ::v-deep(a) {\n  opacity: 0;\n}\n\n.skeleton-wrapper--loading ::v-deep(*::before),\n.skeleton-wrapper--loading ::v-deep(*::after) {\n  display: none !important;\n}\n\n.skeleton-wrapper--loading ::v-deep(*) {\n  position: relative;\n  background-color: var(--skeleton-block-color) !important;\n  border-radius: var(--skeleton-border-radius);\n  overflow: hidden;\n}\n\n.skeleton-wrapper--loading ::v-deep(*)::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: -100%;\n  width: 100%;\n  height: 100%;\n  display: block !important;\n  animation: shimmer var(--skeleton-animation-duration) infinite;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    var(--skeleton-highlight-color) 50%,\n    transparent 100%\n  );\n}\n\n/* Стили для структурного скелетона */\n.skeleton-structure {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  width: 100%;\n}\n\n/* Горизонтальный скелетон для карточек пользователей */\n.skeleton-structure--horizontal {\n  flex-direction: row;\n  align-items: center;\n  flex-wrap: nowrap;\n}\n\n.skeleton-item {\n  background-color: var(--skeleton-block-color);\n  border-radius: var(--skeleton-border-radius);\n  position: relative;\n  overflow: hidden;\n}\n\n.skeleton-item::after {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: -100%;\n  width: 100%;\n  height: 100%;\n  animation: shimmer var(--skeleton-animation-duration) infinite;\n  background: linear-gradient(\n    90deg,\n    transparent 0%,\n    var(--skeleton-highlight-color) 50%,\n    transparent 100%\n  );\n}\n\n/* Типы блоков */\n.skeleton-item--text {\n  height: 1rem;\n  width: 100%;\n}\n\n.skeleton-item--text-group {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  flex: 1;\n}\n\n.skeleton-item--image {\n  width: 100%;\n  aspect-ratio: 16 / 9;\n}\n\n.skeleton-item--avatar {\n  width: 4rem;\n  height: 4rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n\n.skeleton-item--button {\n  height: 3rem;\n  width: 8rem;\n}\n\n.skeleton-item--circle {\n  border-radius: 50%;\n}\n\n.skeleton-item--action {\n  width: 2rem;\n  height: 2rem;\n  border-radius: 50%;\n  flex-shrink: 0;\n}\n\n.skeleton-item--actions-group {\n  display: flex;\n  gap: 0.5rem;\n  margin-left: auto;\n}\n\n.skeleton-item--square {\n  aspect-ratio: 1 / 1;\n}\n\n/* Размеры */\n.skeleton-item--small {\n  width: 30%;\n}\n\n.skeleton-item--medium {\n  width: 60%;\n}\n\n.skeleton-item--large {\n  width: 100%;\n}\n\n.skeleton-item--rounded {\n  border-radius: 50%;\n}\n\n/* Дефолтный скелетон */\n.skeleton-default {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  width: 100%;\n}\n\n/* Анимация движения полосы */\n@keyframes shimmer {\n  0% {\n    left: -100%;\n  }\n  100% {\n    left: 100%;\n  }\n}\n</style>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,UAAM,QAAQ,SAAU;AAExB,UAAM,QAAQ;AA4Cd,UAAM,iBAAiB,SAAS,MAAM,QAAQ,MAAM,OAAO,CAAC;AAG5D,cAAU,MAAM;AACd,YAAM,OAAO,SAAS;AACtB,WAAK,MAAM,YAAY,yBAAyB,MAAM,SAAS;AAC/D,WAAK,MAAM,YAAY,0BAA0B,MAAM,UAAU;AACjE,WAAK,MAAM,YAAY,8BAA8B,MAAM,cAAc;AACzE,WAAK,MAAM,YAAY,iCAAiC,GAAG,MAAM,iBAAiB,GAAG;AACrF,WAAK,MAAM,YAAY,4BAA4B,MAAM,YAAY;AAAA,IACvE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Slider/{Slider.native.vue.cjs → Slider.vue.cjs}

@@ -1,46 +1,28 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
-const vueRouter = require("vue-router");
-const vueI18n = require("vue-i18n");
-const Loader = require("../Loader/Loader.vue2.cjs");
-const _pluginVue_exportHelper = require("../../../../_virtual/_plugin-vue_export-helper.cjs");
+;/* empty css              */
 const _hoisted_1 = { class: "pos-relative" };
 const _hoisted_2 = {
-  key: 0,
-  class: "h-20r radius-semi pos-relative w-100 bg-light"
-};
-const _hoisted_3 = {
-  key: 1,
-  class: "bg-light radius-semi flex flex-center w-100 h-20r"
-};
-const _hoisted_4 = { class: "text-gray-500" };
-const _hoisted_5 = {
   key: 0,
   class: "carousel__dots"
 };
-const _hoisted_6 = ["onClick"];
+const _hoisted_3 = ["onClick"];
 const _sfc_main = {
-  __name: "Slider.native",
+  __name: "Slider",
   props: {
     showDots: Boolean,
-    store: Object,
-    options: Object,
-    text: Object,
-    user: Object
+    slideCount: {
+      type: Number,
+      default: 0
+    }
   },
   setup(__props) {
     const props = __props;
-    vueRouter.useRouter();
     const carouselRef = vue.ref(null);
-    const entitiesState = vue.ref([]);
-    const isLoading = vue.ref(true);
     const selectedIndex = vue.ref(0);
     const autoplayInterval = vue.ref(null);
     const scrollTimeout = vue.ref(null);
-    const { t } = vueI18n.useI18n({
-      messages: props.text
-    });
     const scrollTo = (index) => {
       if (!carouselRef.value) return;
       const container = carouselRef.value.querySelector(".carousel__container");
@@ -69,7 +51,7 @@ const _sfc_main = {
       const scrollPosition = container.scrollLeft;
       const slideWidth = slides[0].offsetWidth;
       const index = Math.round(scrollPosition / slideWidth);
-      const boundedIndex = Math.max(0, Math.min(index, entitiesState.value.length - 1));
+      const boundedIndex = Math.max(0, Math.min(index, slides.length - 1));
       selectedIndex.value = boundedIndex;
     };
     const setupAutoplay = () => {
@@ -77,20 +59,12 @@ const _sfc_main = {
         clearInterval(autoplayInterval.value);
       }
       autoplayInterval.value = setInterval(() => {
-        const nextIndex = (selectedIndex.value + 1) % entitiesState.value.length;
+        const nextIndex = (selectedIndex.value + 1) % props.slideCount;
         scrollTo(nextIndex);
       }, 2e3);
     };
-    vue.onMounted(async () => {
-      try {
-        entitiesState.value = await props.store.read(props.options);
-      } catch (error) {
-        console.error("Error loading entities:", error);
-        entitiesState.value = [];
-      } finally {
-        isLoading.value = false;
-      }
-      if (entitiesState.value.length && carouselRef.value) {
+    vue.onMounted(() => {
+      if (carouselRef.value) {
         const container = carouselRef.value.querySelector(".carousel__container");
         const slides = container.querySelectorAll(".carousel__slide");
         const observer = new IntersectionObserver((entries) => {
@@ -166,21 +140,9 @@ const _sfc_main = {
         clearTimeout(scrollTimeout.value);
       }
     });
-    vue.watch(entitiesState, (newValue) => {
-      if (newValue.length && carouselRef.value) {
-        selectedIndex.value = 0;
-        scrollTo(0);
-        setupAutoplay();
-      }
-    });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
-        isLoading.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
-          vue.createVNode(Loader.default)
-        ])) : !entitiesState.value.length ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
-          vue.createElementVNode("p", _hoisted_4, vue.toDisplayString(vue.unref(t)("title")), 1)
-        ])) : (vue.openBlock(), vue.createElementBlock("div", {
-          key: 2,
+        vue.createElementVNode("div", {
           class: "carousel",
           ref_key: "carouselRef",
           ref: carouselRef
@@ -189,41 +151,21 @@ const _sfc_main = {
             class: "carousel__container",
             onScroll: handleScroll
           }, [
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(entitiesState.value, (entity, key, index) => {
-              return vue.openBlock(), vue.createElementBlock("div", {
-                class: "carousel__slide pd-nano",
-                key
-              }, [
-                vue.createVNode(vue.Transition, {
-                  name: "fade",
-                  mode: "out-in",
-                  appear: ""
-                }, {
-                  default: vue.withCtx(() => [
-                    vue.renderSlot(_ctx.$slots, "default", {
-                      item: entity,
-                      user: __props.user
-                    }, void 0, true)
-                  ]),
-                  _: 2
-                }, 1024)
-              ]);
-            }), 128))
+            vue.renderSlot(_ctx.$slots, "default")
           ], 32),
-          __props.showDots && entitiesState.value.length > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(entitiesState.value, (_, index) => {
+          __props.showDots && __props.slideCount > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.slideCount, (index) => {
               return vue.openBlock(), vue.createElementBlock("button", {
-                key: index,
-                class: vue.normalizeClass(["carousel__dot", { "carousel__dot--active": selectedIndex.value === index }]),
-                onClick: ($event) => scrollTo(index)
-              }, null, 10, _hoisted_6);
+                key: index - 1,
+                class: vue.normalizeClass(["carousel__dot", { "carousel__dot--active": selectedIndex.value === index - 1 }]),
+                onClick: ($event) => scrollTo(index - 1)
+              }, null, 10, _hoisted_3);
             }), 128))
           ])) : vue.createCommentVNode("", true)
-        ], 512))
+        ], 512)
       ]);
     };
   }
 };
-const SliderNative = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-a766dedc"]]);
-exports.default = SliderNative;
-//# sourceMappingURL=Slider.native.vue.cjs.map
+exports.default = _sfc_main;
+//# sourceMappingURL=Slider.vue.cjs.map

package/dist/martyrs/src/components/Slider/Slider.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.vue.cjs","sources":["../../../../../src/components/Slider/Slider.vue"],"sourcesContent":["<template>\n  <div class=\"pos-relative\">\n    <!-- Native Carousel -->\n    <div class=\"carousel\" ref=\"carouselRef\">\n      <div class=\"carousel__container\" @scroll=\"handleScroll\">\n        <slot></slot>\n      </div>\n      \n      <!-- Navigation Dots (optional) -->\n      <div class=\"carousel__dots\" v-if=\"showDots && slideCount > 1\">\n        <button \n          v-for=\"index in slideCount\" \n          :key=\"index - 1\"\n          class=\"carousel__dot\"\n          :class=\"{ 'carousel__dot--active': selectedIndex === index - 1 }\"\n          @click=\"scrollTo(index - 1)\"\n        ></button>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, onMounted, onBeforeUnmount, computed } from 'vue'\n\n// Props for customization\nconst props = defineProps({\n  showDots: Boolean,\n  slideCount: {\n    type: Number,\n    default: 0\n  }\n});\n\nconst carouselRef = ref(null)\nconst selectedIndex = ref(0)\nconst autoplayInterval = ref(null)\nconst scrollTimeout = ref(null)\n\n// Scroll to specific slide\nconst scrollTo = (index) => {\n  if (!carouselRef.value) return\n  \n  const container = carouselRef.value.querySelector('.carousel__container')\n  const slides = container.querySelectorAll('.carousel__slide')\n  \n  if (slides[index]) {\n    container.scrollTo({\n      left: slides[index].offsetLeft,\n      behavior: 'smooth'\n    })\n    \n    selectedIndex.value = index\n  }\n}\n\n// Handle scroll event with debounce\nconst handleScroll = () => {\n  // Clear previous timeout\n  if (scrollTimeout.value) {\n    clearTimeout(scrollTimeout.value)\n  }\n  \n  // Set a timeout to update the index when scrolling stops\n  scrollTimeout.value = setTimeout(() => {\n    updateSelectedIndex()\n  }, 50) // Small delay to ensure scroll has completed\n}\n\n// Update selected index when scrolling\nconst updateSelectedIndex = () => {\n  if (!carouselRef.value) return\n  \n  const container = carouselRef.value.querySelector('.carousel__container')\n  const slides = container.querySelectorAll('.carousel__slide')\n  \n  if (!slides.length) return\n  \n  const scrollPosition = container.scrollLeft\n  const slideWidth = slides[0].offsetWidth\n  \n  // Find current slide index based on scroll position\n  const index = Math.round(scrollPosition / slideWidth)\n  \n  // Ensure index is within bounds\n  const boundedIndex = Math.max(0, Math.min(index, slides.length - 1))\n  \n  // Update selected index\n  selectedIndex.value = boundedIndex\n}\n\n// Setup autoplay functionality\nconst setupAutoplay = () => {\n  if (autoplayInterval.value) {\n    clearInterval(autoplayInterval.value)\n  }\n  \n  autoplayInterval.value = setInterval(() => {\n    const nextIndex = (selectedIndex.value + 1) % props.slideCount\n    scrollTo(nextIndex)\n  }, 2000) // 2 seconds interval like in original\n}\n\nonMounted(() => {\n  // Initialize native carousel after component is mounted\n  if (carouselRef.value) {\n    // Listen for scroll end using intersection observer for better performance\n    const container = carouselRef.value.querySelector('.carousel__container')\n    const slides = container.querySelectorAll('.carousel__slide')\n    \n    // Create intersection observer to detect when slides are visible\n    const observer = new IntersectionObserver((entries) => {\n      entries.forEach(entry => {\n        if (entry.isIntersecting) {\n          // Find the index of the visible slide\n          const slideIndex = Array.from(slides).indexOf(entry.target)\n          if (slideIndex !== -1) {\n            selectedIndex.value = slideIndex\n          }\n        }\n      })\n    }, {\n      root: container,\n      threshold: 0.7 // Consider slide visible when 70% is in view\n    })\n    \n    // Observe all slides\n    slides.forEach(slide => {\n      observer.observe(slide)\n    })\n    \n    // Add focus/blur events to pause autoplay on focus\n    container.addEventListener('focusin', () => {\n      if (autoplayInterval.value) {\n        clearInterval(autoplayInterval.value)\n      }\n    })\n    \n    container.addEventListener('focusout', () => {\n      setupAutoplay()\n    })\n    \n    // Stop autoplay on touch/mouse interaction\n    container.addEventListener('mousedown', () => {\n      if (autoplayInterval.value) {\n        clearInterval(autoplayInterval.value)\n      }\n    })\n    \n    container.addEventListener('touchstart', () => {\n      if (autoplayInterval.value) {\n        clearInterval(autoplayInterval.value)\n      }\n    })\n    \n    // Resume autoplay after interaction ends\n    container.addEventListener('mouseup', () => {\n      setupAutoplay()\n    })\n    \n    container.addEventListener('touchend', () => {\n      setupAutoplay()\n    })\n    \n    // Initialize autoplay\n    setupAutoplay()\n    \n    // Store observer for cleanup\n    carouselRef.value._observer = observer\n  }\n})\n\nonBeforeUnmount(() => {\n  // Clean up all resources\n  if (carouselRef.value) {\n    // Clean up intersection observer\n    if (carouselRef.value._observer) {\n      carouselRef.value._observer.disconnect()\n    }\n    \n    // Clean up event listeners\n    const container = carouselRef.value.querySelector('.carousel__container')\n    if (container) {\n      container.removeEventListener('focusin', () => {})\n      container.removeEventListener('focusout', () => {})\n      container.removeEventListener('mousedown', () => {})\n      container.removeEventListener('touchstart', () => {})\n      container.removeEventListener('mouseup', () => {})\n      container.removeEventListener('touchend', () => {})\n    }\n  }\n  \n  // Clear all timeouts and intervals\n  if (autoplayInterval.value) {\n    clearInterval(autoplayInterval.value)\n  }\n  \n  if (scrollTimeout.value) {\n    clearTimeout(scrollTimeout.value)\n  }\n})\n</script>\n\n<style >\n.carousel {\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n}\n\n.carousel__container {\n  display: flex;\n  scroll-snap-type: x mandatory;\n  overflow-x: scroll;\n  scrollbar-width: none; /* Firefox */\n  -ms-overflow-style: none; /* IE and Edge */\n  scroll-behavior: smooth;\n}\n\n.carousel__container::-webkit-scrollbar {\n  display: none; /* Chrome, Safari, Opera */\n}\n\n.carousel__slide {\n  flex: 0 0 100%;\n  width: 100%;\n  scroll-snap-align: start;\n  scroll-snap-stop: always;\n}\n\n/* Navigation dots */\n.carousel__dots {\n  display: flex;\n  justify-content: center;\n  gap: 0.5rem;\n  margin-top: 1rem;\n}\n\n.carousel__dot {\n  width: 0.625rem;\n  height: 0.625rem;\n  border-radius: 50%;\n  background-color: rgba(0, 0, 0, 0.2);\n  border: none;\n  padding: 0;\n  cursor: pointer;\n  transition: background-color 0.3s ease;\n}\n\n.carousel__dot--active {\n  background-color: rgba(0, 0, 0, 0.6);\n}\n</style>"],"names":["ref","onMounted","onBeforeUnmount"],"mappings":"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"}

package/dist/martyrs/src/components/Slider/{Slider.native.vue.js → Slider.vue.js}

@@ -1,44 +1,26 @@
-import { ref, onMounted, onBeforeUnmount, watch, createElementBlock, openBlock, createVNode, createElementVNode, toDisplayString, unref, createCommentVNode, Fragment, renderList, Transition, withCtx, renderSlot, normalizeClass } from "vue";
-import { useRouter } from "vue-router";
-import { useI18n } from "vue-i18n";
-import Loader from "../Loader/Loader.vue2.js";
-import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
+import { ref, onMounted, onBeforeUnmount, createElementBlock, openBlock, createElementVNode, createCommentVNode, renderSlot, Fragment, renderList, normalizeClass } from "vue";
+/* empty css            */
 const _hoisted_1 = { class: "pos-relative" };
 const _hoisted_2 = {
-  key: 0,
-  class: "h-20r radius-semi pos-relative w-100 bg-light"
-};
-const _hoisted_3 = {
-  key: 1,
-  class: "bg-light radius-semi flex flex-center w-100 h-20r"
-};
-const _hoisted_4 = { class: "text-gray-500" };
-const _hoisted_5 = {
   key: 0,
   class: "carousel__dots"
 };
-const _hoisted_6 = ["onClick"];
+const _hoisted_3 = ["onClick"];
 const _sfc_main = {
-  __name: "Slider.native",
+  __name: "Slider",
   props: {
     showDots: Boolean,
-    store: Object,
-    options: Object,
-    text: Object,
-    user: Object
+    slideCount: {
+      type: Number,
+      default: 0
+    }
   },
   setup(__props) {
     const props = __props;
-    useRouter();
     const carouselRef = ref(null);
-    const entitiesState = ref([]);
-    const isLoading = ref(true);
     const selectedIndex = ref(0);
     const autoplayInterval = ref(null);
     const scrollTimeout = ref(null);
-    const { t } = useI18n({
-      messages: props.text
-    });
     const scrollTo = (index) => {
       if (!carouselRef.value) return;
       const container = carouselRef.value.querySelector(".carousel__container");
@@ -67,7 +49,7 @@ const _sfc_main = {
       const scrollPosition = container.scrollLeft;
       const slideWidth = slides[0].offsetWidth;
       const index = Math.round(scrollPosition / slideWidth);
-      const boundedIndex = Math.max(0, Math.min(index, entitiesState.value.length - 1));
+      const boundedIndex = Math.max(0, Math.min(index, slides.length - 1));
       selectedIndex.value = boundedIndex;
     };
     const setupAutoplay = () => {
@@ -75,20 +57,12 @@ const _sfc_main = {
         clearInterval(autoplayInterval.value);
       }
       autoplayInterval.value = setInterval(() => {
-        const nextIndex = (selectedIndex.value + 1) % entitiesState.value.length;
+        const nextIndex = (selectedIndex.value + 1) % props.slideCount;
         scrollTo(nextIndex);
       }, 2e3);
     };
-    onMounted(async () => {
-      try {
-        entitiesState.value = await props.store.read(props.options);
-      } catch (error) {
-        console.error("Error loading entities:", error);
-        entitiesState.value = [];
-      } finally {
-        isLoading.value = false;
-      }
-      if (entitiesState.value.length && carouselRef.value) {
+    onMounted(() => {
+      if (carouselRef.value) {
         const container = carouselRef.value.querySelector(".carousel__container");
         const slides = container.querySelectorAll(".carousel__slide");
         const observer = new IntersectionObserver((entries) => {
@@ -164,21 +138,9 @@ const _sfc_main = {
         clearTimeout(scrollTimeout.value);
       }
     });
-    watch(entitiesState, (newValue) => {
-      if (newValue.length && carouselRef.value) {
-        selectedIndex.value = 0;
-        scrollTo(0);
-        setupAutoplay();
-      }
-    });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
-        isLoading.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
-          createVNode(Loader)
-        ])) : !entitiesState.value.length ? (openBlock(), createElementBlock("div", _hoisted_3, [
-          createElementVNode("p", _hoisted_4, toDisplayString(unref(t)("title")), 1)
-        ])) : (openBlock(), createElementBlock("div", {
-          key: 2,
+        createElementVNode("div", {
           class: "carousel",
           ref_key: "carouselRef",
           ref: carouselRef
@@ -187,43 +149,23 @@ const _sfc_main = {
             class: "carousel__container",
             onScroll: handleScroll
           }, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(entitiesState.value, (entity, key, index) => {
-              return openBlock(), createElementBlock("div", {
-                class: "carousel__slide pd-nano",
-                key
-              }, [
-                createVNode(Transition, {
-                  name: "fade",
-                  mode: "out-in",
-                  appear: ""
-                }, {
-                  default: withCtx(() => [
-                    renderSlot(_ctx.$slots, "default", {
-                      item: entity,
-                      user: __props.user
-                    }, void 0, true)
-                  ]),
-                  _: 2
-                }, 1024)
-              ]);
-            }), 128))
+            renderSlot(_ctx.$slots, "default")
           ], 32),
-          __props.showDots && entitiesState.value.length > 1 ? (openBlock(), createElementBlock("div", _hoisted_5, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(entitiesState.value, (_, index) => {
+          __props.showDots && __props.slideCount > 1 ? (openBlock(), createElementBlock("div", _hoisted_2, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.slideCount, (index) => {
               return openBlock(), createElementBlock("button", {
-                key: index,
-                class: normalizeClass(["carousel__dot", { "carousel__dot--active": selectedIndex.value === index }]),
-                onClick: ($event) => scrollTo(index)
-              }, null, 10, _hoisted_6);
+                key: index - 1,
+                class: normalizeClass(["carousel__dot", { "carousel__dot--active": selectedIndex.value === index - 1 }]),
+                onClick: ($event) => scrollTo(index - 1)
+              }, null, 10, _hoisted_3);
             }), 128))
           ])) : createCommentVNode("", true)
-        ], 512))
+        ], 512)
       ]);
     };
   }
 };
-const SliderNative = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a766dedc"]]);
 export {
-  SliderNative as default
+  _sfc_main as default
 };
-//# sourceMappingURL=Slider.native.vue.js.map
+//# sourceMappingURL=Slider.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.vue.js","sources":["../../../../../src/components/Slider/Slider.vue"],"sourcesContent":["<template>\n  <div class=\"pos-relative\">\n    <!-- Native Carousel -->\n    <div class=\"carousel\" ref=\"carouselRef\">\n      <div class=\"carousel__container\" @scroll=\"handleScroll\">\n        <slot></slot>\n      </div>\n      \n      <!-- Navigation Dots (optional) -->\n      <div class=\"carousel__dots\" v-if=\"showDots && slideCount > 1\">\n        <button \n          v-for=\"index in slideCount\" \n          :key=\"index - 1\"\n          class=\"carousel__dot\"\n          :class=\"{ 'carousel__dot--active': selectedIndex === index - 1 }\"\n          @click=\"scrollTo(index - 1)\"\n        ></button>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, onMounted, onBeforeUnmount, computed } from 'vue'\n\n// Props for customization\nconst props = defineProps({\n  showDots: Boolean,\n  slideCount: {\n    type: Number,\n    default: 0\n  }\n});\n\nconst carouselRef = ref(null)\nconst selectedIndex = ref(0)\nconst autoplayInterval = ref(null)\nconst scrollTimeout = ref(null)\n\n// Scroll to specific slide\nconst scrollTo = (index) => {\n  if (!carouselRef.value) return\n  \n  const container = carouselRef.value.querySelector('.carousel__container')\n  const slides = container.querySelectorAll('.carousel__slide')\n  \n  if (slides[index]) {\n    container.scrollTo({\n      left: slides[index].offsetLeft,\n      behavior: 'smooth'\n    })\n    \n    selectedIndex.value = index\n  }\n}\n\n// Handle scroll event with debounce\nconst handleScroll = () => {\n  // Clear previous timeout\n  if (scrollTimeout.value) {\n    clearTimeout(scrollTimeout.value)\n  }\n  \n  // Set a timeout to update the index when scrolling stops\n  scrollTimeout.value = setTimeout(() => {\n    updateSelectedIndex()\n  }, 50) // Small delay to ensure scroll has completed\n}\n\n// Update selected index when scrolling\nconst updateSelectedIndex = () => {\n  if (!carouselRef.value) return\n  \n  const container = carouselRef.value.querySelector('.carousel__container')\n  const slides = container.querySelectorAll('.carousel__slide')\n  \n  if (!slides.length) return\n  \n  const scrollPosition = container.scrollLeft\n  const slideWidth = slides[0].offsetWidth\n  \n  // Find current slide index based on scroll position\n  const index = Math.round(scrollPosition / slideWidth)\n  \n  // Ensure index is within bounds\n  const boundedIndex = Math.max(0, Math.min(index, slides.length - 1))\n  \n  // Update selected index\n  selectedIndex.value = boundedIndex\n}\n\n// Setup autoplay functionality\nconst setupAutoplay = () => {\n  if (autoplayInterval.value) {\n    clearInterval(autoplayInterval.value)\n  }\n  \n  autoplayInterval.value = setInterval(() => {\n    const nextIndex = (selectedIndex.value + 1) % props.slideCount\n    scrollTo(nextIndex)\n  }, 2000) // 2 seconds interval like in original\n}\n\nonMounted(() => {\n  // Initialize native carousel after component is mounted\n  if (carouselRef.value) {\n    // Listen for scroll end using intersection observer for better performance\n    const container = carouselRef.value.querySelector('.carousel__container')\n    const slides = container.querySelectorAll('.carousel__slide')\n    \n    // Create intersection observer to detect when slides are visible\n    const observer = new IntersectionObserver((entries) => {\n      entries.forEach(entry => {\n        if (entry.isIntersecting) {\n          // Find the index of the visible slide\n          const slideIndex = Array.from(slides).indexOf(entry.target)\n          if (slideIndex !== -1) {\n            selectedIndex.value = slideIndex\n          }\n        }\n      })\n    }, {\n      root: container,\n      threshold: 0.7 // Consider slide visible when 70% is in view\n    })\n    \n    // Observe all slides\n    slides.forEach(slide => {\n      observer.observe(slide)\n    })\n    \n    // Add focus/blur events to pause autoplay on focus\n    container.addEventListener('focusin', () => {\n      if (autoplayInterval.value) {\n        clearInterval(autoplayInterval.value)\n      }\n    })\n    \n    container.addEventListener('focusout', () => {\n      setupAutoplay()\n    })\n    \n    // Stop autoplay on touch/mouse interaction\n    container.addEventListener('mousedown', () => {\n      if (autoplayInterval.value) {\n        clearInterval(autoplayInterval.value)\n      }\n    })\n    \n    container.addEventListener('touchstart', () => {\n      if (autoplayInterval.value) {\n        clearInterval(autoplayInterval.value)\n      }\n    })\n    \n    // Resume autoplay after interaction ends\n    container.addEventListener('mouseup', () => {\n      setupAutoplay()\n    })\n    \n    container.addEventListener('touchend', () => {\n      setupAutoplay()\n    })\n    \n    // Initialize autoplay\n    setupAutoplay()\n    \n    // Store observer for cleanup\n    carouselRef.value._observer = observer\n  }\n})\n\nonBeforeUnmount(() => {\n  // Clean up all resources\n  if (carouselRef.value) {\n    // Clean up intersection observer\n    if (carouselRef.value._observer) {\n      carouselRef.value._observer.disconnect()\n    }\n    \n    // Clean up event listeners\n    const container = carouselRef.value.querySelector('.carousel__container')\n    if (container) {\n      container.removeEventListener('focusin', () => {})\n      container.removeEventListener('focusout', () => {})\n      container.removeEventListener('mousedown', () => {})\n      container.removeEventListener('touchstart', () => {})\n      container.removeEventListener('mouseup', () => {})\n      container.removeEventListener('touchend', () => {})\n    }\n  }\n  \n  // Clear all timeouts and intervals\n  if (autoplayInterval.value) {\n    clearInterval(autoplayInterval.value)\n  }\n  \n  if (scrollTimeout.value) {\n    clearTimeout(scrollTimeout.value)\n  }\n})\n</script>\n\n<style >\n.carousel {\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n}\n\n.carousel__container {\n  display: flex;\n  scroll-snap-type: x mandatory;\n  overflow-x: scroll;\n  scrollbar-width: none; /* Firefox */\n  -ms-overflow-style: none; /* IE and Edge */\n  scroll-behavior: smooth;\n}\n\n.carousel__container::-webkit-scrollbar {\n  display: none; /* Chrome, Safari, Opera */\n}\n\n.carousel__slide {\n  flex: 0 0 100%;\n  width: 100%;\n  scroll-snap-align: start;\n  scroll-snap-stop: always;\n}\n\n/* Navigation dots */\n.carousel__dots {\n  display: flex;\n  justify-content: center;\n  gap: 0.5rem;\n  margin-top: 1rem;\n}\n\n.carousel__dot {\n  width: 0.625rem;\n  height: 0.625rem;\n  border-radius: 50%;\n  background-color: rgba(0, 0, 0, 0.2);\n  border: none;\n  padding: 0;\n  cursor: pointer;\n  transition: background-color 0.3s ease;\n}\n\n.carousel__dot--active {\n  background-color: rgba(0, 0, 0, 0.6);\n}\n</style>"],"names":[],"mappings":"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"}

package/dist/martyrs/src/components/Status/Status.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Status.vue.cjs","sources":["../../../../../src/components/Status/Status.vue"],"sourcesContent":["<template>\n\t<div class=\"pd-small error-wrapper\">\n\t\t<div class=\"\n\t\t\tflex-nowrap flex\n\t\t\tradius-small\n\t\t\tpd-small\n\t\t\tt-white \n\t\t\tbg-fourth\n\t\t\">\n\t\t\t<p class=\"w-100\">\n\t\t\t\t{{data.message}}\n\t\t\t\t<!-- <span class=\"t-semi\">Ошибка: {{status}} </span> -->\n\t\t\t\t<br>\n\t\t\t\t<!-- <span>Сообщение: {{message}}</span> -->\n\t\t\t</p>\n\t\t\t\n\t\t\t<IconCross @click=\"closeError()\"  class=\"cursor-pointer hover-scale-1 i-regular z-index-5\"/>\n\t\t</div>\n\t</div>\n</template>\n\n\n<script setup=\"props\">\n\timport { computed } from 'vue'\n\timport IconCross from '@martyrs/src/modules/icons/navigation/IconCross.vue';\n\n\tconst emits = defineEmits('close')\n\n\tconst props = defineProps({\n\t  status: String,\n\t  message: String,\n\t  show: Boolean,\n\t  data: Object\n\t})\n\n\tfunction closeError () {\n\t\temits('close')\n\t} \n</script>\n\n<style lang=\"scss\">\n\t.error-wrapper {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tright: 0;\n\t\topacity: 0.9\n\t}\n</style>\n\n\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AA0BC,UAAM,QAAQ;AASd,aAAS,aAAc;AACtB,YAAM,OAAO;AAAA,IACb;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Status.vue.cjs","sources":["../../../../../src/components/Status/Status.vue"],"sourcesContent":["<template>\n\t<div class=\"pd-small error-wrapper\">\n\t\t<div class=\"\n\t\t\tflex-nowrap flex\n\t\t\tradius-small\n\t\t\tpd-small\n\t\t\tt-white \n\t\t\tbg-fourth\n\t\t\">\n\t\t\t<p class=\"w-100\">\n\t\t\t\t{{data.message}}\n\t\t\t\t<!-- <span class=\"t-semi\">Ошибка: {{status}} </span> -->\n\t\t\t\t<br>\n\t\t\t\t<!-- <span>Сообщение: {{message}}</span> -->\n\t\t\t</p>\n\t\t\t\n\t\t\t<IconCross @click=\"closeError()\"  class=\"cursor-pointer hover-scale-1 i-regular z-index-5\"/>\n\t\t</div>\n\t</div>\n</template>\n\n\n<script setup=\"props\">\n\timport { computed } from 'vue'\n\timport IconCross from '@martyrs/src/modules/icons/navigation/IconCross.vue';\n\n\tconst emits = defineEmits('close')\n\n\tconst props = defineProps({\n\t  status: String,\n\t  message: String,\n\t  show: Boolean,\n\t  data: Object\n\t})\n\n\tfunction closeError () {\n\t\temits('close')\n\t} \n</script>\n\n<style lang=\"scss\">\n\t.error-wrapper {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tright: 0;\n\t}\n</style>\n\n\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AA0BC,UAAM,QAAQ;AASd,aAAS,aAAc;AACtB,YAAM,OAAO;AAAA,IACb;;;;;;;;;;;;;;;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"Status.vue.js","sources":["../../../../../src/components/Status/Status.vue"],"sourcesContent":["<template>\n\t<div class=\"pd-small error-wrapper\">\n\t\t<div class=\"\n\t\t\tflex-nowrap flex\n\t\t\tradius-small\n\t\t\tpd-small\n\t\t\tt-white \n\t\t\tbg-fourth\n\t\t\">\n\t\t\t<p class=\"w-100\">\n\t\t\t\t{{data.message}}\n\t\t\t\t<!-- <span class=\"t-semi\">Ошибка: {{status}} </span> -->\n\t\t\t\t<br>\n\t\t\t\t<!-- <span>Сообщение: {{message}}</span> -->\n\t\t\t</p>\n\t\t\t\n\t\t\t<IconCross @click=\"closeError()\"  class=\"cursor-pointer hover-scale-1 i-regular z-index-5\"/>\n\t\t</div>\n\t</div>\n</template>\n\n\n<script setup=\"props\">\n\timport { computed } from 'vue'\n\timport IconCross from '@martyrs/src/modules/icons/navigation/IconCross.vue';\n\n\tconst emits = defineEmits('close')\n\n\tconst props = defineProps({\n\t  status: String,\n\t  message: String,\n\t  show: Boolean,\n\t  data: Object\n\t})\n\n\tfunction closeError () {\n\t\temits('close')\n\t} \n</script>\n\n<style lang=\"scss\">\n\t.error-wrapper {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tright: 0;\n\t\topacity: 0.9\n\t}\n</style>\n\n\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AA0BC,UAAM,QAAQ;AASd,aAAS,aAAc;AACtB,YAAM,OAAO;AAAA,IACb;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Status.vue.js","sources":["../../../../../src/components/Status/Status.vue"],"sourcesContent":["<template>\n\t<div class=\"pd-small error-wrapper\">\n\t\t<div class=\"\n\t\t\tflex-nowrap flex\n\t\t\tradius-small\n\t\t\tpd-small\n\t\t\tt-white \n\t\t\tbg-fourth\n\t\t\">\n\t\t\t<p class=\"w-100\">\n\t\t\t\t{{data.message}}\n\t\t\t\t<!-- <span class=\"t-semi\">Ошибка: {{status}} </span> -->\n\t\t\t\t<br>\n\t\t\t\t<!-- <span>Сообщение: {{message}}</span> -->\n\t\t\t</p>\n\t\t\t\n\t\t\t<IconCross @click=\"closeError()\"  class=\"cursor-pointer hover-scale-1 i-regular z-index-5\"/>\n\t\t</div>\n\t</div>\n</template>\n\n\n<script setup=\"props\">\n\timport { computed } from 'vue'\n\timport IconCross from '@martyrs/src/modules/icons/navigation/IconCross.vue';\n\n\tconst emits = defineEmits('close')\n\n\tconst props = defineProps({\n\t  status: String,\n\t  message: String,\n\t  show: Boolean,\n\t  data: Object\n\t})\n\n\tfunction closeError () {\n\t\temits('close')\n\t} \n</script>\n\n<style lang=\"scss\">\n\t.error-wrapper {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tright: 0;\n\t}\n</style>\n\n\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AA0BC,UAAM,QAAQ;AASd,aAAS,aAAc;AACtB,YAAM,OAAO;AAAA,IACb;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Tooltip/Tooltip.vue2.cjs

@@ -18,7 +18,7 @@ const _sfc_main = {
       zIndex: 1e3,
       background: "#333",
       color: "#fff",
-      padding: "5px 10px",
+      padding: "5px",
       borderRadius: "3px",
       fontSize: "14px",
       display: "none"
@@ -43,7 +43,9 @@ const _sfc_main = {
         vue.createElementVNode("div", {
           class: "tooltip-content",
           style: vue.normalizeStyle(tooltipStyle)
-        }, vue.toDisplayString(__props.text), 5)
+        }, [
+          vue.createElementVNode("span", null, vue.toDisplayString(__props.text), 1)
+        ], 4)
       ], 32);
     };
   }

package/dist/martyrs/src/components/Tooltip/Tooltip.vue2.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.vue2.cjs","sources":["../../../../../src/components/Tooltip/Tooltip.vue"],"sourcesContent":["<template>\n  <div class=\"cursor-pointer tooltip-container\" @mouseover=\"showTooltip\" @mouseleave=\"hideTooltip\">\n    <slot></slot>\n    <div  class=\"tooltip-content\" :style=\"tooltipStyle\">\n      {{ text }}\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, reactive } from 'vue';\n\nconst props = defineProps({\n  text: {\n    type: String,\n    required: true\n  }\n});\n\nconst visible = ref(false);\n\nconst tooltipStyle = reactive({\n  position: 'absolute',\n  width: 'max-content',\n  zIndex: 1000,\n  background: '#333',\n  color: '#fff',\n  padding: '5px 10px',\n  borderRadius: '3px',\n  fontSize: '14px',\n  display: 'none',\n});\n\nfunction showTooltip(event) {\n  visible.value = true;\n  tooltipStyle.left = `${(event.clientX / 100) + 10 }px`;\n  tooltipStyle.top = `${(event.clientY / 100) + 10 }px`;\n  tooltipStyle.display = 'block';\n}\n\nfunction hideTooltip() {\n  visible.value = false;\n  tooltipStyle.display = 'none';\n}\n</script>\n\n<style >\n.tooltip-container {\n  position: relative;\n  display: inline-block;\n}\n\n.tooltip-content {\n  pointer-events: none;\n}\n</style>"],"names":["ref","reactive"],"mappings":";;;;;;;;;;;;;AAmBA,UAAM,UAAUA,IAAG,IAAC,KAAK;AAEzB,UAAM,eAAeC,IAAAA,SAAS;AAAA,MAC5B,UAAU;AAAA,MACV,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,cAAc;AAAA,MACd,UAAU;AAAA,MACV,SAAS;AAAA,IACX,CAAC;AAED,aAAS,YAAY,OAAO;AAC1B,cAAQ,QAAQ;AAChB,mBAAa,OAAO,GAAI,MAAM,UAAU,MAAO,EAAE;AACjD,mBAAa,MAAM,GAAI,MAAM,UAAU,MAAO,EAAE;AAChD,mBAAa,UAAU;AAAA,IACzB;AAEA,aAAS,cAAc;AACrB,cAAQ,QAAQ;AAChB,mBAAa,UAAU;AAAA,IACzB;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Tooltip.vue2.cjs","sources":["../../../../../src/components/Tooltip/Tooltip.vue"],"sourcesContent":["<template>\n  <div class=\"cursor-pointer tooltip-container\" @mouseover=\"showTooltip\" @mouseleave=\"hideTooltip\">\n    <slot></slot>\n    <div  class=\"tooltip-content\" :style=\"tooltipStyle\">\n      <span>{{ text }}</span>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, reactive } from 'vue';\n\nconst props = defineProps({\n  text: {\n    type: String,\n    required: true\n  }\n});\n\nconst visible = ref(false);\n\nconst tooltipStyle = reactive({\n  position: 'absolute',\n  width: 'max-content',\n  zIndex: 1000,\n  background: '#333',\n  color: '#fff',\n  padding: '5px',\n  borderRadius: '3px',\n  fontSize: '14px',\n  display: 'none',\n});\n\nfunction showTooltip(event) {\n  visible.value = true;\n  tooltipStyle.left = `${(event.clientX / 100) + 10 }px`;\n  tooltipStyle.top = `${(event.clientY / 100) + 10 }px`;\n  tooltipStyle.display = 'block';\n}\n\nfunction hideTooltip() {\n  visible.value = false;\n  tooltipStyle.display = 'none';\n}\n</script>\n\n<style >\n.tooltip-container {\n  position: relative;\n  display: inline-block;\n}\n\n.tooltip-content {\n  pointer-events: none;\n}\n</style>"],"names":["ref","reactive"],"mappings":";;;;;;;;;;;;;AAmBA,UAAM,UAAUA,IAAG,IAAC,KAAK;AAEzB,UAAM,eAAeC,IAAAA,SAAS;AAAA,MAC5B,UAAU;AAAA,MACV,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,cAAc;AAAA,MACd,UAAU;AAAA,MACV,SAAS;AAAA,IACX,CAAC;AAED,aAAS,YAAY,OAAO;AAC1B,cAAQ,QAAQ;AAChB,mBAAa,OAAO,GAAI,MAAM,UAAU,MAAO,EAAE;AACjD,mBAAa,MAAM,GAAI,MAAM,UAAU,MAAO,EAAE;AAChD,mBAAa,UAAU;AAAA,IACzB;AAEA,aAAS,cAAc;AACrB,cAAQ,QAAQ;AAChB,mBAAa,UAAU;AAAA,IACzB;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Tooltip/Tooltip.vue2.js

@@ -16,7 +16,7 @@ const _sfc_main = {
       zIndex: 1e3,
       background: "#333",
       color: "#fff",
-      padding: "5px 10px",
+      padding: "5px",
       borderRadius: "3px",
       fontSize: "14px",
       display: "none"
@@ -41,7 +41,9 @@ const _sfc_main = {
         createElementVNode("div", {
           class: "tooltip-content",
           style: normalizeStyle(tooltipStyle)
-        }, toDisplayString(__props.text), 5)
+        }, [
+          createElementVNode("span", null, toDisplayString(__props.text), 1)
+        ], 4)
       ], 32);
     };
   }

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.vue2.js","sources":["../../../../../src/components/Tooltip/Tooltip.vue"],"sourcesContent":["<template>\n  <div class=\"cursor-pointer tooltip-container\" @mouseover=\"showTooltip\" @mouseleave=\"hideTooltip\">\n    <slot></slot>\n    <div  class=\"tooltip-content\" :style=\"tooltipStyle\">\n      {{ text }}\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, reactive } from 'vue';\n\nconst props = defineProps({\n  text: {\n    type: String,\n    required: true\n  }\n});\n\nconst visible = ref(false);\n\nconst tooltipStyle = reactive({\n  position: 'absolute',\n  width: 'max-content',\n  zIndex: 1000,\n  background: '#333',\n  color: '#fff',\n  padding: '5px 10px',\n  borderRadius: '3px',\n  fontSize: '14px',\n  display: 'none',\n});\n\nfunction showTooltip(event) {\n  visible.value = true;\n  tooltipStyle.left = `${(event.clientX / 100) + 10 }px`;\n  tooltipStyle.top = `${(event.clientY / 100) + 10 }px`;\n  tooltipStyle.display = 'block';\n}\n\nfunction hideTooltip() {\n  visible.value = false;\n  tooltipStyle.display = 'none';\n}\n</script>\n\n<style >\n.tooltip-container {\n  position: relative;\n  display: inline-block;\n}\n\n.tooltip-content {\n  pointer-events: none;\n}\n</style>"],"names":[],"mappings":";;;;;;;;;;;AAmBA,UAAM,UAAU,IAAI,KAAK;AAEzB,UAAM,eAAe,SAAS;AAAA,MAC5B,UAAU;AAAA,MACV,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,cAAc;AAAA,MACd,UAAU;AAAA,MACV,SAAS;AAAA,IACX,CAAC;AAED,aAAS,YAAY,OAAO;AAC1B,cAAQ,QAAQ;AAChB,mBAAa,OAAO,GAAI,MAAM,UAAU,MAAO,EAAE;AACjD,mBAAa,MAAM,GAAI,MAAM,UAAU,MAAO,EAAE;AAChD,mBAAa,UAAU;AAAA,IACzB;AAEA,aAAS,cAAc;AACrB,cAAQ,QAAQ;AAChB,mBAAa,UAAU;AAAA,IACzB;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Tooltip.vue2.js","sources":["../../../../../src/components/Tooltip/Tooltip.vue"],"sourcesContent":["<template>\n  <div class=\"cursor-pointer tooltip-container\" @mouseover=\"showTooltip\" @mouseleave=\"hideTooltip\">\n    <slot></slot>\n    <div  class=\"tooltip-content\" :style=\"tooltipStyle\">\n      <span>{{ text }}</span>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, reactive } from 'vue';\n\nconst props = defineProps({\n  text: {\n    type: String,\n    required: true\n  }\n});\n\nconst visible = ref(false);\n\nconst tooltipStyle = reactive({\n  position: 'absolute',\n  width: 'max-content',\n  zIndex: 1000,\n  background: '#333',\n  color: '#fff',\n  padding: '5px',\n  borderRadius: '3px',\n  fontSize: '14px',\n  display: 'none',\n});\n\nfunction showTooltip(event) {\n  visible.value = true;\n  tooltipStyle.left = `${(event.clientX / 100) + 10 }px`;\n  tooltipStyle.top = `${(event.clientY / 100) + 10 }px`;\n  tooltipStyle.display = 'block';\n}\n\nfunction hideTooltip() {\n  visible.value = false;\n  tooltipStyle.display = 'none';\n}\n</script>\n\n<style >\n.tooltip-container {\n  position: relative;\n  display: inline-block;\n}\n\n.tooltip-content {\n  pointer-events: none;\n}\n</style>"],"names":[],"mappings":";;;;;;;;;;;AAmBA,UAAM,UAAU,IAAI,KAAK;AAEzB,UAAM,eAAe,SAAS;AAAA,MAC5B,UAAU;AAAA,MACV,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,cAAc;AAAA,MACd,UAAU;AAAA,MACV,SAAS;AAAA,IACX,CAAC;AAED,aAAS,YAAY,OAAO;AAC1B,cAAQ,QAAQ;AAChB,mBAAa,OAAO,GAAI,MAAM,UAAU,MAAO,EAAE;AACjD,mBAAa,MAAM,GAAI,MAAM,UAAU,MAAO,EAAE;AAChD,mBAAa,UAAU;AAAA,IACzB;AAEA,aAAS,cAAc;AACrB,cAAQ,QAAQ;AAChB,mBAAa,UAAU;AAAA,IACzB;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/auth/views/components/pages/Profile.vue.cjs

@@ -4,7 +4,7 @@ const vue = require("vue");
 ;/* empty css                                            */
 ;/* empty css                                            */
 const Dropdown = require("../../../../../components/Dropdown/Dropdown.vue.cjs");
-const Menu = require("../../../../../components/Menu/Menu.vue.cjs");
+const Menu = require("../../../../../components/Menu/Menu.vue2.cjs");
 const MenuItem = require("../../../../../components/Menu/MenuItem.vue.cjs");
 const ButtonToggleMembership = require("../../../../organizations/components/elements/ButtonToggleMembership.vue.cjs");
 const FormReport = require("../../../../reports/components/sections/FormReport.vue.cjs");
@@ -105,6 +105,7 @@ const _sfc_main = {
     }
     return (_ctx, _cache) => {
       var _a;
+      const _component_RouterView = vue.resolveComponent("RouterView");
       return show.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
         ((_a = users.state.current) == null ? void 0 : _a.status) === "removed" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, " Sorry, user has been removed. ")) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
           vue.createElementVNode("section", _hoisted_4, [
@@ -193,6 +194,7 @@ const _sfc_main = {
               class: "mn-r-auto mn-l-auto"
             }, null, 8, ["telegram", "facebook", "instagram", "twitter"])
           ]),
+          vue.createVNode(_component_RouterView),
           filteredModules.value.length > 0 ? (vue.openBlock(), vue.createBlock(Menu.default, {
             key: 0,
             class: "mn-b-regular bg-light"