@ozdao/martyrs 0.2.485 → 0.2.487

package/dist/martyrs/src/modules/music/components/cards/PlaylistCard.vue.cjs

@@ -0,0 +1,83 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const Media = require("../../../../components/Media/Media.vue.cjs");
+const Button = require("../../../../components/Button/Button.vue.cjs");
+const IconPlay = require("../../../icons/navigation/IconPlay.vue.cjs");
+const player = require("../../store/player.cjs");
+const _pluginVue_exportHelper = require("../../../../../../_virtual/_plugin-vue_export-helper.cjs");
+const _hoisted_1 = { class: "playlist-cover pos-relative" };
+const _hoisted_2 = { class: "playlist-overlay pos-absolute pos-t-0 pos-l-0 w-100 h-100 flex-center flex transition-cubic-in-out" };
+const _hoisted_3 = { class: "playlist-info pd-small bg-dark-transp-20" };
+const _hoisted_4 = { class: "t-medium t-truncate" };
+const _hoisted_5 = { class: "t-grey t-small t-truncate" };
+const _sfc_main = {
+  __name: "PlaylistCard",
+  props: {
+    playlist: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const playlistInfo = vue.computed(() => {
+      var _a, _b, _c, _d, _e, _f;
+      const trackCount = ((_a = props.playlist.tracks) == null ? void 0 : _a.length) || 0;
+      let creatorName = "Unknown";
+      if ((_d = (_c = (_b = props.playlist.creator) == null ? void 0 : _b.target) == null ? void 0 : _c.profile) == null ? void 0 : _d.name) {
+        creatorName = props.playlist.creator.target.profile.name;
+      } else if ((_f = (_e = props.playlist.creator) == null ? void 0 : _e.target) == null ? void 0 : _f.name) {
+        creatorName = props.playlist.creator.target.name;
+      }
+      return `${creatorName} • ${trackCount} ${trackCount === 1 ? "track" : "tracks"}`;
+    });
+    const playPlaylist = (playlist) => {
+      var _a;
+      const tracks = ((_a = playlist.tracks) == null ? void 0 : _a.map((item) => item.track).filter((track) => track)) || [];
+      if (tracks.length > 0) {
+        player.actions.setQueue(tracks);
+      }
+    };
+    return (_ctx, _cache) => {
+      const _component_router_link = vue.resolveComponent("router-link");
+      return vue.openBlock(), vue.createBlock(_component_router_link, {
+        to: { name: "playlist", params: { url: __props.playlist.url } },
+        class: "playlist-card d-block radius-small o-hidden"
+      }, {
+        default: vue.withCtx(() => [
+          vue.createElementVNode("div", _hoisted_1, [
+            vue.createVNode(Media.default, {
+              url: __props.playlist.coverUrl || "/assets/placeholder-playlist.jpg",
+              class: "w-100 aspect-1x1 object-fit-cover"
+            }, null, 8, ["url"]),
+            vue.createElementVNode("div", _hoisted_2, [
+              vue.createVNode(Button.default, {
+                onClick: _cache[0] || (_cache[0] = vue.withModifiers(($event) => playPlaylist(__props.playlist), ["stop"])),
+                class: "play-button bg-main radius-round flex-center flex aspect-1x1",
+                showLoader: false,
+                showSucces: false
+              }, {
+                default: vue.withCtx(() => [
+                  vue.createVNode(IconPlay.default, {
+                    class: "i-small",
+                    fill: "rgb(var(--black))"
+                  })
+                ]),
+                _: 1
+              })
+            ])
+          ]),
+          vue.createElementVNode("div", _hoisted_3, [
+            vue.createElementVNode("h3", _hoisted_4, vue.toDisplayString(__props.playlist.title), 1),
+            vue.createElementVNode("p", _hoisted_5, vue.toDisplayString(playlistInfo.value), 1)
+          ])
+        ]),
+        _: 1
+      }, 8, ["to"]);
+    };
+  }
+};
+const PlaylistCard = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-238f47e7"]]);
+exports.default = PlaylistCard;
+//# sourceMappingURL=PlaylistCard.vue.cjs.map

package/dist/martyrs/src/modules/music/components/cards/PlaylistCard.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlaylistCard.vue.cjs","sources":["../../../../../../../src/modules/music/components/cards/PlaylistCard.vue"],"sourcesContent":["<!-- components/cards/PlaylistCard.vue -->\n<template>\n  <router-link \n    :to=\"{ name: 'playlist', params: { url: playlist.url } }\" \n    class=\"playlist-card d-block radius-small o-hidden\"\n  >\n    <div class=\"playlist-cover pos-relative\">\n      <Media \n        :url=\"playlist.coverUrl || '/assets/placeholder-playlist.jpg'\" \n        class=\"w-100 aspect-1x1 object-fit-cover\"\n      />\n      <div class=\"playlist-overlay pos-absolute pos-t-0 pos-l-0 w-100 h-100 flex-center flex transition-cubic-in-out\">\n        <Button \n          @click.stop=\"playPlaylist(playlist)\" \n          class=\"play-button bg-main radius-round flex-center flex aspect-1x1\"\n          :showLoader=\"false\"\n          :showSucces=\"false\"\n        >\n          <IconPlay class=\"i-small\" fill=\"rgb(var(--black))\" />\n        </Button>\n      </div>\n    </div>\n    <div class=\"playlist-info pd-small bg-dark-transp-20\">\n      <h3 class=\" t-medium t-truncate\">{{ playlist.title }}</h3>\n      <p class=\"t-grey t-small t-truncate\">{{ playlistInfo }}</p>\n    </div>\n  </router-link>\n</template>\n\n<script setup>\nimport { computed } from 'vue';\nimport Media from '@martyrs/src/components/Media/Media.vue';\nimport Button from '@martyrs/src/components/Button/Button.vue';\nimport IconPlay from '@martyrs/src/modules/icons/navigation/IconPlay.vue';\n\n// Import player store\nimport { actions as playerActions } from '../../store/player.js';\n\nconst props = defineProps({\n  playlist: {\n    type: Object,\n    required: true\n  }\n});\n\n// Computed properties\nconst playlistInfo = computed(() => {\n  const trackCount = props.playlist.tracks?.length || 0;\n  let creatorName = 'Unknown';\n  \n  if (props.playlist.creator?.target?.profile?.name) {\n    creatorName = props.playlist.creator.target.profile.name;\n  } else if (props.playlist.creator?.target?.name) {\n    creatorName = props.playlist.creator.target.name;\n  }\n  \n  return `${creatorName} • ${trackCount} ${trackCount === 1 ? 'track' : 'tracks'}`;\n});\n\n// Methods\nconst playPlaylist = (playlist) => {\n  // Extract tracks from playlist\n  const tracks = playlist.tracks?.map(item => item.track).filter(track => track) || [];\n  \n  if (tracks.length > 0) {\n    playerActions.setQueue(tracks);\n  }\n};\n</script>\n\n<style scoped>\n.playlist-card {\n  transition: transform 0.3s ease;\n}\n\n.playlist-card:hover {\n  transform: translateY(-5px);\n}\n\n.playlist-overlay {\n  background: rgba(0, 0, 0, 0.5);\n  opacity: 0;\n  transition: opacity 0.3s ease;\n}\n\n.playlist-card:hover .playlist-overlay {\n  opacity: 1;\n}\n\n.play-button {\n  width: 48px;\n  height: 48px;\n  transform: scale(0.8);\n  transition: transform 0.3s ease;\n}\n\n.playlist-card:hover .play-button {\n  transform: scale(1);\n}\n</style>"],"names":["computed","playerActions"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsCA,UAAM,QAAQ;AAQd,UAAM,eAAeA,IAAQ,SAAC,MAAM;;AAClC,YAAM,eAAa,WAAM,SAAS,WAAf,mBAAuB,WAAU;AACpD,UAAI,cAAc;AAElB,WAAI,uBAAM,SAAS,YAAf,mBAAwB,WAAxB,mBAAgC,YAAhC,mBAAyC,MAAM;AACjD,sBAAc,MAAM,SAAS,QAAQ,OAAO,QAAQ;AAAA,MACrD,YAAU,iBAAM,SAAS,YAAf,mBAAwB,WAAxB,mBAAgC,MAAM;AAC/C,sBAAc,MAAM,SAAS,QAAQ,OAAO;AAAA,MAChD;AAEE,aAAO,GAAG,WAAW,MAAM,UAAU,IAAI,eAAe,IAAI,UAAU,QAAQ;AAAA,IAChF,CAAC;AAGD,UAAM,eAAe,CAAC,aAAa;;AAEjC,YAAM,WAAS,cAAS,WAAT,mBAAiB,IAAI,UAAQ,KAAK,OAAO,OAAO,WAAS,WAAU,CAAE;AAEpF,UAAI,OAAO,SAAS,GAAG;AACrBC,eAAa,QAAC,SAAS,MAAM;AAAA,MACjC;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/music/components/cards/PlaylistCard.vue.js

@@ -0,0 +1,83 @@
+import { computed, resolveComponent, createBlock, openBlock, withCtx, createElementVNode, createVNode, withModifiers, toDisplayString } from "vue";
+import Media from "../../../../components/Media/Media.vue.js";
+import _sfc_main$1 from "../../../../components/Button/Button.vue.js";
+import _sfc_main$2 from "../../../icons/navigation/IconPlay.vue.js";
+import { actions } from "../../store/player.js";
+import _export_sfc from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "playlist-cover pos-relative" };
+const _hoisted_2 = { class: "playlist-overlay pos-absolute pos-t-0 pos-l-0 w-100 h-100 flex-center flex transition-cubic-in-out" };
+const _hoisted_3 = { class: "playlist-info pd-small bg-dark-transp-20" };
+const _hoisted_4 = { class: "t-medium t-truncate" };
+const _hoisted_5 = { class: "t-grey t-small t-truncate" };
+const _sfc_main = {
+  __name: "PlaylistCard",
+  props: {
+    playlist: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const playlistInfo = computed(() => {
+      var _a, _b, _c, _d, _e, _f;
+      const trackCount = ((_a = props.playlist.tracks) == null ? void 0 : _a.length) || 0;
+      let creatorName = "Unknown";
+      if ((_d = (_c = (_b = props.playlist.creator) == null ? void 0 : _b.target) == null ? void 0 : _c.profile) == null ? void 0 : _d.name) {
+        creatorName = props.playlist.creator.target.profile.name;
+      } else if ((_f = (_e = props.playlist.creator) == null ? void 0 : _e.target) == null ? void 0 : _f.name) {
+        creatorName = props.playlist.creator.target.name;
+      }
+      return `${creatorName} • ${trackCount} ${trackCount === 1 ? "track" : "tracks"}`;
+    });
+    const playPlaylist = (playlist) => {
+      var _a;
+      const tracks = ((_a = playlist.tracks) == null ? void 0 : _a.map((item) => item.track).filter((track) => track)) || [];
+      if (tracks.length > 0) {
+        actions.setQueue(tracks);
+      }
+    };
+    return (_ctx, _cache) => {
+      const _component_router_link = resolveComponent("router-link");
+      return openBlock(), createBlock(_component_router_link, {
+        to: { name: "playlist", params: { url: __props.playlist.url } },
+        class: "playlist-card d-block radius-small o-hidden"
+      }, {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1, [
+            createVNode(Media, {
+              url: __props.playlist.coverUrl || "/assets/placeholder-playlist.jpg",
+              class: "w-100 aspect-1x1 object-fit-cover"
+            }, null, 8, ["url"]),
+            createElementVNode("div", _hoisted_2, [
+              createVNode(_sfc_main$1, {
+                onClick: _cache[0] || (_cache[0] = withModifiers(($event) => playPlaylist(__props.playlist), ["stop"])),
+                class: "play-button bg-main radius-round flex-center flex aspect-1x1",
+                showLoader: false,
+                showSucces: false
+              }, {
+                default: withCtx(() => [
+                  createVNode(_sfc_main$2, {
+                    class: "i-small",
+                    fill: "rgb(var(--black))"
+                  })
+                ]),
+                _: 1
+              })
+            ])
+          ]),
+          createElementVNode("div", _hoisted_3, [
+            createElementVNode("h3", _hoisted_4, toDisplayString(__props.playlist.title), 1),
+            createElementVNode("p", _hoisted_5, toDisplayString(playlistInfo.value), 1)
+          ])
+        ]),
+        _: 1
+      }, 8, ["to"]);
+    };
+  }
+};
+const PlaylistCard = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-238f47e7"]]);
+export {
+  PlaylistCard as default
+};
+//# sourceMappingURL=PlaylistCard.vue.js.map

package/dist/martyrs/src/modules/music/components/cards/PlaylistCard.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlaylistCard.vue.js","sources":["../../../../../../../src/modules/music/components/cards/PlaylistCard.vue"],"sourcesContent":["<!-- components/cards/PlaylistCard.vue -->\n<template>\n  <router-link \n    :to=\"{ name: 'playlist', params: { url: playlist.url } }\" \n    class=\"playlist-card d-block radius-small o-hidden\"\n  >\n    <div class=\"playlist-cover pos-relative\">\n      <Media \n        :url=\"playlist.coverUrl || '/assets/placeholder-playlist.jpg'\" \n        class=\"w-100 aspect-1x1 object-fit-cover\"\n      />\n      <div class=\"playlist-overlay pos-absolute pos-t-0 pos-l-0 w-100 h-100 flex-center flex transition-cubic-in-out\">\n        <Button \n          @click.stop=\"playPlaylist(playlist)\" \n          class=\"play-button bg-main radius-round flex-center flex aspect-1x1\"\n          :showLoader=\"false\"\n          :showSucces=\"false\"\n        >\n          <IconPlay class=\"i-small\" fill=\"rgb(var(--black))\" />\n        </Button>\n      </div>\n    </div>\n    <div class=\"playlist-info pd-small bg-dark-transp-20\">\n      <h3 class=\" t-medium t-truncate\">{{ playlist.title }}</h3>\n      <p class=\"t-grey t-small t-truncate\">{{ playlistInfo }}</p>\n    </div>\n  </router-link>\n</template>\n\n<script setup>\nimport { computed } from 'vue';\nimport Media from '@martyrs/src/components/Media/Media.vue';\nimport Button from '@martyrs/src/components/Button/Button.vue';\nimport IconPlay from '@martyrs/src/modules/icons/navigation/IconPlay.vue';\n\n// Import player store\nimport { actions as playerActions } from '../../store/player.js';\n\nconst props = defineProps({\n  playlist: {\n    type: Object,\n    required: true\n  }\n});\n\n// Computed properties\nconst playlistInfo = computed(() => {\n  const trackCount = props.playlist.tracks?.length || 0;\n  let creatorName = 'Unknown';\n  \n  if (props.playlist.creator?.target?.profile?.name) {\n    creatorName = props.playlist.creator.target.profile.name;\n  } else if (props.playlist.creator?.target?.name) {\n    creatorName = props.playlist.creator.target.name;\n  }\n  \n  return `${creatorName} • ${trackCount} ${trackCount === 1 ? 'track' : 'tracks'}`;\n});\n\n// Methods\nconst playPlaylist = (playlist) => {\n  // Extract tracks from playlist\n  const tracks = playlist.tracks?.map(item => item.track).filter(track => track) || [];\n  \n  if (tracks.length > 0) {\n    playerActions.setQueue(tracks);\n  }\n};\n</script>\n\n<style scoped>\n.playlist-card {\n  transition: transform 0.3s ease;\n}\n\n.playlist-card:hover {\n  transform: translateY(-5px);\n}\n\n.playlist-overlay {\n  background: rgba(0, 0, 0, 0.5);\n  opacity: 0;\n  transition: opacity 0.3s ease;\n}\n\n.playlist-card:hover .playlist-overlay {\n  opacity: 1;\n}\n\n.play-button {\n  width: 48px;\n  height: 48px;\n  transform: scale(0.8);\n  transition: transform 0.3s ease;\n}\n\n.playlist-card:hover .play-button {\n  transform: scale(1);\n}\n</style>"],"names":["playerActions"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsCA,UAAM,QAAQ;AAQd,UAAM,eAAe,SAAS,MAAM;;AAClC,YAAM,eAAa,WAAM,SAAS,WAAf,mBAAuB,WAAU;AACpD,UAAI,cAAc;AAElB,WAAI,uBAAM,SAAS,YAAf,mBAAwB,WAAxB,mBAAgC,YAAhC,mBAAyC,MAAM;AACjD,sBAAc,MAAM,SAAS,QAAQ,OAAO,QAAQ;AAAA,MACrD,YAAU,iBAAM,SAAS,YAAf,mBAAwB,WAAxB,mBAAgC,MAAM;AAC/C,sBAAc,MAAM,SAAS,QAAQ,OAAO;AAAA,MAChD;AAEE,aAAO,GAAG,WAAW,MAAM,UAAU,IAAI,eAAe,IAAI,UAAU,QAAQ;AAAA,IAChF,CAAC;AAGD,UAAM,eAAe,CAAC,aAAa;;AAEjC,YAAM,WAAS,cAAS,WAAT,mBAAiB,IAAI,UAAQ,KAAK,OAAO,OAAO,WAAS,WAAU,CAAE;AAEpF,UAAI,OAAO,SAAS,GAAG;AACrBA,gBAAc,SAAS,MAAM;AAAA,MACjC;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/music/components/cards/TrackCard.vue.cjs

@@ -0,0 +1,68 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const Media = require("../../../../components/Media/Media.vue.cjs");
+const IconPlay = require("../../../icons/navigation/IconPlay.vue.cjs");
+const player = require("../../store/player.cjs");
+const _pluginVue_exportHelper = require("../../../../../../_virtual/_plugin-vue_export-helper.cjs");
+const _hoisted_1 = { class: "track-card-content pd-small flex-v-center flex" };
+const _hoisted_2 = { class: "track-cover mn-r-small" };
+const _hoisted_3 = { class: "track-info flex-1" };
+const _hoisted_4 = { class: "track-name t-truncate" };
+const _hoisted_5 = { class: "track-artist t-grey t-small t-truncate" };
+const _hoisted_6 = { class: "track-play pos-absolute pos-r-0 pos-t-0 h-100 pd-small flex-center flex" };
+const _hoisted_7 = { class: "play-button bg-main radius-round flex-center flex aspect-1x1 i-medium" };
+const _sfc_main = {
+  __name: "TrackCard",
+  props: {
+    track: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const getArtistName = (track) => {
+      if (track.artist) {
+        if (typeof track.artist === "object") {
+          return track.artist.name || "Unknown Artist";
+        }
+        return track.artist;
+      }
+      return "Unknown Artist";
+    };
+    const playTrack = () => {
+      player.actions.playTrack(props.track);
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: "track-card radius-small o-hidden pos-relative cursor-pointer transition-cubic-in-out bg-dark-transp-20",
+        onClick: playTrack
+      }, [
+        vue.createElementVNode("div", _hoisted_1, [
+          vue.createElementVNode("div", _hoisted_2, [
+            vue.createVNode(Media.default, {
+              url: __props.track.coverUrl || __props.track.album && __props.track.album.coverUrl || "/assets/placeholder-track.jpg",
+              class: "w-3r h-3r object-fit-cover radius-small"
+            }, null, 8, ["url"])
+          ]),
+          vue.createElementVNode("div", _hoisted_3, [
+            vue.createElementVNode("div", _hoisted_4, vue.toDisplayString(__props.track.title), 1),
+            vue.createElementVNode("div", _hoisted_5, vue.toDisplayString(getArtistName(__props.track)), 1)
+          ]),
+          vue.createElementVNode("div", _hoisted_6, [
+            vue.createElementVNode("div", _hoisted_7, [
+              vue.createVNode(IconPlay.default, {
+                class: "i-small",
+                fill: "rgb(var(--black))"
+              })
+            ])
+          ])
+        ])
+      ]);
+    };
+  }
+};
+const TrackCard = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-4db48be7"]]);
+exports.default = TrackCard;
+//# sourceMappingURL=TrackCard.vue.cjs.map

package/dist/martyrs/src/modules/music/components/cards/TrackCard.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrackCard.vue.cjs","sources":["../../../../../../../src/modules/music/components/cards/TrackCard.vue"],"sourcesContent":["<!-- components/cards/TrackCard.vue -->\n<template>\n  <div \n    class=\"track-card radius-small o-hidden pos-relative cursor-pointer transition-cubic-in-out bg-dark-transp-20\"\n    @click=\"playTrack\"\n  >\n    <div class=\"track-card-content pd-small flex-v-center flex\">\n      <div class=\"track-cover mn-r-small\">\n        <Media \n          :url=\"track.coverUrl || (track.album && track.album.coverUrl) || '/assets/placeholder-track.jpg'\" \n          class=\"w-3r h-3r object-fit-cover radius-small\"\n        />\n      </div>\n      \n      <div class=\"track-info flex-1\">\n        <div class=\"track-name  t-truncate\">{{ track.title }}</div>\n        <div class=\"track-artist t-grey t-small t-truncate\">{{ getArtistName(track) }}</div>\n      </div>\n      \n      <div class=\"track-play pos-absolute pos-r-0 pos-t-0 h-100 pd-small flex-center flex\">\n        <div class=\"play-button bg-main radius-round flex-center flex aspect-1x1 i-medium\">\n          <IconPlay class=\"i-small\" fill=\"rgb(var(--black))\"/>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { computed } from 'vue';\nimport Media from '@martyrs/src/components/Media/Media.vue';\nimport IconPlay from '@martyrs/src/modules/icons/navigation/IconPlay.vue';\n\n// Import player store\nimport { actions as playerActions } from '../../store/player.js';\n\nconst props = defineProps({\n  track: {\n    type: Object,\n    required: true\n  }\n});\n\n// Methods\nconst getArtistName = (track) => {\n  if (track.artist) {\n    if (typeof track.artist === 'object') {\n      return track.artist.name || 'Unknown Artist';\n    }\n    return track.artist;\n  }\n  return 'Unknown Artist';\n};\n\nconst playTrack = () => {\n  playerActions.playTrack(props.track);\n};\n</script>\n\n<style scoped>\n.track-card {\n  transition: background-color 0.3s ease;\n}\n\n.track-card:hover {\n  background-color: rgba(var(--dark), 0.4);\n}\n\n.track-play {\n  opacity: 0;\n  transition: opacity 0.3s ease;\n}\n\n.track-card:hover .track-play {\n  opacity: 1;\n}\n\n.play-button {\n  transform: scale(0.8);\n  transition: transform 0.3s ease;\n}\n\n.track-card:hover .play-button {\n  transform: scale(1);\n}\n</style>"],"names":["playerActions"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAoCA,UAAM,QAAQ;AAQd,UAAM,gBAAgB,CAAC,UAAU;AAC/B,UAAI,MAAM,QAAQ;AAChB,YAAI,OAAO,MAAM,WAAW,UAAU;AACpC,iBAAO,MAAM,OAAO,QAAQ;AAAA,QAClC;AACI,eAAO,MAAM;AAAA,MACjB;AACE,aAAO;AAAA,IACT;AAEA,UAAM,YAAY,MAAM;AACtBA,qBAAc,UAAU,MAAM,KAAK;AAAA,IACrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/music/components/cards/TrackCard.vue.js

@@ -0,0 +1,68 @@
+import { createElementBlock, openBlock, createElementVNode, createVNode, toDisplayString } from "vue";
+import Media from "../../../../components/Media/Media.vue.js";
+import _sfc_main$1 from "../../../icons/navigation/IconPlay.vue.js";
+import { actions } from "../../store/player.js";
+import _export_sfc from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "track-card-content pd-small flex-v-center flex" };
+const _hoisted_2 = { class: "track-cover mn-r-small" };
+const _hoisted_3 = { class: "track-info flex-1" };
+const _hoisted_4 = { class: "track-name t-truncate" };
+const _hoisted_5 = { class: "track-artist t-grey t-small t-truncate" };
+const _hoisted_6 = { class: "track-play pos-absolute pos-r-0 pos-t-0 h-100 pd-small flex-center flex" };
+const _hoisted_7 = { class: "play-button bg-main radius-round flex-center flex aspect-1x1 i-medium" };
+const _sfc_main = {
+  __name: "TrackCard",
+  props: {
+    track: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const getArtistName = (track) => {
+      if (track.artist) {
+        if (typeof track.artist === "object") {
+          return track.artist.name || "Unknown Artist";
+        }
+        return track.artist;
+      }
+      return "Unknown Artist";
+    };
+    const playTrack = () => {
+      actions.playTrack(props.track);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "track-card radius-small o-hidden pos-relative cursor-pointer transition-cubic-in-out bg-dark-transp-20",
+        onClick: playTrack
+      }, [
+        createElementVNode("div", _hoisted_1, [
+          createElementVNode("div", _hoisted_2, [
+            createVNode(Media, {
+              url: __props.track.coverUrl || __props.track.album && __props.track.album.coverUrl || "/assets/placeholder-track.jpg",
+              class: "w-3r h-3r object-fit-cover radius-small"
+            }, null, 8, ["url"])
+          ]),
+          createElementVNode("div", _hoisted_3, [
+            createElementVNode("div", _hoisted_4, toDisplayString(__props.track.title), 1),
+            createElementVNode("div", _hoisted_5, toDisplayString(getArtistName(__props.track)), 1)
+          ]),
+          createElementVNode("div", _hoisted_6, [
+            createElementVNode("div", _hoisted_7, [
+              createVNode(_sfc_main$1, {
+                class: "i-small",
+                fill: "rgb(var(--black))"
+              })
+            ])
+          ])
+        ])
+      ]);
+    };
+  }
+};
+const TrackCard = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-4db48be7"]]);
+export {
+  TrackCard as default
+};
+//# sourceMappingURL=TrackCard.vue.js.map

package/dist/martyrs/src/modules/music/components/cards/TrackCard.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrackCard.vue.js","sources":["../../../../../../../src/modules/music/components/cards/TrackCard.vue"],"sourcesContent":["<!-- components/cards/TrackCard.vue -->\n<template>\n  <div \n    class=\"track-card radius-small o-hidden pos-relative cursor-pointer transition-cubic-in-out bg-dark-transp-20\"\n    @click=\"playTrack\"\n  >\n    <div class=\"track-card-content pd-small flex-v-center flex\">\n      <div class=\"track-cover mn-r-small\">\n        <Media \n          :url=\"track.coverUrl || (track.album && track.album.coverUrl) || '/assets/placeholder-track.jpg'\" \n          class=\"w-3r h-3r object-fit-cover radius-small\"\n        />\n      </div>\n      \n      <div class=\"track-info flex-1\">\n        <div class=\"track-name  t-truncate\">{{ track.title }}</div>\n        <div class=\"track-artist t-grey t-small t-truncate\">{{ getArtistName(track) }}</div>\n      </div>\n      \n      <div class=\"track-play pos-absolute pos-r-0 pos-t-0 h-100 pd-small flex-center flex\">\n        <div class=\"play-button bg-main radius-round flex-center flex aspect-1x1 i-medium\">\n          <IconPlay class=\"i-small\" fill=\"rgb(var(--black))\"/>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { computed } from 'vue';\nimport Media from '@martyrs/src/components/Media/Media.vue';\nimport IconPlay from '@martyrs/src/modules/icons/navigation/IconPlay.vue';\n\n// Import player store\nimport { actions as playerActions } from '../../store/player.js';\n\nconst props = defineProps({\n  track: {\n    type: Object,\n    required: true\n  }\n});\n\n// Methods\nconst getArtistName = (track) => {\n  if (track.artist) {\n    if (typeof track.artist === 'object') {\n      return track.artist.name || 'Unknown Artist';\n    }\n    return track.artist;\n  }\n  return 'Unknown Artist';\n};\n\nconst playTrack = () => {\n  playerActions.playTrack(props.track);\n};\n</script>\n\n<style scoped>\n.track-card {\n  transition: background-color 0.3s ease;\n}\n\n.track-card:hover {\n  background-color: rgba(var(--dark), 0.4);\n}\n\n.track-play {\n  opacity: 0;\n  transition: opacity 0.3s ease;\n}\n\n.track-card:hover .track-play {\n  opacity: 1;\n}\n\n.play-button {\n  transform: scale(0.8);\n  transition: transform 0.3s ease;\n}\n\n.track-card:hover .play-button {\n  transform: scale(1);\n}\n</style>"],"names":["playerActions"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAoCA,UAAM,QAAQ;AAQd,UAAM,gBAAgB,CAAC,UAAU;AAC/B,UAAI,MAAM,QAAQ;AAChB,YAAI,OAAO,MAAM,WAAW,UAAU;AACpC,iBAAO,MAAM,OAAO,QAAQ;AAAA,QAClC;AACI,eAAO,MAAM;AAAA,MACjB;AACE,aAAO;AAAA,IACT;AAEA,UAAM,YAAY,MAAM;AACtBA,cAAc,UAAU,MAAM,KAAK;AAAA,IACrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/music/components/cards/TrackListCard.vue.cjs

@@ -0,0 +1,162 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const Button = require("../../../../components/Button/Button.vue.cjs");
+const Media = require("../../../../components/Media/Media.vue.cjs");
+const IconPlay = require("../../../icons/navigation/IconPlay.vue.cjs");
+const IconPause = require("../../../icons/navigation/IconPause.vue.cjs");
+const player = require("../../store/player.cjs");
+const _hoisted_1 = { class: "track-number w-3r t-center pos-relative" };
+const _hoisted_2 = {
+  key: 0,
+  class: "t-grey"
+};
+const _hoisted_3 = { class: "track-title flex-child-1 flex flex-v-center" };
+const _hoisted_4 = {
+  key: 0,
+  class: "track-cover mn-r-small"
+};
+const _hoisted_5 = { class: "track-info" };
+const _hoisted_6 = { class: "track-artist t-grey t-small" };
+const _hoisted_7 = { key: 1 };
+const _hoisted_8 = {
+  key: 0,
+  class: "track-album w-15r mobile:w-0 mobile:hidden t-grey t-truncate"
+};
+const _hoisted_9 = { key: 1 };
+const _hoisted_10 = { class: "track-duration w-5r t-right t-grey" };
+const _sfc_main = {
+  __name: "TrackListCard",
+  props: {
+    track: {
+      type: Object,
+      required: true
+    },
+    index: {
+      type: Number,
+      default: 0
+    },
+    showCover: {
+      type: Boolean,
+      default: true
+    },
+    showAlbum: {
+      type: Boolean,
+      default: true
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const hoveredIndex = vue.ref(-1);
+    const isPlaying = (track) => {
+      return player.state.currentTrack && player.state.currentTrack._id === track._id && player.state.isPlaying;
+    };
+    const playTrack = (track, force = false) => {
+      if (isPlaying(track) && !force) {
+        player.actions.togglePlay();
+      } else {
+        player.actions.playTrack(track);
+      }
+    };
+    const pauseTrack = () => {
+      player.actions.pause();
+    };
+    const getArtistName = (track) => {
+      if (!track || !track.artist) return "Unknown Artist";
+      return typeof track.artist === "object" ? track.artist.name : "Unknown Artist";
+    };
+    const formatDuration = (duration) => {
+      if (!duration) return "--:--";
+      const minutes = Math.floor(duration / 60);
+      const seconds = Math.floor(duration % 60);
+      return `${minutes}:${seconds.toString().padStart(2, "0")}`;
+    };
+    return (_ctx, _cache) => {
+      var _a;
+      const _component_router_link = vue.resolveComponent("router-link");
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass(["track-item pd-small hover-bg-dark-transp-25 flex-v-center flex cursor-pointer", { "bg-dark-transp-25": isPlaying(__props.track) }]),
+        onClick: _cache[4] || (_cache[4] = ($event) => playTrack(__props.track)),
+        onDblclick: _cache[5] || (_cache[5] = ($event) => playTrack(__props.track, true)),
+        onMouseenter: _cache[6] || (_cache[6] = ($event) => hoveredIndex.value = props.index),
+        onMouseleave: _cache[7] || (_cache[7] = ($event) => hoveredIndex.value = -1)
+      }, [
+        vue.createElementVNode("div", _hoisted_1, [
+          !isPlaying(__props.track) && hoveredIndex.value !== props.index ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2, vue.toDisplayString(props.index + 1), 1)) : !isPlaying(__props.track) && hoveredIndex.value === props.index ? (vue.openBlock(), vue.createBlock(Button.default, {
+            key: 1,
+            onClick: _cache[0] || (_cache[0] = vue.withModifiers(($event) => playTrack(__props.track), ["stop"])),
+            class: "bg-transparent border-none pd-zero",
+            showLoader: false,
+            showSucces: false
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(IconPlay.default, {
+                class: "i-small",
+                fill: "rgb(var(--white))"
+              })
+            ]),
+            _: 1
+          })) : (vue.openBlock(), vue.createBlock(Button.default, {
+            key: 2,
+            onClick: _cache[1] || (_cache[1] = vue.withModifiers(($event) => pauseTrack(), ["stop"])),
+            class: "bg-transparent border-none pd-zero",
+            showLoader: false,
+            showSucces: false
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(IconPause.default, {
+                class: "i-small",
+                fill: "rgb(var(--main))"
+              })
+            ]),
+            _: 1
+          }))
+        ]),
+        vue.createElementVNode("div", _hoisted_3, [
+          __props.showCover ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
+            vue.createVNode(Media.default, {
+              url: __props.track.coverUrl || __props.track.album && __props.track.album.coverUrl || "/assets/placeholder-track.jpg",
+              class: "w-3r h-3r object-fit-cover o-hidden radius-small"
+            }, null, 8, ["url"])
+          ])) : vue.createCommentVNode("", true),
+          vue.createElementVNode("div", _hoisted_5, [
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass(["track-name", { "t-main": isPlaying(__props.track) }])
+            }, vue.toDisplayString(__props.track.title), 3),
+            vue.createElementVNode("div", _hoisted_6, [
+              __props.track.artist && __props.track.artist._id ? (vue.openBlock(), vue.createBlock(_component_router_link, {
+                key: 0,
+                to: { name: "artist", params: { url: __props.track.artist.url } },
+                class: "t-grey hover-",
+                onClick: _cache[2] || (_cache[2] = vue.withModifiers(() => {
+                }, ["stop"]))
+              }, {
+                default: vue.withCtx(() => [
+                  vue.createTextVNode(vue.toDisplayString(getArtistName(__props.track)), 1)
+                ]),
+                _: 1
+              }, 8, ["to"])) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_7, vue.toDisplayString(getArtistName(__props.track)), 1))
+            ])
+          ])
+        ]),
+        __props.showAlbum ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8, [
+          __props.track.album && __props.track.album._id ? (vue.openBlock(), vue.createBlock(_component_router_link, {
+            key: 0,
+            to: { name: "album", params: { url: __props.track.album.url } },
+            class: "t-grey hover-",
+            onClick: _cache[3] || (_cache[3] = vue.withModifiers(() => {
+            }, ["stop"]))
+          }, {
+            default: vue.withCtx(() => [
+              vue.createTextVNode(vue.toDisplayString(__props.track.album.title), 1)
+            ]),
+            _: 1
+          }, 8, ["to"])) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_9, vue.toDisplayString(((_a = __props.track.album) == null ? void 0 : _a.title) || "Single"), 1))
+        ])) : vue.createCommentVNode("", true),
+        vue.createElementVNode("div", _hoisted_10, vue.toDisplayString(formatDuration(__props.track.duration)), 1)
+      ], 34);
+    };
+  }
+};
+exports.default = _sfc_main;
+//# sourceMappingURL=TrackListCard.vue.cjs.map

package/dist/martyrs/src/modules/music/components/cards/TrackListCard.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrackListCard.vue.cjs","sources":["../../../../../../../src/modules/music/components/cards/TrackListCard.vue"],"sourcesContent":["<!-- components/cards/TrackListCard.vue -->\n<template>\n  <div \n    class=\"track-item pd-small hover-bg-dark-transp-25 flex-v-center flex cursor-pointer\"\n    :class=\"{'bg-dark-transp-25': isPlaying(track)}\"\n    @click=\"playTrack(track)\"\n    @dblclick=\"playTrack(track, true)\"\n    @mouseenter=\"hoveredIndex = props.index\"\n    @mouseleave=\"hoveredIndex = -1\"\n  >\n    <div class=\"track-number w-3r t-center pos-relative\">\n      <span v-if=\"!isPlaying(track) && hoveredIndex !== props.index\" class=\"t-grey\">{{ props.index + 1 }}</span>\n      <Button \n        v-else-if=\"!isPlaying(track) && hoveredIndex === props.index\"\n        @click.stop=\"playTrack(track)\"\n        class=\"bg-transparent border-none pd-zero\"\n        :showLoader=\"false\"\n        :showSucces=\"false\"\n      >\n        <IconPlay class=\"i-small\" fill=\"rgb(var(--white))\"/>\n      </Button>\n      <Button \n        v-else\n        @click.stop=\"pauseTrack()\"\n        class=\"bg-transparent border-none pd-zero\"\n        :showLoader=\"false\"\n        :showSucces=\"false\"\n      >\n        <IconPause class=\"i-small\" fill=\"rgb(var(--main))\"/>\n      </Button>\n    </div>\n    \n    <div class=\"track-title flex-child-1 flex flex-v-center\">\n      <div v-if=\"showCover\" class=\"track-cover mn-r-small\">\n        <Media \n          :url=\"track.coverUrl || (track.album && track.album.coverUrl) || '/assets/placeholder-track.jpg'\" \n          class=\"w-3r h-3r object-fit-cover o-hidden radius-small\"\n        />\n      </div>\n      \n      <div class=\"track-info\">\n        <div class=\"track-name \" :class=\"{'t-main': isPlaying(track)}\">{{ track.title }}</div>\n        <div class=\"track-artist t-grey t-small\">\n          <router-link \n            v-if=\"track.artist && track.artist._id\"\n            :to=\"{ name: 'artist', params: { url: track.artist.url } }\"\n            class=\"t-grey hover-\"\n            @click.stop\n          >\n            {{ getArtistName(track) }}\n          </router-link>\n          <span v-else>{{ getArtistName(track) }}</span>\n        </div>\n      </div>\n    </div>\n    \n    <div v-if=\"showAlbum\" class=\"track-album w-15r mobile:w-0 mobile:hidden t-grey t-truncate\">\n      <router-link \n        v-if=\"track.album && track.album._id\"\n        :to=\"{ name: 'album', params: { url: track.album.url } }\"\n        class=\"t-grey hover-\"\n        @click.stop\n      >\n        {{ track.album.title }}\n      </router-link>\n      <span v-else>{{ track.album?.title || 'Single' }}</span>\n    </div>\n    \n    <div class=\"track-duration w-5r t-right t-grey\">{{ formatDuration(track.duration) }}</div>\n  </div>\n</template>\n\n<script setup>\nimport { ref } from 'vue';\nimport Button from '@martyrs/src/components/Button/Button.vue';\nimport Media from '@martyrs/src/components/Media/Media.vue';\nimport IconPlay from '@martyrs/src/modules/icons/navigation/IconPlay.vue';\nimport IconPause from '@martyrs/src/modules/icons/navigation/IconPause.vue';\n\n// Import player store\nimport { state as playerState, actions as playerActions } from '../../store/player.js';\n\n// Props\nconst props = defineProps({\n  track: {\n    type: Object,\n    required: true\n  },\n  index: {\n    type: Number,\n    default: 0\n  },\n  showCover: {\n    type: Boolean,\n    default: true\n  },\n  showAlbum: {\n    type: Boolean,\n    default: true\n  }\n});\n\n// State\nconst hoveredIndex = ref(-1);\n\n// Methods\nconst isPlaying = (track) => {\n  return playerState.currentTrack && playerState.currentTrack._id === track._id && playerState.isPlaying;\n};\n\nconst playTrack = (track, force = false) => {\n  if (isPlaying(track) && !force) {\n    playerActions.togglePlay();\n  } else {\n    playerActions.playTrack(track);\n  }\n};\n\nconst pauseTrack = () => {\n  playerActions.pause();\n};\n\nconst getArtistName = (track) => {\n  if (!track || !track.artist) return 'Unknown Artist';\n  return typeof track.artist === 'object' ? track.artist.name : 'Unknown Artist';\n};\n\nconst formatDuration = (duration) => {\n  if (!duration) return '--:--';\n  \n  const minutes = Math.floor(duration / 60);\n  const seconds = Math.floor(duration % 60);\n  return `${minutes}:${seconds.toString().padStart(2, '0')}`;\n};\n</script>"],"names":["ref","playerState","playerActions"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmFA,UAAM,QAAQ;AAoBd,UAAM,eAAeA,IAAG,IAAC,EAAE;AAG3B,UAAM,YAAY,CAAC,UAAU;AAC3B,aAAOC,OAAW,MAAC,gBAAgBA,aAAY,aAAa,QAAQ,MAAM,OAAOA,OAAAA,MAAY;AAAA,IAC/F;AAEA,UAAM,YAAY,CAAC,OAAO,QAAQ,UAAU;AAC1C,UAAI,UAAU,KAAK,KAAK,CAAC,OAAO;AAC9BC,eAAAA,QAAc,WAAY;AAAA,MAC9B,OAAS;AACLA,eAAa,QAAC,UAAU,KAAK;AAAA,MACjC;AAAA,IACA;AAEA,UAAM,aAAa,MAAM;AACvBA,aAAAA,QAAc,MAAO;AAAA,IACvB;AAEA,UAAM,gBAAgB,CAAC,UAAU;AAC/B,UAAI,CAAC,SAAS,CAAC,MAAM,OAAQ,QAAO;AACpC,aAAO,OAAO,MAAM,WAAW,WAAW,MAAM,OAAO,OAAO;AAAA,IAChE;AAEA,UAAM,iBAAiB,CAAC,aAAa;AACnC,UAAI,CAAC,SAAU,QAAO;AAEtB,YAAM,UAAU,KAAK,MAAM,WAAW,EAAE;AACxC,YAAM,UAAU,KAAK,MAAM,WAAW,EAAE;AACxC,aAAO,GAAG,OAAO,IAAI,QAAQ,SAAU,EAAC,SAAS,GAAG,GAAG,CAAC;AAAA,IAC1D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}