@ozdao/martyrs 0.2.548 → 0.2.549

package/dist/martyrs/src/components/UploadImage/{UploadImage.vue2.cjs → UploadImage.vue.cjs}

@@ -5,7 +5,7 @@ const axios = require("axios");
 const Loader = require("../Loader/Loader.vue2.cjs");
 const IconUpload = ;/* empty css                                              */
 const IconDelete = require("../../modules/icons/navigation/IconDelete.vue.cjs");
-;/* empty css                  */
+;/* empty css                   */
 const _pluginVue_exportHelper = require("../../../../_virtual/_plugin-vue_export-helper.cjs");
 const _hoisted_1 = ["src"];
 const _hoisted_2 = {
@@ -216,4 +216,4 @@ const _sfc_main = {
 };
 const UploadImage = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-65075013"]]);
 exports.default = UploadImage;
-//# sourceMappingURL=UploadImage.vue2.cjs.map
+//# sourceMappingURL=UploadImage.vue.cjs.map

package/dist/martyrs/src/components/UploadImage/{UploadImage.vue2.js.map → UploadImage.vue.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"UploadImage.vue2.js","sources":["../../../../../src/components/UploadImage/UploadImage.vue"],"sourcesContent":["<template>\n  <div class=\"upload-image-wrapper flex-v-center flex-nowrap flex gap-small\" :class=\"{'with-text': text}\">\n    <div \n      @click=\"onComponentClick\"\n      @drop=\"onDrop\"\n      @dragover.prevent\n      class=\"pos-relative radius-small br-solid br-1px br-black-transp-10 h-100 aspect-1x1 flex-v-center flex-h-center flex cursor-pointer\"\n    >\n      <img loading=\"lazy\" \n        v-if=\"imageUrl || photo || previewUrl\" \n        :src=\"previewUrl || (FILE_SERVER_URL || '') + (imageUrl || photo)\"\n        alt=\"Uploaded image\" \n        class=\"pos-absolute  radius-small o-hidden z-index-1 w-100 h-100 object-fit-cover\"\n      />\n      \n      <div v-else class=\"flex-v-center pos-relative z-index-2 flex-h-center flex w-100 h-100 radius-small  bg-second\" >\n        <IconUpload class=\"i-medium upload-icon\" fill=\"rgb(var(--white))\" />\n      </div>\n      \n      <!-- Hover controls -->\n      <div class=\"z-index-2 pos-relative  hover-controls pos-absolute w-100 h-100 flex-v-center flex-h-center flex\">\n        <div v-if=\"!imageUrl && !photo && !previewUrl\" class=\"hover-upload-icon\">\n          <IconUpload class=\"i-medium\" fill=\"rgb(var(--white))\" />\n        </div>\n        <div v-else class=\"hover-buttons flex gap-small\">\n          <button @click.stop=\"onComponentClick\" class=\"hover-button radius-small pd-thin bg-main t-white br-none cursor-pointer\">\n            <IconUpload class=\"i-medium\" fill=\"rgb(var(--white))\" />\n          </button>\n          <button @click.stop=\"deleteImage\" class=\"hover-button radius-small pd-thin bg-danger t-white br-none cursor-pointer\">\n            <IconDelete class=\"i-medium\" fill=\"rgb(var(--white))\" />\n          </button>\n        </div>\n      </div>\n      \n      <!-- Loading overlay -->\n      <div v-if=\"loading\" class=\"z-index-2 loading-overlay pos-absolute w-100 h-100 flex-v-center flex-h-center flex\">\n        <Loader :centered=\"false\" />\n      </div>\n      \n      <input type=\"file\" name=\"file\" ref=\"fileInput\" @change=\"onFileChange\" style=\"display: none\"/>\n    </div>\n    \n    <!-- Text block -->\n    <div v-if=\"text\" class=\"upload-text-block  flex flex-column\">\n      <span class=\"mn-b-small t-medium\">{{ textConfig.title }}</span>\n      <span class=\"mn-b-medium t-transp\">{{ textConfig.subtitle }}</span>\n      <div v-if=\"!imageUrl && !photo && !previewUrl\">\n        <button @click=\"onComponentClick\" class=\"button button-small w-max bg-main t-black cursor-pointer\">\n          {{ textConfig.buttonText }}\n        </button>\n      </div>\n      <div v-else class=\"flex gap-thin\">\n        <button @click=\"onComponentClick\" class=\"button button-small w-max bg-second t-white cursor-pointer\">\n          Upload \n        </button>\n        <button @click=\"deleteImage\" class=\"button button-small w-max bg-red t-white cursor-pointer\">\n          Delete\n        </button>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, watch, computed } from 'vue';\nimport axios from 'axios';\nimport Loader from '@martyrs/src/components/Loader/Loader.vue';\nimport IconUpload from '@martyrs/src/modules/icons/navigation/IconUpload.vue';\nimport IconDelete from '@martyrs/src/modules/icons/navigation/IconDelete.vue';\n\nconst imageUrl = ref(null);\nconst fileInput = ref(null);\nconst previewUrl = ref(null);\nconst loading = ref(false);\n\nconst props = defineProps({\n  uploadPath: {\n    type: String,\n    required: true\n  },\n  photo: {\n    type: String,\n    default: null\n  },\n  text: {\n    type: [Object, Boolean],\n    default: null\n  }\n});\n\nconst emit = defineEmits(['update:photo', 'error']);\n\n// Text configuration with defaults\nconst textConfig = computed(() => {\n  const defaults = {\n    title: 'Upload Image',\n    subtitle: 'Drag & drop your image here or click button. Supported: JPG, PNG, GIF. Max size: 2MB',\n    buttonText: 'Choose Image'\n  };\n  \n  if (props.text === true) {\n    return defaults;\n  } else if (typeof props.text === 'object' && props.text !== null) {\n    return {\n      title: props.text.title || defaults.title,\n      subtitle: props.text.subtitle || defaults.subtitle,\n      buttonText: props.text.buttonText || defaults.buttonText\n    };\n  }\n  \n  return defaults;\n});\n\nwatch(props, ({photo}) => {\n  if(photo) imageUrl.value = photo;\n});\n\nfunction onComponentClick() {\n  fileInput.value.click();\n}\n\nasync function onFileChange(e) {\n  let file = e.target.files[0];\n  if (!file) {\n    console.error(\"No file selected\");\n    return;\n  }\n  \n  // Create preview from file\n  const reader = new FileReader();\n  reader.onload = (e) => {\n    previewUrl.value = e.target.result;\n  };\n  reader.readAsDataURL(file);\n  \n  let formData = new FormData();\n  formData.append(\"file\", file);\n\n  console.log(\"Sending file:\", file.name); // Логируем имя файла перед отправкой\n  \n  loading.value = true;\n\n  try {\n    const $axios = axios.create({ baseURL: process.env.API_URL, withCredentials: true }); \n\n    let response = await $axios.post(`/api/upload/multiple?folderName=${encodeURIComponent(props.uploadPath)}`, formData);\n    console.log(\"Upload response:\", response); // Логируем ответ сервера\n    imageUrl.value = response.data[0].filepath;\n    previewUrl.value = null; // Clear preview after successful upload\n    emit('update:photo', imageUrl.value);\n  } catch (error) {\n    emit('error', error);\n    console.error(\"Upload error:\", error); // Логируем ошибку\n    previewUrl.value = null; // Clear preview on error\n  } finally {\n    loading.value = false;\n  }\n}\n\n\nfunction onDrop(e) {\n  e.preventDefault();\n  onFileChange({\n    target: {\n      files: e.dataTransfer.files\n    }\n  });\n}\n\nfunction deleteImage() {\n  imageUrl.value = null;\n  previewUrl.value = null;\n  emit('update:photo', null);\n  // Reset file input\n  if (fileInput.value) {\n    fileInput.value.value = '';\n  }\n}\n</script>\n\n<style scoped>\n.image-upload-area {\n  overflow: hidden;\n  transition: all 0.3s ease;\n}\n\n.image-upload-area:hover {\n  opacity: 0.95;\n}\n\n/* Hover controls */\n.hover-controls {\n  top: 0;\n  left: 0;\n  background: rgba(0, 0, 0, 0.7);\n  opacity: 0;\n  transition: opacity 0.3s ease;\n  pointer-events: none;\n}\n\n.image-upload-area:hover .hover-controls {\n  opacity: 1;\n  pointer-events: all;\n}\n\n.hover-upload-icon {\n  animation: pulse 1.5s infinite;\n}\n\n.hover-button {\n  transition: transform 0.2s ease, background-color 0.2s ease;\n}\n\n.hover-button:hover {\n  transform: scale(1.1);\n}\n\n.hover-button:active {\n  transform: scale(0.95);\n}\n\n/* Loading overlay */\n.loading-overlay {\n  top: 0;\n  left: 0;\n  background: rgba(255, 255, 255, 0.9);\n  z-index: 10;\n}\n\n/* Animations */\n@keyframes pulse {\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  50% {\n    transform: scale(1.05);\n    opacity: 0.8;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n\n/* Upload icon in empty state */\n.upload-icon {\n  transition: transform 0.3s ease;\n}\n\n.image-upload-area:hover .upload-icon {\n  transform: scale(1.1);\n}\n</style>\n"],"names":["e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsEA,UAAM,WAAW,IAAI,IAAI;AACzB,UAAM,YAAY,IAAI,IAAI;AAC1B,UAAM,aAAa,IAAI,IAAI;AAC3B,UAAM,UAAU,IAAI,KAAK;AAEzB,UAAM,QAAQ;AAed,UAAM,OAAO;AAGb,UAAM,aAAa,SAAS,MAAM;AAChC,YAAM,WAAW;AAAA,QACf,OAAO;AAAA,QACP,UAAU;AAAA,QACV,YAAY;AAAA,MAChB;AAEE,UAAI,MAAM,SAAS,MAAM;AACvB,eAAO;AAAA,MACT,WAAW,OAAO,MAAM,SAAS,YAAY,MAAM,SAAS,MAAM;AAChE,eAAO;AAAA,UACL,OAAO,MAAM,KAAK,SAAS,SAAS;AAAA,UACpC,UAAU,MAAM,KAAK,YAAY,SAAS;AAAA,UAC1C,YAAY,MAAM,KAAK,cAAc,SAAS;AAAA,QACpD;AAAA,MACE;AAEA,aAAO;AAAA,IACT,CAAC;AAED,UAAM,OAAO,CAAC,EAAC,MAAK,MAAM;AACxB,UAAG,MAAO,UAAS,QAAQ;AAAA,IAC7B,CAAC;AAED,aAAS,mBAAmB;AAC1B,gBAAU,MAAM,MAAK;AAAA,IACvB;AAEA,mBAAe,aAAa,GAAG;AAC7B,UAAI,OAAO,EAAE,OAAO,MAAM,CAAC;AAC3B,UAAI,CAAC,MAAM;AACT,gBAAQ,MAAM,kBAAkB;AAChC;AAAA,MACF;AAGA,YAAM,SAAS,IAAI,WAAU;AAC7B,aAAO,SAAS,CAACA,OAAM;AACrB,mBAAW,QAAQA,GAAE,OAAO;AAAA,MAC9B;AACA,aAAO,cAAc,IAAI;AAEzB,UAAI,WAAW,IAAI,SAAQ;AAC3B,eAAS,OAAO,QAAQ,IAAI;AAE5B,cAAQ,IAAI,iBAAiB,KAAK,IAAI;AAEtC,cAAQ,QAAQ;AAEhB,UAAI;AACF,cAAM,SAAS,MAAM,OAAO,EAAE,SAAS,QAAQ,IAAI,SAAS,iBAAiB,KAAI,CAAE;AAEnF,YAAI,WAAW,MAAM,OAAO,KAAK,mCAAmC,mBAAmB,MAAM,UAAU,CAAC,IAAI,QAAQ;AACpH,gBAAQ,IAAI,oBAAoB,QAAQ;AACxC,iBAAS,QAAQ,SAAS,KAAK,CAAC,EAAE;AAClC,mBAAW,QAAQ;AACnB,aAAK,gBAAgB,SAAS,KAAK;AAAA,MACrC,SAAS,OAAO;AACd,aAAK,SAAS,KAAK;AACnB,gBAAQ,MAAM,iBAAiB,KAAK;AACpC,mBAAW,QAAQ;AAAA,MACrB,UAAC;AACC,gBAAQ,QAAQ;AAAA,MAClB;AAAA,IACF;AAGA,aAAS,OAAO,GAAG;AACjB,QAAE,eAAc;AAChB,mBAAa;AAAA,QACX,QAAQ;AAAA,UACN,OAAO,EAAE,aAAa;AAAA,QAC5B;AAAA,MACA,CAAG;AAAA,IACH;AAEA,aAAS,cAAc;AACrB,eAAS,QAAQ;AACjB,iBAAW,QAAQ;AACnB,WAAK,gBAAgB,IAAI;AAEzB,UAAI,UAAU,OAAO;AACnB,kBAAU,MAAM,QAAQ;AAAA,MAC1B;AAAA,IACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"UploadImage.vue.cjs","sources":["../../../../../src/components/UploadImage/UploadImage.vue"],"sourcesContent":["<template>\n  <div class=\"upload-image-wrapper flex-v-center flex-nowrap flex gap-small\" :class=\"{'with-text': text}\">\n    <div \n      @click=\"onComponentClick\"\n      @drop=\"onDrop\"\n      @dragover.prevent\n      class=\"pos-relative radius-small br-solid br-1px br-black-transp-10 h-100 aspect-1x1 flex-v-center flex-h-center flex cursor-pointer\"\n    >\n      <img loading=\"lazy\" \n        v-if=\"imageUrl || photo || previewUrl\" \n        :src=\"previewUrl || (FILE_SERVER_URL || '') + (imageUrl || photo)\"\n        alt=\"Uploaded image\" \n        class=\"pos-absolute  radius-small o-hidden z-index-1 w-100 h-100 object-fit-cover\"\n      />\n      \n      <div v-else class=\"flex-v-center pos-relative z-index-2 flex-h-center flex w-100 h-100 radius-small  bg-second\" >\n        <IconUpload class=\"i-medium upload-icon\" fill=\"rgb(var(--white))\" />\n      </div>\n      \n      <!-- Hover controls -->\n      <div class=\"z-index-2 pos-relative  hover-controls pos-absolute w-100 h-100 flex-v-center flex-h-center flex\">\n        <div v-if=\"!imageUrl && !photo && !previewUrl\" class=\"hover-upload-icon\">\n          <IconUpload class=\"i-medium\" fill=\"rgb(var(--white))\" />\n        </div>\n        <div v-else class=\"hover-buttons flex gap-small\">\n          <button @click.stop=\"onComponentClick\" class=\"hover-button radius-small pd-thin bg-main t-white br-none cursor-pointer\">\n            <IconUpload class=\"i-medium\" fill=\"rgb(var(--white))\" />\n          </button>\n          <button @click.stop=\"deleteImage\" class=\"hover-button radius-small pd-thin bg-danger t-white br-none cursor-pointer\">\n            <IconDelete class=\"i-medium\" fill=\"rgb(var(--white))\" />\n          </button>\n        </div>\n      </div>\n      \n      <!-- Loading overlay -->\n      <div v-if=\"loading\" class=\"z-index-2 loading-overlay pos-absolute w-100 h-100 flex-v-center flex-h-center flex\">\n        <Loader :centered=\"false\" />\n      </div>\n      \n      <input type=\"file\" name=\"file\" ref=\"fileInput\" @change=\"onFileChange\" style=\"display: none\"/>\n    </div>\n    \n    <!-- Text block -->\n    <div v-if=\"text\" class=\"upload-text-block  flex flex-column\">\n      <span class=\"mn-b-small t-medium\">{{ textConfig.title }}</span>\n      <span class=\"mn-b-medium t-transp\">{{ textConfig.subtitle }}</span>\n      <div v-if=\"!imageUrl && !photo && !previewUrl\">\n        <button @click=\"onComponentClick\" class=\"button button-small w-max bg-main t-black cursor-pointer\">\n          {{ textConfig.buttonText }}\n        </button>\n      </div>\n      <div v-else class=\"flex gap-thin\">\n        <button @click=\"onComponentClick\" class=\"button button-small w-max bg-second t-white cursor-pointer\">\n          Upload \n        </button>\n        <button @click=\"deleteImage\" class=\"button button-small w-max bg-red t-white cursor-pointer\">\n          Delete\n        </button>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, watch, computed } from 'vue';\nimport axios from 'axios';\nimport Loader from '@martyrs/src/components/Loader/Loader.vue';\nimport IconUpload from '@martyrs/src/modules/icons/navigation/IconUpload.vue';\nimport IconDelete from '@martyrs/src/modules/icons/navigation/IconDelete.vue';\n\nconst imageUrl = ref(null);\nconst fileInput = ref(null);\nconst previewUrl = ref(null);\nconst loading = ref(false);\n\nconst props = defineProps({\n  uploadPath: {\n    type: String,\n    required: true\n  },\n  photo: {\n    type: String,\n    default: null\n  },\n  text: {\n    type: [Object, Boolean],\n    default: null\n  }\n});\n\nconst emit = defineEmits(['update:photo', 'error']);\n\n// Text configuration with defaults\nconst textConfig = computed(() => {\n  const defaults = {\n    title: 'Upload Image',\n    subtitle: 'Drag & drop your image here or click button. Supported: JPG, PNG, GIF. Max size: 2MB',\n    buttonText: 'Choose Image'\n  };\n  \n  if (props.text === true) {\n    return defaults;\n  } else if (typeof props.text === 'object' && props.text !== null) {\n    return {\n      title: props.text.title || defaults.title,\n      subtitle: props.text.subtitle || defaults.subtitle,\n      buttonText: props.text.buttonText || defaults.buttonText\n    };\n  }\n  \n  return defaults;\n});\n\nwatch(props, ({photo}) => {\n  if(photo) imageUrl.value = photo;\n});\n\nfunction onComponentClick() {\n  fileInput.value.click();\n}\n\nasync function onFileChange(e) {\n  let file = e.target.files[0];\n  if (!file) {\n    console.error(\"No file selected\");\n    return;\n  }\n  \n  // Create preview from file\n  const reader = new FileReader();\n  reader.onload = (e) => {\n    previewUrl.value = e.target.result;\n  };\n  reader.readAsDataURL(file);\n  \n  let formData = new FormData();\n  formData.append(\"file\", file);\n\n  console.log(\"Sending file:\", file.name); // Логируем имя файла перед отправкой\n  \n  loading.value = true;\n\n  try {\n    const $axios = axios.create({ baseURL: process.env.API_URL, withCredentials: true }); \n\n    let response = await $axios.post(`/api/upload/multiple?folderName=${encodeURIComponent(props.uploadPath)}`, formData);\n    console.log(\"Upload response:\", response); // Логируем ответ сервера\n    imageUrl.value = response.data[0].filepath;\n    previewUrl.value = null; // Clear preview after successful upload\n    emit('update:photo', imageUrl.value);\n  } catch (error) {\n    emit('error', error);\n    console.error(\"Upload error:\", error); // Логируем ошибку\n    previewUrl.value = null; // Clear preview on error\n  } finally {\n    loading.value = false;\n  }\n}\n\n\nfunction onDrop(e) {\n  e.preventDefault();\n  onFileChange({\n    target: {\n      files: e.dataTransfer.files\n    }\n  });\n}\n\nfunction deleteImage() {\n  imageUrl.value = null;\n  previewUrl.value = null;\n  emit('update:photo', null);\n  // Reset file input\n  if (fileInput.value) {\n    fileInput.value.value = '';\n  }\n}\n</script>\n\n<style scoped>\n.image-upload-area {\n  overflow: hidden;\n  transition: all 0.3s ease;\n}\n\n.image-upload-area:hover {\n  opacity: 0.95;\n}\n\n/* Hover controls */\n.hover-controls {\n  top: 0;\n  left: 0;\n  background: rgba(0, 0, 0, 0.7);\n  opacity: 0;\n  transition: opacity 0.3s ease;\n  pointer-events: none;\n}\n\n.image-upload-area:hover .hover-controls {\n  opacity: 1;\n  pointer-events: all;\n}\n\n.hover-upload-icon {\n  animation: pulse 1.5s infinite;\n}\n\n.hover-button {\n  transition: transform 0.2s ease, background-color 0.2s ease;\n}\n\n.hover-button:hover {\n  transform: scale(1.1);\n}\n\n.hover-button:active {\n  transform: scale(0.95);\n}\n\n/* Loading overlay */\n.loading-overlay {\n  top: 0;\n  left: 0;\n  background: rgba(255, 255, 255, 0.9);\n  z-index: 10;\n}\n\n/* Animations */\n@keyframes pulse {\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  50% {\n    transform: scale(1.05);\n    opacity: 0.8;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n\n/* Upload icon in empty state */\n.upload-icon {\n  transition: transform 0.3s ease;\n}\n\n.image-upload-area:hover .upload-icon {\n  transform: scale(1.1);\n}\n</style>\n"],"names":["ref","computed","watch","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsEA,UAAM,WAAWA,IAAAA,IAAI,IAAI;AACzB,UAAM,YAAYA,IAAAA,IAAI,IAAI;AAC1B,UAAM,aAAaA,IAAAA,IAAI,IAAI;AAC3B,UAAM,UAAUA,IAAAA,IAAI,KAAK;AAEzB,UAAM,QAAQ;AAed,UAAM,OAAO;AAGb,UAAM,aAAaC,IAAAA,SAAS,MAAM;AAChC,YAAM,WAAW;AAAA,QACf,OAAO;AAAA,QACP,UAAU;AAAA,QACV,YAAY;AAAA,MAChB;AAEE,UAAI,MAAM,SAAS,MAAM;AACvB,eAAO;AAAA,MACT,WAAW,OAAO,MAAM,SAAS,YAAY,MAAM,SAAS,MAAM;AAChE,eAAO;AAAA,UACL,OAAO,MAAM,KAAK,SAAS,SAAS;AAAA,UACpC,UAAU,MAAM,KAAK,YAAY,SAAS;AAAA,UAC1C,YAAY,MAAM,KAAK,cAAc,SAAS;AAAA,QACpD;AAAA,MACE;AAEA,aAAO;AAAA,IACT,CAAC;AAEDC,QAAAA,MAAM,OAAO,CAAC,EAAC,MAAK,MAAM;AACxB,UAAG,MAAO,UAAS,QAAQ;AAAA,IAC7B,CAAC;AAED,aAAS,mBAAmB;AAC1B,gBAAU,MAAM,MAAK;AAAA,IACvB;AAEA,mBAAe,aAAa,GAAG;AAC7B,UAAI,OAAO,EAAE,OAAO,MAAM,CAAC;AAC3B,UAAI,CAAC,MAAM;AACT,gBAAQ,MAAM,kBAAkB;AAChC;AAAA,MACF;AAGA,YAAM,SAAS,IAAI,WAAU;AAC7B,aAAO,SAAS,CAACC,OAAM;AACrB,mBAAW,QAAQA,GAAE,OAAO;AAAA,MAC9B;AACA,aAAO,cAAc,IAAI;AAEzB,UAAI,WAAW,IAAI,SAAQ;AAC3B,eAAS,OAAO,QAAQ,IAAI;AAE5B,cAAQ,IAAI,iBAAiB,KAAK,IAAI;AAEtC,cAAQ,QAAQ;AAEhB,UAAI;AACF,cAAM,SAAS,MAAM,OAAO,EAAE,SAAS,QAAQ,IAAI,SAAS,iBAAiB,KAAI,CAAE;AAEnF,YAAI,WAAW,MAAM,OAAO,KAAK,mCAAmC,mBAAmB,MAAM,UAAU,CAAC,IAAI,QAAQ;AACpH,gBAAQ,IAAI,oBAAoB,QAAQ;AACxC,iBAAS,QAAQ,SAAS,KAAK,CAAC,EAAE;AAClC,mBAAW,QAAQ;AACnB,aAAK,gBAAgB,SAAS,KAAK;AAAA,MACrC,SAAS,OAAO;AACd,aAAK,SAAS,KAAK;AACnB,gBAAQ,MAAM,iBAAiB,KAAK;AACpC,mBAAW,QAAQ;AAAA,MACrB,UAAC;AACC,gBAAQ,QAAQ;AAAA,MAClB;AAAA,IACF;AAGA,aAAS,OAAO,GAAG;AACjB,QAAE,eAAc;AAChB,mBAAa;AAAA,QACX,QAAQ;AAAA,UACN,OAAO,EAAE,aAAa;AAAA,QAC5B;AAAA,MACA,CAAG;AAAA,IACH;AAEA,aAAS,cAAc;AACrB,eAAS,QAAQ;AACjB,iBAAW,QAAQ;AACnB,WAAK,gBAAgB,IAAI;AAEzB,UAAI,UAAU,OAAO;AACnB,kBAAU,MAAM,QAAQ;AAAA,MAC1B;AAAA,IACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/UploadImage/{UploadImage.vue2.js → UploadImage.vue.js}

@@ -3,7 +3,7 @@ import axios from "axios";
 import Loader from "../Loader/Loader.vue2.js";
 import _sfc_main$1 from "../../modules/icons/navigation/IconUpload.vue.js";
 import _sfc_main$2 from "../../modules/icons/navigation/IconDelete.vue.js";
-/* empty css                */
+/* empty css                 */
 import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
 const _hoisted_1 = ["src"];
 const _hoisted_2 = {
@@ -216,4 +216,4 @@ const UploadImage = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-
 export {
   UploadImage as default
 };
-//# sourceMappingURL=UploadImage.vue2.js.map
+//# sourceMappingURL=UploadImage.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"UploadImage.vue.js","sources":["../../../../../src/components/UploadImage/UploadImage.vue"],"sourcesContent":["<template>\n  <div class=\"upload-image-wrapper flex-v-center flex-nowrap flex gap-small\" :class=\"{'with-text': text}\">\n    <div \n      @click=\"onComponentClick\"\n      @drop=\"onDrop\"\n      @dragover.prevent\n      class=\"pos-relative radius-small br-solid br-1px br-black-transp-10 h-100 aspect-1x1 flex-v-center flex-h-center flex cursor-pointer\"\n    >\n      <img loading=\"lazy\" \n        v-if=\"imageUrl || photo || previewUrl\" \n        :src=\"previewUrl || (FILE_SERVER_URL || '') + (imageUrl || photo)\"\n        alt=\"Uploaded image\" \n        class=\"pos-absolute  radius-small o-hidden z-index-1 w-100 h-100 object-fit-cover\"\n      />\n      \n      <div v-else class=\"flex-v-center pos-relative z-index-2 flex-h-center flex w-100 h-100 radius-small  bg-second\" >\n        <IconUpload class=\"i-medium upload-icon\" fill=\"rgb(var(--white))\" />\n      </div>\n      \n      <!-- Hover controls -->\n      <div class=\"z-index-2 pos-relative  hover-controls pos-absolute w-100 h-100 flex-v-center flex-h-center flex\">\n        <div v-if=\"!imageUrl && !photo && !previewUrl\" class=\"hover-upload-icon\">\n          <IconUpload class=\"i-medium\" fill=\"rgb(var(--white))\" />\n        </div>\n        <div v-else class=\"hover-buttons flex gap-small\">\n          <button @click.stop=\"onComponentClick\" class=\"hover-button radius-small pd-thin bg-main t-white br-none cursor-pointer\">\n            <IconUpload class=\"i-medium\" fill=\"rgb(var(--white))\" />\n          </button>\n          <button @click.stop=\"deleteImage\" class=\"hover-button radius-small pd-thin bg-danger t-white br-none cursor-pointer\">\n            <IconDelete class=\"i-medium\" fill=\"rgb(var(--white))\" />\n          </button>\n        </div>\n      </div>\n      \n      <!-- Loading overlay -->\n      <div v-if=\"loading\" class=\"z-index-2 loading-overlay pos-absolute w-100 h-100 flex-v-center flex-h-center flex\">\n        <Loader :centered=\"false\" />\n      </div>\n      \n      <input type=\"file\" name=\"file\" ref=\"fileInput\" @change=\"onFileChange\" style=\"display: none\"/>\n    </div>\n    \n    <!-- Text block -->\n    <div v-if=\"text\" class=\"upload-text-block  flex flex-column\">\n      <span class=\"mn-b-small t-medium\">{{ textConfig.title }}</span>\n      <span class=\"mn-b-medium t-transp\">{{ textConfig.subtitle }}</span>\n      <div v-if=\"!imageUrl && !photo && !previewUrl\">\n        <button @click=\"onComponentClick\" class=\"button button-small w-max bg-main t-black cursor-pointer\">\n          {{ textConfig.buttonText }}\n        </button>\n      </div>\n      <div v-else class=\"flex gap-thin\">\n        <button @click=\"onComponentClick\" class=\"button button-small w-max bg-second t-white cursor-pointer\">\n          Upload \n        </button>\n        <button @click=\"deleteImage\" class=\"button button-small w-max bg-red t-white cursor-pointer\">\n          Delete\n        </button>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, watch, computed } from 'vue';\nimport axios from 'axios';\nimport Loader from '@martyrs/src/components/Loader/Loader.vue';\nimport IconUpload from '@martyrs/src/modules/icons/navigation/IconUpload.vue';\nimport IconDelete from '@martyrs/src/modules/icons/navigation/IconDelete.vue';\n\nconst imageUrl = ref(null);\nconst fileInput = ref(null);\nconst previewUrl = ref(null);\nconst loading = ref(false);\n\nconst props = defineProps({\n  uploadPath: {\n    type: String,\n    required: true\n  },\n  photo: {\n    type: String,\n    default: null\n  },\n  text: {\n    type: [Object, Boolean],\n    default: null\n  }\n});\n\nconst emit = defineEmits(['update:photo', 'error']);\n\n// Text configuration with defaults\nconst textConfig = computed(() => {\n  const defaults = {\n    title: 'Upload Image',\n    subtitle: 'Drag & drop your image here or click button. Supported: JPG, PNG, GIF. Max size: 2MB',\n    buttonText: 'Choose Image'\n  };\n  \n  if (props.text === true) {\n    return defaults;\n  } else if (typeof props.text === 'object' && props.text !== null) {\n    return {\n      title: props.text.title || defaults.title,\n      subtitle: props.text.subtitle || defaults.subtitle,\n      buttonText: props.text.buttonText || defaults.buttonText\n    };\n  }\n  \n  return defaults;\n});\n\nwatch(props, ({photo}) => {\n  if(photo) imageUrl.value = photo;\n});\n\nfunction onComponentClick() {\n  fileInput.value.click();\n}\n\nasync function onFileChange(e) {\n  let file = e.target.files[0];\n  if (!file) {\n    console.error(\"No file selected\");\n    return;\n  }\n  \n  // Create preview from file\n  const reader = new FileReader();\n  reader.onload = (e) => {\n    previewUrl.value = e.target.result;\n  };\n  reader.readAsDataURL(file);\n  \n  let formData = new FormData();\n  formData.append(\"file\", file);\n\n  console.log(\"Sending file:\", file.name); // Логируем имя файла перед отправкой\n  \n  loading.value = true;\n\n  try {\n    const $axios = axios.create({ baseURL: process.env.API_URL, withCredentials: true }); \n\n    let response = await $axios.post(`/api/upload/multiple?folderName=${encodeURIComponent(props.uploadPath)}`, formData);\n    console.log(\"Upload response:\", response); // Логируем ответ сервера\n    imageUrl.value = response.data[0].filepath;\n    previewUrl.value = null; // Clear preview after successful upload\n    emit('update:photo', imageUrl.value);\n  } catch (error) {\n    emit('error', error);\n    console.error(\"Upload error:\", error); // Логируем ошибку\n    previewUrl.value = null; // Clear preview on error\n  } finally {\n    loading.value = false;\n  }\n}\n\n\nfunction onDrop(e) {\n  e.preventDefault();\n  onFileChange({\n    target: {\n      files: e.dataTransfer.files\n    }\n  });\n}\n\nfunction deleteImage() {\n  imageUrl.value = null;\n  previewUrl.value = null;\n  emit('update:photo', null);\n  // Reset file input\n  if (fileInput.value) {\n    fileInput.value.value = '';\n  }\n}\n</script>\n\n<style scoped>\n.image-upload-area {\n  overflow: hidden;\n  transition: all 0.3s ease;\n}\n\n.image-upload-area:hover {\n  opacity: 0.95;\n}\n\n/* Hover controls */\n.hover-controls {\n  top: 0;\n  left: 0;\n  background: rgba(0, 0, 0, 0.7);\n  opacity: 0;\n  transition: opacity 0.3s ease;\n  pointer-events: none;\n}\n\n.image-upload-area:hover .hover-controls {\n  opacity: 1;\n  pointer-events: all;\n}\n\n.hover-upload-icon {\n  animation: pulse 1.5s infinite;\n}\n\n.hover-button {\n  transition: transform 0.2s ease, background-color 0.2s ease;\n}\n\n.hover-button:hover {\n  transform: scale(1.1);\n}\n\n.hover-button:active {\n  transform: scale(0.95);\n}\n\n/* Loading overlay */\n.loading-overlay {\n  top: 0;\n  left: 0;\n  background: rgba(255, 255, 255, 0.9);\n  z-index: 10;\n}\n\n/* Animations */\n@keyframes pulse {\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  50% {\n    transform: scale(1.05);\n    opacity: 0.8;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n\n/* Upload icon in empty state */\n.upload-icon {\n  transition: transform 0.3s ease;\n}\n\n.image-upload-area:hover .upload-icon {\n  transform: scale(1.1);\n}\n</style>\n"],"names":["e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsEA,UAAM,WAAW,IAAI,IAAI;AACzB,UAAM,YAAY,IAAI,IAAI;AAC1B,UAAM,aAAa,IAAI,IAAI;AAC3B,UAAM,UAAU,IAAI,KAAK;AAEzB,UAAM,QAAQ;AAed,UAAM,OAAO;AAGb,UAAM,aAAa,SAAS,MAAM;AAChC,YAAM,WAAW;AAAA,QACf,OAAO;AAAA,QACP,UAAU;AAAA,QACV,YAAY;AAAA,MAChB;AAEE,UAAI,MAAM,SAAS,MAAM;AACvB,eAAO;AAAA,MACT,WAAW,OAAO,MAAM,SAAS,YAAY,MAAM,SAAS,MAAM;AAChE,eAAO;AAAA,UACL,OAAO,MAAM,KAAK,SAAS,SAAS;AAAA,UACpC,UAAU,MAAM,KAAK,YAAY,SAAS;AAAA,UAC1C,YAAY,MAAM,KAAK,cAAc,SAAS;AAAA,QACpD;AAAA,MACE;AAEA,aAAO;AAAA,IACT,CAAC;AAED,UAAM,OAAO,CAAC,EAAC,MAAK,MAAM;AACxB,UAAG,MAAO,UAAS,QAAQ;AAAA,IAC7B,CAAC;AAED,aAAS,mBAAmB;AAC1B,gBAAU,MAAM,MAAK;AAAA,IACvB;AAEA,mBAAe,aAAa,GAAG;AAC7B,UAAI,OAAO,EAAE,OAAO,MAAM,CAAC;AAC3B,UAAI,CAAC,MAAM;AACT,gBAAQ,MAAM,kBAAkB;AAChC;AAAA,MACF;AAGA,YAAM,SAAS,IAAI,WAAU;AAC7B,aAAO,SAAS,CAACA,OAAM;AACrB,mBAAW,QAAQA,GAAE,OAAO;AAAA,MAC9B;AACA,aAAO,cAAc,IAAI;AAEzB,UAAI,WAAW,IAAI,SAAQ;AAC3B,eAAS,OAAO,QAAQ,IAAI;AAE5B,cAAQ,IAAI,iBAAiB,KAAK,IAAI;AAEtC,cAAQ,QAAQ;AAEhB,UAAI;AACF,cAAM,SAAS,MAAM,OAAO,EAAE,SAAS,QAAQ,IAAI,SAAS,iBAAiB,KAAI,CAAE;AAEnF,YAAI,WAAW,MAAM,OAAO,KAAK,mCAAmC,mBAAmB,MAAM,UAAU,CAAC,IAAI,QAAQ;AACpH,gBAAQ,IAAI,oBAAoB,QAAQ;AACxC,iBAAS,QAAQ,SAAS,KAAK,CAAC,EAAE;AAClC,mBAAW,QAAQ;AACnB,aAAK,gBAAgB,SAAS,KAAK;AAAA,MACrC,SAAS,OAAO;AACd,aAAK,SAAS,KAAK;AACnB,gBAAQ,MAAM,iBAAiB,KAAK;AACpC,mBAAW,QAAQ;AAAA,MACrB,UAAC;AACC,gBAAQ,QAAQ;AAAA,MAClB;AAAA,IACF;AAGA,aAAS,OAAO,GAAG;AACjB,QAAE,eAAc;AAChB,mBAAa;AAAA,QACX,QAAQ;AAAA,UACN,OAAO,EAAE,aAAa;AAAA,QAC5B;AAAA,MACA,CAAG;AAAA,IACH;AAEA,aAAS,cAAc;AACrB,eAAS,QAAQ;AACjB,iBAAW,QAAQ;AACnB,WAAK,gBAAgB,IAAI;AAEzB,UAAI,UAAU,OAAO;AACnB,kBAAU,MAAM,QAAQ;AAAA,MAC1B;AAAA,IACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -3,7 +3,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
 const vue = require("vue");
 const Field = require("../../../../../components/Field/Field.vue2.cjs");
 const Button = require("../../../../../components/Button/Button.vue.cjs");
-const UploadImage = require("../../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../../components/UploadImage/UploadImage.vue.cjs");
 const vueRouter = require("vue-router");
 const users = require("../../store/users.cjs");
 const _hoisted_1 = { class: "for-transition w-100" };

package/dist/martyrs/src/modules/auth/views/components/pages/ProfileEditProfile.vue.js

@@ -1,7 +1,7 @@
 import { createElementBlock, openBlock, createElementVNode, createVNode, toDisplayString, withCtx, createTextVNode } from "vue";
 import Field from "../../../../../components/Field/Field.vue2.js";
 import _sfc_main$1 from "../../../../../components/Button/Button.vue.js";
-import UploadImage from "../../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../../components/UploadImage/UploadImage.vue.js";
 import { useRouter } from "vue-router";
 import { state, actions } from "../../store/users.js";
 const _hoisted_1 = { class: "for-transition w-100" };

package/dist/martyrs/src/modules/constructor/components/elements/Card.vue.cjs

@@ -2,7 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
 const Field = require("../../../../components/Field/Field.vue2.cjs");
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 const _hoisted_1 = { class: "w-100 pd-medium bg-white radius-medium pos-relative" };
 const _hoisted_2 = { class: "flex flex-v-center gap-thin" };
 const _hoisted_3 = {

package/dist/martyrs/src/modules/constructor/components/elements/Card.vue.js

@@ -1,6 +1,6 @@
 import { ref, createElementBlock, openBlock, createElementVNode, createCommentVNode, createBlock, Fragment, createVNode, toDisplayString } from "vue";
 import Field from "../../../../components/Field/Field.vue2.js";
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 const _hoisted_1 = { class: "w-100 pd-medium bg-white radius-medium pos-relative" };
 const _hoisted_2 = { class: "flex flex-v-center gap-thin" };
 const _hoisted_3 = {

package/dist/martyrs/src/modules/events/components/pages/EditEvent.vue.cjs

@@ -15,7 +15,7 @@ const Checkbox = require("../../../../components/Checkbox/Checkbox.vue.cjs");
 ;/* empty css                                                   */
 require("axios");
 ;/* empty css                                         */
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 ;/* empty css                                         */
 ;/* empty css                                                 */
 const Feed = require("../../../../components/Feed/Feed.vue.cjs");

package/dist/martyrs/src/modules/events/components/pages/EditEvent.vue.js

@@ -13,7 +13,7 @@ import _sfc_main$8 from "../../../../components/Checkbox/Checkbox.vue.js";
 /* empty css                                                 */
 import "axios";
 /* empty css                                       */
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 /* empty css                                       */
 /* empty css                                               */
 import _sfc_main$7 from "../../../../components/Feed/Feed.vue.js";

package/dist/martyrs/src/modules/music/components/forms/AlbumForm.vue.cjs

@@ -6,7 +6,7 @@ const Field = require("../../../../components/Field/Field.vue2.cjs");
 const Block = require("../../../../components/Block/Block.vue.cjs");
 const Button = require("../../../../components/Button/Button.vue.cjs");
 const Select = require("../../../../components/Select/Select.vue.cjs");
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 const IconCross = require("../../../icons/navigation/IconCross.vue.cjs");
 const BlockMultiselect = require("../../../globals/views/components/blocks/BlockMultiselect.vue.cjs");
 const albums = require("../../store/albums.cjs");

package/dist/martyrs/src/modules/music/components/forms/AlbumForm.vue.js

@@ -4,7 +4,7 @@ import Field from "../../../../components/Field/Field.vue2.js";
 import _sfc_main$1 from "../../../../components/Block/Block.vue.js";
 import _sfc_main$3 from "../../../../components/Button/Button.vue.js";
 import Select from "../../../../components/Select/Select.vue.js";
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 import _sfc_main$2 from "../../../icons/navigation/IconCross.vue.js";
 import BlockMultiselect from "../../../globals/views/components/blocks/BlockMultiselect.vue.js";
 import { actions as actions$2 } from "../../store/albums.js";

package/dist/martyrs/src/modules/music/components/forms/ArtistForm.vue.cjs

@@ -7,7 +7,7 @@ const Block = require("../../../../components/Block/Block.vue.cjs");
 const Button = require("../../../../components/Button/Button.vue.cjs");
 const Checkbox = require("../../../../components/Checkbox/Checkbox.vue.cjs");
 const Select = require("../../../../components/Select/Select.vue.cjs");
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 ;/* empty css                                         */
 const BlockMultiselect = require("../../../globals/views/components/blocks/BlockMultiselect.vue.cjs");
 const IconCross = require("../../../icons/navigation/IconCross.vue.cjs");

package/dist/martyrs/src/modules/music/components/forms/ArtistForm.vue.js

@@ -5,7 +5,7 @@ import _sfc_main$1 from "../../../../components/Block/Block.vue.js";
 import _sfc_main$4 from "../../../../components/Button/Button.vue.js";
 import _sfc_main$3 from "../../../../components/Checkbox/Checkbox.vue.js";
 import Select from "../../../../components/Select/Select.vue.js";
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 /* empty css                                       */
 import BlockMultiselect from "../../../globals/views/components/blocks/BlockMultiselect.vue.js";
 import _sfc_main$2 from "../../../icons/navigation/IconCross.vue.js";

package/dist/martyrs/src/modules/music/components/forms/PlaylistForm.vue.cjs

@@ -6,7 +6,7 @@ const Field = require("../../../../components/Field/Field.vue2.cjs");
 const Block = require("../../../../components/Block/Block.vue.cjs");
 const Button = require("../../../../components/Button/Button.vue.cjs");
 const Radio = require("../../../../components/Radio/Radio.vue.cjs");
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 const IconCross = require("../../../icons/navigation/IconCross.vue.cjs");
 const BlockMultiselect = require("../../../globals/views/components/blocks/BlockMultiselect.vue.cjs");
 const playlists = require("../../store/playlists.cjs");

package/dist/martyrs/src/modules/music/components/forms/PlaylistForm.vue.js

@@ -4,7 +4,7 @@ import Field from "../../../../components/Field/Field.vue2.js";
 import _sfc_main$1 from "../../../../components/Block/Block.vue.js";
 import _sfc_main$4 from "../../../../components/Button/Button.vue.js";
 import _sfc_main$3 from "../../../../components/Radio/Radio.vue.js";
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 import _sfc_main$2 from "../../../icons/navigation/IconCross.vue.js";
 import BlockMultiselect from "../../../globals/views/components/blocks/BlockMultiselect.vue.js";
 import { actions as actions$1 } from "../../store/playlists.js";

package/dist/martyrs/src/modules/music/components/forms/TrackForm.vue.cjs

@@ -7,7 +7,7 @@ const Block = require("../../../../components/Block/Block.vue.cjs");
 const Button = require("../../../../components/Button/Button.vue.cjs");
 const Checkbox = require("../../../../components/Checkbox/Checkbox.vue.cjs");
 const Select = require("../../../../components/Select/Select.vue.cjs");
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 const Upload = require("../../../../components/Upload/Upload.vue2.cjs");
 const IconCross = require("../../../icons/navigation/IconCross.vue.cjs");
 const BlockMultiselect = require("../../../globals/views/components/blocks/BlockMultiselect.vue.cjs");

package/dist/martyrs/src/modules/music/components/forms/TrackForm.vue.js

@@ -5,7 +5,7 @@ import _sfc_main$1 from "../../../../components/Block/Block.vue.js";
 import _sfc_main$4 from "../../../../components/Button/Button.vue.js";
 import _sfc_main$3 from "../../../../components/Checkbox/Checkbox.vue.js";
 import Select from "../../../../components/Select/Select.vue.js";
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 import Upload from "../../../../components/Upload/Upload.vue2.js";
 import _sfc_main$2 from "../../../icons/navigation/IconCross.vue.js";
 import BlockMultiselect from "../../../globals/views/components/blocks/BlockMultiselect.vue.js";

package/dist/martyrs/src/modules/organizations/components/blocks/CardDepartment.vue.cjs

@@ -24,13 +24,13 @@ require("../../../../components/Menu/MenuItem.vue.cjs");
 ;/* empty css                                          */
 ;/* empty css                                          */
 ;/* empty css                                                          */
-;/* empty css                                              */
+;/* empty css                                               */
 ;/* empty css                                                     */
 ;/* empty css                                               */
 ;/* empty css                                                */
 ;/* empty css                                                   */
 require("axios");
-;/* empty css                                                   */
+;/* empty css                                                    */
 ;/* empty css                      */
 ;/* empty css                     */
 ;/* empty css                           */

package/dist/martyrs/src/modules/organizations/components/blocks/CardDepartment.vue.js

@@ -22,13 +22,13 @@ import "../../../../components/Menu/MenuItem.vue.js";
 /* empty css                                        */
 /* empty css                                        */
 /* empty css                                                        */
-/* empty css                                            */
+/* empty css                                             */
 /* empty css                                                   */
 /* empty css                                             */
 /* empty css                                              */
 /* empty css                                                 */
 import "axios";
-/* empty css                                                 */
+/* empty css                                                  */
 /* empty css                    */
 /* empty css                   */
 /* empty css                         */

package/dist/martyrs/src/modules/organizations/components/forms/DepartmentForm.vue.cjs

@@ -2,7 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
 const vueRouter = require("vue-router");
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 const Field = require("../../../../components/Field/Field.vue2.cjs");
 const Checkbox = require("../../../../components/Checkbox/Checkbox.vue.cjs");
 const Button = require("../../../../components/Button/Button.vue.cjs");

package/dist/martyrs/src/modules/organizations/components/forms/DepartmentForm.vue.js

@@ -1,6 +1,6 @@
 import { computed, ref, reactive, createElementBlock, openBlock, createVNode, createElementVNode, withCtx, Fragment, renderList, createBlock, createTextVNode, toDisplayString, createCommentVNode, unref, normalizeClass } from "vue";
 import { useRoute } from "vue-router";
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 import Field from "../../../../components/Field/Field.vue2.js";
 import _sfc_main$4 from "../../../../components/Checkbox/Checkbox.vue.js";
 import _sfc_main$6 from "../../../../components/Button/Button.vue.js";

package/dist/martyrs/src/modules/organizations/components/pages/Department.vue.cjs

@@ -25,13 +25,13 @@ const IconEdit = require("../../../icons/navigation/IconEdit.vue.cjs");
 ;/* empty css                                          */
 ;/* empty css                                          */
 ;/* empty css                                                          */
-;/* empty css                                              */
+;/* empty css                                               */
 ;/* empty css                                                     */
 ;/* empty css                                               */
 ;/* empty css                                                */
 ;/* empty css                                                   */
 require("axios");
-;/* empty css                                                   */
+;/* empty css                                                    */
 ;/* empty css                              */
 const DepartmentSub = require("../blocks/DepartmentSub.vue.cjs");
 ;/* empty css                           */

package/dist/martyrs/src/modules/organizations/components/pages/Department.vue.js

@@ -23,13 +23,13 @@ import _sfc_main$1 from "../../../icons/navigation/IconEdit.vue.js";
 /* empty css                                        */
 /* empty css                                        */
 /* empty css                                                        */
-/* empty css                                            */
+/* empty css                                             */
 /* empty css                                                   */
 /* empty css                                             */
 /* empty css                                              */
 /* empty css                                                 */
 import "axios";
-/* empty css                                                 */
+/* empty css                                                  */
 /* empty css                            */
 import DepartmentSub from "../blocks/DepartmentSub.vue.js";
 /* empty css                         */

package/dist/martyrs/src/modules/organizations/components/pages/Members.vue.cjs

@@ -27,7 +27,7 @@ require("../../../../components/Menu/MenuItem.vue.cjs");
 ;/* empty css                                             */
 ;/* empty css                                          */
 ;/* empty css                                                       */
-;/* empty css                                              */
+;/* empty css                                               */
 ;/* empty css                                                     */
 const auth = require("../../../auth/views/store/auth.cjs");
 ;/* empty css                                               */
@@ -35,7 +35,7 @@ const auth = require("../../../auth/views/store/auth.cjs");
 ;/* empty css                                                   */
 require("axios");
 const IconDelete = require("../../../icons/navigation/IconDelete.vue.cjs");
-;/* empty css                                                   */
+;/* empty css                                                    */
 ;/* empty css                                             */
 const DepartmentForm = require("../forms/DepartmentForm.vue.cjs");
 const InviteForm = require("../forms/InviteForm.vue.cjs");

package/dist/martyrs/src/modules/organizations/components/pages/Members.vue.js

@@ -25,7 +25,7 @@ import "../../../../components/Menu/MenuItem.vue.js";
 /* empty css                                           */
 /* empty css                                        */
 /* empty css                                                     */
-/* empty css                                            */
+/* empty css                                             */
 /* empty css                                                   */
 import { state } from "../../../auth/views/store/auth.js";
 /* empty css                                             */
@@ -33,7 +33,7 @@ import { state } from "../../../auth/views/store/auth.js";
 /* empty css                                                 */
 import "axios";
 import _sfc_main$4 from "../../../icons/navigation/IconDelete.vue.js";
-/* empty css                                                 */
+/* empty css                                                  */
 /* empty css                                           */
 import _sfc_main$8 from "../forms/DepartmentForm.vue.js";
 import _sfc_main$6 from "../forms/InviteForm.vue.js";

package/dist/martyrs/src/modules/organizations/components/pages/Organization.vue.cjs

@@ -32,7 +32,7 @@ const globals = require("../../../globals/views/store/globals.cjs");
 ;/* empty css                                          */
 ;/* empty css                                                   */
 require("axios");
-;/* empty css                                                   */
+;/* empty css                                                    */
 ;/* empty css                                          */
 const ButtonToggleMembership = require("../elements/ButtonToggleMembership.vue.cjs");
 ;/* empty css                              */

package/dist/martyrs/src/modules/organizations/components/pages/Organization.vue.js

@@ -30,7 +30,7 @@ import { state as state$2 } from "../../../globals/views/store/globals.js";
 /* empty css                                        */
 /* empty css                                                 */
 import "axios";
-/* empty css                                                 */
+/* empty css                                                  */
 /* empty css                                        */
 import _sfc_main$4 from "../elements/ButtonToggleMembership.vue.js";
 /* empty css                            */

package/dist/martyrs/src/modules/organizations/components/pages/OrganizationEdit.vue.cjs

@@ -9,7 +9,7 @@ const BlockTags = require("../../../../components/FieldTags/BlockTags.vue.cjs");
 const Field = require("../../../../components/Field/Field.vue2.cjs");
 ;/* empty css                                          */
 const SelectMulti = require("../../../../components/SelectMulti/SelectMulti.vue2.cjs");
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 const Button = require("../../../../components/Button/Button.vue.cjs");
 ;/* empty css                                        */
 const auth = require("../../../auth/views/store/auth.cjs");

package/dist/martyrs/src/modules/organizations/components/pages/OrganizationEdit.vue.js

@@ -7,7 +7,7 @@ import _sfc_main$2 from "../../../../components/FieldTags/BlockTags.vue.js";
 import Field from "../../../../components/Field/Field.vue2.js";
 /* empty css                                        */
 import _sfc_main$1 from "../../../../components/SelectMulti/SelectMulti.vue2.js";
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 import _sfc_main$3 from "../../../../components/Button/Button.vue.js";
 /* empty css                                      */
 import { state as state$1 } from "../../../auth/views/store/auth.js";

package/dist/martyrs/src/modules/products/components/blocks/CardProduct.vue.cjs

@@ -4,7 +4,7 @@ const vue = require("vue");
 const vueI18n = require("vue-i18n");
 const IconEdit = require("../../../icons/navigation/IconEdit.vue.cjs");
 const IconShopcartAdd = require("../../../icons/actions/IconShopcartAdd.vue.cjs");
-const THC = require("../elements/THC.vue2.cjs");
+const THC = require("../elements/THC.vue.cjs");
 const Price = require("../elements/Price.vue.cjs");
 const PlaceholderImage = require("../../../icons/placeholders/PlaceholderImage.vue.cjs");
 ;/* empty css                   */

package/dist/martyrs/src/modules/products/components/blocks/CardProduct.vue.js

@@ -2,7 +2,7 @@ import { resolveComponent, createElementBlock, openBlock, createBlock, createCom
 import { useI18n } from "vue-i18n";
 import _sfc_main$1 from "../../../icons/navigation/IconEdit.vue.js";
 import _sfc_main$4 from "../../../icons/actions/IconShopcartAdd.vue.js";
-import _sfc_main$2 from "../elements/THC.vue2.js";
+import _sfc_main$2 from "../elements/THC.vue.js";
 import _sfc_main$3 from "../elements/Price.vue.js";
 import PlaceholderImage from "../../../icons/placeholders/PlaceholderImage.vue.js";
 /* empty css                 */

package/dist/martyrs/src/modules/products/components/elements/{THC.vue2.cjs → THC.vue.cjs}

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
-;/* empty css          */
+;/* empty css           */
 const _hoisted_1 = {
   key: 0,
   class: "thc"
@@ -86,4 +86,4 @@ const _sfc_main = {
   }
 };
 exports.default = _sfc_main;
-//# sourceMappingURL=THC.vue2.cjs.map
+//# sourceMappingURL=THC.vue.cjs.map

package/dist/martyrs/src/modules/products/components/elements/THC.vue.cjs.map

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

package/dist/martyrs/src/modules/products/components/elements/{THC.vue2.js → THC.vue.js}

@@ -1,5 +1,5 @@
 import { createElementBlock, createCommentVNode, openBlock, createElementVNode, toDisplayString } from "vue";
-/* empty css        */
+/* empty css         */
 const _hoisted_1 = {
   key: 0,
   class: "thc"
@@ -86,4 +86,4 @@ const _sfc_main = {
 export {
   _sfc_main as default
 };
-//# sourceMappingURL=THC.vue2.js.map
+//# sourceMappingURL=THC.vue.js.map

package/dist/martyrs/src/modules/products/components/elements/THC.vue.js.map

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

package/dist/martyrs/src/modules/products/components/pages/CategoryEdit.vue.cjs

@@ -5,7 +5,7 @@ const vueRouter = require("vue-router");
 const IconDelete = require("../../../icons/navigation/IconDelete.vue.cjs");
 const Button = require("../../../../components/Button/Button.vue.cjs");
 const Select = require("../../../../components/Select/Select.vue.cjs");
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 const Field = require("../../../../components/Field/Field.vue2.cjs");
 const FieldTags = require("../../../../components/FieldTags/FieldTags.vue2.cjs");
 ;/* empty css                                         */

package/dist/martyrs/src/modules/products/components/pages/CategoryEdit.vue.js

@@ -3,7 +3,7 @@ import { useRoute, useRouter } from "vue-router";
 import _sfc_main$4 from "../../../icons/navigation/IconDelete.vue.js";
 import _sfc_main$3 from "../../../../components/Button/Button.vue.js";
 import Select from "../../../../components/Select/Select.vue.js";
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 import Field from "../../../../components/Field/Field.vue2.js";
 import FieldTags from "../../../../components/FieldTags/FieldTags.vue2.js";
 /* empty css                                       */

package/dist/martyrs/src/modules/products/components/sections/SectionProduct.vue.cjs

@@ -7,7 +7,7 @@ const IconEdit = require("../../../icons/navigation/IconEdit.vue.cjs");
 const PlaceholderImage = require("../../../icons/placeholders/PlaceholderImage.vue.cjs");
 const Image360 = require("../elements/Image360.vue.cjs");
 const ProductImages = require("../blocks/ProductImages.vue.cjs");
-;/* empty css                    */
+;/* empty css                     */
 const Price = require("../elements/Price.vue.cjs");
 const vueRouter = require("vue-router");
 const vueI18n = require("vue-i18n");

package/dist/martyrs/src/modules/products/components/sections/SectionProduct.vue.js

@@ -5,7 +5,7 @@ import _sfc_main$1 from "../../../icons/navigation/IconEdit.vue.js";
 import PlaceholderImage from "../../../icons/placeholders/PlaceholderImage.vue.js";
 import Image360 from "../elements/Image360.vue.js";
 import ProductImages from "../blocks/ProductImages.vue.js";
-/* empty css                  */
+/* empty css                   */
 import _sfc_main$2 from "../elements/Price.vue.js";
 import { useRoute, useRouter } from "vue-router";
 import { useI18n } from "vue-i18n";

package/dist/martyrs/src/modules/spots/components/pages/SpotEdit.vue.cjs

@@ -3,7 +3,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
 const vue = require("vue");
 const vueRouter = require("vue-router");
 const Block = require("../../../../components/Block/Block.vue.cjs");
-const UploadImage = require("../../../../components/UploadImage/UploadImage.vue2.cjs");
+const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
 ;/* empty css                                   */
 const Field = require("../../../../components/Field/Field.vue2.cjs");
 const Select = require("../../../../components/Select/Select.vue.cjs");

package/dist/martyrs/src/modules/spots/components/pages/SpotEdit.vue.js

@@ -1,7 +1,7 @@
 import { ref, onMounted, createElementBlock, openBlock, createVNode, createElementVNode, withCtx, toDisplayString, unref, createTextVNode, Fragment, renderList } from "vue";
 import { useRouter, useRoute } from "vue-router";
 import _sfc_main$1 from "../../../../components/Block/Block.vue.js";
-import UploadImage from "../../../../components/UploadImage/UploadImage.vue2.js";
+import UploadImage from "../../../../components/UploadImage/UploadImage.vue.js";
 /* empty css                                 */
 import Field from "../../../../components/Field/Field.vue2.js";
 import Select from "../../../../components/Select/Select.vue.js";

package/dist/martyrs/src/modules/wallet/views/components/pages/Wallet.vue.cjs

@@ -1,8 +1,29 @@
 "use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
 const vueI18n = require("vue-i18n");
-const Web3 = require("web3");
 const wallet_store = require("../../store/wallet.store.cjs");
 const wallet = require("../../localization/wallet.json.cjs");
 const Popup = require("../../../../../components/Popup/Popup.vue.cjs");
@@ -76,12 +97,13 @@ const _sfc_main = {
       useScope: "global",
       ...wallet.default
     });
-    vue.onMounted(() => {
+    vue.onMounted(async () => {
       window.ethereum.on("accountsChanged", (accounts) => {
         if (accounts.length < 1) {
           wallet_store.state.account = null;
         }
       });
+      const { default: Web3 } = await import("web3");
       wallet_store.state.web3 = new Web3(window.ethereum || "http://localhost:8080");
       wallet_store.actions.listRewards();
       wallet_store.actions.tryReconnectWallet();

package/dist/martyrs/src/modules/wallet/views/components/pages/Wallet.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Wallet.vue.cjs","sources":["../../../../../../../../src/modules/wallet/views/components/pages/Wallet.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin\">\n    <section class=\"bg-black t-white mn-b-thin radius-big pd-big\">\n      <h1 class=\"mn-b-medium\">{{ t('wallet.title') }}</h1>\n\n      <p class=\"mn-b-semi t-transp p-medium\">\n        {{ t('wallet.subtitle') }}\n      </p>\n\n      <div \n        v-if=\"state.account\"\n        class=\"gap-thin mn-b-thin flex-nowrap bg-black radius-extra t-white br-solid br-white-transp-10 br-1px flex-v-center flex pd-medium\"\n      >\n        <div class=\"flex-v-center flex-nowrap flex mn-r-auto\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt.svg\" class=\"mn-r-thin i-big\"> -->\n          <h2>{{state.tokenBalance}} {{ t('wallet.token') }}</h2>\n        </div>\n\n        <button @click=\"openGetMorePopup\" class=\"t-nowrap w-max bg-main t-medium button\">Get More</button>\n\n\n        <Button \n          :submit=\"actions.collectRewards\" \n          class=\"w-max bg-white t-black t-medium button\"\n        >\n          Withdraw\n        </Button>\n      </div>\n\n      <ConnectMetamask class=\"mn-b-thin radius-extra br-solid br-white-transp-10 br-1px w-100\" />\n\n      <div\n        v-if=\"state.account\"\n        class=\"w-100 mn-b-semi flex-column flex pd-big radius-big bg-main t-black\"\n      >\n        <p class=\"t-transp t-medium mn-b-thin\">You own:</p>\n        <p class=\"h1 mn-b-small\">{{state.share}}%</p>\n        <p class=\"t-white p-medium t-medium mn-b-semi\">of all shares</p>\n\n          <div\n            class=\"flex-v-center mn-b-small flex-nowrap flex pd-small bg-black-transp-5 radius-extra\"\n          >\n              <!-- <img loading=\"lazy\" src=\"@/assets/icons/metamask.svg\" class=\"mn-r-small i-big\" > -->\n            \n            <p v-if=\"state.account\" class=\"t-transp t-medium \">\n               <span class=\"uppercase p-small t-medium t-transp\">Connected Metamask</span><br>\n               <span>{{state.account}}</span>\n            </p>\n\n            <button\n              v-if=\"state.account\"\n              @click=\"actions.disconnectWallet\"\n              class=\"mn-l-auto bg-red button\"\n            >\n              Disconnect Wallet\n            </button>\n          </div>\n      </div>\n\n    </section>\n\n    <div v-if=\"!state.account\" class=\"mn-b-semi cols-2 gap-thin\">\n      <div\n        class=\"w-100 pd-medium radius-medium t-center bg-light\"\n      >\n        <h3 class=\"mn-b-small\">Make first order and start earning Weeder Token</h3>\n        <button class=\"mn-l-auto mn-r-auto bg-main button\">Explore marketplace</button>\n      </div>\n\n      <div\n        class=\"w-100 pd-medium flex-center flex flex-column radius-medium t-center bg-light\"\n      >\n        <h3 \n          v-if=\"!state.account\"\n          class=\"mn-b-small\"\n        >\n          Connect Metamask to withdrawal your earnings.\n        </h3>\n\n        <button\n          v-if=\"!state.account\"\n          @click=\"actions.connectWallet\"\n          class=\"br-solid br-2px br-black-transp-10 t-black button\"\n        >\n          Connect Wallet\n        </button>\n      </div>\n    </div>\n\n    <h2 class=\"mn-b-small\" v-if=\"state.rewards.length > 0\">Latest Rewards </h2>\n\n    <section class=\"cols-3 mobile:cols-1 gap-thin\">\n      <div \n        class=\"radius-medium bg-light\"\n        v-for=\"income in state.rewards\"\n      > \n        <div class=\"flex-nowrap br-b br-black-transp-10 br-solid flex pd-medium\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt-plus.svg\" class=\"mn-r-thin i-medium\"> -->\n          <p class=\"t-semi mn-r-auto\">{{income.amount}} WDT</p>\n          \n          <span class=\"pd-t-nano pd-b-nano pd-l-thin pd-r-thin bg-main flex flex-center radius-extra t-semi p-small\">{{income.type === 'blogpost' ? 'Community Reward' : income.type}}</span>\n        </div>\n\n        <div class=\"pd-medium\">\n          <h4 class=\"t-regular mn-b-thin\">{{income.name}}</h4>\n          <!-- <p class=\"p-small\">{{income.content[0].content}}</p> -->\n        </div>\n\n      </div>\n\n\n    </section>\n\n    <h2 class=\"mn-b-small\" v-if=\"state.rewards.length > 0\">Activity</h2>\n\n    <section class=\"cols-3 mobile:cols-1 gap-thin\">\n      <div \n        class=\"radius-medium bg-grey\"\n        v-for=\"income in state.rewards\"\n      > \n        <div class=\"flex-nowrap br-b br-black-transp-10 br-solid flex pd-medium\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt-plus.svg\" class=\"mn-r-thin i-medium\"> -->\n          <p class=\"t-semi mn-r-auto\">{{income.amount}} WDT</p>\n          \n          <span class=\"pd-t-nano pd-b-nano pd-l-thin pd-r-thin bg-main flex flex-center radius-extra t-semi p-small\">{{income.type === 'blogpost' ? 'Community Reward' : income.type}}</span>\n        </div>\n\n        <div class=\"pd-medium\">\n          <h4 class=\"t-regular mn-b-thin\">{{income.name}}</h4>\n          <!-- <p class=\"p-small\">{{income.content[0].content}}</p> -->\n        </div>\n      </div>\n    </section>\n\n    <Popup \n      @close-popup=\"closeGetMorePopup\" \n      :isPopupOpen=\"isGetMorePopup\"\n      class=\"w-m-50r t-left pd-big bg-white radius-big\"\n    >\n      <div\n        v-if=\"currentMenuPopup === 0\"\n      >\n        <h2 class=\"mn-b-small t-center t-bold\">Choose the way of deposit</h2>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(1)\"\n        >\n          CASH\n        </button>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(2)\"\n        >\n          CARD\n        </button>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(4)\"\n        >\n          CRYPTO\n        </button>\n      </div>\n\n      <CashDepositMenu\n        v-if=\"currentMenuPopup === 1\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n      />\n\n      <CardDepositMenu\n        v-if=\"currentMenuPopup === 2\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n\n      <CardBalanceReplenished\n        v-if=\"currentMenuPopup === 3\"\n        @close=\"closeGetMorePopup\"\n      />\n\n      <CryptoDepositMenu\n        v-if=\"currentMenuPopup === 4\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n\n      <CryptoDepositProcessing\n        v-if=\"currentMenuPopup === 5\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n    </Popup>\n  </div>\n</template>\n\n<script setup>\n  import { onMounted, ref } from 'vue';\n  import { useI18n } from 'vue-i18n'\n  import Web3 from \"web3\";\n\n  import { state, actions } from '@martyrs/src/modules/wallet/views/store/wallet.store';\n\n  import text from '@martyrs/src/modules/wallet/views/localization/wallet.json'\n \n  const { t } = useI18n({\n    useScope: 'global', \n    ...text\n  })\n\n  import Popup from '@martyrs/src/components/Popup/Popup.vue';\n  import Button from '@martyrs/src/components/Button/Button.vue'; \n\n  import CardBlogpost from '@martyrs/src/modules/community/components/blocks/CardBlogpost.vue';\n\n  import ConnectMetamask from '@martyrs/src/modules/wallet/views/components/elements/ConnectMetamask.vue';\n\n  import CashDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CashDeposit.vue';\n  import CardDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CardDeposit.vue';\n  import CryptoDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CryptoDeposit.vue';\n  import CardBalanceReplenished from '@martyrs/src/modules/wallet/views/components/blocks/CardBalanceReplenished.vue';\n  import CryptoDepositProcessing from '@martyrs/src/modules/wallet/views/components/blocks/CryptoDepositProcessing.vue';\n\n\n\n  onMounted(() => {\n      // User has disconnected metamask from extension\n    window.ethereum.on('accountsChanged', (accounts) => {\n      if (accounts.length < 1) {\n        state.account = null;\n      }\n    });\n\n\n    state.web3 = new Web3(window.ethereum || 'http://localhost:8080');\n\n    actions.listRewards();\n    actions.tryReconnectWallet();\n  });\n\n  // /////////////////////////////////////////\n  // GetMore Popup\n  // /////////////////////////////////////////\n  const isGetMorePopup = ref(false)\n  const currentMenuPopup = ref(0)\n\n  function switchGetMoreMenu(value) {\n    currentMenuPopup.value = value;\n  }\n\n  function openGetMorePopup() {\n    isGetMorePopup.value = true;\n  }\n  function closeGetMorePopup() {\n    isGetMorePopup.value = false;\n    currentMenuPopup.value = 0;\n    actions.stopTimer();\n    actions.disconnectWebSocket();\n  }\n</script>"],"names":["useI18n","text","onMounted","state","actions","ref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8ME,UAAM,EAAE,EAAC,IAAKA,gBAAQ;AAAA,MACpB,UAAU;AAAA,MACV,GAAGC,OAAAA;AAAAA,IACP,CAAG;AAiBDC,QAAAA,UAAU,MAAM;AAEd,aAAO,SAAS,GAAG,mBAAmB,CAAC,aAAa;AAClD,YAAI,SAAS,SAAS,GAAG;AACvBC,uBAAAA,MAAM,UAAU;AAAA,QAClB;AAAA,MACF,CAAC;AAGDA,mBAAAA,MAAM,OAAO,IAAI,KAAK,OAAO,YAAY,uBAAuB;AAEhEC,mBAAAA,QAAQ,YAAW;AACnBA,mBAAAA,QAAQ,mBAAkB;AAAA,IAC5B,CAAC;AAKD,UAAM,iBAAiBC,IAAAA,IAAI,KAAK;AAChC,UAAM,mBAAmBA,IAAAA,IAAI,CAAC;AAE9B,aAAS,kBAAkB,OAAO;AAChC,uBAAiB,QAAQ;AAAA,IAC3B;AAEA,aAAS,mBAAmB;AAC1B,qBAAe,QAAQ;AAAA,IACzB;AACA,aAAS,oBAAoB;AAC3B,qBAAe,QAAQ;AACvB,uBAAiB,QAAQ;AACzBD,mBAAAA,QAAQ,UAAS;AACjBA,mBAAAA,QAAQ,oBAAmB;AAAA,IAC7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Wallet.vue.cjs","sources":["../../../../../../../../src/modules/wallet/views/components/pages/Wallet.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin\">\n    <section class=\"bg-black t-white mn-b-thin radius-big pd-big\">\n      <h1 class=\"mn-b-medium\">{{ t('wallet.title') }}</h1>\n\n      <p class=\"mn-b-semi t-transp p-medium\">\n        {{ t('wallet.subtitle') }}\n      </p>\n\n      <div \n        v-if=\"state.account\"\n        class=\"gap-thin mn-b-thin flex-nowrap bg-black radius-extra t-white br-solid br-white-transp-10 br-1px flex-v-center flex pd-medium\"\n      >\n        <div class=\"flex-v-center flex-nowrap flex mn-r-auto\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt.svg\" class=\"mn-r-thin i-big\"> -->\n          <h2>{{state.tokenBalance}} {{ t('wallet.token') }}</h2>\n        </div>\n\n        <button @click=\"openGetMorePopup\" class=\"t-nowrap w-max bg-main t-medium button\">Get More</button>\n\n\n        <Button \n          :submit=\"actions.collectRewards\" \n          class=\"w-max bg-white t-black t-medium button\"\n        >\n          Withdraw\n        </Button>\n      </div>\n\n      <ConnectMetamask class=\"mn-b-thin radius-extra br-solid br-white-transp-10 br-1px w-100\" />\n\n      <div\n        v-if=\"state.account\"\n        class=\"w-100 mn-b-semi flex-column flex pd-big radius-big bg-main t-black\"\n      >\n        <p class=\"t-transp t-medium mn-b-thin\">You own:</p>\n        <p class=\"h1 mn-b-small\">{{state.share}}%</p>\n        <p class=\"t-white p-medium t-medium mn-b-semi\">of all shares</p>\n\n          <div\n            class=\"flex-v-center mn-b-small flex-nowrap flex pd-small bg-black-transp-5 radius-extra\"\n          >\n              <!-- <img loading=\"lazy\" src=\"@/assets/icons/metamask.svg\" class=\"mn-r-small i-big\" > -->\n            \n            <p v-if=\"state.account\" class=\"t-transp t-medium \">\n               <span class=\"uppercase p-small t-medium t-transp\">Connected Metamask</span><br>\n               <span>{{state.account}}</span>\n            </p>\n\n            <button\n              v-if=\"state.account\"\n              @click=\"actions.disconnectWallet\"\n              class=\"mn-l-auto bg-red button\"\n            >\n              Disconnect Wallet\n            </button>\n          </div>\n      </div>\n\n    </section>\n\n    <div v-if=\"!state.account\" class=\"mn-b-semi cols-2 gap-thin\">\n      <div\n        class=\"w-100 pd-medium radius-medium t-center bg-light\"\n      >\n        <h3 class=\"mn-b-small\">Make first order and start earning Weeder Token</h3>\n        <button class=\"mn-l-auto mn-r-auto bg-main button\">Explore marketplace</button>\n      </div>\n\n      <div\n        class=\"w-100 pd-medium flex-center flex flex-column radius-medium t-center bg-light\"\n      >\n        <h3 \n          v-if=\"!state.account\"\n          class=\"mn-b-small\"\n        >\n          Connect Metamask to withdrawal your earnings.\n        </h3>\n\n        <button\n          v-if=\"!state.account\"\n          @click=\"actions.connectWallet\"\n          class=\"br-solid br-2px br-black-transp-10 t-black button\"\n        >\n          Connect Wallet\n        </button>\n      </div>\n    </div>\n\n    <h2 class=\"mn-b-small\" v-if=\"state.rewards.length > 0\">Latest Rewards </h2>\n\n    <section class=\"cols-3 mobile:cols-1 gap-thin\">\n      <div \n        class=\"radius-medium bg-light\"\n        v-for=\"income in state.rewards\"\n      > \n        <div class=\"flex-nowrap br-b br-black-transp-10 br-solid flex pd-medium\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt-plus.svg\" class=\"mn-r-thin i-medium\"> -->\n          <p class=\"t-semi mn-r-auto\">{{income.amount}} WDT</p>\n          \n          <span class=\"pd-t-nano pd-b-nano pd-l-thin pd-r-thin bg-main flex flex-center radius-extra t-semi p-small\">{{income.type === 'blogpost' ? 'Community Reward' : income.type}}</span>\n        </div>\n\n        <div class=\"pd-medium\">\n          <h4 class=\"t-regular mn-b-thin\">{{income.name}}</h4>\n          <!-- <p class=\"p-small\">{{income.content[0].content}}</p> -->\n        </div>\n\n      </div>\n\n\n    </section>\n\n    <h2 class=\"mn-b-small\" v-if=\"state.rewards.length > 0\">Activity</h2>\n\n    <section class=\"cols-3 mobile:cols-1 gap-thin\">\n      <div \n        class=\"radius-medium bg-grey\"\n        v-for=\"income in state.rewards\"\n      > \n        <div class=\"flex-nowrap br-b br-black-transp-10 br-solid flex pd-medium\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt-plus.svg\" class=\"mn-r-thin i-medium\"> -->\n          <p class=\"t-semi mn-r-auto\">{{income.amount}} WDT</p>\n          \n          <span class=\"pd-t-nano pd-b-nano pd-l-thin pd-r-thin bg-main flex flex-center radius-extra t-semi p-small\">{{income.type === 'blogpost' ? 'Community Reward' : income.type}}</span>\n        </div>\n\n        <div class=\"pd-medium\">\n          <h4 class=\"t-regular mn-b-thin\">{{income.name}}</h4>\n          <!-- <p class=\"p-small\">{{income.content[0].content}}</p> -->\n        </div>\n      </div>\n    </section>\n\n    <Popup \n      @close-popup=\"closeGetMorePopup\" \n      :isPopupOpen=\"isGetMorePopup\"\n      class=\"w-m-50r t-left pd-big bg-white radius-big\"\n    >\n      <div\n        v-if=\"currentMenuPopup === 0\"\n      >\n        <h2 class=\"mn-b-small t-center t-bold\">Choose the way of deposit</h2>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(1)\"\n        >\n          CASH\n        </button>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(2)\"\n        >\n          CARD\n        </button>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(4)\"\n        >\n          CRYPTO\n        </button>\n      </div>\n\n      <CashDepositMenu\n        v-if=\"currentMenuPopup === 1\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n      />\n\n      <CardDepositMenu\n        v-if=\"currentMenuPopup === 2\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n\n      <CardBalanceReplenished\n        v-if=\"currentMenuPopup === 3\"\n        @close=\"closeGetMorePopup\"\n      />\n\n      <CryptoDepositMenu\n        v-if=\"currentMenuPopup === 4\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n\n      <CryptoDepositProcessing\n        v-if=\"currentMenuPopup === 5\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n    </Popup>\n  </div>\n</template>\n\n<script setup>\n  import { onMounted, ref } from 'vue';\n  import { useI18n } from 'vue-i18n'\n\n  import { state, actions } from '@martyrs/src/modules/wallet/views/store/wallet.store';\n\n  import text from '@martyrs/src/modules/wallet/views/localization/wallet.json'\n\n  const { t } = useI18n({\n    useScope: 'global',\n    ...text\n  })\n\n  import Popup from '@martyrs/src/components/Popup/Popup.vue';\n  import Button from '@martyrs/src/components/Button/Button.vue';\n\n  import CardBlogpost from '@martyrs/src/modules/community/components/blocks/CardBlogpost.vue';\n\n  import ConnectMetamask from '@martyrs/src/modules/wallet/views/components/elements/ConnectMetamask.vue';\n\n  import CashDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CashDeposit.vue';\n  import CardDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CardDeposit.vue';\n  import CryptoDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CryptoDeposit.vue';\n  import CardBalanceReplenished from '@martyrs/src/modules/wallet/views/components/blocks/CardBalanceReplenished.vue';\n  import CryptoDepositProcessing from '@martyrs/src/modules/wallet/views/components/blocks/CryptoDepositProcessing.vue';\n\n\n\n  onMounted(async () => {\n      // User has disconnected metamask from extension\n    window.ethereum.on('accountsChanged', (accounts) => {\n      if (accounts.length < 1) {\n        state.account = null;\n      }\n    });\n\n    // Динамический импорт Web3 только когда компонент монтируется\n    const { default: Web3 } = await import('web3');\n    state.web3 = new Web3(window.ethereum || 'http://localhost:8080');\n\n    actions.listRewards();\n    actions.tryReconnectWallet();\n  });\n\n  // /////////////////////////////////////////\n  // GetMore Popup\n  // /////////////////////////////////////////\n  const isGetMorePopup = ref(false)\n  const currentMenuPopup = ref(0)\n\n  function switchGetMoreMenu(value) {\n    currentMenuPopup.value = value;\n  }\n\n  function openGetMorePopup() {\n    isGetMorePopup.value = true;\n  }\n  function closeGetMorePopup() {\n    isGetMorePopup.value = false;\n    currentMenuPopup.value = 0;\n    actions.stopTimer();\n    actions.disconnectWebSocket();\n  }\n</script>"],"names":["useI18n","text","onMounted","state","actions","ref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6ME,UAAM,EAAE,EAAC,IAAKA,gBAAQ;AAAA,MACpB,UAAU;AAAA,MACV,GAAGC,OAAAA;AAAAA,IACP,CAAG;AAiBDC,QAAAA,UAAU,YAAY;AAEpB,aAAO,SAAS,GAAG,mBAAmB,CAAC,aAAa;AAClD,YAAI,SAAS,SAAS,GAAG;AACvBC,uBAAAA,MAAM,UAAU;AAAA,QAClB;AAAA,MACF,CAAC;AAGD,YAAM,EAAE,SAAS,SAAS,MAAM,OAAO,MAAM;AAC7CA,mBAAAA,MAAM,OAAO,IAAI,KAAK,OAAO,YAAY,uBAAuB;AAEhEC,mBAAAA,QAAQ,YAAW;AACnBA,mBAAAA,QAAQ,mBAAkB;AAAA,IAC5B,CAAC;AAKD,UAAM,iBAAiBC,IAAAA,IAAI,KAAK;AAChC,UAAM,mBAAmBA,IAAAA,IAAI,CAAC;AAE9B,aAAS,kBAAkB,OAAO;AAChC,uBAAiB,QAAQ;AAAA,IAC3B;AAEA,aAAS,mBAAmB;AAC1B,qBAAe,QAAQ;AAAA,IACzB;AACA,aAAS,oBAAoB;AAC3B,qBAAe,QAAQ;AACvB,uBAAiB,QAAQ;AACzBD,mBAAAA,QAAQ,UAAS;AACjBA,mBAAAA,QAAQ,oBAAmB;AAAA,IAC7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/wallet/views/components/pages/Wallet.vue.js

@@ -1,6 +1,5 @@
 import { onMounted, ref, createElementBlock, openBlock, createElementVNode, createCommentVNode, createVNode, toDisplayString, unref, withCtx, createTextVNode, Fragment, renderList, createBlock } from "vue";
 import { useI18n } from "vue-i18n";
-import Web3 from "web3";
 import { state, actions } from "../../store/wallet.store.js";
 import text from "../../localization/wallet.json.js";
 import _sfc_main$3 from "../../../../../components/Popup/Popup.vue.js";
@@ -74,12 +73,13 @@ const _sfc_main = {
       useScope: "global",
       ...text
     });
-    onMounted(() => {
+    onMounted(async () => {
       window.ethereum.on("accountsChanged", (accounts) => {
         if (accounts.length < 1) {
           state.account = null;
         }
       });
+      const { default: Web3 } = await import("web3");
       state.web3 = new Web3(window.ethereum || "http://localhost:8080");
       actions.listRewards();
       actions.tryReconnectWallet();

package/dist/martyrs/src/modules/wallet/views/components/pages/Wallet.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Wallet.vue.js","sources":["../../../../../../../../src/modules/wallet/views/components/pages/Wallet.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin\">\n    <section class=\"bg-black t-white mn-b-thin radius-big pd-big\">\n      <h1 class=\"mn-b-medium\">{{ t('wallet.title') }}</h1>\n\n      <p class=\"mn-b-semi t-transp p-medium\">\n        {{ t('wallet.subtitle') }}\n      </p>\n\n      <div \n        v-if=\"state.account\"\n        class=\"gap-thin mn-b-thin flex-nowrap bg-black radius-extra t-white br-solid br-white-transp-10 br-1px flex-v-center flex pd-medium\"\n      >\n        <div class=\"flex-v-center flex-nowrap flex mn-r-auto\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt.svg\" class=\"mn-r-thin i-big\"> -->\n          <h2>{{state.tokenBalance}} {{ t('wallet.token') }}</h2>\n        </div>\n\n        <button @click=\"openGetMorePopup\" class=\"t-nowrap w-max bg-main t-medium button\">Get More</button>\n\n\n        <Button \n          :submit=\"actions.collectRewards\" \n          class=\"w-max bg-white t-black t-medium button\"\n        >\n          Withdraw\n        </Button>\n      </div>\n\n      <ConnectMetamask class=\"mn-b-thin radius-extra br-solid br-white-transp-10 br-1px w-100\" />\n\n      <div\n        v-if=\"state.account\"\n        class=\"w-100 mn-b-semi flex-column flex pd-big radius-big bg-main t-black\"\n      >\n        <p class=\"t-transp t-medium mn-b-thin\">You own:</p>\n        <p class=\"h1 mn-b-small\">{{state.share}}%</p>\n        <p class=\"t-white p-medium t-medium mn-b-semi\">of all shares</p>\n\n          <div\n            class=\"flex-v-center mn-b-small flex-nowrap flex pd-small bg-black-transp-5 radius-extra\"\n          >\n              <!-- <img loading=\"lazy\" src=\"@/assets/icons/metamask.svg\" class=\"mn-r-small i-big\" > -->\n            \n            <p v-if=\"state.account\" class=\"t-transp t-medium \">\n               <span class=\"uppercase p-small t-medium t-transp\">Connected Metamask</span><br>\n               <span>{{state.account}}</span>\n            </p>\n\n            <button\n              v-if=\"state.account\"\n              @click=\"actions.disconnectWallet\"\n              class=\"mn-l-auto bg-red button\"\n            >\n              Disconnect Wallet\n            </button>\n          </div>\n      </div>\n\n    </section>\n\n    <div v-if=\"!state.account\" class=\"mn-b-semi cols-2 gap-thin\">\n      <div\n        class=\"w-100 pd-medium radius-medium t-center bg-light\"\n      >\n        <h3 class=\"mn-b-small\">Make first order and start earning Weeder Token</h3>\n        <button class=\"mn-l-auto mn-r-auto bg-main button\">Explore marketplace</button>\n      </div>\n\n      <div\n        class=\"w-100 pd-medium flex-center flex flex-column radius-medium t-center bg-light\"\n      >\n        <h3 \n          v-if=\"!state.account\"\n          class=\"mn-b-small\"\n        >\n          Connect Metamask to withdrawal your earnings.\n        </h3>\n\n        <button\n          v-if=\"!state.account\"\n          @click=\"actions.connectWallet\"\n          class=\"br-solid br-2px br-black-transp-10 t-black button\"\n        >\n          Connect Wallet\n        </button>\n      </div>\n    </div>\n\n    <h2 class=\"mn-b-small\" v-if=\"state.rewards.length > 0\">Latest Rewards </h2>\n\n    <section class=\"cols-3 mobile:cols-1 gap-thin\">\n      <div \n        class=\"radius-medium bg-light\"\n        v-for=\"income in state.rewards\"\n      > \n        <div class=\"flex-nowrap br-b br-black-transp-10 br-solid flex pd-medium\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt-plus.svg\" class=\"mn-r-thin i-medium\"> -->\n          <p class=\"t-semi mn-r-auto\">{{income.amount}} WDT</p>\n          \n          <span class=\"pd-t-nano pd-b-nano pd-l-thin pd-r-thin bg-main flex flex-center radius-extra t-semi p-small\">{{income.type === 'blogpost' ? 'Community Reward' : income.type}}</span>\n        </div>\n\n        <div class=\"pd-medium\">\n          <h4 class=\"t-regular mn-b-thin\">{{income.name}}</h4>\n          <!-- <p class=\"p-small\">{{income.content[0].content}}</p> -->\n        </div>\n\n      </div>\n\n\n    </section>\n\n    <h2 class=\"mn-b-small\" v-if=\"state.rewards.length > 0\">Activity</h2>\n\n    <section class=\"cols-3 mobile:cols-1 gap-thin\">\n      <div \n        class=\"radius-medium bg-grey\"\n        v-for=\"income in state.rewards\"\n      > \n        <div class=\"flex-nowrap br-b br-black-transp-10 br-solid flex pd-medium\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt-plus.svg\" class=\"mn-r-thin i-medium\"> -->\n          <p class=\"t-semi mn-r-auto\">{{income.amount}} WDT</p>\n          \n          <span class=\"pd-t-nano pd-b-nano pd-l-thin pd-r-thin bg-main flex flex-center radius-extra t-semi p-small\">{{income.type === 'blogpost' ? 'Community Reward' : income.type}}</span>\n        </div>\n\n        <div class=\"pd-medium\">\n          <h4 class=\"t-regular mn-b-thin\">{{income.name}}</h4>\n          <!-- <p class=\"p-small\">{{income.content[0].content}}</p> -->\n        </div>\n      </div>\n    </section>\n\n    <Popup \n      @close-popup=\"closeGetMorePopup\" \n      :isPopupOpen=\"isGetMorePopup\"\n      class=\"w-m-50r t-left pd-big bg-white radius-big\"\n    >\n      <div\n        v-if=\"currentMenuPopup === 0\"\n      >\n        <h2 class=\"mn-b-small t-center t-bold\">Choose the way of deposit</h2>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(1)\"\n        >\n          CASH\n        </button>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(2)\"\n        >\n          CARD\n        </button>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(4)\"\n        >\n          CRYPTO\n        </button>\n      </div>\n\n      <CashDepositMenu\n        v-if=\"currentMenuPopup === 1\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n      />\n\n      <CardDepositMenu\n        v-if=\"currentMenuPopup === 2\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n\n      <CardBalanceReplenished\n        v-if=\"currentMenuPopup === 3\"\n        @close=\"closeGetMorePopup\"\n      />\n\n      <CryptoDepositMenu\n        v-if=\"currentMenuPopup === 4\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n\n      <CryptoDepositProcessing\n        v-if=\"currentMenuPopup === 5\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n    </Popup>\n  </div>\n</template>\n\n<script setup>\n  import { onMounted, ref } from 'vue';\n  import { useI18n } from 'vue-i18n'\n  import Web3 from \"web3\";\n\n  import { state, actions } from '@martyrs/src/modules/wallet/views/store/wallet.store';\n\n  import text from '@martyrs/src/modules/wallet/views/localization/wallet.json'\n \n  const { t } = useI18n({\n    useScope: 'global', \n    ...text\n  })\n\n  import Popup from '@martyrs/src/components/Popup/Popup.vue';\n  import Button from '@martyrs/src/components/Button/Button.vue'; \n\n  import CardBlogpost from '@martyrs/src/modules/community/components/blocks/CardBlogpost.vue';\n\n  import ConnectMetamask from '@martyrs/src/modules/wallet/views/components/elements/ConnectMetamask.vue';\n\n  import CashDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CashDeposit.vue';\n  import CardDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CardDeposit.vue';\n  import CryptoDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CryptoDeposit.vue';\n  import CardBalanceReplenished from '@martyrs/src/modules/wallet/views/components/blocks/CardBalanceReplenished.vue';\n  import CryptoDepositProcessing from '@martyrs/src/modules/wallet/views/components/blocks/CryptoDepositProcessing.vue';\n\n\n\n  onMounted(() => {\n      // User has disconnected metamask from extension\n    window.ethereum.on('accountsChanged', (accounts) => {\n      if (accounts.length < 1) {\n        state.account = null;\n      }\n    });\n\n\n    state.web3 = new Web3(window.ethereum || 'http://localhost:8080');\n\n    actions.listRewards();\n    actions.tryReconnectWallet();\n  });\n\n  // /////////////////////////////////////////\n  // GetMore Popup\n  // /////////////////////////////////////////\n  const isGetMorePopup = ref(false)\n  const currentMenuPopup = ref(0)\n\n  function switchGetMoreMenu(value) {\n    currentMenuPopup.value = value;\n  }\n\n  function openGetMorePopup() {\n    isGetMorePopup.value = true;\n  }\n  function closeGetMorePopup() {\n    isGetMorePopup.value = false;\n    currentMenuPopup.value = 0;\n    actions.stopTimer();\n    actions.disconnectWebSocket();\n  }\n</script>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8ME,UAAM,EAAE,EAAC,IAAK,QAAQ;AAAA,MACpB,UAAU;AAAA,MACV,GAAG;AAAA,IACP,CAAG;AAiBD,cAAU,MAAM;AAEd,aAAO,SAAS,GAAG,mBAAmB,CAAC,aAAa;AAClD,YAAI,SAAS,SAAS,GAAG;AACvB,gBAAM,UAAU;AAAA,QAClB;AAAA,MACF,CAAC;AAGD,YAAM,OAAO,IAAI,KAAK,OAAO,YAAY,uBAAuB;AAEhE,cAAQ,YAAW;AACnB,cAAQ,mBAAkB;AAAA,IAC5B,CAAC;AAKD,UAAM,iBAAiB,IAAI,KAAK;AAChC,UAAM,mBAAmB,IAAI,CAAC;AAE9B,aAAS,kBAAkB,OAAO;AAChC,uBAAiB,QAAQ;AAAA,IAC3B;AAEA,aAAS,mBAAmB;AAC1B,qBAAe,QAAQ;AAAA,IACzB;AACA,aAAS,oBAAoB;AAC3B,qBAAe,QAAQ;AACvB,uBAAiB,QAAQ;AACzB,cAAQ,UAAS;AACjB,cAAQ,oBAAmB;AAAA,IAC7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Wallet.vue.js","sources":["../../../../../../../../src/modules/wallet/views/components/pages/Wallet.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin\">\n    <section class=\"bg-black t-white mn-b-thin radius-big pd-big\">\n      <h1 class=\"mn-b-medium\">{{ t('wallet.title') }}</h1>\n\n      <p class=\"mn-b-semi t-transp p-medium\">\n        {{ t('wallet.subtitle') }}\n      </p>\n\n      <div \n        v-if=\"state.account\"\n        class=\"gap-thin mn-b-thin flex-nowrap bg-black radius-extra t-white br-solid br-white-transp-10 br-1px flex-v-center flex pd-medium\"\n      >\n        <div class=\"flex-v-center flex-nowrap flex mn-r-auto\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt.svg\" class=\"mn-r-thin i-big\"> -->\n          <h2>{{state.tokenBalance}} {{ t('wallet.token') }}</h2>\n        </div>\n\n        <button @click=\"openGetMorePopup\" class=\"t-nowrap w-max bg-main t-medium button\">Get More</button>\n\n\n        <Button \n          :submit=\"actions.collectRewards\" \n          class=\"w-max bg-white t-black t-medium button\"\n        >\n          Withdraw\n        </Button>\n      </div>\n\n      <ConnectMetamask class=\"mn-b-thin radius-extra br-solid br-white-transp-10 br-1px w-100\" />\n\n      <div\n        v-if=\"state.account\"\n        class=\"w-100 mn-b-semi flex-column flex pd-big radius-big bg-main t-black\"\n      >\n        <p class=\"t-transp t-medium mn-b-thin\">You own:</p>\n        <p class=\"h1 mn-b-small\">{{state.share}}%</p>\n        <p class=\"t-white p-medium t-medium mn-b-semi\">of all shares</p>\n\n          <div\n            class=\"flex-v-center mn-b-small flex-nowrap flex pd-small bg-black-transp-5 radius-extra\"\n          >\n              <!-- <img loading=\"lazy\" src=\"@/assets/icons/metamask.svg\" class=\"mn-r-small i-big\" > -->\n            \n            <p v-if=\"state.account\" class=\"t-transp t-medium \">\n               <span class=\"uppercase p-small t-medium t-transp\">Connected Metamask</span><br>\n               <span>{{state.account}}</span>\n            </p>\n\n            <button\n              v-if=\"state.account\"\n              @click=\"actions.disconnectWallet\"\n              class=\"mn-l-auto bg-red button\"\n            >\n              Disconnect Wallet\n            </button>\n          </div>\n      </div>\n\n    </section>\n\n    <div v-if=\"!state.account\" class=\"mn-b-semi cols-2 gap-thin\">\n      <div\n        class=\"w-100 pd-medium radius-medium t-center bg-light\"\n      >\n        <h3 class=\"mn-b-small\">Make first order and start earning Weeder Token</h3>\n        <button class=\"mn-l-auto mn-r-auto bg-main button\">Explore marketplace</button>\n      </div>\n\n      <div\n        class=\"w-100 pd-medium flex-center flex flex-column radius-medium t-center bg-light\"\n      >\n        <h3 \n          v-if=\"!state.account\"\n          class=\"mn-b-small\"\n        >\n          Connect Metamask to withdrawal your earnings.\n        </h3>\n\n        <button\n          v-if=\"!state.account\"\n          @click=\"actions.connectWallet\"\n          class=\"br-solid br-2px br-black-transp-10 t-black button\"\n        >\n          Connect Wallet\n        </button>\n      </div>\n    </div>\n\n    <h2 class=\"mn-b-small\" v-if=\"state.rewards.length > 0\">Latest Rewards </h2>\n\n    <section class=\"cols-3 mobile:cols-1 gap-thin\">\n      <div \n        class=\"radius-medium bg-light\"\n        v-for=\"income in state.rewards\"\n      > \n        <div class=\"flex-nowrap br-b br-black-transp-10 br-solid flex pd-medium\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt-plus.svg\" class=\"mn-r-thin i-medium\"> -->\n          <p class=\"t-semi mn-r-auto\">{{income.amount}} WDT</p>\n          \n          <span class=\"pd-t-nano pd-b-nano pd-l-thin pd-r-thin bg-main flex flex-center radius-extra t-semi p-small\">{{income.type === 'blogpost' ? 'Community Reward' : income.type}}</span>\n        </div>\n\n        <div class=\"pd-medium\">\n          <h4 class=\"t-regular mn-b-thin\">{{income.name}}</h4>\n          <!-- <p class=\"p-small\">{{income.content[0].content}}</p> -->\n        </div>\n\n      </div>\n\n\n    </section>\n\n    <h2 class=\"mn-b-small\" v-if=\"state.rewards.length > 0\">Activity</h2>\n\n    <section class=\"cols-3 mobile:cols-1 gap-thin\">\n      <div \n        class=\"radius-medium bg-grey\"\n        v-for=\"income in state.rewards\"\n      > \n        <div class=\"flex-nowrap br-b br-black-transp-10 br-solid flex pd-medium\">\n          <!-- <img loading=\"lazy\" src=\"/logo/wdt-plus.svg\" class=\"mn-r-thin i-medium\"> -->\n          <p class=\"t-semi mn-r-auto\">{{income.amount}} WDT</p>\n          \n          <span class=\"pd-t-nano pd-b-nano pd-l-thin pd-r-thin bg-main flex flex-center radius-extra t-semi p-small\">{{income.type === 'blogpost' ? 'Community Reward' : income.type}}</span>\n        </div>\n\n        <div class=\"pd-medium\">\n          <h4 class=\"t-regular mn-b-thin\">{{income.name}}</h4>\n          <!-- <p class=\"p-small\">{{income.content[0].content}}</p> -->\n        </div>\n      </div>\n    </section>\n\n    <Popup \n      @close-popup=\"closeGetMorePopup\" \n      :isPopupOpen=\"isGetMorePopup\"\n      class=\"w-m-50r t-left pd-big bg-white radius-big\"\n    >\n      <div\n        v-if=\"currentMenuPopup === 0\"\n      >\n        <h2 class=\"mn-b-small t-center t-bold\">Choose the way of deposit</h2>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(1)\"\n        >\n          CASH\n        </button>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(2)\"\n        >\n          CARD\n        </button>\n\n        <button\n          class=\"w-100 bg-white t-black pd-thin radius-medium h3 t-center br-solid br-2px br-black-transp-10 mn-t-small\"\n          @click=\"switchGetMoreMenu(4)\"\n        >\n          CRYPTO\n        </button>\n      </div>\n\n      <CashDepositMenu\n        v-if=\"currentMenuPopup === 1\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n      />\n\n      <CardDepositMenu\n        v-if=\"currentMenuPopup === 2\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n\n      <CardBalanceReplenished\n        v-if=\"currentMenuPopup === 3\"\n        @close=\"closeGetMorePopup\"\n      />\n\n      <CryptoDepositMenu\n        v-if=\"currentMenuPopup === 4\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n\n      <CryptoDepositProcessing\n        v-if=\"currentMenuPopup === 5\"\n        @back-selection=\"switchGetMoreMenu(0)\"\n        @switch-menu=\"switchGetMoreMenu\"\n      />\n    </Popup>\n  </div>\n</template>\n\n<script setup>\n  import { onMounted, ref } from 'vue';\n  import { useI18n } from 'vue-i18n'\n\n  import { state, actions } from '@martyrs/src/modules/wallet/views/store/wallet.store';\n\n  import text from '@martyrs/src/modules/wallet/views/localization/wallet.json'\n\n  const { t } = useI18n({\n    useScope: 'global',\n    ...text\n  })\n\n  import Popup from '@martyrs/src/components/Popup/Popup.vue';\n  import Button from '@martyrs/src/components/Button/Button.vue';\n\n  import CardBlogpost from '@martyrs/src/modules/community/components/blocks/CardBlogpost.vue';\n\n  import ConnectMetamask from '@martyrs/src/modules/wallet/views/components/elements/ConnectMetamask.vue';\n\n  import CashDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CashDeposit.vue';\n  import CardDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CardDeposit.vue';\n  import CryptoDepositMenu from '@martyrs/src/modules/wallet/views/components/blocks/CryptoDeposit.vue';\n  import CardBalanceReplenished from '@martyrs/src/modules/wallet/views/components/blocks/CardBalanceReplenished.vue';\n  import CryptoDepositProcessing from '@martyrs/src/modules/wallet/views/components/blocks/CryptoDepositProcessing.vue';\n\n\n\n  onMounted(async () => {\n      // User has disconnected metamask from extension\n    window.ethereum.on('accountsChanged', (accounts) => {\n      if (accounts.length < 1) {\n        state.account = null;\n      }\n    });\n\n    // Динамический импорт Web3 только когда компонент монтируется\n    const { default: Web3 } = await import('web3');\n    state.web3 = new Web3(window.ethereum || 'http://localhost:8080');\n\n    actions.listRewards();\n    actions.tryReconnectWallet();\n  });\n\n  // /////////////////////////////////////////\n  // GetMore Popup\n  // /////////////////////////////////////////\n  const isGetMorePopup = ref(false)\n  const currentMenuPopup = ref(0)\n\n  function switchGetMoreMenu(value) {\n    currentMenuPopup.value = value;\n  }\n\n  function openGetMorePopup() {\n    isGetMorePopup.value = true;\n  }\n  function closeGetMorePopup() {\n    isGetMorePopup.value = false;\n    currentMenuPopup.value = 0;\n    actions.stopTimer();\n    actions.disconnectWebSocket();\n  }\n</script>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6ME,UAAM,EAAE,EAAC,IAAK,QAAQ;AAAA,MACpB,UAAU;AAAA,MACV,GAAG;AAAA,IACP,CAAG;AAiBD,cAAU,YAAY;AAEpB,aAAO,SAAS,GAAG,mBAAmB,CAAC,aAAa;AAClD,YAAI,SAAS,SAAS,GAAG;AACvB,gBAAM,UAAU;AAAA,QAClB;AAAA,MACF,CAAC;AAGD,YAAM,EAAE,SAAS,SAAS,MAAM,OAAO,MAAM;AAC7C,YAAM,OAAO,IAAI,KAAK,OAAO,YAAY,uBAAuB;AAEhE,cAAQ,YAAW;AACnB,cAAQ,mBAAkB;AAAA,IAC5B,CAAC;AAKD,UAAM,iBAAiB,IAAI,KAAK;AAChC,UAAM,mBAAmB,IAAI,CAAC;AAE9B,aAAS,kBAAkB,OAAO;AAChC,uBAAiB,QAAQ;AAAA,IAC3B;AAEA,aAAS,mBAAmB;AAC1B,qBAAe,QAAQ;AAAA,IACzB;AACA,aAAS,oBAAoB;AAC3B,qBAAe,QAAQ;AACvB,uBAAiB,QAAQ;AACzB,cAAQ,UAAS;AACjB,cAAQ,oBAAmB;AAAA,IAC7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ozdao/martyrs",
-  "version": "0.2.548",
+  "version": "0.2.549",
   "description": "Fullstack framework focused on user experience and ease of development.",
   "author": "OZ DAO <hello@ozdao.dev>",
   "license": "GPL-3.0-or-later",

package/src/modules/wallet/views/components/pages/Wallet.vue

@@ -198,19 +198,18 @@
 <script setup>
   import { onMounted, ref } from 'vue';
   import { useI18n } from 'vue-i18n'
-  import Web3 from "web3";
 
   import { state, actions } from '@martyrs/src/modules/wallet/views/store/wallet.store';
 
   import text from '@martyrs/src/modules/wallet/views/localization/wallet.json'
- 
+
   const { t } = useI18n({
-    useScope: 'global', 
+    useScope: 'global',
     ...text
   })
 
   import Popup from '@martyrs/src/components/Popup/Popup.vue';
-  import Button from '@martyrs/src/components/Button/Button.vue'; 
+  import Button from '@martyrs/src/components/Button/Button.vue';
 
   import CardBlogpost from '@martyrs/src/modules/community/components/blocks/CardBlogpost.vue';
 
@@ -224,7 +223,7 @@
 
 
 
-  onMounted(() => {
+  onMounted(async () => {
       // User has disconnected metamask from extension
     window.ethereum.on('accountsChanged', (accounts) => {
       if (accounts.length < 1) {
@@ -232,7 +231,8 @@
       }
     });
 
-
+    // Динамический импорт Web3 только когда компонент монтируется
+    const { default: Web3 } = await import('web3');
     state.web3 = new Web3(window.ethereum || 'http://localhost:8080');
 
     actions.listRewards();

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

@@ -1 +0,0 @@
-{"version":3,"file":"UploadImage.vue2.cjs","sources":["../../../../../src/components/UploadImage/UploadImage.vue"],"sourcesContent":["<template>\n  <div class=\"upload-image-wrapper flex-v-center flex-nowrap flex gap-small\" :class=\"{'with-text': text}\">\n    <div \n      @click=\"onComponentClick\"\n      @drop=\"onDrop\"\n      @dragover.prevent\n      class=\"pos-relative radius-small br-solid br-1px br-black-transp-10 h-100 aspect-1x1 flex-v-center flex-h-center flex cursor-pointer\"\n    >\n      <img loading=\"lazy\" \n        v-if=\"imageUrl || photo || previewUrl\" \n        :src=\"previewUrl || (FILE_SERVER_URL || '') + (imageUrl || photo)\"\n        alt=\"Uploaded image\" \n        class=\"pos-absolute  radius-small o-hidden z-index-1 w-100 h-100 object-fit-cover\"\n      />\n      \n      <div v-else class=\"flex-v-center pos-relative z-index-2 flex-h-center flex w-100 h-100 radius-small  bg-second\" >\n        <IconUpload class=\"i-medium upload-icon\" fill=\"rgb(var(--white))\" />\n      </div>\n      \n      <!-- Hover controls -->\n      <div class=\"z-index-2 pos-relative  hover-controls pos-absolute w-100 h-100 flex-v-center flex-h-center flex\">\n        <div v-if=\"!imageUrl && !photo && !previewUrl\" class=\"hover-upload-icon\">\n          <IconUpload class=\"i-medium\" fill=\"rgb(var(--white))\" />\n        </div>\n        <div v-else class=\"hover-buttons flex gap-small\">\n          <button @click.stop=\"onComponentClick\" class=\"hover-button radius-small pd-thin bg-main t-white br-none cursor-pointer\">\n            <IconUpload class=\"i-medium\" fill=\"rgb(var(--white))\" />\n          </button>\n          <button @click.stop=\"deleteImage\" class=\"hover-button radius-small pd-thin bg-danger t-white br-none cursor-pointer\">\n            <IconDelete class=\"i-medium\" fill=\"rgb(var(--white))\" />\n          </button>\n        </div>\n      </div>\n      \n      <!-- Loading overlay -->\n      <div v-if=\"loading\" class=\"z-index-2 loading-overlay pos-absolute w-100 h-100 flex-v-center flex-h-center flex\">\n        <Loader :centered=\"false\" />\n      </div>\n      \n      <input type=\"file\" name=\"file\" ref=\"fileInput\" @change=\"onFileChange\" style=\"display: none\"/>\n    </div>\n    \n    <!-- Text block -->\n    <div v-if=\"text\" class=\"upload-text-block  flex flex-column\">\n      <span class=\"mn-b-small t-medium\">{{ textConfig.title }}</span>\n      <span class=\"mn-b-medium t-transp\">{{ textConfig.subtitle }}</span>\n      <div v-if=\"!imageUrl && !photo && !previewUrl\">\n        <button @click=\"onComponentClick\" class=\"button button-small w-max bg-main t-black cursor-pointer\">\n          {{ textConfig.buttonText }}\n        </button>\n      </div>\n      <div v-else class=\"flex gap-thin\">\n        <button @click=\"onComponentClick\" class=\"button button-small w-max bg-second t-white cursor-pointer\">\n          Upload \n        </button>\n        <button @click=\"deleteImage\" class=\"button button-small w-max bg-red t-white cursor-pointer\">\n          Delete\n        </button>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, watch, computed } from 'vue';\nimport axios from 'axios';\nimport Loader from '@martyrs/src/components/Loader/Loader.vue';\nimport IconUpload from '@martyrs/src/modules/icons/navigation/IconUpload.vue';\nimport IconDelete from '@martyrs/src/modules/icons/navigation/IconDelete.vue';\n\nconst imageUrl = ref(null);\nconst fileInput = ref(null);\nconst previewUrl = ref(null);\nconst loading = ref(false);\n\nconst props = defineProps({\n  uploadPath: {\n    type: String,\n    required: true\n  },\n  photo: {\n    type: String,\n    default: null\n  },\n  text: {\n    type: [Object, Boolean],\n    default: null\n  }\n});\n\nconst emit = defineEmits(['update:photo', 'error']);\n\n// Text configuration with defaults\nconst textConfig = computed(() => {\n  const defaults = {\n    title: 'Upload Image',\n    subtitle: 'Drag & drop your image here or click button. Supported: JPG, PNG, GIF. Max size: 2MB',\n    buttonText: 'Choose Image'\n  };\n  \n  if (props.text === true) {\n    return defaults;\n  } else if (typeof props.text === 'object' && props.text !== null) {\n    return {\n      title: props.text.title || defaults.title,\n      subtitle: props.text.subtitle || defaults.subtitle,\n      buttonText: props.text.buttonText || defaults.buttonText\n    };\n  }\n  \n  return defaults;\n});\n\nwatch(props, ({photo}) => {\n  if(photo) imageUrl.value = photo;\n});\n\nfunction onComponentClick() {\n  fileInput.value.click();\n}\n\nasync function onFileChange(e) {\n  let file = e.target.files[0];\n  if (!file) {\n    console.error(\"No file selected\");\n    return;\n  }\n  \n  // Create preview from file\n  const reader = new FileReader();\n  reader.onload = (e) => {\n    previewUrl.value = e.target.result;\n  };\n  reader.readAsDataURL(file);\n  \n  let formData = new FormData();\n  formData.append(\"file\", file);\n\n  console.log(\"Sending file:\", file.name); // Логируем имя файла перед отправкой\n  \n  loading.value = true;\n\n  try {\n    const $axios = axios.create({ baseURL: process.env.API_URL, withCredentials: true }); \n\n    let response = await $axios.post(`/api/upload/multiple?folderName=${encodeURIComponent(props.uploadPath)}`, formData);\n    console.log(\"Upload response:\", response); // Логируем ответ сервера\n    imageUrl.value = response.data[0].filepath;\n    previewUrl.value = null; // Clear preview after successful upload\n    emit('update:photo', imageUrl.value);\n  } catch (error) {\n    emit('error', error);\n    console.error(\"Upload error:\", error); // Логируем ошибку\n    previewUrl.value = null; // Clear preview on error\n  } finally {\n    loading.value = false;\n  }\n}\n\n\nfunction onDrop(e) {\n  e.preventDefault();\n  onFileChange({\n    target: {\n      files: e.dataTransfer.files\n    }\n  });\n}\n\nfunction deleteImage() {\n  imageUrl.value = null;\n  previewUrl.value = null;\n  emit('update:photo', null);\n  // Reset file input\n  if (fileInput.value) {\n    fileInput.value.value = '';\n  }\n}\n</script>\n\n<style scoped>\n.image-upload-area {\n  overflow: hidden;\n  transition: all 0.3s ease;\n}\n\n.image-upload-area:hover {\n  opacity: 0.95;\n}\n\n/* Hover controls */\n.hover-controls {\n  top: 0;\n  left: 0;\n  background: rgba(0, 0, 0, 0.7);\n  opacity: 0;\n  transition: opacity 0.3s ease;\n  pointer-events: none;\n}\n\n.image-upload-area:hover .hover-controls {\n  opacity: 1;\n  pointer-events: all;\n}\n\n.hover-upload-icon {\n  animation: pulse 1.5s infinite;\n}\n\n.hover-button {\n  transition: transform 0.2s ease, background-color 0.2s ease;\n}\n\n.hover-button:hover {\n  transform: scale(1.1);\n}\n\n.hover-button:active {\n  transform: scale(0.95);\n}\n\n/* Loading overlay */\n.loading-overlay {\n  top: 0;\n  left: 0;\n  background: rgba(255, 255, 255, 0.9);\n  z-index: 10;\n}\n\n/* Animations */\n@keyframes pulse {\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  50% {\n    transform: scale(1.05);\n    opacity: 0.8;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n\n/* Upload icon in empty state */\n.upload-icon {\n  transition: transform 0.3s ease;\n}\n\n.image-upload-area:hover .upload-icon {\n  transform: scale(1.1);\n}\n</style>\n"],"names":["ref","computed","watch","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsEA,UAAM,WAAWA,IAAAA,IAAI,IAAI;AACzB,UAAM,YAAYA,IAAAA,IAAI,IAAI;AAC1B,UAAM,aAAaA,IAAAA,IAAI,IAAI;AAC3B,UAAM,UAAUA,IAAAA,IAAI,KAAK;AAEzB,UAAM,QAAQ;AAed,UAAM,OAAO;AAGb,UAAM,aAAaC,IAAAA,SAAS,MAAM;AAChC,YAAM,WAAW;AAAA,QACf,OAAO;AAAA,QACP,UAAU;AAAA,QACV,YAAY;AAAA,MAChB;AAEE,UAAI,MAAM,SAAS,MAAM;AACvB,eAAO;AAAA,MACT,WAAW,OAAO,MAAM,SAAS,YAAY,MAAM,SAAS,MAAM;AAChE,eAAO;AAAA,UACL,OAAO,MAAM,KAAK,SAAS,SAAS;AAAA,UACpC,UAAU,MAAM,KAAK,YAAY,SAAS;AAAA,UAC1C,YAAY,MAAM,KAAK,cAAc,SAAS;AAAA,QACpD;AAAA,MACE;AAEA,aAAO;AAAA,IACT,CAAC;AAEDC,QAAAA,MAAM,OAAO,CAAC,EAAC,MAAK,MAAM;AACxB,UAAG,MAAO,UAAS,QAAQ;AAAA,IAC7B,CAAC;AAED,aAAS,mBAAmB;AAC1B,gBAAU,MAAM,MAAK;AAAA,IACvB;AAEA,mBAAe,aAAa,GAAG;AAC7B,UAAI,OAAO,EAAE,OAAO,MAAM,CAAC;AAC3B,UAAI,CAAC,MAAM;AACT,gBAAQ,MAAM,kBAAkB;AAChC;AAAA,MACF;AAGA,YAAM,SAAS,IAAI,WAAU;AAC7B,aAAO,SAAS,CAACC,OAAM;AACrB,mBAAW,QAAQA,GAAE,OAAO;AAAA,MAC9B;AACA,aAAO,cAAc,IAAI;AAEzB,UAAI,WAAW,IAAI,SAAQ;AAC3B,eAAS,OAAO,QAAQ,IAAI;AAE5B,cAAQ,IAAI,iBAAiB,KAAK,IAAI;AAEtC,cAAQ,QAAQ;AAEhB,UAAI;AACF,cAAM,SAAS,MAAM,OAAO,EAAE,SAAS,QAAQ,IAAI,SAAS,iBAAiB,KAAI,CAAE;AAEnF,YAAI,WAAW,MAAM,OAAO,KAAK,mCAAmC,mBAAmB,MAAM,UAAU,CAAC,IAAI,QAAQ;AACpH,gBAAQ,IAAI,oBAAoB,QAAQ;AACxC,iBAAS,QAAQ,SAAS,KAAK,CAAC,EAAE;AAClC,mBAAW,QAAQ;AACnB,aAAK,gBAAgB,SAAS,KAAK;AAAA,MACrC,SAAS,OAAO;AACd,aAAK,SAAS,KAAK;AACnB,gBAAQ,MAAM,iBAAiB,KAAK;AACpC,mBAAW,QAAQ;AAAA,MACrB,UAAC;AACC,gBAAQ,QAAQ;AAAA,MAClB;AAAA,IACF;AAGA,aAAS,OAAO,GAAG;AACjB,QAAE,eAAc;AAChB,mBAAa;AAAA,QACX,QAAQ;AAAA,UACN,OAAO,EAAE,aAAa;AAAA,QAC5B;AAAA,MACA,CAAG;AAAA,IACH;AAEA,aAAS,cAAc;AACrB,eAAS,QAAQ;AACjB,iBAAW,QAAQ;AACnB,WAAK,gBAAgB,IAAI;AAEzB,UAAI,UAAU,OAAO;AACnB,kBAAU,MAAM,QAAQ;AAAA,MAC1B;AAAA,IACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/products/components/elements/THC.vue2.cjs.map

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

package/dist/martyrs/src/modules/products/components/elements/THC.vue2.js.map

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