@ozdao/martyrs 0.2.430 → 0.2.431

package/dist/martyrs/src/modules/landing/components/sections/SectionRoadmap.vue.cjs

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const vueI18n = require("vue-i18n");
+const _pluginVue_exportHelper = require("../../../../../../_virtual/_plugin-vue_export-helper.cjs");
+const _hoisted_1 = { class: "o-hidden bg-black t-white t-left pd-big radius-medium" };
+const _hoisted_2 = { class: "mn-b-big t-center w-100" };
+const _hoisted_3 = { class: "gap-thin flex-nowrap flex o-scrolled timeline custom-scroll" };
+const _hoisted_4 = { class: "mn-b-semi bg-white-transp-5 timeline-icon" };
+const _hoisted_5 = {
+  key: 0,
+  width: "18",
+  height: "18",
+  viewBox: "0 0 18 18",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+const _hoisted_6 = { class: "w-100 timeline-content" };
+const _hoisted_7 = { class: "mn-b-small" };
+const _hoisted_8 = { class: "uppercase mn-b-semi t-main t-semi date" };
+const _hoisted_9 = { class: "t-transp w-100" };
+const _sfc_main = {
+  __name: "SectionRoadmap",
+  props: {
+    textData: {
+      type: Object,
+      default: () => ({
+        messages: {
+          en: {
+            title: "Weeder Roadmap",
+            milestones: [{
+              title: "MVP in Thailand",
+              description: "The Weeder platform was tested as a minimum viable product (MVP) in Thailand to validate its basic features and gather user feedback. This helped the company make improvements before launching on a larger scale.",
+              date: "2023-02-01",
+              finished: "true"
+            }, {
+              date: "2023-05-01",
+              title: "Weeder Platform Soft Launch",
+              description: "A soft version of the Weeder platform will be launched for users to explore and provide feedback. This allows the company to identify any issues and make improvements before the official release."
+            }, {
+              date: "2023-07-01",
+              title: "IDO",
+              description: "The Initial DEX Offering (IDO) will launch the Weeder token on a our decentralized platform. It allows the public to purchase Weeder tokens and get involved in the project at an early stage. It can also help establish the initial token price."
+            }, {
+              date: "2023-09-01",
+              title: "Weeder Platform Official Release",
+              description: "The Weeder platform will be officially released with dividend features, cashback, and full blockchain integration. This marks the full launch of the platform and allows users to access all its features."
+            }, {
+              date: "2023-11-01",
+              title: "Weeder Ecosystem Expansion",
+              description: "The Weeder ecosystem will be expanded by adding support for new countries and enhancing its functionalities. This helps to increase the platforms user base and improve its overall capabilities."
+            }]
+          }
+        }
+      })
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const { t, tm } = vueI18n.useI18n(props.textData);
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("h2", _hoisted_2, vue.toDisplayString(vue.unref(t)("title")), 1),
+        vue.createElementVNode("div", _hoisted_3, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(tm)("milestones"), (milestone, index) => {
+            return vue.openBlock(), vue.createElementBlock("div", {
+              key: index,
+              class: "timeline-item br-white-transp-10 br-1px br-solid pd-big radius-small"
+            }, [
+              vue.createElementVNode("div", _hoisted_4, [
+                milestone.finished ? (vue.openBlock(), vue.createElementBlock("svg", _hoisted_5, _cache[0] || (_cache[0] = [
+                  vue.createElementVNode("g", { id: "24 / basic / check-mark" }, [
+                    vue.createElementVNode("path", {
+                      id: "icon",
+                      "fill-rule": "evenodd",
+                      "clip-rule": "evenodd",
+                      d: "M7.28033 10.7197L14.25 3.75L15.3107 4.81066L7.28033 12.841L3 8.56066L4.06066 7.5L7.28033 10.7197Z",
+                      fill: "rgb(var(--main))"
+                    })
+                  ], -1)
+                ]))) : vue.createCommentVNode("", true)
+              ]),
+              vue.createElementVNode("div", _hoisted_6, [
+                vue.createElementVNode("h3", _hoisted_7, vue.toDisplayString(vue.unref(t)(milestone.title)), 1),
+                vue.createElementVNode("p", _hoisted_8, vue.toDisplayString(milestone.date), 1),
+                vue.createElementVNode("p", _hoisted_9, vue.toDisplayString(vue.unref(t)(milestone.description)), 1)
+              ])
+            ]);
+          }), 128))
+        ])
+      ]);
+    };
+  }
+};
+const SectionRoadmap = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-148fd4a9"]]);
+exports.default = SectionRoadmap;
+//# sourceMappingURL=SectionRoadmap.vue.cjs.map

package/dist/martyrs/src/modules/landing/components/sections/SectionRoadmap.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionRoadmap.vue.cjs","sources":["../../../../../../../src/modules/landing/components/sections/SectionRoadmap.vue"],"sourcesContent":["<script setup>\nimport { ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\n\nconst props = defineProps({\n  textData: {\n    type: Object,\n    default: () => ({\n      messages: {\n        en: {\n          title: 'Weeder Roadmap',\n          milestones: [{\n            title: 'MVP in Thailand',\n            description: 'The Weeder platform was tested as a minimum viable product (MVP) in Thailand to validate its basic features and gather user feedback. This helped the company make improvements before launching on a larger scale.',\n            date: '2023-02-01',\n            finished: 'true'\n          },{\n            date: '2023-05-01',\n            title: 'Weeder Platform Soft Launch',\n            description: 'A soft version of the Weeder platform will be launched for users to explore and provide feedback. This allows the company to identify any issues and make improvements before the official release.',\n          },{\n            date: '2023-07-01',\n            title: 'IDO',\n            description: 'The Initial DEX Offering (IDO) will launch the Weeder token on a our decentralized platform. It allows the public to purchase Weeder tokens and get involved in the project at an early stage. It can also help establish the initial token price.',\n          },{\n            date: '2023-09-01',\n            title: 'Weeder Platform Official Release',\n            description: 'The Weeder platform will be officially released with dividend features, cashback, and full blockchain integration. This marks the full launch of the platform and allows users to access all its features.',\n          },{\n            date: '2023-11-01',\n            title: 'Weeder Ecosystem Expansion',\n            description: 'The Weeder ecosystem will be expanded by adding support for new countries and enhancing its functionalities. This helps to increase the platforms user base and improve its overall capabilities.',\n          }]\n        }\n      }\n    })\n  }\n});\n\nconst { t,tm } = useI18n(props.textData);\n</script>\n\n<template>\n  <div class=\"o-hidden bg-black t-white t-left pd-big radius-medium\">\n    <h2 class=\"mn-b-big t-center w-100\">{{ t('title') }}</h2>\n    \n    <div class=\"gap-thin flex-nowrap flex o-scrolled timeline custom-scroll\">\n      <div\n        v-for=\"(milestone, index) in tm('milestones')\"\n        :key=\"index\"\n        class=\"timeline-item br-white-transp-10 br-1px br-solid pd-big radius-small\"\n      >\n      \n        <div class=\"mn-b-semi bg-white-transp-5 timeline-icon\">\n          <svg v-if=\"milestone.finished\"  width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <g id=\"24 / basic / check-mark\">\n            <path id=\"icon\" fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.28033 10.7197L14.25 3.75L15.3107 4.81066L7.28033 12.841L3 8.56066L4.06066 7.5L7.28033 10.7197Z\" fill=\"rgb(var(--main))\"/>\n            </g>\n          </svg>\n        </div>\n\n        <div class=\"w-100 timeline-content\">\n          <h3 class=\"mn-b-small\">{{ t(milestone.title) }}</h3>\n          <p class=\"uppercase mn-b-semi t-main t-semi date\">{{ milestone.date }}</p>\n          <p class=\"t-transp w-100\">{{ t(milestone.description) }}</p>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n  .timeline {\n    .timeline-item {\n      min-width: 32rem;\n    }\n\n    .timeline-icon {\n      border-radius: 100%;\n      width: 3rem;\n      height: 3rem;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    \n\n      img {\n        width: 1.5rem;\n        height: 1.5rem;\n      }\n    }\n  }\n\n  .custom-scroll {\n    overflow-x: scroll;\n    scrollbar-width: none; /* Hide scrollbar for Firefox */\n    -ms-overflow-style: none; /* Hide scrollbar for IE and Edge */\n    display: -webkit-box; /* Fix for Safari */\n    display: -webkit-flex; /* Fix for Safari */\n    display: -ms-flexbox;\n    display: flex;\n  }\n\n  .custom-scroll::-webkit-scrollbar {\n    width: 0px; /* Hide scrollbar for Chrome and Safari */\n    height: 0px;\n  }\n</style>"],"names":["useI18n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,UAAM,QAAQ;AAmCd,UAAM,EAAE,GAAE,GAAE,IAAKA,QAAAA,QAAQ,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/landing/components/sections/SectionRoadmap.vue.js

@@ -0,0 +1,97 @@
+import { createElementBlock, openBlock, createElementVNode, toDisplayString, unref, Fragment, renderList, createCommentVNode } from "vue";
+import { useI18n } from "vue-i18n";
+import _export_sfc from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "o-hidden bg-black t-white t-left pd-big radius-medium" };
+const _hoisted_2 = { class: "mn-b-big t-center w-100" };
+const _hoisted_3 = { class: "gap-thin flex-nowrap flex o-scrolled timeline custom-scroll" };
+const _hoisted_4 = { class: "mn-b-semi bg-white-transp-5 timeline-icon" };
+const _hoisted_5 = {
+  key: 0,
+  width: "18",
+  height: "18",
+  viewBox: "0 0 18 18",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+const _hoisted_6 = { class: "w-100 timeline-content" };
+const _hoisted_7 = { class: "mn-b-small" };
+const _hoisted_8 = { class: "uppercase mn-b-semi t-main t-semi date" };
+const _hoisted_9 = { class: "t-transp w-100" };
+const _sfc_main = {
+  __name: "SectionRoadmap",
+  props: {
+    textData: {
+      type: Object,
+      default: () => ({
+        messages: {
+          en: {
+            title: "Weeder Roadmap",
+            milestones: [{
+              title: "MVP in Thailand",
+              description: "The Weeder platform was tested as a minimum viable product (MVP) in Thailand to validate its basic features and gather user feedback. This helped the company make improvements before launching on a larger scale.",
+              date: "2023-02-01",
+              finished: "true"
+            }, {
+              date: "2023-05-01",
+              title: "Weeder Platform Soft Launch",
+              description: "A soft version of the Weeder platform will be launched for users to explore and provide feedback. This allows the company to identify any issues and make improvements before the official release."
+            }, {
+              date: "2023-07-01",
+              title: "IDO",
+              description: "The Initial DEX Offering (IDO) will launch the Weeder token on a our decentralized platform. It allows the public to purchase Weeder tokens and get involved in the project at an early stage. It can also help establish the initial token price."
+            }, {
+              date: "2023-09-01",
+              title: "Weeder Platform Official Release",
+              description: "The Weeder platform will be officially released with dividend features, cashback, and full blockchain integration. This marks the full launch of the platform and allows users to access all its features."
+            }, {
+              date: "2023-11-01",
+              title: "Weeder Ecosystem Expansion",
+              description: "The Weeder ecosystem will be expanded by adding support for new countries and enhancing its functionalities. This helps to increase the platforms user base and improve its overall capabilities."
+            }]
+          }
+        }
+      })
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const { t, tm } = useI18n(props.textData);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("h2", _hoisted_2, toDisplayString(unref(t)("title")), 1),
+        createElementVNode("div", _hoisted_3, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(tm)("milestones"), (milestone, index) => {
+            return openBlock(), createElementBlock("div", {
+              key: index,
+              class: "timeline-item br-white-transp-10 br-1px br-solid pd-big radius-small"
+            }, [
+              createElementVNode("div", _hoisted_4, [
+                milestone.finished ? (openBlock(), createElementBlock("svg", _hoisted_5, _cache[0] || (_cache[0] = [
+                  createElementVNode("g", { id: "24 / basic / check-mark" }, [
+                    createElementVNode("path", {
+                      id: "icon",
+                      "fill-rule": "evenodd",
+                      "clip-rule": "evenodd",
+                      d: "M7.28033 10.7197L14.25 3.75L15.3107 4.81066L7.28033 12.841L3 8.56066L4.06066 7.5L7.28033 10.7197Z",
+                      fill: "rgb(var(--main))"
+                    })
+                  ], -1)
+                ]))) : createCommentVNode("", true)
+              ]),
+              createElementVNode("div", _hoisted_6, [
+                createElementVNode("h3", _hoisted_7, toDisplayString(unref(t)(milestone.title)), 1),
+                createElementVNode("p", _hoisted_8, toDisplayString(milestone.date), 1),
+                createElementVNode("p", _hoisted_9, toDisplayString(unref(t)(milestone.description)), 1)
+              ])
+            ]);
+          }), 128))
+        ])
+      ]);
+    };
+  }
+};
+const SectionRoadmap = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-148fd4a9"]]);
+export {
+  SectionRoadmap as default
+};
+//# sourceMappingURL=SectionRoadmap.vue.js.map

package/dist/martyrs/src/modules/landing/components/sections/SectionRoadmap.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionRoadmap.vue.js","sources":["../../../../../../../src/modules/landing/components/sections/SectionRoadmap.vue"],"sourcesContent":["<script setup>\nimport { ref } from 'vue';\nimport { useI18n } from 'vue-i18n';\n\nconst props = defineProps({\n  textData: {\n    type: Object,\n    default: () => ({\n      messages: {\n        en: {\n          title: 'Weeder Roadmap',\n          milestones: [{\n            title: 'MVP in Thailand',\n            description: 'The Weeder platform was tested as a minimum viable product (MVP) in Thailand to validate its basic features and gather user feedback. This helped the company make improvements before launching on a larger scale.',\n            date: '2023-02-01',\n            finished: 'true'\n          },{\n            date: '2023-05-01',\n            title: 'Weeder Platform Soft Launch',\n            description: 'A soft version of the Weeder platform will be launched for users to explore and provide feedback. This allows the company to identify any issues and make improvements before the official release.',\n          },{\n            date: '2023-07-01',\n            title: 'IDO',\n            description: 'The Initial DEX Offering (IDO) will launch the Weeder token on a our decentralized platform. It allows the public to purchase Weeder tokens and get involved in the project at an early stage. It can also help establish the initial token price.',\n          },{\n            date: '2023-09-01',\n            title: 'Weeder Platform Official Release',\n            description: 'The Weeder platform will be officially released with dividend features, cashback, and full blockchain integration. This marks the full launch of the platform and allows users to access all its features.',\n          },{\n            date: '2023-11-01',\n            title: 'Weeder Ecosystem Expansion',\n            description: 'The Weeder ecosystem will be expanded by adding support for new countries and enhancing its functionalities. This helps to increase the platforms user base and improve its overall capabilities.',\n          }]\n        }\n      }\n    })\n  }\n});\n\nconst { t,tm } = useI18n(props.textData);\n</script>\n\n<template>\n  <div class=\"o-hidden bg-black t-white t-left pd-big radius-medium\">\n    <h2 class=\"mn-b-big t-center w-100\">{{ t('title') }}</h2>\n    \n    <div class=\"gap-thin flex-nowrap flex o-scrolled timeline custom-scroll\">\n      <div\n        v-for=\"(milestone, index) in tm('milestones')\"\n        :key=\"index\"\n        class=\"timeline-item br-white-transp-10 br-1px br-solid pd-big radius-small\"\n      >\n      \n        <div class=\"mn-b-semi bg-white-transp-5 timeline-icon\">\n          <svg v-if=\"milestone.finished\"  width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <g id=\"24 / basic / check-mark\">\n            <path id=\"icon\" fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M7.28033 10.7197L14.25 3.75L15.3107 4.81066L7.28033 12.841L3 8.56066L4.06066 7.5L7.28033 10.7197Z\" fill=\"rgb(var(--main))\"/>\n            </g>\n          </svg>\n        </div>\n\n        <div class=\"w-100 timeline-content\">\n          <h3 class=\"mn-b-small\">{{ t(milestone.title) }}</h3>\n          <p class=\"uppercase mn-b-semi t-main t-semi date\">{{ milestone.date }}</p>\n          <p class=\"t-transp w-100\">{{ t(milestone.description) }}</p>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n  .timeline {\n    .timeline-item {\n      min-width: 32rem;\n    }\n\n    .timeline-icon {\n      border-radius: 100%;\n      width: 3rem;\n      height: 3rem;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    \n\n      img {\n        width: 1.5rem;\n        height: 1.5rem;\n      }\n    }\n  }\n\n  .custom-scroll {\n    overflow-x: scroll;\n    scrollbar-width: none; /* Hide scrollbar for Firefox */\n    -ms-overflow-style: none; /* Hide scrollbar for IE and Edge */\n    display: -webkit-box; /* Fix for Safari */\n    display: -webkit-flex; /* Fix for Safari */\n    display: -ms-flexbox;\n    display: flex;\n  }\n\n  .custom-scroll::-webkit-scrollbar {\n    width: 0px; /* Hide scrollbar for Chrome and Safari */\n    height: 0px;\n  }\n</style>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,UAAM,QAAQ;AAmCd,UAAM,EAAE,GAAE,GAAE,IAAK,QAAQ,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/landing/landing.client.cjs

@@ -9,6 +9,9 @@ const SectionGuide = require("./components/sections/SectionGuide.vue.cjs");
 const SectionOverview = require("./components/sections/SectionOverview.vue.cjs");
 const FloatingImages = require("./components/elements/FloatingImages.vue.cjs");
 const AnimatedGrid = require("./components/elements/AnimatedGrid.vue.cjs");
+const SectionHeroToken = require("./components/sections/SectionHeroToken.vue.cjs");
+const SectionFeaturesImages = require("./components/sections/SectionFeaturesImages.vue.cjs");
+const SectionRoadmap = require("./components/sections/SectionRoadmap.vue.cjs");
 exports.SectionFeatures = SectionFeatures.default;
 exports.SectionMobileApp = SectionMobileApp.default;
 exports.SectionJoinUs = SectionJoinUs.default;
@@ -18,4 +21,7 @@ exports.SectionGuide = SectionGuide.default;
 exports.SectionOverview = SectionOverview.default;
 exports.FloatingImages = FloatingImages.default;
 exports.AnimatedGrid = AnimatedGrid.default;
+exports.SectionHeroToken = SectionHeroToken.default;
+exports.SectionFeaturesImages = SectionFeaturesImages.default;
+exports.SectionRoadmap = SectionRoadmap.default;
 //# sourceMappingURL=landing.client.cjs.map

package/dist/martyrs/src/modules/landing/landing.client.cjs.map

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

package/dist/martyrs/src/modules/landing/landing.client.js

@@ -7,15 +7,21 @@ import { default as default7 } from "./components/sections/SectionGuide.vue.js";
 import { default as default8 } from "./components/sections/SectionOverview.vue.js";
 import { default as default9 } from "./components/elements/FloatingImages.vue.js";
 import { default as default10 } from "./components/elements/AnimatedGrid.vue.js";
+import { default as default11 } from "./components/sections/SectionHeroToken.vue.js";
+import { default as default12 } from "./components/sections/SectionFeaturesImages.vue.js";
+import { default as default13 } from "./components/sections/SectionRoadmap.vue.js";
 export {
   default10 as AnimatedGrid,
   default9 as FloatingImages,
   default6 as SectionEarn,
   default2 as SectionFeatures,
+  default12 as SectionFeaturesImages,
   default7 as SectionGuide,
+  default11 as SectionHeroToken,
   default4 as SectionJoinUs,
   default3 as SectionMobileApp,
   default8 as SectionOverview,
+  default13 as SectionRoadmap,
   default5 as SubscribeNewsletter
 };
 //# sourceMappingURL=landing.client.js.map

package/dist/martyrs/src/modules/landing/landing.client.js.map

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

package/dist/martyrs/src/modules/notifications/components/elements/NotificationBadge.vue.cjs

@@ -52,12 +52,6 @@ const _sfc_main = {
     });
     const toggleNotifications = () => {
       isOpen.value = !isOpen.value;
-      if (isOpen.value) {
-        const userId = auth.state.user._id;
-        if (userId) {
-          getNotifications(userId);
-        }
-      }
     };
     const handleNotificationClick = (notification) => {
       isOpen.value = false;
@@ -76,11 +70,9 @@ const _sfc_main = {
     };
     vue.onMounted(() => {
       document.addEventListener("click", handleClickOutside);
-      if (isOpen.value) {
-        const userId = auth.state.user._id;
-        if (userId) {
-          getNotifications(userId);
-        }
+      const userId = auth.state.user._id;
+      if (userId) {
+        getNotifications(userId);
       }
     });
     vue.onUnmounted(() => {
@@ -134,6 +126,6 @@ const _sfc_main = {
     };
   }
 };
-const NotificationBadge = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-73074f7a"]]);
+const NotificationBadge = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-23980e50"]]);
 exports.default = NotificationBadge;
 //# sourceMappingURL=NotificationBadge.vue.cjs.map

package/dist/martyrs/src/modules/notifications/components/elements/NotificationBadge.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationBadge.vue.cjs","sources":["../../../../../../../src/modules/notifications/components/elements/NotificationBadge.vue"],"sourcesContent":["<template>\n  <div class=\"notification-badge-container\">\n    <button \n      class=\"i-semi notification-button\"\n      @click=\"toggleNotifications\"\n      :aria-label=\"unreadCount > 0 ? `${unreadCount} unread notifications` : 'No unread notifications'\"\n    >\n      <IconBell class=\"notification-icon i-medium\" :fill=\"fill\"/>\n      <span \n        v-if=\"unreadCount > 0\" \n        class=\"button-counter\"\n      >\n        {{ unreadCount > 99 ? '99+' : unreadCount }}\n      </span>\n    </button>\n    <div v-if=\"isOpen\" class=\"notifications-dropdown\">\n      <div class=\"notifications-header\">\n        <h3>Notifications</h3>\n        <button \n          v-if=\"unreadCount > 0\" \n          class=\"mark-all-read-btn\" \n          @click=\"markAllAsRead\"\n        >\n          Mark all read\n        </button>\n      </div>\n      <div v-if=\"loading\" class=\"notifications-loading\">\n        Loading...\n      </div>\n      <div v-else-if=\"notifications.length === 0\" class=\"notifications-empty\">\n        No notifications\n      </div>\n      <div v-else class=\"notifications-list\">\n        <notification-item \n          v-for=\"notification in recentNotifications\" \n          :key=\"notification._id\" \n          :notification=\"notification\"\n          @click=\"handleNotificationClick(notification)\"\n        />\n      </div>\n      <div class=\"notifications-footer\">\n        <router-link to=\"/notifications\" @click=\"isOpen = false\">\n          View all notifications\n        </router-link>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, inject } from 'vue';\nimport { useRouter } from 'vue-router';\nimport NotificationItem from '../blocks/NotificationItem.vue';\nimport * as auth from '@martyrs/src/modules/auth/views/store/auth';\n\nimport IconBell from '@martyrs/src/modules/icons/entities/IconBell.vue';\n\nconst props = defineProps({\n  maxNotifications: {\n    type: Number,\n    default: 5\n  },\n  fill: {\n    type: String,\n    default: 'rgb(var(--white))'\n  }\n});\n\n// Get router and notification functionality\nconst router = useRouter();\nconst { notifications, unreadCount, loading, markAllAsRead, getNotifications } = inject('useNotifications')();\n\n// Local state\nconst isOpen = ref(false);\n\n// Computed properties\nconst recentNotifications = computed(() => {\n  return notifications.value\n    .slice()\n    .sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt))\n    .slice(0, props.maxNotifications);\n});\n\n// Methods\nconst toggleNotifications = () => {\n  isOpen.value = !isOpen.value;\n  \n  // Load notifications if opening\n  if (isOpen.value) {\n    const userId = auth.state.user._id;\n    if (userId) {\n      getNotifications(userId);\n    }\n  }\n};\n\nconst handleNotificationClick = (notification) => {\n  isOpen.value = false;\n  \n  if (notification._id) {\n    // Handle in store\n    actions.handleNotificationAction({\n      notificationId: notification._id,\n      ...notification.metadata\n    });\n  }\n};\n\n// Close dropdown when clicking outside\nconst handleClickOutside = (event) => {\n  const container = document.querySelector('.notification-badge-container');\n  if (container && !container.contains(event.target)) {\n    isOpen.value = false;\n  }\n};\n\n// Lifecycle hooks\nonMounted(() => {\n  document.addEventListener('click', handleClickOutside);\n\n  if (isOpen.value) {\n    const userId = auth.state.user._id;\n    if (userId) {\n      getNotifications(userId);\n    }\n  }\n});\n\nonUnmounted(() => {\n  document.removeEventListener('click', handleClickOutside);\n});\n</script>\n\n<style scoped>\n.notification-badge-container {\n  position: relative;\n  display: inline-block;\n}\n\n.notification-button {\n  background: none;\n  border: none;\n  cursor: pointer;\n  position: relative;\n  font-size: 1.2rem;\n}\n\n.notification-icon {\n  font-size: 1.4rem;\n}\n.button-counter {\n  position: absolute;\n  right: -8px;\n  bottom: -8px;\n  background: rgb(var(--fourth));\n  color: rgb(var(--white));\n  height: 16px;\n  border-radius: 16px;\n  width: 16px;\n  font-weight: 500;\n  text-align: center;\n  line-height: 16px;\n  font-size: 10px;\n}\n.notifications-dropdown {\n  position: absolute;\n  top: 100%;\n  right: 0;\n  width: 320px;\n  max-height: 400px;\n  overflow-y: auto;\n  background-color: white;\n  border-radius: 4px;\n  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n}\n\n.notifications-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 12px 16px;\n  border-bottom: 1px solid #eee;\n}\n\n.notifications-header h3 {\n  margin: 0;\n  font-size: 1rem;\n}\n\n.mark-all-read-btn {\n  background: none;\n  border: none;\n  color: #2196f3;\n  font-size: 0.8rem;\n  cursor: pointer;\n}\n\n.notifications-loading,\n.notifications-empty {\n  padding: 24px;\n  text-align: center;\n  color: #666;\n}\n\n.notifications-list {\n  max-height: 300px;\n  overflow-y: auto;\n}\n\n.notifications-footer {\n  padding: 12px 16px;\n  text-align: center;\n  border-top: 1px solid #eee;\n}\n\n.notifications-footer a {\n  color: #2196f3;\n  text-decoration: none;\n  font-size: 0.9rem;\n}\n</style>"],"names":["useRouter","inject","ref","computed","auth.state","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,UAAM,QAAQ;AAYCA,cAAS,UAAA;AACxB,UAAM,EAAE,eAAe,aAAa,SAAS,eAAe,qBAAqBC,IAAAA,OAAO,kBAAkB,EAAG;AAG7G,UAAM,SAASC,IAAG,IAAC,KAAK;AAGxB,UAAM,sBAAsBC,IAAQ,SAAC,MAAM;AACzC,aAAO,cAAc,MAClB,MAAK,EACL,KAAK,CAAC,GAAG,MAAM,IAAI,KAAK,EAAE,SAAS,IAAI,IAAI,KAAK,EAAE,SAAS,CAAC,EAC5D,MAAM,GAAG,MAAM,gBAAgB;AAAA,IACpC,CAAC;AAGD,UAAM,sBAAsB,MAAM;AAChC,aAAO,QAAQ,CAAC,OAAO;AAGvB,UAAI,OAAO,OAAO;AAChB,cAAM,SAASC,WAAW,KAAK;AAC/B,YAAI,QAAQ;AACV,2BAAiB,MAAM;AAAA,QAC7B;AAAA,MACA;AAAA,IACA;AAEA,UAAM,0BAA0B,CAAC,iBAAiB;AAChD,aAAO,QAAQ;AAEf,UAAI,aAAa,KAAK;AAEpB,gBAAQ,yBAAyB;AAAA,UAC/B,gBAAgB,aAAa;AAAA,UAC7B,GAAG,aAAa;AAAA,QACtB,CAAK;AAAA,MACL;AAAA,IACA;AAGA,UAAM,qBAAqB,CAAC,UAAU;AACpC,YAAM,YAAY,SAAS,cAAc,+BAA+B;AACxE,UAAI,aAAa,CAAC,UAAU,SAAS,MAAM,MAAM,GAAG;AAClD,eAAO,QAAQ;AAAA,MACnB;AAAA,IACA;AAGAC,QAAAA,UAAU,MAAM;AACd,eAAS,iBAAiB,SAAS,kBAAkB;AAErD,UAAI,OAAO,OAAO;AAChB,cAAM,SAASD,WAAW,KAAK;AAC/B,YAAI,QAAQ;AACV,2BAAiB,MAAM;AAAA,QAC7B;AAAA,MACA;AAAA,IACA,CAAC;AAEDE,QAAAA,YAAY,MAAM;AAChB,eAAS,oBAAoB,SAAS,kBAAkB;AAAA,IAC1D,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"NotificationBadge.vue.cjs","sources":["../../../../../../../src/modules/notifications/components/elements/NotificationBadge.vue"],"sourcesContent":["<template>\n  <div class=\"notification-badge-container\">\n    <button \n      class=\"i-semi notification-button\"\n      @click=\"toggleNotifications\"\n      :aria-label=\"unreadCount > 0 ? `${unreadCount} unread notifications` : 'No unread notifications'\"\n    >\n      <IconBell class=\"notification-icon i-medium\" :fill=\"fill\"/>\n      <span \n        v-if=\"unreadCount > 0\" \n        class=\"button-counter\"\n      >\n        {{ unreadCount > 99 ? '99+' : unreadCount }}\n      </span>\n    </button>\n    <div v-if=\"isOpen\" class=\"notifications-dropdown\">\n      <div class=\"notifications-header\">\n        <h3>Notifications</h3>\n        <button \n          v-if=\"unreadCount > 0\" \n          class=\"mark-all-read-btn\" \n          @click=\"markAllAsRead\"\n        >\n          Mark all read\n        </button>\n      </div>\n      <div v-if=\"loading\" class=\"notifications-loading\">\n        Loading...\n      </div>\n      <div v-else-if=\"notifications.length === 0\" class=\"notifications-empty\">\n        No notifications\n      </div>\n      <div v-else class=\"notifications-list\">\n        <notification-item \n          v-for=\"notification in recentNotifications\" \n          :key=\"notification._id\" \n          :notification=\"notification\"\n          @click=\"handleNotificationClick(notification)\"\n        />\n      </div>\n      <div class=\"notifications-footer\">\n        <router-link to=\"/notifications\" @click=\"isOpen = false\">\n          View all notifications\n        </router-link>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, inject } from 'vue';\nimport { useRouter } from 'vue-router';\nimport NotificationItem from '../blocks/NotificationItem.vue';\nimport * as auth from '@martyrs/src/modules/auth/views/store/auth';\n\nimport IconBell from '@martyrs/src/modules/icons/entities/IconBell.vue';\n\nconst props = defineProps({\n  maxNotifications: {\n    type: Number,\n    default: 5\n  },\n  fill: {\n    type: String,\n    default: 'rgb(var(--white))'\n  }\n});\n\n// Get router and notification functionality\nconst router = useRouter();\nconst { notifications, unreadCount, loading, markAllAsRead, getNotifications } = inject('useNotifications')();\n\n// Local state\nconst isOpen = ref(false);\n\n// Computed properties\nconst recentNotifications = computed(() => {\n  return notifications.value\n    .slice()\n    .sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt))\n    .slice(0, props.maxNotifications);\n});\n\n// Methods\nconst toggleNotifications = () => {\n  isOpen.value = !isOpen.value;\n};\n\nconst handleNotificationClick = (notification) => {\n  isOpen.value = false;\n  \n  if (notification._id) {\n    // Handle in store\n    actions.handleNotificationAction({\n      notificationId: notification._id,\n      ...notification.metadata\n    });\n  }\n};\n\n// Close dropdown when clicking outside\nconst handleClickOutside = (event) => {\n  const container = document.querySelector('.notification-badge-container');\n  if (container && !container.contains(event.target)) {\n    isOpen.value = false;\n  }\n};\n\n// Lifecycle hooks\nonMounted(() => {\n  document.addEventListener('click', handleClickOutside);\n\n  // Load notifications when component mounts\n  const userId = auth.state.user._id;\n  if (userId) {\n    getNotifications(userId);\n  }\n});\n\nonUnmounted(() => {\n  document.removeEventListener('click', handleClickOutside);\n});\n</script>\n\n<style scoped>\n.notification-badge-container {\n  position: relative;\n  display: inline-block;\n}\n\n.notification-button {\n  background: none;\n  border: none;\n  cursor: pointer;\n  position: relative;\n  font-size: 1.2rem;\n}\n\n.notification-icon {\n  font-size: 1.4rem;\n}\n.button-counter {\n  position: absolute;\n  right: -8px;\n  bottom: -8px;\n  background: rgb(var(--fourth));\n  color: rgb(var(--white));\n  height: 16px;\n  border-radius: 16px;\n  width: 16px;\n  font-weight: 500;\n  text-align: center;\n  line-height: 16px;\n  font-size: 10px;\n}\n.notifications-dropdown {\n  position: absolute;\n  top: 100%;\n  right: 0;\n  width: 320px;\n  max-height: 400px;\n  overflow-y: auto;\n  background-color: white;\n  border-radius: 4px;\n  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n}\n\n.notifications-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 12px 16px;\n  border-bottom: 1px solid #eee;\n}\n\n.notifications-header h3 {\n  margin: 0;\n  font-size: 1rem;\n}\n\n.mark-all-read-btn {\n  background: none;\n  border: none;\n  color: #2196f3;\n  font-size: 0.8rem;\n  cursor: pointer;\n}\n\n.notifications-loading,\n.notifications-empty {\n  padding: 24px;\n  text-align: center;\n  color: #666;\n}\n\n.notifications-list {\n  max-height: 300px;\n  overflow-y: auto;\n}\n\n.notifications-footer {\n  padding: 12px 16px;\n  text-align: center;\n  border-top: 1px solid #eee;\n}\n\n.notifications-footer a {\n  color: #2196f3;\n  text-decoration: none;\n  font-size: 0.9rem;\n}\n</style>"],"names":["useRouter","inject","ref","computed","onMounted","auth.state","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,UAAM,QAAQ;AAYCA,cAAS,UAAA;AACxB,UAAM,EAAE,eAAe,aAAa,SAAS,eAAe,qBAAqBC,IAAAA,OAAO,kBAAkB,EAAG;AAG7G,UAAM,SAASC,IAAG,IAAC,KAAK;AAGxB,UAAM,sBAAsBC,IAAQ,SAAC,MAAM;AACzC,aAAO,cAAc,MAClB,MAAK,EACL,KAAK,CAAC,GAAG,MAAM,IAAI,KAAK,EAAE,SAAS,IAAI,IAAI,KAAK,EAAE,SAAS,CAAC,EAC5D,MAAM,GAAG,MAAM,gBAAgB;AAAA,IACpC,CAAC;AAGD,UAAM,sBAAsB,MAAM;AAChC,aAAO,QAAQ,CAAC,OAAO;AAAA,IACzB;AAEA,UAAM,0BAA0B,CAAC,iBAAiB;AAChD,aAAO,QAAQ;AAEf,UAAI,aAAa,KAAK;AAEpB,gBAAQ,yBAAyB;AAAA,UAC/B,gBAAgB,aAAa;AAAA,UAC7B,GAAG,aAAa;AAAA,QACtB,CAAK;AAAA,MACL;AAAA,IACA;AAGA,UAAM,qBAAqB,CAAC,UAAU;AACpC,YAAM,YAAY,SAAS,cAAc,+BAA+B;AACxE,UAAI,aAAa,CAAC,UAAU,SAAS,MAAM,MAAM,GAAG;AAClD,eAAO,QAAQ;AAAA,MACnB;AAAA,IACA;AAGAC,QAAAA,UAAU,MAAM;AACd,eAAS,iBAAiB,SAAS,kBAAkB;AAGrD,YAAM,SAASC,WAAW,KAAK;AAC/B,UAAI,QAAQ;AACV,yBAAiB,MAAM;AAAA,MAC3B;AAAA,IACA,CAAC;AAEDC,QAAAA,YAAY,MAAM;AAChB,eAAS,oBAAoB,SAAS,kBAAkB;AAAA,IAC1D,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/notifications/components/elements/NotificationBadge.vue.js

@@ -50,12 +50,6 @@ const _sfc_main = {
     });
     const toggleNotifications = () => {
       isOpen.value = !isOpen.value;
-      if (isOpen.value) {
-        const userId = state.user._id;
-        if (userId) {
-          getNotifications(userId);
-        }
-      }
     };
     const handleNotificationClick = (notification) => {
       isOpen.value = false;
@@ -74,11 +68,9 @@ const _sfc_main = {
     };
     onMounted(() => {
       document.addEventListener("click", handleClickOutside);
-      if (isOpen.value) {
-        const userId = state.user._id;
-        if (userId) {
-          getNotifications(userId);
-        }
+      const userId = state.user._id;
+      if (userId) {
+        getNotifications(userId);
       }
     });
     onUnmounted(() => {
@@ -132,7 +124,7 @@ const _sfc_main = {
     };
   }
 };
-const NotificationBadge = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-73074f7a"]]);
+const NotificationBadge = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-23980e50"]]);
 export {
   NotificationBadge as default
 };

package/dist/martyrs/src/modules/notifications/components/elements/NotificationBadge.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationBadge.vue.js","sources":["../../../../../../../src/modules/notifications/components/elements/NotificationBadge.vue"],"sourcesContent":["<template>\n  <div class=\"notification-badge-container\">\n    <button \n      class=\"i-semi notification-button\"\n      @click=\"toggleNotifications\"\n      :aria-label=\"unreadCount > 0 ? `${unreadCount} unread notifications` : 'No unread notifications'\"\n    >\n      <IconBell class=\"notification-icon i-medium\" :fill=\"fill\"/>\n      <span \n        v-if=\"unreadCount > 0\" \n        class=\"button-counter\"\n      >\n        {{ unreadCount > 99 ? '99+' : unreadCount }}\n      </span>\n    </button>\n    <div v-if=\"isOpen\" class=\"notifications-dropdown\">\n      <div class=\"notifications-header\">\n        <h3>Notifications</h3>\n        <button \n          v-if=\"unreadCount > 0\" \n          class=\"mark-all-read-btn\" \n          @click=\"markAllAsRead\"\n        >\n          Mark all read\n        </button>\n      </div>\n      <div v-if=\"loading\" class=\"notifications-loading\">\n        Loading...\n      </div>\n      <div v-else-if=\"notifications.length === 0\" class=\"notifications-empty\">\n        No notifications\n      </div>\n      <div v-else class=\"notifications-list\">\n        <notification-item \n          v-for=\"notification in recentNotifications\" \n          :key=\"notification._id\" \n          :notification=\"notification\"\n          @click=\"handleNotificationClick(notification)\"\n        />\n      </div>\n      <div class=\"notifications-footer\">\n        <router-link to=\"/notifications\" @click=\"isOpen = false\">\n          View all notifications\n        </router-link>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, inject } from 'vue';\nimport { useRouter } from 'vue-router';\nimport NotificationItem from '../blocks/NotificationItem.vue';\nimport * as auth from '@martyrs/src/modules/auth/views/store/auth';\n\nimport IconBell from '@martyrs/src/modules/icons/entities/IconBell.vue';\n\nconst props = defineProps({\n  maxNotifications: {\n    type: Number,\n    default: 5\n  },\n  fill: {\n    type: String,\n    default: 'rgb(var(--white))'\n  }\n});\n\n// Get router and notification functionality\nconst router = useRouter();\nconst { notifications, unreadCount, loading, markAllAsRead, getNotifications } = inject('useNotifications')();\n\n// Local state\nconst isOpen = ref(false);\n\n// Computed properties\nconst recentNotifications = computed(() => {\n  return notifications.value\n    .slice()\n    .sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt))\n    .slice(0, props.maxNotifications);\n});\n\n// Methods\nconst toggleNotifications = () => {\n  isOpen.value = !isOpen.value;\n  \n  // Load notifications if opening\n  if (isOpen.value) {\n    const userId = auth.state.user._id;\n    if (userId) {\n      getNotifications(userId);\n    }\n  }\n};\n\nconst handleNotificationClick = (notification) => {\n  isOpen.value = false;\n  \n  if (notification._id) {\n    // Handle in store\n    actions.handleNotificationAction({\n      notificationId: notification._id,\n      ...notification.metadata\n    });\n  }\n};\n\n// Close dropdown when clicking outside\nconst handleClickOutside = (event) => {\n  const container = document.querySelector('.notification-badge-container');\n  if (container && !container.contains(event.target)) {\n    isOpen.value = false;\n  }\n};\n\n// Lifecycle hooks\nonMounted(() => {\n  document.addEventListener('click', handleClickOutside);\n\n  if (isOpen.value) {\n    const userId = auth.state.user._id;\n    if (userId) {\n      getNotifications(userId);\n    }\n  }\n});\n\nonUnmounted(() => {\n  document.removeEventListener('click', handleClickOutside);\n});\n</script>\n\n<style scoped>\n.notification-badge-container {\n  position: relative;\n  display: inline-block;\n}\n\n.notification-button {\n  background: none;\n  border: none;\n  cursor: pointer;\n  position: relative;\n  font-size: 1.2rem;\n}\n\n.notification-icon {\n  font-size: 1.4rem;\n}\n.button-counter {\n  position: absolute;\n  right: -8px;\n  bottom: -8px;\n  background: rgb(var(--fourth));\n  color: rgb(var(--white));\n  height: 16px;\n  border-radius: 16px;\n  width: 16px;\n  font-weight: 500;\n  text-align: center;\n  line-height: 16px;\n  font-size: 10px;\n}\n.notifications-dropdown {\n  position: absolute;\n  top: 100%;\n  right: 0;\n  width: 320px;\n  max-height: 400px;\n  overflow-y: auto;\n  background-color: white;\n  border-radius: 4px;\n  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n}\n\n.notifications-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 12px 16px;\n  border-bottom: 1px solid #eee;\n}\n\n.notifications-header h3 {\n  margin: 0;\n  font-size: 1rem;\n}\n\n.mark-all-read-btn {\n  background: none;\n  border: none;\n  color: #2196f3;\n  font-size: 0.8rem;\n  cursor: pointer;\n}\n\n.notifications-loading,\n.notifications-empty {\n  padding: 24px;\n  text-align: center;\n  color: #666;\n}\n\n.notifications-list {\n  max-height: 300px;\n  overflow-y: auto;\n}\n\n.notifications-footer {\n  padding: 12px 16px;\n  text-align: center;\n  border-top: 1px solid #eee;\n}\n\n.notifications-footer a {\n  color: #2196f3;\n  text-decoration: none;\n  font-size: 0.9rem;\n}\n</style>"],"names":["auth.state"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,UAAM,QAAQ;AAYC,cAAS;AACxB,UAAM,EAAE,eAAe,aAAa,SAAS,eAAe,qBAAqB,OAAO,kBAAkB,EAAG;AAG7G,UAAM,SAAS,IAAI,KAAK;AAGxB,UAAM,sBAAsB,SAAS,MAAM;AACzC,aAAO,cAAc,MAClB,MAAK,EACL,KAAK,CAAC,GAAG,MAAM,IAAI,KAAK,EAAE,SAAS,IAAI,IAAI,KAAK,EAAE,SAAS,CAAC,EAC5D,MAAM,GAAG,MAAM,gBAAgB;AAAA,IACpC,CAAC;AAGD,UAAM,sBAAsB,MAAM;AAChC,aAAO,QAAQ,CAAC,OAAO;AAGvB,UAAI,OAAO,OAAO;AAChB,cAAM,SAASA,MAAW,KAAK;AAC/B,YAAI,QAAQ;AACV,2BAAiB,MAAM;AAAA,QAC7B;AAAA,MACA;AAAA,IACA;AAEA,UAAM,0BAA0B,CAAC,iBAAiB;AAChD,aAAO,QAAQ;AAEf,UAAI,aAAa,KAAK;AAEpB,gBAAQ,yBAAyB;AAAA,UAC/B,gBAAgB,aAAa;AAAA,UAC7B,GAAG,aAAa;AAAA,QACtB,CAAK;AAAA,MACL;AAAA,IACA;AAGA,UAAM,qBAAqB,CAAC,UAAU;AACpC,YAAM,YAAY,SAAS,cAAc,+BAA+B;AACxE,UAAI,aAAa,CAAC,UAAU,SAAS,MAAM,MAAM,GAAG;AAClD,eAAO,QAAQ;AAAA,MACnB;AAAA,IACA;AAGA,cAAU,MAAM;AACd,eAAS,iBAAiB,SAAS,kBAAkB;AAErD,UAAI,OAAO,OAAO;AAChB,cAAM,SAASA,MAAW,KAAK;AAC/B,YAAI,QAAQ;AACV,2BAAiB,MAAM;AAAA,QAC7B;AAAA,MACA;AAAA,IACA,CAAC;AAED,gBAAY,MAAM;AAChB,eAAS,oBAAoB,SAAS,kBAAkB;AAAA,IAC1D,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"NotificationBadge.vue.js","sources":["../../../../../../../src/modules/notifications/components/elements/NotificationBadge.vue"],"sourcesContent":["<template>\n  <div class=\"notification-badge-container\">\n    <button \n      class=\"i-semi notification-button\"\n      @click=\"toggleNotifications\"\n      :aria-label=\"unreadCount > 0 ? `${unreadCount} unread notifications` : 'No unread notifications'\"\n    >\n      <IconBell class=\"notification-icon i-medium\" :fill=\"fill\"/>\n      <span \n        v-if=\"unreadCount > 0\" \n        class=\"button-counter\"\n      >\n        {{ unreadCount > 99 ? '99+' : unreadCount }}\n      </span>\n    </button>\n    <div v-if=\"isOpen\" class=\"notifications-dropdown\">\n      <div class=\"notifications-header\">\n        <h3>Notifications</h3>\n        <button \n          v-if=\"unreadCount > 0\" \n          class=\"mark-all-read-btn\" \n          @click=\"markAllAsRead\"\n        >\n          Mark all read\n        </button>\n      </div>\n      <div v-if=\"loading\" class=\"notifications-loading\">\n        Loading...\n      </div>\n      <div v-else-if=\"notifications.length === 0\" class=\"notifications-empty\">\n        No notifications\n      </div>\n      <div v-else class=\"notifications-list\">\n        <notification-item \n          v-for=\"notification in recentNotifications\" \n          :key=\"notification._id\" \n          :notification=\"notification\"\n          @click=\"handleNotificationClick(notification)\"\n        />\n      </div>\n      <div class=\"notifications-footer\">\n        <router-link to=\"/notifications\" @click=\"isOpen = false\">\n          View all notifications\n        </router-link>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, computed, onMounted, onUnmounted, inject } from 'vue';\nimport { useRouter } from 'vue-router';\nimport NotificationItem from '../blocks/NotificationItem.vue';\nimport * as auth from '@martyrs/src/modules/auth/views/store/auth';\n\nimport IconBell from '@martyrs/src/modules/icons/entities/IconBell.vue';\n\nconst props = defineProps({\n  maxNotifications: {\n    type: Number,\n    default: 5\n  },\n  fill: {\n    type: String,\n    default: 'rgb(var(--white))'\n  }\n});\n\n// Get router and notification functionality\nconst router = useRouter();\nconst { notifications, unreadCount, loading, markAllAsRead, getNotifications } = inject('useNotifications')();\n\n// Local state\nconst isOpen = ref(false);\n\n// Computed properties\nconst recentNotifications = computed(() => {\n  return notifications.value\n    .slice()\n    .sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt))\n    .slice(0, props.maxNotifications);\n});\n\n// Methods\nconst toggleNotifications = () => {\n  isOpen.value = !isOpen.value;\n};\n\nconst handleNotificationClick = (notification) => {\n  isOpen.value = false;\n  \n  if (notification._id) {\n    // Handle in store\n    actions.handleNotificationAction({\n      notificationId: notification._id,\n      ...notification.metadata\n    });\n  }\n};\n\n// Close dropdown when clicking outside\nconst handleClickOutside = (event) => {\n  const container = document.querySelector('.notification-badge-container');\n  if (container && !container.contains(event.target)) {\n    isOpen.value = false;\n  }\n};\n\n// Lifecycle hooks\nonMounted(() => {\n  document.addEventListener('click', handleClickOutside);\n\n  // Load notifications when component mounts\n  const userId = auth.state.user._id;\n  if (userId) {\n    getNotifications(userId);\n  }\n});\n\nonUnmounted(() => {\n  document.removeEventListener('click', handleClickOutside);\n});\n</script>\n\n<style scoped>\n.notification-badge-container {\n  position: relative;\n  display: inline-block;\n}\n\n.notification-button {\n  background: none;\n  border: none;\n  cursor: pointer;\n  position: relative;\n  font-size: 1.2rem;\n}\n\n.notification-icon {\n  font-size: 1.4rem;\n}\n.button-counter {\n  position: absolute;\n  right: -8px;\n  bottom: -8px;\n  background: rgb(var(--fourth));\n  color: rgb(var(--white));\n  height: 16px;\n  border-radius: 16px;\n  width: 16px;\n  font-weight: 500;\n  text-align: center;\n  line-height: 16px;\n  font-size: 10px;\n}\n.notifications-dropdown {\n  position: absolute;\n  top: 100%;\n  right: 0;\n  width: 320px;\n  max-height: 400px;\n  overflow-y: auto;\n  background-color: white;\n  border-radius: 4px;\n  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n}\n\n.notifications-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 12px 16px;\n  border-bottom: 1px solid #eee;\n}\n\n.notifications-header h3 {\n  margin: 0;\n  font-size: 1rem;\n}\n\n.mark-all-read-btn {\n  background: none;\n  border: none;\n  color: #2196f3;\n  font-size: 0.8rem;\n  cursor: pointer;\n}\n\n.notifications-loading,\n.notifications-empty {\n  padding: 24px;\n  text-align: center;\n  color: #666;\n}\n\n.notifications-list {\n  max-height: 300px;\n  overflow-y: auto;\n}\n\n.notifications-footer {\n  padding: 12px 16px;\n  text-align: center;\n  border-top: 1px solid #eee;\n}\n\n.notifications-footer a {\n  color: #2196f3;\n  text-decoration: none;\n  font-size: 0.9rem;\n}\n</style>"],"names":["auth.state"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,UAAM,QAAQ;AAYC,cAAS;AACxB,UAAM,EAAE,eAAe,aAAa,SAAS,eAAe,qBAAqB,OAAO,kBAAkB,EAAG;AAG7G,UAAM,SAAS,IAAI,KAAK;AAGxB,UAAM,sBAAsB,SAAS,MAAM;AACzC,aAAO,cAAc,MAClB,MAAK,EACL,KAAK,CAAC,GAAG,MAAM,IAAI,KAAK,EAAE,SAAS,IAAI,IAAI,KAAK,EAAE,SAAS,CAAC,EAC5D,MAAM,GAAG,MAAM,gBAAgB;AAAA,IACpC,CAAC;AAGD,UAAM,sBAAsB,MAAM;AAChC,aAAO,QAAQ,CAAC,OAAO;AAAA,IACzB;AAEA,UAAM,0BAA0B,CAAC,iBAAiB;AAChD,aAAO,QAAQ;AAEf,UAAI,aAAa,KAAK;AAEpB,gBAAQ,yBAAyB;AAAA,UAC/B,gBAAgB,aAAa;AAAA,UAC7B,GAAG,aAAa;AAAA,QACtB,CAAK;AAAA,MACL;AAAA,IACA;AAGA,UAAM,qBAAqB,CAAC,UAAU;AACpC,YAAM,YAAY,SAAS,cAAc,+BAA+B;AACxE,UAAI,aAAa,CAAC,UAAU,SAAS,MAAM,MAAM,GAAG;AAClD,eAAO,QAAQ;AAAA,MACnB;AAAA,IACA;AAGA,cAAU,MAAM;AACd,eAAS,iBAAiB,SAAS,kBAAkB;AAGrD,YAAM,SAASA,MAAW,KAAK;AAC/B,UAAI,QAAQ;AACV,yBAAiB,MAAM;AAAA,MAC3B;AAAA,IACA,CAAC;AAED,gBAAY,MAAM;AAChB,eAAS,oBAAoB,SAAS,kBAAkB;AAAA,IAC1D,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}