@ozdao/martyrs 0.2.423

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

@@ -0,0 +1,41 @@
+import { createElementBlock, openBlock, createElementVNode, createCommentVNode, toDisplayString } from "vue";
+const _hoisted_1 = { class: "mn-b-thin" };
+const _hoisted_2 = { class: "mn-b-small t-transp p-medium" };
+const _sfc_main = {
+  __name: "EmptyState",
+  props: {
+    title: {
+      type: String,
+      default: "Sorry, nothing found."
+    },
+    description: {
+      type: String,
+      default: "No items to display. Try changing your search criteria."
+    },
+    action: {
+      type: String
+    },
+    callback: {
+      type: Function,
+      default: () => {
+      }
+    }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("section", null, [
+        createElementVNode("h4", _hoisted_1, toDisplayString(__props.title), 1),
+        createElementVNode("p", _hoisted_2, toDisplayString(__props.description), 1),
+        __props.action ? (openBlock(), createElementBlock("button", {
+          key: 0,
+          onClick: _cache[0] || (_cache[0] = (...args) => __props.callback && __props.callback(...args)),
+          class: "t-white bg-second w-100 button"
+        }, toDisplayString(__props.action), 1)) : createCommentVNode("", true)
+      ]);
+    };
+  }
+};
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=EmptyState.vue.js.map

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

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

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

@@ -0,0 +1,363 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+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.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");
+const BlockSorting = require("../../modules/globals/views/components/blocks/BlockSorting.vue.cjs");
+const BlockFilter = require("../../modules/globals/views/components/blocks/BlockFilter.vue.cjs");
+const ButtonSort = require("../../modules/globals/views/components/elements/ButtonSort.vue.cjs");
+const ButtonDate = require("../../modules/globals/views/components/elements/ButtonDate.vue.cjs");
+const IconFilter = require("../../modules/icons/navigation/IconFilter.vue.cjs");
+;/* empty css            */
+const _hoisted_1 = {
+  key: 0,
+  class: "mn-b-thin flex-nowrap flex gap-thin"
+};
+const _hoisted_2 = {
+  key: 5,
+  class: "col-w-100 w-100 pos-relative"
+};
+const _sfc_main = {
+  __name: "Feed",
+  props: /* @__PURE__ */ vue.mergeModels({
+    showLoadMore: {
+      type: Boolean,
+      default: true
+    },
+    LoadMore: {
+      type: Boolean,
+      default: true
+    },
+    search: {
+      type: [Boolean, Object],
+      default: false
+    },
+    states: {
+      type: Object,
+      default: () => ({
+        empty: {
+          title: "Nothing found",
+          description: "Sorry, nothing found"
+        }
+      })
+    },
+    skeleton: {
+      type: Object,
+      default: () => ({
+        hide: false,
+        horizontal: false,
+        structure: [
+          { block: "text", size: "medium" },
+          { block: "text", size: "large" },
+          { block: "button", size: "small" }
+        ]
+      })
+    },
+    store: {
+      type: Object,
+      default: () => ({
+        read: Function,
+        state: Object
+      })
+    },
+    external: {
+      type: Boolean,
+      default: false
+    },
+    options: {
+      type: Object,
+      default: () => ({
+        category: null,
+        limit: 10,
+        skip: 0,
+        owner: null,
+        creator: null,
+        customer: null,
+        user: null,
+        status: null,
+        period: null,
+        contain: null
+      })
+    }
+  }, {
+    "search": {},
+    "searchModifiers": {},
+    "sort": {},
+    "sortModifiers": {},
+    "filter": {},
+    "filterModifiers": {},
+    "date": {},
+    "dateModifiers": {},
+    "items": {},
+    "itemsModifiers": {}
+  }),
+  emits: ["update:search", "update:sort", "update:filter", "update:date", "update:items"],
+  setup(__props) {
+    const search = vue.useModel(__props, "search");
+    const sort = vue.useModel(__props, "sort");
+    const filter = vue.useModel(__props, "filter");
+    const date = vue.useModel(__props, "date");
+    const items = vue.useModel(__props, "items");
+    const props = __props;
+    const itemsList = vue.shallowRef(items.value || []);
+    const hasMoreItems = vue.ref(false);
+    let isLoading = vue.ref(true);
+    let isLoadingExtra = vue.ref(false);
+    let sentinel = vue.ref(null);
+    let currentSkip = vue.ref(props.options.skip ? props.options.skip : 0);
+    let currentLimit = vue.ref(props.options.limit ? props.options.limit : 10);
+    let currentSearch = vue.ref("");
+    function debounce(fn, delay) {
+      let timeoutId = null;
+      return (...args) => {
+        clearTimeout(timeoutId);
+        timeoutId = setTimeout(() => fn(...args), delay);
+      };
+    }
+    const debouncedSearch = debounce((value) => {
+      currentSearch.value = value;
+      currentSkip.value = 0;
+      currentLimit.value = 10;
+      fetchItems();
+    }, 300);
+    function updateSearch(search2) {
+      debouncedSearch(search2);
+    }
+    const loadMoreItems = async () => {
+      isLoadingExtra.value = true;
+      if (hasMoreItems.value) {
+        currentSkip.value += currentLimit.value;
+        const data = await props.store.read({
+          skip: currentSkip.value,
+          limit: currentLimit.value,
+          search: currentSearch.value,
+          dateStart: date.value ? date.value.start : null,
+          dateEnd: date.value ? date.value.end : null,
+          sortParam: sort.value ? sort.value.param : null,
+          sortOrder: sort.value ? sort.value.order : null,
+          ...props.options
+        });
+        if (data.length === 0) {
+          hasMoreItems.value = false;
+        } else if (data.length < currentLimit.value) {
+          hasMoreItems.value = false;
+        } else {
+          hasMoreItems.value = true;
+        }
+        itemsList.value = [...itemsList.value, ...data];
+        if (items.value) items.value = itemsList.value;
+      }
+      isLoadingExtra.value = false;
+    };
+    const fetchItems = async () => {
+      isLoading.value = true;
+      const data = await props.store.read({
+        skip: currentSkip.value,
+        limit: currentLimit.value,
+        dateStart: date.value ? date.value.start : null,
+        dateEnd: date.value ? date.value.end : null,
+        sortParam: sort.value ? sort.value.param : null,
+        sortOrder: sort.value ? sort.value.order : null,
+        search: currentSearch.value,
+        ...props.options
+      });
+      if (data.length === 0) {
+        hasMoreItems.value = false;
+      } else if (data.length < currentLimit.value) {
+        hasMoreItems.value = false;
+      } else {
+        hasMoreItems.value = true;
+      }
+      itemsList.value = data;
+      if (items.value) items.value = itemsList.value;
+      isLoading.value = false;
+    };
+    vue.watch(
+      () => [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;
+          fetchItems();
+        }
+      },
+      { deep: true }
+    );
+    let observer = null;
+    vue.onMounted(async () => {
+      await fetchItems();
+      if (typeof window !== "undefined" && !props.showLoadMore && props.LoadMore) {
+        observer = new IntersectionObserver((entries) => {
+          if (entries.some((entry) => entry.isIntersecting)) {
+            loadMoreItems();
+          }
+        });
+        if (sentinel.value) observer.observe(sentinel.value);
+      }
+    });
+    vue.onUnmounted(() => {
+      if (observer) {
+        observer.disconnect();
+      }
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
+        search.value || date.value || sort.value && !sort.value.hideButton ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+          search.value ? (vue.openBlock(), vue.createBlock(BlockSearch.default, {
+            key: 0,
+            placeholder: search.value.placeholder || "Search...",
+            class: vue.normalizeClass(search.value.class || "bg-light"),
+            onSearch: updateSearch,
+            autofocus: search.value.autofocus
+          }, null, 8, ["placeholder", "class", "autofocus"])) : vue.createCommentVNode("", true),
+          filter.value ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass([filter.value.class || "bg-light", "flex-center flex pd-thin bg-light radius-extra aspect-1x1 h-100"])
+            }, [
+              vue.createVNode(IconFilter.default, {
+                onClick: _cache[0] || (_cache[0] = () => filter.value.active = !filter.value.active),
+                class: "w-1r h-auto"
+              })
+            ], 2),
+            vue.createVNode(BottomSheet.default, {
+              show: filter.value.active,
+              onToggle: _cache[3] || (_cache[3] = () => filter.value.active = false),
+              class: vue.normalizeClass(["z-index-10 pos-fixed pos-t-0 pos-r-0", {
+                "pos-t-0": filter.value.active,
+                "pos-t-100": !filter.value.active
+              }])
+            }, {
+              default: vue.withCtx(() => [
+                vue.createVNode(BlockFilter.default, {
+                  filter: filter.value,
+                  "onUpdate:filter": _cache[1] || (_cache[1] = ($event) => filter.value = $event),
+                  options: filter.value.options,
+                  onClick_filter: _cache[2] || (_cache[2] = () => {
+                    filter.value.active = false;
+                  }),
+                  class: "h-100 w-100 pd-small bg-light"
+                }, null, 8, ["filter", "options"])
+              ]),
+              _: 1
+            }, 8, ["show", "class"])
+          ], 64)) : vue.createCommentVNode("", true),
+          date.value ? (vue.openBlock(), vue.createBlock(Dropdown.default, {
+            key: 2,
+            label: {
+              component: ButtonDate.default,
+              props: { date: date.value }
+            },
+            class: vue.normalizeClass([date.value.class || "bg-light", "flex-child flex-child-shrink-0 pd-r-small pd-l-small pd-thin bg-light radius-big"]),
+            align: search.value ? "right" : "left"
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(Calendar.default, {
+                date: date.value,
+                "onUpdate:date": _cache[4] || (_cache[4] = ($event) => date.value = $event),
+                locale: _ctx.$i18n.locale,
+                allowRange: true,
+                class: "radius-semi w-100 o-hidden bg-light"
+              }, null, 8, ["date", "locale"])
+            ]),
+            _: 1
+          }, 8, ["label", "class", "align"])) : vue.createCommentVNode("", true),
+          sort.value && !sort.value.hideButton ? (vue.openBlock(), vue.createBlock(Dropdown.default, {
+            key: 3,
+            label: {
+              component: ButtonSort.default,
+              props: { order: sort.value.order },
+              class: "w-1r"
+            },
+            class: vue.normalizeClass([sort.value.class || "bg-light", "radius-extra aspect-1x1 h-100"]),
+            align: search.value ? "right" : "left"
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(BlockSorting.default, {
+                param: sort.value.param,
+                "onUpdate:param": _cache[5] || (_cache[5] = ($event) => sort.value.param = $event),
+                order: sort.value.order,
+                "onUpdate:order": _cache[6] || (_cache[6] = ($event) => sort.value.order = $event),
+                options: sort.value.options,
+                class: "h-100 pd-small radius-semi t-white bg-black"
+              }, null, 8, ["param", "order", "options"])
+            ]),
+            _: 1
+          }, 8, ["label", "class", "align"])) : vue.createCommentVNode("", true)
+        ])) : vue.createCommentVNode("", true),
+        vue.unref(isLoading) ? (vue.openBlock(), vue.createBlock(vue.TransitionGroup, {
+          key: 1,
+          tag: "ul",
+          name: "scaleTransition",
+          class: vue.normalizeClass(_ctx.$attrs.class)
+        }, {
+          default: vue.withCtx(() => {
+            var _a, _b;
+            return [
+              vue.unref(isLoading) && !((_a = __props.skeleton) == null ? void 0 : _a.hide) ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(vue.unref(currentLimit), (i) => {
+                return vue.openBlock(), vue.createBlock(Skeleton.default, {
+                  structure: __props.skeleton.structure,
+                  horizontal: __props.skeleton.horizontal,
+                  loading: vue.unref(isLoading),
+                  key: "skeleton-" + i,
+                  class: "mn-b-small radius-medium o-hidden d-block"
+                }, null, 8, ["structure", "horizontal", "loading"]);
+              }), 128)) : vue.createCommentVNode("", true),
+              vue.unref(isLoading) && ((_b = __props.skeleton) == null ? void 0 : _b.hide) ? (vue.openBlock(), vue.createBlock(Loader.default, { key: 1 })) : vue.createCommentVNode("", true)
+            ];
+          }),
+          _: 1
+        }, 8, ["class"])) : vue.createCommentVNode("", true),
+        !vue.unref(isLoading) && itemsList.value.length < 1 ? (vue.openBlock(), vue.createBlock(vue.TransitionGroup, {
+          key: 2,
+          tag: "ul",
+          name: "feed",
+          class: vue.normalizeClass(_ctx.$attrs.class)
+        }, {
+          default: vue.withCtx(() => [
+            !vue.unref(isLoading) && itemsList.value.length < 1 ? (vue.openBlock(), vue.createBlock(EmptyState.default, {
+              key: 0,
+              title: __props.states.empty.title,
+              description: __props.states.empty.description,
+              action: __props.states.empty.action,
+              callback: __props.states.empty.callback,
+              class: "pd-medium mn-b-thin bg-light radius-medium"
+            }, null, 8, ["title", "description", "action", "callback"])) : vue.createCommentVNode("", true)
+          ]),
+          _: 1
+        }, 8, ["class"])) : vue.createCommentVNode("", true),
+        vue.createVNode(vue.TransitionGroup, {
+          tag: "ul",
+          name: "feed",
+          class: vue.normalizeClass(_ctx.$attrs.class)
+        }, {
+          default: vue.withCtx(() => [
+            !vue.unref(isLoading) && itemsList.value.length > 0 ? vue.renderSlot(_ctx.$slots, "default", {
+              key: 0,
+              items: itemsList.value
+            }) : vue.createCommentVNode("", true)
+          ]),
+          _: 3
+        }, 8, ["class"]),
+        __props.showLoadMore && hasMoreItems.value && itemsList.value.length > 0 && !vue.unref(isLoadingExtra) ? (vue.openBlock(), vue.createElementBlock("button", {
+          key: 3,
+          onClick: loadMoreItems,
+          class: "col-w-100 mn-t-thin w-100 t-black bg-main button"
+        }, " Load More ")) : (vue.openBlock(), vue.createElementBlock("div", {
+          key: "sentinel",
+          ref_key: "sentinel",
+          ref: sentinel,
+          class: "sentinel"
+        }, null, 512)),
+        vue.unref(isLoadingExtra) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+          vue.createVNode(Loader.default)
+        ])) : vue.createCommentVNode("", true)
+      ], 64);
+    };
+  }
+};
+exports.default = _sfc_main;
+//# sourceMappingURL=Feed.vue.cjs.map

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

@@ -0,0 +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-t-0 pos-r-0\"\n        :class=\"{\n          'pos-t-0':  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 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=\"mn-b-small 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   :class=\"$attrs.class\"\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}, 300);\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0KA,UAAM,SAASA,IAAAA,SAAW,SAAC,QAAQ;AACnC,UAAM,OAAOA,IAAAA,SAAY,SAAA,MAAM;AAC/B,UAAM,SAASA,IAAAA,SAAW,SAAC,QAAQ;AACnC,UAAM,OAAOA,IAAAA,SAAY,SAAA,MAAM;AAC/B,UAAM,QAAQA,IAAAA,SAAY,SAAA,OAAO;AAGjC,UAAM,QAAQ;AA+Dd,UAAM,YAAYC,IAAU,WAAC,MAAM,SAAS,CAAA,CAAE;AAC9C,UAAM,eAAeC,IAAG,IAAC,KAAK;AAE9B,QAAI,YAAYA,IAAG,IAAC,IAAI;AACxB,QAAI,iBAAiBA,IAAG,IAAC,KAAK;AAC9B,QAAI,WAAWA,IAAG,IAAC,IAAI;AAEvB,QAAI,cAAcA,IAAAA,IAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ,OAAO,CAAC;AACjE,QAAI,eAAeA,IAAAA,IAAI,MAAM,QAAQ,QAAQ,MAAM,QAAQ,QAAQ,EAAE;AAKrE,QAAI,gBAAgBA,IAAG,IAAC,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;AAEAC,QAAK;AAAA,MACH,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;AAEfC,QAAAA,UAAU,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;AAEDC,QAAAA,YAAY,MAAM;AAChB,UAAI,UAAU;AACZ,iBAAS,WAAY;AAAA,MACzB;AAAA,IACA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}