npm - @ozdao/martyrs - Versions diffs - 0.2.471 → 0.2.473 - Mend

@ozdao/martyrs 0.2.471 → 0.2.473

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (559) hide show

package/dist/martyrs/src/components/Dropdown/{Dropdown.vue2.cjs → Dropdown.vue.cjs} RENAMED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
 const clickOutside = require("../FieldPhone/click-outside.cjs");
-;/* empty css               */
+;/* empty css                */
 const _hoisted_1 = {
   key: 0,
   class: "w-100 h-100 flex-center flex"
@@ -61,4 +61,4 @@ const _sfc_main = {
   }
 };
 exports.default = _sfc_main;
-//# sourceMappingURL=Dropdown.vue2.cjs.map
+//# sourceMappingURL=Dropdown.vue.cjs.map

package/dist/martyrs/src/components/Dropdown/{Dropdown.vue2.js.map → Dropdown.vue.cjs.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dropdown.~~vue2~~.js","sources":["../../../../../src/components/Dropdown/Dropdown.vue"],"sourcesContent":["<template>\n <div class=\"dropdown pos-relative\" v-click-outside=\"clickedOutside\" @click.stop=\"isOpen = !isOpen\">\n <div v-if=\"isComponentLabel\" class=\"w-100 h-100 flex-center flex\">\n <component :is=\"label.component\" v-bind=\"label.props\" :class=\"label.class\"></component>\n </div>\n <div v-else>\n {{ label }}\n </div>\n <transition name=\"TransitionTranslateY\" mode=\"out-in\">\n <div \n v-show=\"isOpen\" \n :style=\"{ left: align === 'left' ? '0' : 'auto', right: align === 'right' ? '0' : 'auto' }\" \n class=\"dropdown-content radius-big\" \n >\n <slot></slot>\n </div>\n </transition>\n </div>\n</template>\n\n<script setup>\nimport { ref, computed } from 'vue';\nimport clickOutside from '../FieldPhone/click-outside';\n\nlet vClickOutside = clickOutside\n\nconst props = defineProps({\n label: {\n type: [String, Object],\n default: 'Open'\n },\n align: {\n type: String,\n default: 'left'\n }\n})\n\nconst isOpen = ref(false);\nconst isComponentLabel = computed(() => typeof props.label === 'object');\n\nfunction clickedOutside () {\n isOpen.value = false\n}\n</script>\n\n<style >\n.dropdown-content {\n display: block;\n position: absolute;\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n z-index: 1;\n}\n\n/.dropdown:hover .dropdown-content {\n display: block;\n}/\n</style>\n"],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;~~AAwBA,QAAI,~~gBAAgB~~;AAEpB,UAAM,QAAQ;AAWd,UAAM,~~SAAS~~,~~IAAI~~,KAAK;AACxB,UAAM,~~mBAAmB~~,SAAS,MAAM,OAAO,MAAM,UAAU,QAAQ;AAEvE,aAAS,iBAAkB;AACzB,aAAO,QAAQ;AAAA,IACjB~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"Dropdown.vue.cjs","sources":["../../../../../src/components/Dropdown/Dropdown.vue"],"sourcesContent":["<template>\n <div class=\"dropdown pos-relative\" v-click-outside=\"clickedOutside\" @click.stop=\"isOpen = !isOpen\">\n <div v-if=\"isComponentLabel\" class=\"w-100 h-100 flex-center flex\">\n <component :is=\"label.component\" v-bind=\"label.props\" :class=\"label.class\"></component>\n </div>\n <div v-else>\n {{ label }}\n </div>\n <transition name=\"TransitionTranslateY\" mode=\"out-in\">\n <div \n v-show=\"isOpen\" \n :style=\"{ left: align === 'left' ? '0' : 'auto', right: align === 'right' ? '0' : 'auto' }\" \n class=\"dropdown-content radius-big\" \n >\n <slot></slot>\n </div>\n </transition>\n </div>\n</template>\n\n<script setup>\nimport { ref, computed } from 'vue';\nimport clickOutside from '../FieldPhone/click-outside';\n\nlet vClickOutside = clickOutside\n\nconst props = defineProps({\n label: {\n type: [String, Object],\n default: 'Open'\n },\n align: {\n type: String,\n default: 'left'\n }\n})\n\nconst isOpen = ref(false);\nconst isComponentLabel = computed(() => typeof props.label === 'object');\n\nfunction clickedOutside () {\n isOpen.value = false\n}\n</script>\n\n<style >\n.dropdown-content {\n display: block;\n position: absolute;\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n z-index: 1;\n}\n\n/.dropdown:hover .dropdown-content {\n display: block;\n}/\n</style>\n"],"names":["clickOutside","ref","computed"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAwBA,QAAI,gBAAgBA,aAAAA;AAEpB,UAAM,QAAQ;AAWd,UAAM,SAASC,IAAG,IAAC,KAAK;AACxB,UAAM,mBAAmBC,IAAAA,SAAS,MAAM,OAAO,MAAM,UAAU,QAAQ;AAEvE,aAAS,iBAAkB;AACzB,aAAO,QAAQ;AAAA,IACjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Dropdown/{Dropdown.vue2.js → Dropdown.vue.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { ref, computed, withDirectives, createElementBlock, openBlock, withModifiers, createVNode, createBlock, resolveDynamicComponent, mergeProps, toDisplayString, Transition, withCtx, createElementVNode, normalizeStyle, renderSlot, vShow, unref } from "vue";
 import clickOutside from "../FieldPhone/click-outside.js";
-/* empty css             */
+/* empty css              */
 const _hoisted_1 = {
   key: 0,
   class: "w-100 h-100 flex-center flex"
@@ -61,4 +61,4 @@ const _sfc_main = {
 export {
   _sfc_main as default
 };
-//# sourceMappingURL=Dropdown.vue2.js.map
+//# sourceMappingURL=Dropdown.vue.js.map

package/dist/martyrs/src/components/Dropdown/Dropdown.vue.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Dropdown.vue.js","sources":["../../../../../src/components/Dropdown/Dropdown.vue"],"sourcesContent":["<template>\n <div class=\"dropdown pos-relative\" v-click-outside=\"clickedOutside\" @click.stop=\"isOpen = !isOpen\">\n <div v-if=\"isComponentLabel\" class=\"w-100 h-100 flex-center flex\">\n <component :is=\"label.component\" v-bind=\"label.props\" :class=\"label.class\"></component>\n </div>\n <div v-else>\n {{ label }}\n </div>\n <transition name=\"TransitionTranslateY\" mode=\"out-in\">\n <div \n v-show=\"isOpen\" \n :style=\"{ left: align === 'left' ? '0' : 'auto', right: align === 'right' ? '0' : 'auto' }\" \n class=\"dropdown-content radius-big\" \n >\n <slot></slot>\n </div>\n </transition>\n </div>\n</template>\n\n<script setup>\nimport { ref, computed } from 'vue';\nimport clickOutside from '../FieldPhone/click-outside';\n\nlet vClickOutside = clickOutside\n\nconst props = defineProps({\n label: {\n type: [String, Object],\n default: 'Open'\n },\n align: {\n type: String,\n default: 'left'\n }\n})\n\nconst isOpen = ref(false);\nconst isComponentLabel = computed(() => typeof props.label === 'object');\n\nfunction clickedOutside () {\n isOpen.value = false\n}\n</script>\n\n<style >\n.dropdown-content {\n display: block;\n position: absolute;\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n z-index: 1;\n}\n\n/*.dropdown:hover .dropdown-content {\n display: block;\n}*/\n</style>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAwBA,QAAI,gBAAgB;AAEpB,UAAM,QAAQ;AAWd,UAAM,SAAS,IAAI,KAAK;AACxB,UAAM,mBAAmB,SAAS,MAAM,OAAO,MAAM,UAAU,QAAQ;AAEvE,aAAS,iBAAkB;AACzB,aAAO,QAAQ;AAAA,IACjB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Feed/Feed.vue.cjs CHANGED Viewed

@@ -4,7 +4,7 @@ const vue = require("vue");
 const Loader = require("../Loader/Loader.vue2.cjs");
 const Skeleton = require("../Skeleton/Skeleton.vue.cjs");
 const EmptyState = require("../EmptyState/EmptyState.vue.cjs");
-const Dropdown = require("../Dropdown/Dropdown.vue2.cjs");
+const Dropdown = require("../Dropdown/Dropdown.vue.cjs");
 const Calendar = require("../DatePicker/Calendar.vue.cjs");
 const BottomSheet = require("../BottomSheet/BottomSheet.vue.cjs");
 const BlockSearch = require("../../modules/globals/views/components/blocks/BlockSearch.vue.cjs");
@@ -178,7 +178,7 @@ const _sfc_main = {
       isLoading.value = false;
     };
     vue.watch(
-      () => [props.external, date.value, sort.value, props.options],
+      [() => props.external, () => date.value, () => ({ ...sort.value }), () => ({ ...props.options })],
       ([newExternal, newDate, newSort, newOptions], [oldExternal, oldDate, oldSort, oldOptions]) => {
         if (newExternal !== oldExternal || newDate !== oldDate || (newSort == null ? void 0 : newSort.order) !== (oldSort == null ? void 0 : oldSort.order) || (newSort == null ? void 0 : newSort.param) !== (oldSort == null ? void 0 : oldSort.param) || JSON.stringify(newOptions) !== JSON.stringify(oldOptions)) {
           currentSkip.value = 0;
@@ -301,7 +301,7 @@ const _sfc_main = {
                 return vue.openBlock(), vue.createBlock(Skeleton.default, {
                   structure: __props.skeleton.structure,
                   horizontal: __props.skeleton.horizontal,
-                  loading: vue.unref(isLoading),
+                  loading: __props.skeleton.apply_to_slot,
                   key: "skeleton-" + i,
                   class: "radius-medium o-hidden d-block"
                 }, null, 8, ["structure", "horizontal", "loading"]);

package/dist/martyrs/src/components/Feed/Feed.vue.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Feed.vue.cjs","sources":["../../../../../src/components/Feed/Feed.vue"],"sourcesContent":["<template>\n\n <div v-if=\"search \|\| date \|\| (sort && !sort.hideButton)\" class=\"mn-b-thin 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 <template\n v-if=\"filter\"\n >\n <div \n :class=\"filter.class \|\| 'bg-light'\"\n class=\"flex-center flex pd-thin bg-light radius-extra aspect-1x1 h-100\"\n >\n <IconFilter @click=\"() => filter.active = !filter.active\" class=\"w-1r h-auto\"/>\n </div>\n\n \n <BottomSheet\n :show=\"filter.active\"\n @toggle=\"() => filter.active = false\"\n class=\"z-index-10 pos-fixed pos-r-0\"\n :class=\"{\n 'pos-t-4r': filter.active,\n 'pos-t-100': !filter.active\n }\"\n >\n <BlockFilter\n v-model:filter=\"filter\"\n :options=\"filter.options\"\n @click_filter=\"() => { filter.active = false } \"\n class=\"h-100 w-100 pd-small pd-b-5r bg-light\"\n />\n </BottomSheet> \n </template>\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-big\"\n :align=\"search ? 'right' : 'left'\"\n >\n\n <Calendar\n v-model:date=\"date\"\n :locale=\"$i18n.locale\"\n :allowRange=\"true\"\n class=\"radius-semi 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-extra 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-semi t-white bg-black\"\n />\n </Dropdown> \n </div>\n\n <TransitionGroup \n v-if=\"isLoading\"\n tag=\"ul\" \n name=\"scaleTransition\" \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=\"isLoading\"\n :key=\"'skeleton-' + i\"\n class=\"radius-medium o-hidden d-block\"\n />\n <Loader v-if=\"isLoading && skeleton?.hide\"/>\n </TransitionGroup>\n\n <TransitionGroup \n tag=\"ul\" \n v-if=\"!isLoading && 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=\"pd-medium mn-b-thin bg-light radius-medium\"\n />\n </TransitionGroup>\n\n <TransitionGroup \n tag=\"ul\" \n name=\"feed\"\n :class=\"$attrs.class\"\n >\n <slot\n v-if=\"!isLoading && itemsList.length > 0\"\n :items=\"itemsList\"\n >\n </slot>\n </TransitionGroup>\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\n v-if=\"isLoadingExtra\"\n class=\"col-w-100 w-100 pos-relative\"\n >\n <Loader/>\n </div>\n \n\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, shallowRef, watch } from 'vue';\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/DatePicker/Calendar.vue'\nimport BottomSheet from '@martyrs/src/components/BottomSheet/BottomSheet.vue';\n\nimport BlockSearch from '@martyrs/src/modules/globals/views/components/blocks/BlockSearch.vue'\nimport BlockSorting from '@martyrs/src/modules/globals/views/components/blocks/BlockSorting.vue'\nimport BlockFilter from '@martyrs/src/modules/globals/views/components/blocks/BlockFilter.vue'\n\nimport ButtonSort from '@martyrs/src/modules/globals/views/components/elements/ButtonSort.vue'\nimport ButtonDate from '@martyrs/src/modules/globals/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 search = defineModel('search')\nconst sort = defineModel('sort')\nconst filter = defineModel('filter')\nconst date = defineModel('date')\nconst items = defineModel('items')\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 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});\n \nconst itemsList = shallowRef(items.value \|\| []);\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\n// let sortParam = ref(sort.value?.param \|\| 'createdAt');\n// let sortOrder = ref(sort.value?.order \|\| 'asc');\n\nlet currentSearch = ref('');\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 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 loadMoreItems = async () => {\n isLoadingExtra.value = true\n\n if (hasMoreItems.value) {\n currentSkip.value += currentLimit.value;\n \n const data = await props.store.read({\n skip: currentSkip.value,\n limit: currentLimit.value,\n search: currentSearch.value,\n dateStart: date.value ? date.value.start : null,\n dateEnd: date.value ? date.value.end : null,\n sortParam: sort.value ? sort.value.param : null,\n sortOrder: sort.value ? sort.value.order : null,\n ...props.options\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 itemsList.value = [...itemsList.value, ...data];\n \n if (items.value) items.value = itemsList.value;\n }\n\n isLoadingExtra.value = false\n};\n\nconst fetchItems = async () => {\n isLoading.value = true;\n const data = await props.store.read({\n skip: currentSkip.value,\n limit: currentLimit.value,\n dateStart: date.value ? date.value.start : null,\n dateEnd: date.value ? date.value.end : null,\n sortParam: sort.value ? sort.value.param : null,\n sortOrder: sort.value ? sort.value.order : null,\n search: currentSearch.value,\n ...props.options\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 itemsList.value = data;\n if (items.value) items.value = itemsList.value;\n isLoading.value = false;\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\n<style>\n.feed-move, /* apply transition to moving elements /\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/ ensure leaving items are taken out of layout flow so that moving\n animations can be calculated correctly. */\n.feed-leave-active {\n position: absolute;\n}\n</style>"],"names":["_useModel","shallowRef","ref","search","watch","onMounted","onUnmounted"],"mappings":"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"}
1	+ {"version":3,"file":"Feed.vue.cjs","sources":["../../../../../src/components/Feed/Feed.vue"],"sourcesContent":["<template>\n\n <div v-if=\"search \|\| date \|\| (sort && !sort.hideButton)\" class=\"mn-b-thin 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 <template\n v-if=\"filter\"\n >\n <div \n :class=\"filter.class \|\| 'bg-light'\"\n class=\"flex-center flex pd-thin bg-light radius-extra aspect-1x1 h-100\"\n >\n <IconFilter @click=\"() => filter.active = !filter.active\" class=\"w-1r h-auto\"/>\n </div>\n\n \n <BottomSheet\n :show=\"filter.active\"\n @toggle=\"() => filter.active = false\"\n class=\"z-index-10 pos-fixed pos-r-0\"\n :class=\"{\n 'pos-t-4r': filter.active,\n 'pos-t-100': !filter.active\n }\"\n >\n <BlockFilter\n v-model:filter=\"filter\"\n :options=\"filter.options\"\n @click_filter=\"() => { filter.active = false } \"\n class=\"h-100 w-100 pd-small pd-b-5r bg-light\"\n />\n </BottomSheet> \n </template>\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-big\"\n :align=\"search ? 'right' : 'left'\"\n >\n\n <Calendar\n v-model:date=\"date\"\n :locale=\"$i18n.locale\"\n :allowRange=\"true\"\n class=\"radius-semi 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-extra 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-semi t-white bg-black\"\n />\n </Dropdown> \n </div>\n\n <TransitionGroup \n v-if=\"isLoading\"\n tag=\"ul\" \n name=\"scaleTransition\" \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=\"radius-medium o-hidden d-block\"\n />\n <Loader v-if=\"isLoading && skeleton?.hide\"/>\n </TransitionGroup>\n\n <TransitionGroup \n tag=\"ul\" \n v-if=\"!isLoading && 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=\"pd-medium mn-b-thin bg-light radius-medium\"\n />\n </TransitionGroup>\n\n <TransitionGroup \n tag=\"ul\" \n name=\"feed\"\n :class=\"$attrs.class\"\n >\n <slot\n v-if=\"!isLoading && itemsList.length > 0\"\n :items=\"itemsList\"\n >\n </slot>\n </TransitionGroup>\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\n v-if=\"isLoadingExtra\"\n class=\"col-w-100 w-100 pos-relative\"\n >\n <Loader/>\n </div>\n \n\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, shallowRef, watch } from 'vue';\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/DatePicker/Calendar.vue'\nimport BottomSheet from '@martyrs/src/components/BottomSheet/BottomSheet.vue';\n\nimport BlockSearch from '@martyrs/src/modules/globals/views/components/blocks/BlockSearch.vue'\nimport BlockSorting from '@martyrs/src/modules/globals/views/components/blocks/BlockSorting.vue'\nimport BlockFilter from '@martyrs/src/modules/globals/views/components/blocks/BlockFilter.vue'\n\nimport ButtonSort from '@martyrs/src/modules/globals/views/components/elements/ButtonSort.vue'\nimport ButtonDate from '@martyrs/src/modules/globals/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 search = defineModel('search')\nconst sort = defineModel('sort')\nconst filter = defineModel('filter')\nconst date = defineModel('date')\nconst items = defineModel('items')\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 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});\n \nconst itemsList = shallowRef(items.value \|\| []);\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('');\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 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 loadMoreItems = async () => {\n isLoadingExtra.value = true\n\n if (hasMoreItems.value) {\n currentSkip.value += currentLimit.value;\n \n const data = await props.store.read({\n skip: currentSkip.value,\n limit: currentLimit.value,\n search: currentSearch.value,\n dateStart: date.value ? date.value.start : null,\n dateEnd: date.value ? date.value.end : null,\n sortParam: sort.value ? sort.value.param : null,\n sortOrder: sort.value ? sort.value.order : null,\n ...props.options\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 itemsList.value = [...itemsList.value, ...data];\n \n if (items.value) items.value = itemsList.value;\n }\n\n isLoadingExtra.value = false\n};\n\nconst fetchItems = async () => {\n isLoading.value = true;\n const data = await props.store.read({\n skip: currentSkip.value,\n limit: currentLimit.value,\n dateStart: date.value ? date.value.start : null,\n dateEnd: date.value ? date.value.end : null,\n sortParam: sort.value ? sort.value.param : null,\n sortOrder: sort.value ? sort.value.order : null,\n search: currentSearch.value,\n ...props.options\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 itemsList.value = data;\n if (items.value) items.value = itemsList.value;\n isLoading.value = false;\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);\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\n<style>\n.feed-move, /* apply transition to moving elements /\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/ ensure leaving items are taken out of layout flow so that moving\n animations can be calculated correctly. */\n.feed-leave-active {\n position: absolute;\n}\n</style>"],"names":["_useModel","shallowRef","ref","search","watch","onMounted","onUnmounted"],"mappings":"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"}

package/dist/martyrs/src/components/Feed/Feed.vue.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { mergeModels, useModel, shallowRef, ref, watch, onMounted, onUnmounted,
 import Loader from "../Loader/Loader.vue2.js";
 import Skeleton from "../Skeleton/Skeleton.vue.js";
 import _sfc_main$9 from "../EmptyState/EmptyState.vue.js";
-import _sfc_main$5 from "../Dropdown/Dropdown.vue2.js";
+import _sfc_main$5 from "../Dropdown/Dropdown.vue.js";
 import Calendar from "../DatePicker/Calendar.vue.js";
 import _sfc_main$3 from "../BottomSheet/BottomSheet.vue.js";
 import _sfc_main$1 from "../../modules/globals/views/components/blocks/BlockSearch.vue.js";
@@ -176,7 +176,7 @@ const _sfc_main = {
       isLoading.value = false;
     };
     watch(
-      () => [props.external, date.value, sort.value, props.options],
+      [() => props.external, () => date.value, () => ({ ...sort.value }), () => ({ ...props.options })],
       ([newExternal, newDate, newSort, newOptions], [oldExternal, oldDate, oldSort, oldOptions]) => {
         if (newExternal !== oldExternal || newDate !== oldDate || (newSort == null ? void 0 : newSort.order) !== (oldSort == null ? void 0 : oldSort.order) || (newSort == null ? void 0 : newSort.param) !== (oldSort == null ? void 0 : oldSort.param) || JSON.stringify(newOptions) !== JSON.stringify(oldOptions)) {
           currentSkip.value = 0;
@@ -299,7 +299,7 @@ const _sfc_main = {
                 return openBlock(), createBlock(Skeleton, {
                   structure: __props.skeleton.structure,
                   horizontal: __props.skeleton.horizontal,
-                  loading: unref(isLoading),
+                  loading: __props.skeleton.apply_to_slot,
                   key: "skeleton-" + i,
                   class: "radius-medium o-hidden d-block"
                 }, null, 8, ["structure", "horizontal", "loading"]);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Feed.vue.js","sources":["../../../../../src/components/Feed/Feed.vue"],"sourcesContent":["<template>\n\n <div v-if=\"search \|\| date \|\| (sort && !sort.hideButton)\" class=\"mn-b-thin 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 <template\n v-if=\"filter\"\n >\n <div \n :class=\"filter.class \|\| 'bg-light'\"\n class=\"flex-center flex pd-thin bg-light radius-extra aspect-1x1 h-100\"\n >\n <IconFilter @click=\"() => filter.active = !filter.active\" class=\"w-1r h-auto\"/>\n </div>\n\n \n <BottomSheet\n :show=\"filter.active\"\n @toggle=\"() => filter.active = false\"\n class=\"z-index-10 pos-fixed pos-r-0\"\n :class=\"{\n 'pos-t-4r': filter.active,\n 'pos-t-100': !filter.active\n }\"\n >\n <BlockFilter\n v-model:filter=\"filter\"\n :options=\"filter.options\"\n @click_filter=\"() => { filter.active = false } \"\n class=\"h-100 w-100 pd-small pd-b-5r bg-light\"\n />\n </BottomSheet> \n </template>\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-big\"\n :align=\"search ? 'right' : 'left'\"\n >\n\n <Calendar\n v-model:date=\"date\"\n :locale=\"$i18n.locale\"\n :allowRange=\"true\"\n class=\"radius-semi 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-extra 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-semi t-white bg-black\"\n />\n </Dropdown> \n </div>\n\n <TransitionGroup \n v-if=\"isLoading\"\n tag=\"ul\" \n name=\"scaleTransition\" \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=\"isLoading\"\n :key=\"'skeleton-' + i\"\n class=\"radius-medium o-hidden d-block\"\n />\n <Loader v-if=\"isLoading && skeleton?.hide\"/>\n </TransitionGroup>\n\n <TransitionGroup \n tag=\"ul\" \n v-if=\"!isLoading && 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=\"pd-medium mn-b-thin bg-light radius-medium\"\n />\n </TransitionGroup>\n\n <TransitionGroup \n tag=\"ul\" \n name=\"feed\"\n :class=\"$attrs.class\"\n >\n <slot\n v-if=\"!isLoading && itemsList.length > 0\"\n :items=\"itemsList\"\n >\n </slot>\n </TransitionGroup>\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\n v-if=\"isLoadingExtra\"\n class=\"col-w-100 w-100 pos-relative\"\n >\n <Loader/>\n </div>\n \n\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, shallowRef, watch } from 'vue';\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/DatePicker/Calendar.vue'\nimport BottomSheet from '@martyrs/src/components/BottomSheet/BottomSheet.vue';\n\nimport BlockSearch from '@martyrs/src/modules/globals/views/components/blocks/BlockSearch.vue'\nimport BlockSorting from '@martyrs/src/modules/globals/views/components/blocks/BlockSorting.vue'\nimport BlockFilter from '@martyrs/src/modules/globals/views/components/blocks/BlockFilter.vue'\n\nimport ButtonSort from '@martyrs/src/modules/globals/views/components/elements/ButtonSort.vue'\nimport ButtonDate from '@martyrs/src/modules/globals/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 search = defineModel('search')\nconst sort = defineModel('sort')\nconst filter = defineModel('filter')\nconst date = defineModel('date')\nconst items = defineModel('items')\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 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});\n \nconst itemsList = shallowRef(items.value \|\| []);\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\n// let sortParam = ref(sort.value?.param \|\| 'createdAt');\n// let sortOrder = ref(sort.value?.order \|\| 'asc');\n\nlet currentSearch = ref('');\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 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 loadMoreItems = async () => {\n isLoadingExtra.value = true\n\n if (hasMoreItems.value) {\n currentSkip.value += currentLimit.value;\n \n const data = await props.store.read({\n skip: currentSkip.value,\n limit: currentLimit.value,\n search: currentSearch.value,\n dateStart: date.value ? date.value.start : null,\n dateEnd: date.value ? date.value.end : null,\n sortParam: sort.value ? sort.value.param : null,\n sortOrder: sort.value ? sort.value.order : null,\n ...props.options\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 itemsList.value = [...itemsList.value, ...data];\n \n if (items.value) items.value = itemsList.value;\n }\n\n isLoadingExtra.value = false\n};\n\nconst fetchItems = async () => {\n isLoading.value = true;\n const data = await props.store.read({\n skip: currentSkip.value,\n limit: currentLimit.value,\n dateStart: date.value ? date.value.start : null,\n dateEnd: date.value ? date.value.end : null,\n sortParam: sort.value ? sort.value.param : null,\n sortOrder: sort.value ? sort.value.order : null,\n search: currentSearch.value,\n ...props.options\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 itemsList.value = data;\n if (items.value) items.value = itemsList.value;\n isLoading.value = false;\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\n<style>\n.feed-move, /* apply transition to moving elements /\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/ ensure leaving items are taken out of layout flow so that moving\n animations can be calculated correctly. */\n.feed-leave-active {\n position: absolute;\n}\n</style>"],"names":["_useModel","search"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyKA,UAAM,SAASA,SAAW,SAAC,QAAQ;AACnC,UAAM,OAAOA,SAAY,SAAA,MAAM;AAC/B,UAAM,SAASA,SAAW,SAAC,QAAQ;AACnC,UAAM,OAAOA,SAAY,SAAA,MAAM;AAC/B,UAAM,QAAQA,SAAY,SAAA,OAAO;AAGjC,UAAM,QAAQ;AA+Dd,UAAM,YAAY,WAAW,MAAM,SAAS,CAAA,CAAE;AAC9C,UAAM,eAAe,IAAI,KAAK;AAE9B,QAAI,YAAY,IAAI,IAAI;AACxB,QAAI,iBAAiB,IAAI,KAAK;AAC9B,QAAI,WAAW,IAAI,IAAI;AAEvB,QAAI,cAAc,IAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ,OAAO,CAAC;AACjE,QAAI,eAAe,IAAI,MAAM,QAAQ,QAAQ,MAAM,QAAQ,QAAQ,EAAE;AAKrE,QAAI,gBAAgB,IAAI,EAAE;AAE1B,aAAS,SAAS,IAAI,OAAO;AAC3B,UAAI,YAAY;AAChB,aAAO,IAAI,SAAS;AAClB,qBAAa,SAAS;AACtB,oBAAY,WAAW,MAAM,GAAG,GAAG,IAAI,GAAG,KAAK;AAAA,MAChD;AAAA,IACH;AAEA,UAAM,kBAAkB,SAAS,CAAC,UAAU;AAC1C,oBAAc,QAAQ;AACtB,kBAAY,QAAQ;AACpB,mBAAa,QAAQ;AACrB,iBAAY;AAAA,IACd,GAAG,GAAG;AAEN,aAAS,aAAaC,SAAQ;AAC5B,sBAAgBA,OAAM;AAAA,IACxB;AAEA,UAAM,gBAAgB,YAAY;AAChC,qBAAe,QAAQ;AAEvB,UAAI,aAAa,OAAO;AACtB,oBAAY,SAAS,aAAa;AAElC,cAAM,OAAO,MAAM,MAAM,MAAM,KAAK;AAAA,UAClC,MAAM,YAAY;AAAA,UAClB,OAAO,aAAa;AAAA,UACpB,QAAQ,cAAc;AAAA,UACtB,WAAW,KAAK,QAAQ,KAAK,MAAM,QAAQ;AAAA,UAC3C,SAAS,KAAK,QAAQ,KAAK,MAAM,MAAM;AAAA,UACvC,WAAW,KAAK,QAAQ,KAAK,MAAM,QAAQ;AAAA,UAC3C,WAAW,KAAK,QAAQ,KAAK,MAAM,QAAQ;AAAA,UAC3C,GAAG,MAAM;AAAA,QACf,CAAK;AAED,YAAI,KAAK,WAAW,GAAG;AACrB,uBAAa,QAAQ;AAAA,QACtB,WAAU,KAAK,SAAS,aAAa,OAAO;AAC3C,uBAAa,QAAQ;AAAA,QAC3B,OAAW;AACL,uBAAa,QAAQ;AAAA,QAC3B;AAEI,kBAAU,QAAQ,CAAC,GAAG,UAAU,OAAO,GAAG,IAAI;AAE9C,YAAI,MAAM,MAAO,OAAM,QAAQ,UAAU;AAAA,MAC7C;AAEE,qBAAe,QAAQ;AAAA,IACzB;AAEA,UAAM,aAAa,YAAY;AAC7B,gBAAU,QAAQ;AAClB,YAAM,OAAO,MAAM,MAAM,MAAM,KAAK;AAAA,QAClC,MAAM,YAAY;AAAA,QAClB,OAAO,aAAa;AAAA,QACpB,WAAW,KAAK,QAAQ,KAAK,MAAM,QAAQ;AAAA,QAC3C,SAAS,KAAK,QAAQ,KAAK,MAAM,MAAM;AAAA,QACvC,WAAW,KAAK,QAAQ,KAAK,MAAM,QAAQ;AAAA,QAC3C,WAAW,KAAK,QAAQ,KAAK,MAAM,QAAQ;AAAA,QAC3C,QAAQ,cAAc;AAAA,QACtB,GAAG,MAAM;AAAA,MACb,CAAG;AAED,UAAI,KAAK,WAAW,GAAG;AACrB,qBAAa,QAAQ;AAAA,MACtB,WAAU,KAAK,SAAS,aAAa,OAAO;AAC3C,qBAAa,QAAQ;AAAA,MACzB,OAAS;AACL,qBAAa,QAAQ;AAAA,MACzB;AAEE,gBAAU,QAAQ;AAClB,UAAI,MAAM,MAAO,OAAM,QAAQ,UAAU;AACzC,gBAAU,QAAQ;AAAA,IACpB;AAEA;AAAA,MACE,MAAM,CAAC,MAAM,UAAU,KAAK,OAAO,KAAK,OAAO,MAAM,OAAO;AAAA,MAC5D,CAAC,CAAC,aAAa,SAAS,SAAS,UAAU,GAAG,CAAC,aAAa,SAAS,SAAS,UAAU,MAAM;AAC5F,YACE,gBAAgB,eAChB,YAAY,YACZ,mCAAS,YAAU,mCAAS,WAC5B,mCAAS,YAAU,mCAAS,UAC5B,KAAK,UAAU,UAAU,MAAM,KAAK,UAAU,UAAU,GACxD;AACA,sBAAY,QAAQ;AACpB,qBAAY;AAAA,QAClB;AAAA,MACG;AAAA,MACD,EAAE,MAAM,KAAI;AAAA,IACd;AAEA,QAAI,WAAW;AAEf,cAAU,YAAY;AACpB,YAAM,WAAU;AAEhB,UAAI,OAAO,WAAW,eAAe,CAAC,MAAM,gBAAgB,MAAM,UAAU;AAC1E,mBAAW,IAAI,qBAAqB,aAAW;AAC7C,cAAI,QAAQ,KAAK,WAAS,MAAM,cAAc,GAAG;AAC/C,0BAAa;AAAA,UACrB;AAAA,QACK,CAAA;AAED,YAAI,SAAS,MAAO,UAAS,QAAQ,SAAS,KAAK;AAAA,MACvD;AAAA,IACA,CAAC;AAED,gBAAY,MAAM;AAChB,UAAI,UAAU;AACZ,iBAAS,WAAY;AAAA,MACzB;AAAA,IACA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"Feed.vue.js","sources":["../../../../../src/components/Feed/Feed.vue"],"sourcesContent":["<template>\n\n <div v-if=\"search \|\| date \|\| (sort && !sort.hideButton)\" class=\"mn-b-thin 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 <template\n v-if=\"filter\"\n >\n <div \n :class=\"filter.class \|\| 'bg-light'\"\n class=\"flex-center flex pd-thin bg-light radius-extra aspect-1x1 h-100\"\n >\n <IconFilter @click=\"() => filter.active = !filter.active\" class=\"w-1r h-auto\"/>\n </div>\n\n \n <BottomSheet\n :show=\"filter.active\"\n @toggle=\"() => filter.active = false\"\n class=\"z-index-10 pos-fixed pos-r-0\"\n :class=\"{\n 'pos-t-4r': filter.active,\n 'pos-t-100': !filter.active\n }\"\n >\n <BlockFilter\n v-model:filter=\"filter\"\n :options=\"filter.options\"\n @click_filter=\"() => { filter.active = false } \"\n class=\"h-100 w-100 pd-small pd-b-5r bg-light\"\n />\n </BottomSheet> \n </template>\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-big\"\n :align=\"search ? 'right' : 'left'\"\n >\n\n <Calendar\n v-model:date=\"date\"\n :locale=\"$i18n.locale\"\n :allowRange=\"true\"\n class=\"radius-semi 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-extra 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-semi t-white bg-black\"\n />\n </Dropdown> \n </div>\n\n <TransitionGroup \n v-if=\"isLoading\"\n tag=\"ul\" \n name=\"scaleTransition\" \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=\"radius-medium o-hidden d-block\"\n />\n <Loader v-if=\"isLoading && skeleton?.hide\"/>\n </TransitionGroup>\n\n <TransitionGroup \n tag=\"ul\" \n v-if=\"!isLoading && 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=\"pd-medium mn-b-thin bg-light radius-medium\"\n />\n </TransitionGroup>\n\n <TransitionGroup \n tag=\"ul\" \n name=\"feed\"\n :class=\"$attrs.class\"\n >\n <slot\n v-if=\"!isLoading && itemsList.length > 0\"\n :items=\"itemsList\"\n >\n </slot>\n </TransitionGroup>\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\n v-if=\"isLoadingExtra\"\n class=\"col-w-100 w-100 pos-relative\"\n >\n <Loader/>\n </div>\n \n\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, shallowRef, watch } from 'vue';\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/DatePicker/Calendar.vue'\nimport BottomSheet from '@martyrs/src/components/BottomSheet/BottomSheet.vue';\n\nimport BlockSearch from '@martyrs/src/modules/globals/views/components/blocks/BlockSearch.vue'\nimport BlockSorting from '@martyrs/src/modules/globals/views/components/blocks/BlockSorting.vue'\nimport BlockFilter from '@martyrs/src/modules/globals/views/components/blocks/BlockFilter.vue'\n\nimport ButtonSort from '@martyrs/src/modules/globals/views/components/elements/ButtonSort.vue'\nimport ButtonDate from '@martyrs/src/modules/globals/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 search = defineModel('search')\nconst sort = defineModel('sort')\nconst filter = defineModel('filter')\nconst date = defineModel('date')\nconst items = defineModel('items')\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 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});\n \nconst itemsList = shallowRef(items.value \|\| []);\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('');\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 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 loadMoreItems = async () => {\n isLoadingExtra.value = true\n\n if (hasMoreItems.value) {\n currentSkip.value += currentLimit.value;\n \n const data = await props.store.read({\n skip: currentSkip.value,\n limit: currentLimit.value,\n search: currentSearch.value,\n dateStart: date.value ? date.value.start : null,\n dateEnd: date.value ? date.value.end : null,\n sortParam: sort.value ? sort.value.param : null,\n sortOrder: sort.value ? sort.value.order : null,\n ...props.options\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 itemsList.value = [...itemsList.value, ...data];\n \n if (items.value) items.value = itemsList.value;\n }\n\n isLoadingExtra.value = false\n};\n\nconst fetchItems = async () => {\n isLoading.value = true;\n const data = await props.store.read({\n skip: currentSkip.value,\n limit: currentLimit.value,\n dateStart: date.value ? date.value.start : null,\n dateEnd: date.value ? date.value.end : null,\n sortParam: sort.value ? sort.value.param : null,\n sortOrder: sort.value ? sort.value.order : null,\n search: currentSearch.value,\n ...props.options\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 itemsList.value = data;\n if (items.value) items.value = itemsList.value;\n isLoading.value = false;\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);\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\n<style>\n.feed-move, /* apply transition to moving elements /\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/ ensure leaving items are taken out of layout flow so that moving\n animations can be calculated correctly. */\n.feed-leave-active {\n position: absolute;\n}\n</style>"],"names":["_useModel","search"],"mappings":"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"}

package/dist/martyrs/src/components/FieldPhone/FieldPhone.vue.cjs CHANGED Viewed

@@ -4,7 +4,7 @@ const vue = require("vue");
 const clickOutside = require("./click-outside.cjs");
 const allCountries = require("./all-countries.cjs");
 ;/* empty css                  */
-const parsePhoneNumber = require("../../../node_modules/libphonenumber-js/min/exports/parsePhoneNumber.cjs");
+const parsePhoneNumber = require("../../../node_modules/.pnpm/libphonenumber-js@1.12.6/node_modules/libphonenumber-js/min/exports/parsePhoneNumber.cjs");
 const _hoisted_1 = ["tabindex"];
 const _hoisted_2 = { class: "flex-nowrap flex flex-v-center p-medium vti__selection" };
 const _hoisted_3 = ["innerHTML"];

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

@@ -2,7 +2,7 @@ import { ref, reactive, onMounted, computed, watch, nextTick, createElementBlock
 import clickOutside from "./click-outside.js";
 import allCountries from "./all-countries.js";
 /* empty css                */
-import { parsePhoneNumber } from "../../../node_modules/libphonenumber-js/min/exports/parsePhoneNumber.js";
+import { parsePhoneNumber } from "../../../node_modules/.pnpm/libphonenumber-js@1.12.6/node_modules/libphonenumber-js/min/exports/parsePhoneNumber.js";
 const _hoisted_1 = ["tabindex"];
 const _hoisted_2 = { class: "flex-nowrap flex flex-v-center p-medium vti__selection" };
 const _hoisted_3 = ["innerHTML"];

package/dist/martyrs/src/components/Menu/{Menu.vue2.cjs → Menu.vue.cjs} RENAMED Viewed

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("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 = {
   }
 };
 exports.default = _sfc_main;
-//# sourceMappingURL=Menu.vue2.cjs.map
+//# sourceMappingURL=Menu.vue.cjs.map

package/dist/martyrs/src/components/Menu/Menu.vue.cjs.map ADDED Viewed

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

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

@@ -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.vue2.js.map
+//# sourceMappingURL=Menu.vue.js.map

package/dist/martyrs/src/components/Menu/Menu.vue.js.map ADDED Viewed

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

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

@@ -12,7 +12,7 @@ const _sfc_main = {
     // Флаг загрузки, определяет, нужно ли показывать скелетон
     loading: {
       type: Boolean,
-      default: true
+      default: false
     },
     // Структура скелетона, если не используется слот
     structure: {
@@ -32,12 +32,12 @@ const _sfc_main = {
     // Цвет блоков скелетона (серый)
     blockColor: {
       type: String,
-      default: "rgb(var(--light))"
+      default: "rgba(var(--white),0.25)"
     },
     // Цвет анимированной полосы (белый с прозрачностью)
     highlightColor: {
       type: String,
-      default: "rgba(255, 255, 255, 0.9)"
+      default: "rgba(var(--white), 0.9)"
     },
     // Скорость анимации в секундах
     animationDuration: {
@@ -47,7 +47,7 @@ const _sfc_main = {
     // Радиус закругления
     borderRadius: {
       type: String,
-      default: "4px"
+      default: "0.5rem"
     }
   },
   setup(__props) {
@@ -90,6 +90,6 @@ const _sfc_main = {
     };
   }
 };
-const Skeleton = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-1c010433"]]);
+const Skeleton = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-70b3339a"]]);
 exports.default = Skeleton;
 //# sourceMappingURL=Skeleton.vue.cjs.map

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

	@@ -1 +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: ~~true~~\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: '~~rgb~~(var(--~~light~~))'\n },\n // Цвет анимированной полосы (белый с прозрачностью)\n highlightColor: {\n type: String,\n default: 'rgba(~~255~~, ~~255, 255,~~ 0.9)'\n },\n // Скорость анимации в секундах\n animationDuration: {\n type: Number,\n default: 1.5\n },\n // Радиус закругления\n borderRadius: {\n type: String,\n default: '~~4px~~'\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 ~~z-index: 10;\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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -10,7 +10,7 @@ const _sfc_main = {
     // Флаг загрузки, определяет, нужно ли показывать скелетон
     loading: {
       type: Boolean,
-      default: true
+      default: false
     },
     // Структура скелетона, если не используется слот
     structure: {
@@ -30,12 +30,12 @@ const _sfc_main = {
     // Цвет блоков скелетона (серый)
     blockColor: {
       type: String,
-      default: "rgb(var(--light))"
+      default: "rgba(var(--white),0.25)"
     },
     // Цвет анимированной полосы (белый с прозрачностью)
     highlightColor: {
       type: String,
-      default: "rgba(255, 255, 255, 0.9)"
+      default: "rgba(var(--white), 0.9)"
     },
     // Скорость анимации в секундах
     animationDuration: {
@@ -45,7 +45,7 @@ const _sfc_main = {
     // Радиус закругления
     borderRadius: {
       type: String,
-      default: "4px"
+      default: "0.5rem"
     }
   },
   setup(__props) {
@@ -88,7 +88,7 @@ const _sfc_main = {
     };
   }
 };
-const Skeleton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1c010433"]]);
+const Skeleton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-70b3339a"]]);
 export {
   Skeleton as default
 };

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

	@@ -1 +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: ~~true~~\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: '~~rgb~~(var(--~~light~~))'\n },\n // Цвет анимированной полосы (белый с прозрачностью)\n highlightColor: {\n type: String,\n default: 'rgba(~~255~~, ~~255, 255,~~ 0.9)'\n },\n // Скорость анимации в секундах\n animationDuration: {\n type: Number,\n default: 1.5\n },\n // Радиус закругления\n borderRadius: {\n type: String,\n default: '~~4px~~'\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 ~~z-index: 10;\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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Tab/{Tab.vue.cjs → Tab.vue2.cjs} RENAMED Viewed

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
-;/* empty css           */
+;/* empty css          */
 const _hoisted_1 = { class: "flex-nowrap flex-v-center flex pos-relative" };
 const _hoisted_2 = ["onClick"];
 const _sfc_main = {
@@ -69,4 +69,4 @@ const _sfc_main = {
   }
 };
 exports.default = _sfc_main;
-//# sourceMappingURL=Tab.vue.cjs.map
+//# sourceMappingURL=Tab.vue2.cjs.map

package/dist/martyrs/src/components/Tab/Tab.vue2.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Tab.vue2.cjs","sources":["../../../../../src/components/Tab/Tab.vue"],"sourcesContent":["<template>\n <div class=\"flex-nowrap flex-v-center flex pos-relative\">\n <button \n v-for=\"(tab, index) in tabs\" \n :key=\"index\" \n @click=\"handleTabClick(index, tab)\" \n class=\"z-index-1 t-center cursor-pointer\"\n :style=\"isSelected(index, tab) ? 'background: rgb(var(--main)) !important' : ''\"\n :class=\"[\n isSelected(index, tab) ? 'bg-main' : '',\n tabClass ? tabClass : 'pd-small pd-r-medium pd-l-medium w-max pd-small radius-small'\n ]\"\n >\n {{tab.name || tab.label}}\n </button>\n </div>\n</template>\n\n<script setup>\nimport { ref, computed, watch } from 'vue'\n\nconst emit = defineEmits(['update:selected', 'tab-click']);\n\nconst props = defineProps({\n tabs: Array,\n tabClass: String,\n selected: [String, Number],\n modelValue: [String, Number],\n callback: Function\n})\n\nconst selectedTab = ref(0)\n\n// Handle both v-model and selected prop for backward compatibility\nconst updateSelectedIndex = () => {\n if (props.modelValue !== undefined) {\n const selectedIndex = props.tabs.findIndex(tab => tab.value === props.modelValue)\n if (selectedIndex !== -1) {\n selectedTab.value = selectedIndex\n }\n } else if (props.selected !== undefined) {\n const selectedIndex = props.tabs.findIndex(tab => tab.value === props.selected)\n if (selectedIndex !== -1) {\n selectedTab.value = selectedIndex\n }\n }\n}\n\n// Initial setup\nupdateSelectedIndex()\n\n// Watch for changes in selected or modelValue props\nwatch(() => props.selected, updateSelectedIndex)\nwatch(() => props.modelValue, updateSelectedIndex)\n\n// Check if tab is selected\nconst isSelected = (index, tab) => {\n if (props.modelValue !== undefined) {\n return tab.value === props.modelValue\n } else if (props.selected !== undefined) {\n return tab.value === props.selected\n }\n return index === selectedTab.value\n}\n\n// Handle tab click\nfunction handleTabClick(index, tab) {\n selectedTab.value = index\n \n // Emit both events for flexibility\n emit('update:selected', tab.value)\n emit('tab-click', { index, tab })\n \n // For v-model support\n if (props.modelValue !== undefined) {\n emit('update:modelValue', tab.value)\n }\n \n // Call callback if provided\n if (props.callback) props.callback(tab)\n}\n</script>\n\n<style lang=\"scss\">\n.tab-selector {\n position: absolute;\n width: 50%;\n height: 100%;\n left: 0;\n top: 0;\n z-index: 0;\n transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n</style>"],"names":["ref","watch"],"mappings":";;;;;;;;;;;;;;;;;AAqBA,UAAM,OAAO;AAEb,UAAM,QAAQ;AAQd,UAAM,cAAcA,IAAG,IAAC,CAAC;AAGzB,UAAM,sBAAsB,MAAM;AAChC,UAAI,MAAM,eAAe,QAAW;AAClC,cAAM,gBAAgB,MAAM,KAAK,UAAU,SAAO,IAAI,UAAU,MAAM,UAAU;AAChF,YAAI,kBAAkB,IAAI;AACxB,sBAAY,QAAQ;AAAA,QAC1B;AAAA,MACA,WAAa,MAAM,aAAa,QAAW;AACvC,cAAM,gBAAgB,MAAM,KAAK,UAAU,SAAO,IAAI,UAAU,MAAM,QAAQ;AAC9E,YAAI,kBAAkB,IAAI;AACxB,sBAAY,QAAQ;AAAA,QAC1B;AAAA,MACA;AAAA,IACA;AAGA,wBAAmB;AAGnBC,QAAAA,MAAM,MAAM,MAAM,UAAU,mBAAmB;AAC/CA,QAAAA,MAAM,MAAM,MAAM,YAAY,mBAAmB;AAGjD,UAAM,aAAa,CAAC,OAAO,QAAQ;AACjC,UAAI,MAAM,eAAe,QAAW;AAClC,eAAO,IAAI,UAAU,MAAM;AAAA,MAC/B,WAAa,MAAM,aAAa,QAAW;AACvC,eAAO,IAAI,UAAU,MAAM;AAAA,MAC/B;AACE,aAAO,UAAU,YAAY;AAAA,IAC/B;AAGA,aAAS,eAAe,OAAO,KAAK;AAClC,kBAAY,QAAQ;AAGpB,WAAK,mBAAmB,IAAI,KAAK;AACjC,WAAK,aAAa,EAAE,OAAO,IAAK,CAAA;AAGhC,UAAI,MAAM,eAAe,QAAW;AAClC,aAAK,qBAAqB,IAAI,KAAK;AAAA,MACvC;AAGE,UAAI,MAAM,SAAU,OAAM,SAAS,GAAG;AAAA,IACxC;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Tab/{Tab.vue.js → Tab.vue2.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { ref, watch, createElementBlock, openBlock, Fragment, renderList, normalizeStyle, normalizeClass, toDisplayString } from "vue";
-/* empty css         */
+/* empty css        */
 const _hoisted_1 = { class: "flex-nowrap flex-v-center flex pos-relative" };
 const _hoisted_2 = ["onClick"];
 const _sfc_main = {
@@ -69,4 +69,4 @@ const _sfc_main = {
 export {
   _sfc_main as default
 };
-//# sourceMappingURL=Tab.vue.js.map
+//# sourceMappingURL=Tab.vue2.js.map

package/dist/martyrs/src/components/Tab/{Tab.vue.cjs.map → Tab.vue2.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tab.~~vue~~.~~cjs~~","sources":["../../../../../src/components/Tab/Tab.vue"],"sourcesContent":["<template>\n <div class=\"flex-nowrap flex-v-center flex pos-relative\">\n <button \n v-for=\"(tab, index) in tabs\" \n :key=\"index\" \n @click=\"handleTabClick(index, tab)\" \n class=\"z-index-1 t-center cursor-pointer\"\n :style=\"isSelected(index, tab) ? 'background: rgb(var(--main)) !important' : ''\"\n :class=\"[\n isSelected(index, tab) ? 'bg-main' : '',\n tabClass ? tabClass : 'pd-small pd-r-medium pd-l-medium w-max pd-small radius-small'\n ]\"\n >\n {{tab.name \|\| tab.label}}\n </button>\n </div>\n</template>\n\n<script setup>\nimport { ref, computed, watch } from 'vue'\n\nconst emit = defineEmits(['update:selected', 'tab-click']);\n\nconst props = defineProps({\n tabs: Array,\n tabClass: String,\n selected: [String, Number],\n modelValue: [String, Number],\n callback: Function\n})\n\nconst selectedTab = ref(0)\n\n// Handle both v-model and selected prop for backward compatibility\nconst updateSelectedIndex = () => {\n if (props.modelValue !== undefined) {\n const selectedIndex = props.tabs.findIndex(tab => tab.value === props.modelValue)\n if (selectedIndex !== -1) {\n selectedTab.value = selectedIndex\n }\n } else if (props.selected !== undefined) {\n const selectedIndex = props.tabs.findIndex(tab => tab.value === props.selected)\n if (selectedIndex !== -1) {\n selectedTab.value = selectedIndex\n }\n }\n}\n\n// Initial setup\nupdateSelectedIndex()\n\n// Watch for changes in selected or modelValue props\nwatch(() => props.selected, updateSelectedIndex)\nwatch(() => props.modelValue, updateSelectedIndex)\n\n// Check if tab is selected\nconst isSelected = (index, tab) => {\n if (props.modelValue !== undefined) {\n return tab.value === props.modelValue\n } else if (props.selected !== undefined) {\n return tab.value === props.selected\n }\n return index === selectedTab.value\n}\n\n// Handle tab click\nfunction handleTabClick(index, tab) {\n selectedTab.value = index\n \n // Emit both events for flexibility\n emit('update:selected', tab.value)\n emit('tab-click', { index, tab })\n \n // For v-model support\n if (props.modelValue !== undefined) {\n emit('update:modelValue', tab.value)\n }\n \n // Call callback if provided\n if (props.callback) props.callback(tab)\n}\n</script>\n\n<style lang=\"scss\">\n.tab-selector {\n position: absolute;\n width: 50%;\n height: 100%;\n left: 0;\n top: 0;\n z-index: 0;\n transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n</style>"],"names":[~~"ref","watch"~~],"mappings":"~~;;;;;;;;;;;;;;;;;~~AAqBA,UAAM,OAAO;AAEb,UAAM,QAAQ;AAQd,UAAM,~~cAAcA~~,~~IAAG~~,~~IAAC,~~CAAC;AAGzB,UAAM,sBAAsB,MAAM;AAChC,UAAI,MAAM,eAAe,QAAW;AAClC,cAAM,gBAAgB,MAAM,KAAK,UAAU,SAAO,IAAI,UAAU,MAAM,UAAU;AAChF,YAAI,kBAAkB,IAAI;AACxB,sBAAY,QAAQ;AAAA,QAC1B;AAAA,MACA,WAAa,MAAM,aAAa,QAAW;AACvC,cAAM,gBAAgB,MAAM,KAAK,UAAU,SAAO,IAAI,UAAU,MAAM,QAAQ;AAC9E,YAAI,kBAAkB,IAAI;AACxB,sBAAY,QAAQ;AAAA,QAC1B;AAAA,MACA;AAAA,IACA;AAGA,wBAAmB;~~AAGnBC~~,~~QAAAA~~,MAAM,MAAM,~~MAAM,~~UAAU,mBAAmB;AAC/CA,~~QAAAA~~,MAAM,MAAM,~~MAAM,~~YAAY,mBAAmB;AAGjD,UAAM,aAAa,CAAC,OAAO,QAAQ;AACjC,UAAI,MAAM,eAAe,QAAW;AAClC,eAAO,IAAI,UAAU,MAAM;AAAA,MAC/B,WAAa,MAAM,aAAa,QAAW;AACvC,eAAO,IAAI,UAAU,MAAM;AAAA,MAC/B;AACE,aAAO,UAAU,YAAY;AAAA,IAC/B;AAGA,aAAS,eAAe,OAAO,KAAK;AAClC,kBAAY,QAAQ;AAGpB,WAAK,mBAAmB,IAAI,KAAK;AACjC,WAAK,aAAa,EAAE,OAAO,IAAK,CAAA;AAGhC,UAAI,MAAM,eAAe,QAAW;AAClC,aAAK,qBAAqB,IAAI,KAAK;AAAA,MACvC;AAGE,UAAI,MAAM,SAAU,OAAM,SAAS,GAAG;AAAA,IACxC~~;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"Tab.vue2.js","sources":["../../../../../src/components/Tab/Tab.vue"],"sourcesContent":["<template>\n <div class=\"flex-nowrap flex-v-center flex pos-relative\">\n <button \n v-for=\"(tab, index) in tabs\" \n :key=\"index\" \n @click=\"handleTabClick(index, tab)\" \n class=\"z-index-1 t-center cursor-pointer\"\n :style=\"isSelected(index, tab) ? 'background: rgb(var(--main)) !important' : ''\"\n :class=\"[\n isSelected(index, tab) ? 'bg-main' : '',\n tabClass ? tabClass : 'pd-small pd-r-medium pd-l-medium w-max pd-small radius-small'\n ]\"\n >\n {{tab.name \|\| tab.label}}\n </button>\n </div>\n</template>\n\n<script setup>\nimport { ref, computed, watch } from 'vue'\n\nconst emit = defineEmits(['update:selected', 'tab-click']);\n\nconst props = defineProps({\n tabs: Array,\n tabClass: String,\n selected: [String, Number],\n modelValue: [String, Number],\n callback: Function\n})\n\nconst selectedTab = ref(0)\n\n// Handle both v-model and selected prop for backward compatibility\nconst updateSelectedIndex = () => {\n if (props.modelValue !== undefined) {\n const selectedIndex = props.tabs.findIndex(tab => tab.value === props.modelValue)\n if (selectedIndex !== -1) {\n selectedTab.value = selectedIndex\n }\n } else if (props.selected !== undefined) {\n const selectedIndex = props.tabs.findIndex(tab => tab.value === props.selected)\n if (selectedIndex !== -1) {\n selectedTab.value = selectedIndex\n }\n }\n}\n\n// Initial setup\nupdateSelectedIndex()\n\n// Watch for changes in selected or modelValue props\nwatch(() => props.selected, updateSelectedIndex)\nwatch(() => props.modelValue, updateSelectedIndex)\n\n// Check if tab is selected\nconst isSelected = (index, tab) => {\n if (props.modelValue !== undefined) {\n return tab.value === props.modelValue\n } else if (props.selected !== undefined) {\n return tab.value === props.selected\n }\n return index === selectedTab.value\n}\n\n// Handle tab click\nfunction handleTabClick(index, tab) {\n selectedTab.value = index\n \n // Emit both events for flexibility\n emit('update:selected', tab.value)\n emit('tab-click', { index, tab })\n \n // For v-model support\n if (props.modelValue !== undefined) {\n emit('update:modelValue', tab.value)\n }\n \n // Call callback if provided\n if (props.callback) props.callback(tab)\n}\n</script>\n\n<style lang=\"scss\">\n.tab-selector {\n position: absolute;\n width: 50%;\n height: 100%;\n left: 0;\n top: 0;\n z-index: 0;\n transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n</style>"],"names":[],"mappings":";;;;;;;;;;;;;;;AAqBA,UAAM,OAAO;AAEb,UAAM,QAAQ;AAQd,UAAM,cAAc,IAAI,CAAC;AAGzB,UAAM,sBAAsB,MAAM;AAChC,UAAI,MAAM,eAAe,QAAW;AAClC,cAAM,gBAAgB,MAAM,KAAK,UAAU,SAAO,IAAI,UAAU,MAAM,UAAU;AAChF,YAAI,kBAAkB,IAAI;AACxB,sBAAY,QAAQ;AAAA,QAC1B;AAAA,MACA,WAAa,MAAM,aAAa,QAAW;AACvC,cAAM,gBAAgB,MAAM,KAAK,UAAU,SAAO,IAAI,UAAU,MAAM,QAAQ;AAC9E,YAAI,kBAAkB,IAAI;AACxB,sBAAY,QAAQ;AAAA,QAC1B;AAAA,MACA;AAAA,IACA;AAGA,wBAAmB;AAGnB,UAAM,MAAM,MAAM,UAAU,mBAAmB;AAC/C,UAAM,MAAM,MAAM,YAAY,mBAAmB;AAGjD,UAAM,aAAa,CAAC,OAAO,QAAQ;AACjC,UAAI,MAAM,eAAe,QAAW;AAClC,eAAO,IAAI,UAAU,MAAM;AAAA,MAC/B,WAAa,MAAM,aAAa,QAAW;AACvC,eAAO,IAAI,UAAU,MAAM;AAAA,MAC/B;AACE,aAAO,UAAU,YAAY;AAAA,IAC/B;AAGA,aAAS,eAAe,OAAO,KAAK;AAClC,kBAAY,QAAQ;AAGpB,WAAK,mBAAmB,IAAI,KAAK;AACjC,WAAK,aAAa,EAAE,OAAO,IAAK,CAAA;AAGhC,UAAI,MAAM,eAAe,QAAW;AAClC,aAAK,qBAAqB,IAAI,KAAK;AAAA,MACvC;AAGE,UAAI,MAAM,SAAU,OAAM,SAAS,GAAG;AAAA,IACxC;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Tooltip/{Tooltip.vue.cjs → Tooltip.vue2.cjs} RENAMED Viewed

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
-;/* empty css               */
+;/* empty css              */
 const _sfc_main = {
   __name: "Tooltip",
   props: {
@@ -49,4 +49,4 @@ const _sfc_main = {
   }
 };
 exports.default = _sfc_main;
-//# sourceMappingURL=Tooltip.vue.cjs.map
+//# sourceMappingURL=Tooltip.vue2.cjs.map

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

@@ -0,0 +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;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Tooltip/{Tooltip.vue.js → Tooltip.vue2.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { ref, reactive, createElementBlock, openBlock, renderSlot, createElementVNode, normalizeStyle, toDisplayString } from "vue";
-/* empty css             */
+/* empty css            */
 const _sfc_main = {
   __name: "Tooltip",
   props: {
@@ -49,4 +49,4 @@ const _sfc_main = {
 export {
   _sfc_main as default
 };
-//# sourceMappingURL=Tooltip.vue.js.map
+//# sourceMappingURL=Tooltip.vue2.js.map

package/dist/martyrs/src/components/Tooltip/{Tooltip.vue.cjs.map → Tooltip.vue2.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tooltip.~~vue~~.~~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~~;;;;;;;;;;;;;;;;;~~"}
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;;;;;;;;;;;;;;;;"}