@ozdao/martyrs 0.2.477 → 0.2.479

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

@@ -1,155 +1,96 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
-const Field = require("../../../../components/Field/Field.vue.cjs");
-const Select = require("../../../../components/Select/Select.vue.cjs");
-;/* empty css                                                    */
-;/* empty css                                          */
-const IconAdd = require("../../../icons/navigation/IconAdd.vue.cjs");
-const IconDelete = require("../../../icons/navigation/IconDelete.vue.cjs");
-const _hoisted_1 = { class: "gap-thin" };
-const _hoisted_2 = { class: "gap-thin mn-b-thin flex-nowrap flex" };
-const _hoisted_3 = { class: "bg-white w-100 w-min-15r br-solid br-1px br-black-transp-5 pd-small radius-small" };
-const _hoisted_4 = ["disabled"];
-const _hoisted_5 = {
+const PlaceholderImage = require("../../../icons/placeholders/PlaceholderImage.vue.cjs");
+const mixins = require("../../../globals/views/mixins/mixins.cjs");
+const _hoisted_1 = { class: "bg-white radius-small pd-small flex-nowrap flex-v-center flex gap-thin" };
+const _hoisted_2 = {
   key: 0,
-  class: "gap-thin flex-nowrap flex"
+  class: "aspect-1x1 h-3r flex-child-default radius-small o-hidden"
 };
+const _hoisted_3 = ["src"];
+const _hoisted_4 = { class: "mn-micro-negative flex flex-column w-100 o-hidden" };
+const _hoisted_5 = { class: "w-100 pd-micro t-trim trimmed capitalize t-medium" };
+const _hoisted_6 = { class: "flex pd-micro flex-v-center gap-micro w-max" };
+const _hoisted_7 = {
+  key: 1,
+  class: "t-transp p-small d-inline-block t-medium"
+};
+const _hoisted_8 = { class: "flex gap-thin" };
+const _hoisted_9 = ["onClick"];
 const _sfc_main = {
   __name: "CardPosition",
   props: {
-    product: Object,
-    products: Array,
-    array: Array,
-    showPrice: {
+    image: {
+      type: String
+    },
+    name: {
+      type: String
+    },
+    title: {
+      type: String
+    },
+    title_class: {
+      type: Array
+    },
+    subtitle: {
+      type: String
+    },
+    showThumbnail: {
       type: Boolean,
       default: true
+    },
+    actions: {
+      type: Array,
+      default: () => []
+      // Expected format:
+      // [
+      //   {
+      //     component: IconEdit,
+      //     handler: (item, index) => {},
+      //     class: 'bg-light' // optional custom class
+      //   }
+      // ]
     }
   },
-  emits: [
-    "add",
-    "delete",
-    "update"
-  ],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emits = __emit;
-    const productSelected = vue.ref(null);
-    const productQuantity = vue.ref(1);
-    const productQuantityType = vue.ref("pcs");
-    const productPrice = vue.ref(0);
-    const isProductValid = vue.computed(
-      () => productSelected.value && productQuantity.value > 0 && productPrice.value >= 0
-    );
-    vue.watch(props.array, () => {
-      productSelected.value = props.product;
-      productQuantity.value = props.product.quantity || 1;
-      productPrice.value = props.product.price;
-      productQuantityType.value = props.product.type;
-    });
-    if (props.product) {
-      productSelected.value = props.product;
-      productQuantity.value = props.product.quantity || 1;
-      productPrice.value = props.product.price;
-      productQuantityType.value = props.product.type;
-    }
-    vue.watch([productSelected, productQuantity, productPrice, productQuantityType], () => {
-      emits("update", {
-        ...productSelected.value,
-        price: productPrice.value,
-        quantity: productQuantity.value || 1,
-        type: productQuantityType.value
-      });
-    });
-    function addProduct() {
-      emits("add", {
-        ...productSelected.value,
-        price: productPrice.value,
-        quantity: productQuantity.value || 1,
-        type: productQuantityType.value
-      });
-    }
-    function deleteProduct() {
-      emits("delete", {
-        ...productSelected.value,
-        price: productPrice.value,
-        quantity: productQuantity.value || 1,
-        type: productQuantityType.value
-      });
-    }
+  setup(__props) {
+    const { formatPrice } = mixins.useGlobalMixins();
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
-        vue.createElementVNode("div", _hoisted_2, [
-          vue.createElementVNode("div", _hoisted_3, vue.toDisplayString(productSelected.value.name || productSelected.value._id.name), 1),
-          !__props.showPrice ? (vue.openBlock(), vue.createBlock(Field.default, {
+        __props.showThumbnail ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+          __props.image && __props.image.length > 0 ? (vue.openBlock(), vue.createElementBlock("img", {
             key: 0,
-            field: productQuantity.value,
-            "onUpdate:field": _cache[1] || (_cache[1] = ($event) => productQuantity.value = $event),
-            type: "number",
-            label: "Qty",
-            class: "bg-white w-100 w-max-10r br-solid br-1px br-black-transp-5 pd-small radius-small"
-          }, {
-            default: vue.withCtx(() => [
-              vue.createVNode(Select.default, {
-                select: productQuantityType.value,
-                "onUpdate:select": _cache[0] || (_cache[0] = ($event) => productQuantityType.value = $event),
-                options: [
-                  "pcs",
-                  "g",
-                  "ml"
-                ],
-                class: "bg-light pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin"
-              }, null, 8, ["select"])
-            ]),
-            _: 1
-          }, 8, ["field"])) : vue.createCommentVNode("", true),
-          !__props.product ? (vue.openBlock(), vue.createElementBlock("button", {
+            src: (_ctx.FILE_SERVER_URL || "") + __props.image,
+            alt: "Item image",
+            class: "w-100 h-100 object-fit-cover"
+          }, null, 8, _hoisted_3)) : (vue.openBlock(), vue.createBlock(PlaceholderImage.default, {
             key: 1,
-            disabled: !isProductValid.value,
-            onClick: addProduct,
-            class: "bg-main aspect-1x1 radius-small pd-small"
-          }, [
-            vue.createVNode(vue.unref(IconAdd.default), { class: "i-semi" })
-          ], 8, _hoisted_4)) : vue.createCommentVNode("", true),
-          __props.product ? (vue.openBlock(), vue.createElementBlock("button", {
-            key: 2,
-            onClick: deleteProduct,
-            class: "bg-red aspect-1x1 radius-small pd-small"
-          }, [
-            vue.createVNode(vue.unref(IconDelete.default), { class: "i-semi" })
-          ])) : vue.createCommentVNode("", true)
+            class: "w-100 h-100"
+          }))
+        ])) : vue.createCommentVNode("", true),
+        vue.createElementVNode("div", _hoisted_4, [
+          vue.createElementVNode("p", _hoisted_5, vue.toDisplayString(__props.name || "Unnamed Product"), 1),
+          vue.createElementVNode("div", _hoisted_6, [
+            __props.title ? (vue.openBlock(), vue.createElementBlock("span", {
+              key: 0,
+              class: vue.normalizeClass([__props.title_class, "t-second d-inline-block t-demi"])
+            }, vue.toDisplayString(__props.title), 3)) : vue.createCommentVNode("", true),
+            __props.subtitle ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_7, vue.toDisplayString(__props.subtitle), 1)) : vue.createCommentVNode("", true)
+          ]),
+          vue.renderSlot(_ctx.$slots, "default")
         ]),
-        __props.showPrice ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
-          vue.createVNode(Field.default, {
-            field: productPrice.value,
-            "onUpdate:field": _cache[2] || (_cache[2] = ($event) => productPrice.value = $event),
-            type: "number",
-            label: "Price",
-            symbol: _ctx.returnCurrency(),
-            class: "bg-white w-100 br-solid br-1px br-black-transp-5 pd-small radius-small"
-          }, null, 8, ["field", "symbol"]),
-          vue.createVNode(Field.default, {
-            field: productQuantity.value,
-            "onUpdate:field": _cache[4] || (_cache[4] = ($event) => productQuantity.value = $event),
-            type: "number",
-            label: "Qty",
-            class: "bg-white w-100 br-solid br-1px br-black-transp-5 pd-small radius-small"
-          }, {
-            default: vue.withCtx(() => [
-              vue.createVNode(Select.default, {
-                select: productQuantityType.value,
-                "onUpdate:select": _cache[3] || (_cache[3] = ($event) => productQuantityType.value = $event),
-                options: [
-                  "pcs",
-                  "g",
-                  "ml"
-                ],
-                class: "bg-light pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin"
-              }, null, 8, ["select"])
-            ]),
-            _: 1
-          }, 8, ["field"])
-        ])) : vue.createCommentVNode("", true)
+        vue.createElementVNode("div", _hoisted_8, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.actions, (action, index) => {
+            return vue.openBlock(), vue.createElementBlock("div", {
+              key: index,
+              class: vue.normalizeClass([action.class || "bg-light", "radius-small pd-small flex-center flex aspect-1x1 cursor-pointer hover-scale-1"]),
+              onClick: () => action.handler(_ctx.item, index)
+            }, [
+              (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(action.component), { class: "i-regular" }))
+            ], 10, _hoisted_9);
+          }), 128)),
+          vue.renderSlot(_ctx.$slots, "actions")
+        ])
       ]);
     };
   }

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

@@ -1 +1 @@
-{"version":3,"file":"CardPosition.vue.cjs","sources":["../../../../../../../src/modules/products/components/blocks/CardPosition.vue"],"sourcesContent":["<template>\n\t<div class=\"gap-thin\">\n\t\t<div class=\"gap-thin mn-b-thin flex-nowrap flex\">\n\t\t\t<div\n\t\t\t\tclass=\"bg-white w-100 w-min-15r br-solid br-1px br-black-transp-5 pd-small radius-small\" \n\t\t\t>\n\t\t\t\t{{productSelected.name || productSelected._id.name}}\n\t\t\t</div>\n\t\t\t<!-- <SelectMulti\n\t\t\t\tv-model=\"productSelected\"\n\t\t\t\t:options=\"products\"\n\t\t\t\tlabel=\"name\"\n\t\t\t\t:multiple=\"false\"\n\t\t\t\t:taggable=\"false\"\n\t\t\t\tplaceholder=\"Select a product\"\n\t\t\t\tclass=\"bg-white w-100 w-min-15r br-solid br-1px br-black-transp-5 pd-small radius-small\" \n\t\t\t/> -->\n\t\t\t<Field \n\t\t\t\tv-if=\"!showPrice\"\n\t\t\t\tv-model:field=\"productQuantity\" \n\t\t\t\ttype=\"number\"  \n\t\t\t\tlabel=\"Qty\" \n\t\t\t\tclass=\"bg-white w-100 w-max-10r br-solid br-1px br-black-transp-5 pd-small radius-small\" \n\t\t\t>\n\t\t\t<Select \n\t\t\t\tv-model:select=\"productQuantityType\" \n\t\t\t\t:options=\"[\n\t\t\t\t\t'pcs',\n\t\t\t\t\t'g',\n\t\t\t\t\t'ml'\n\t\t\t\t]\"\n\t\t\t\tclass=\"bg-light pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin\"\n\t\t\t/>\n\n\t\t\t</Field>\n\t\t\t<button \n\t\t\t\tv-if=\"!product\"\n\t\t\t\t:disabled=\"!isProductValid\" \n\t\t\t\t@click=\"addProduct\" \n\t\t\t\tclass=\"bg-main aspect-1x1 radius-small pd-small\"\n\t\t\t>\n\t\t\t\t<IconAdd class=\"i-semi\"/>\n\t\t\t</button>\n\n\t\t\t<button \n\t\t\t\tv-if=\"product\"\n\t\t\t\t@click=\"deleteProduct\" \n\t\t\t\tclass=\"bg-red aspect-1x1 radius-small pd-small\"\n\t\t\t>\n\t\t\t\t<IconDelete class=\"i-semi\"/>\n\t\t\t</button>\n\t\t</div>\n\t\t<div v-if=\"showPrice\" class=\"gap-thin flex-nowrap flex\">\n\t\t\t<Field \n\t\t\t\tv-model:field=\"productPrice\"\n\t\t\t\ttype=\"number\"   \n\t\t\t\tlabel=\"Price\" \n\t\t\t\t:symbol=\"returnCurrency()\"\n\t\t\t\tclass=\"bg-white w-100 br-solid br-1px br-black-transp-5  pd-small radius-small\" \n\t\t\t/>\n\t\t\t<Field \n\t\t\t\tv-model:field=\"productQuantity\" \n\t\t\t\ttype=\"number\"  \n\t\t\t\tlabel=\"Qty\" \n\t\t\t\tclass=\"bg-white w-100 br-solid br-1px br-black-transp-5 pd-small radius-small\" \n\t\t\t>\n\t\t\t<Select \n\t\t\t\tv-model:select=\"productQuantityType\" \n\t\t\t\t:options=\"[\n\t\t\t\t\t'pcs',\n\t\t\t\t\t'g',\n\t\t\t\t\t'ml'\n\t\t\t\t]\"\n\t\t\t\tclass=\"bg-light pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin\"\n\t\t\t/>\n\n\t\t\t</Field>\n\t\t</div>\n\n\t\t\n\t\t\n\t</div>\n</template>\n\n<script setup>\n\timport { ref, computed, watch } from 'vue';\n\n\timport Field from '@martyrs/src/components/Field/Field.vue';\n  import Select from '@martyrs/src/components/Select/Select.vue';\n  import SelectMulti from '@martyrs/src/components/SelectMulti/SelectMulti.vue';\n\n  import { IconAdd, IconDelete} from '@martyrs/src/modules/icons/icons.client.js';\n\n\tconst props = defineProps({\n\t  product: Object,\n\t  products: Array,\n\t  array: Array,\n\t  showPrice: {\n\t  \ttype: Boolean,\n\t\t  default: true\n\t  }\n\t});\n\n\tconst emits = defineEmits([\n\t\t'add',\n\t\t'delete',\n\t\t'update'\n\t])\n\n\tconst productSelected = ref(null);\n\tconst productQuantity = ref(1);\n\tconst productQuantityType = ref('pcs');\n\tconst productPrice = ref(0);\n\n\tconst isProductValid = computed(() => \n    productSelected.value \n    && productQuantity.value > 0 \n    && productPrice.value >= 0\n\t);\n\n\twatch(props.array, () => {\n\t  productSelected.value = props.product\n\t\tproductQuantity.value = props.product.quantity || 1\n\t\tproductPrice.value = props.product.price\n\t\tproductQuantityType.value = props.product.type\n\t});\n\n\tif (props.product) {\n\t\tproductSelected.value = props.product\n\t\tproductQuantity.value = props.product.quantity || 1\n\t\tproductPrice.value = props.product.price\n\t\tproductQuantityType.value = props.product.type\n\t}\n\n\twatch([productSelected, productQuantity, productPrice, productQuantityType], () => {\n\t  emits('update', {\n\t    ...productSelected.value,\n\t    price: productPrice.value,\n\t    quantity: productQuantity.value || 1,\n\t    type: productQuantityType.value\n\t  });\n\t});\n\n\n\tfunction addProduct() {\n\t\temits('add', {\n\t\t\t...productSelected.value,\n\t\t\tprice: productPrice.value,\n\t\t\tquantity: productQuantity.value || 1,\n\t\t\ttype: productQuantityType.value\n\t  });\n\t}\n\n\tfunction deleteProduct() {\n\t  emits('delete', {\n\t\t\t...productSelected.value,\n\t\t\tprice: productPrice.value,\n\t\t\tquantity: productQuantity.value || 1,\n\t\t\ttype: productQuantityType.value\n\t  });\n\t}\n</script>"],"names":["ref","computed","watch"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6FC,UAAM,QAAQ;AAUd,UAAM,QAAQ;AAMd,UAAM,kBAAkBA,IAAG,IAAC,IAAI;AAChC,UAAM,kBAAkBA,IAAG,IAAC,CAAC;AAC7B,UAAM,sBAAsBA,IAAG,IAAC,KAAK;AACrC,UAAM,eAAeA,IAAG,IAAC,CAAC;AAE1B,UAAM,iBAAiBC,IAAAA;AAAAA,MAAS,MAC7B,gBAAgB,SACb,gBAAgB,QAAQ,KACxB,aAAa,SAAS;AAAA,IAC3B;AAEDC,cAAM,MAAM,OAAO,MAAM;AACvB,sBAAgB,QAAQ,MAAM;AAC/B,sBAAgB,QAAQ,MAAM,QAAQ,YAAY;AAClD,mBAAa,QAAQ,MAAM,QAAQ;AACnC,0BAAoB,QAAQ,MAAM,QAAQ;AAAA,IAC5C,CAAE;AAED,QAAI,MAAM,SAAS;AAClB,sBAAgB,QAAQ,MAAM;AAC9B,sBAAgB,QAAQ,MAAM,QAAQ,YAAY;AAClD,mBAAa,QAAQ,MAAM,QAAQ;AACnC,0BAAoB,QAAQ,MAAM,QAAQ;AAAA,IAC5C;AAECA,QAAK,MAAC,CAAC,iBAAiB,iBAAiB,cAAc,mBAAmB,GAAG,MAAM;AACjF,YAAM,UAAU;AAAA,QACd,GAAG,gBAAgB;AAAA,QACnB,OAAO,aAAa;AAAA,QACpB,UAAU,gBAAgB,SAAS;AAAA,QACnC,MAAM,oBAAoB;AAAA,MAC/B,CAAI;AAAA,IACJ,CAAE;AAGD,aAAS,aAAa;AACrB,YAAM,OAAO;AAAA,QACZ,GAAG,gBAAgB;AAAA,QACnB,OAAO,aAAa;AAAA,QACpB,UAAU,gBAAgB,SAAS;AAAA,QACnC,MAAM,oBAAoB;AAAA,MAC7B,CAAI;AAAA,IACJ;AAEC,aAAS,gBAAgB;AACvB,YAAM,UAAU;AAAA,QAChB,GAAG,gBAAgB;AAAA,QACnB,OAAO,aAAa;AAAA,QACpB,UAAU,gBAAgB,SAAS;AAAA,QACnC,MAAM,oBAAoB;AAAA,MAC7B,CAAI;AAAA,IACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"CardPosition.vue.cjs","sources":["../../../../../../../src/modules/products/components/blocks/CardPosition.vue"],"sourcesContent":["<template>\n  <div class=\"bg-white radius-small pd-small flex-nowrap flex-v-center flex gap-thin\">\n    <!-- Thumbnail image -->\n    <div v-if=\"showThumbnail\" class=\"aspect-1x1 h-3r flex-child-default radius-small o-hidden\">\n      <img\n        v-if=\"image && image.length > 0\"\n        :src=\"(FILE_SERVER_URL || '') + image\"\n        alt=\"Item image\"\n        class=\"w-100 h-100 object-fit-cover\"\n      />\n      <PlaceholderImage v-else class=\"w-100 h-100\" />\n    </div>\n    \n    <!-- Item details -->\n    <div class=\"mn-micro-negative flex flex-column w-100 o-hidden\">\n      <p class=\"w-100 pd-micro t-trim trimmed capitalize t-medium\">{{ name || 'Unnamed Product' }}</p>\n      \n      <div class=\"flex pd-micro flex-v-center gap-micro w-max \">\n      \t<span v-if=\"title\" :class=\"title_class\" class=\"t-second  d-inline-block t-demi\">{{title}}</span>\n      \t<span v-if=\"subtitle\" class=\"t-transp p-small d-inline-block t-medium\">{{ subtitle }}</span>\n      </div>\n    \t<slot></slot>\n    </div>\n    <!-- <p>\n     \n\n      <span class=\"p-small t-transp\">\n        <template v-if=\"product.quantity\">{{returnCurrency() }}{{product.price}} </template>\n        × \n        <template v-if=\"product.listing === 'rent' && rentDates.start && rentDates.end\">\n          {{ rentalDays }} days\n        </template>\n        \n        <template v-else>\n          {{ product.quantity || 0 }} {{ product.unit || 'pcs' }}\n        </template>\n      </span>\n    </p>  -->\n    \n    <!-- Actions -->\n    <div class=\"flex gap-thin\">\n      <template v-for=\"(action, index) in actions\" :key=\"index\">\n        <div \n          :class=\"action.class || 'bg-light'\"\n          class=\"radius-small pd-small flex-center flex aspect-1x1 cursor-pointer hover-scale-1\"\n          @click=\"() => action.handler(item, index)\"\n        >\n          <component\n            :is=\"action.component\"\n            class=\"i-regular\"\n          />\n        </div>\n      </template>\n      <slot name=\"actions\"></slot>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { defineProps } from 'vue';\nimport PlaceholderImage from '@martyrs/src/modules/icons/placeholders/PlaceholderImage.vue';\nimport { useGlobalMixins } from '@martyrs/src/modules/globals/views/mixins/mixins.js';\n\nconst { formatPrice } = useGlobalMixins();\n\nconst props = defineProps({\n\timage: {\n    type: String,\n  },\n  name: {\n    type: String,\n  },\n  title: {\n    type: String,\n  },\n  title_class: {\n  \ttype: Array\n  },\n  subtitle: {\n    type: String,\n  },\n  showThumbnail: {\n    type: Boolean,\n    default: true\n  },\n  actions: {\n    type: Array,\n    default: () => []\n    // Expected format:\n    // [\n    //   {\n    //     component: IconEdit,\n    //     handler: (item, index) => {},\n    //     class: 'bg-light' // optional custom class\n    //   }\n    // ]\n  }\n});\n</script>"],"names":["useGlobalMixins"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DA,UAAM,EAAE,YAAa,IAAGA,uBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -1,153 +1,94 @@
-import { ref, computed, watch, createElementBlock, openBlock, createElementVNode, createCommentVNode, createBlock, toDisplayString, withCtx, createVNode, unref } from "vue";
-import Field from "../../../../components/Field/Field.vue.js";
-import Select from "../../../../components/Select/Select.vue.js";
-/* empty css                                                  */
-/* empty css                                        */
-import _sfc_main$1 from "../../../icons/navigation/IconAdd.vue.js";
-import _sfc_main$2 from "../../../icons/navigation/IconDelete.vue.js";
-const _hoisted_1 = { class: "gap-thin" };
-const _hoisted_2 = { class: "gap-thin mn-b-thin flex-nowrap flex" };
-const _hoisted_3 = { class: "bg-white w-100 w-min-15r br-solid br-1px br-black-transp-5 pd-small radius-small" };
-const _hoisted_4 = ["disabled"];
-const _hoisted_5 = {
+import { createElementBlock, openBlock, createCommentVNode, createElementVNode, createBlock, renderSlot, toDisplayString, normalizeClass, Fragment, renderList, resolveDynamicComponent } from "vue";
+import PlaceholderImage from "../../../icons/placeholders/PlaceholderImage.vue.js";
+import { useGlobalMixins } from "../../../globals/views/mixins/mixins.js";
+const _hoisted_1 = { class: "bg-white radius-small pd-small flex-nowrap flex-v-center flex gap-thin" };
+const _hoisted_2 = {
   key: 0,
-  class: "gap-thin flex-nowrap flex"
+  class: "aspect-1x1 h-3r flex-child-default radius-small o-hidden"
 };
+const _hoisted_3 = ["src"];
+const _hoisted_4 = { class: "mn-micro-negative flex flex-column w-100 o-hidden" };
+const _hoisted_5 = { class: "w-100 pd-micro t-trim trimmed capitalize t-medium" };
+const _hoisted_6 = { class: "flex pd-micro flex-v-center gap-micro w-max" };
+const _hoisted_7 = {
+  key: 1,
+  class: "t-transp p-small d-inline-block t-medium"
+};
+const _hoisted_8 = { class: "flex gap-thin" };
+const _hoisted_9 = ["onClick"];
 const _sfc_main = {
   __name: "CardPosition",
   props: {
-    product: Object,
-    products: Array,
-    array: Array,
-    showPrice: {
+    image: {
+      type: String
+    },
+    name: {
+      type: String
+    },
+    title: {
+      type: String
+    },
+    title_class: {
+      type: Array
+    },
+    subtitle: {
+      type: String
+    },
+    showThumbnail: {
       type: Boolean,
       default: true
+    },
+    actions: {
+      type: Array,
+      default: () => []
+      // Expected format:
+      // [
+      //   {
+      //     component: IconEdit,
+      //     handler: (item, index) => {},
+      //     class: 'bg-light' // optional custom class
+      //   }
+      // ]
     }
   },
-  emits: [
-    "add",
-    "delete",
-    "update"
-  ],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const emits = __emit;
-    const productSelected = ref(null);
-    const productQuantity = ref(1);
-    const productQuantityType = ref("pcs");
-    const productPrice = ref(0);
-    const isProductValid = computed(
-      () => productSelected.value && productQuantity.value > 0 && productPrice.value >= 0
-    );
-    watch(props.array, () => {
-      productSelected.value = props.product;
-      productQuantity.value = props.product.quantity || 1;
-      productPrice.value = props.product.price;
-      productQuantityType.value = props.product.type;
-    });
-    if (props.product) {
-      productSelected.value = props.product;
-      productQuantity.value = props.product.quantity || 1;
-      productPrice.value = props.product.price;
-      productQuantityType.value = props.product.type;
-    }
-    watch([productSelected, productQuantity, productPrice, productQuantityType], () => {
-      emits("update", {
-        ...productSelected.value,
-        price: productPrice.value,
-        quantity: productQuantity.value || 1,
-        type: productQuantityType.value
-      });
-    });
-    function addProduct() {
-      emits("add", {
-        ...productSelected.value,
-        price: productPrice.value,
-        quantity: productQuantity.value || 1,
-        type: productQuantityType.value
-      });
-    }
-    function deleteProduct() {
-      emits("delete", {
-        ...productSelected.value,
-        price: productPrice.value,
-        quantity: productQuantity.value || 1,
-        type: productQuantityType.value
-      });
-    }
+  setup(__props) {
+    const { formatPrice } = useGlobalMixins();
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
-        createElementVNode("div", _hoisted_2, [
-          createElementVNode("div", _hoisted_3, toDisplayString(productSelected.value.name || productSelected.value._id.name), 1),
-          !__props.showPrice ? (openBlock(), createBlock(Field, {
+        __props.showThumbnail ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          __props.image && __props.image.length > 0 ? (openBlock(), createElementBlock("img", {
             key: 0,
-            field: productQuantity.value,
-            "onUpdate:field": _cache[1] || (_cache[1] = ($event) => productQuantity.value = $event),
-            type: "number",
-            label: "Qty",
-            class: "bg-white w-100 w-max-10r br-solid br-1px br-black-transp-5 pd-small radius-small"
-          }, {
-            default: withCtx(() => [
-              createVNode(Select, {
-                select: productQuantityType.value,
-                "onUpdate:select": _cache[0] || (_cache[0] = ($event) => productQuantityType.value = $event),
-                options: [
-                  "pcs",
-                  "g",
-                  "ml"
-                ],
-                class: "bg-light pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin"
-              }, null, 8, ["select"])
-            ]),
-            _: 1
-          }, 8, ["field"])) : createCommentVNode("", true),
-          !__props.product ? (openBlock(), createElementBlock("button", {
+            src: (_ctx.FILE_SERVER_URL || "") + __props.image,
+            alt: "Item image",
+            class: "w-100 h-100 object-fit-cover"
+          }, null, 8, _hoisted_3)) : (openBlock(), createBlock(PlaceholderImage, {
             key: 1,
-            disabled: !isProductValid.value,
-            onClick: addProduct,
-            class: "bg-main aspect-1x1 radius-small pd-small"
-          }, [
-            createVNode(unref(_sfc_main$1), { class: "i-semi" })
-          ], 8, _hoisted_4)) : createCommentVNode("", true),
-          __props.product ? (openBlock(), createElementBlock("button", {
-            key: 2,
-            onClick: deleteProduct,
-            class: "bg-red aspect-1x1 radius-small pd-small"
-          }, [
-            createVNode(unref(_sfc_main$2), { class: "i-semi" })
-          ])) : createCommentVNode("", true)
+            class: "w-100 h-100"
+          }))
+        ])) : createCommentVNode("", true),
+        createElementVNode("div", _hoisted_4, [
+          createElementVNode("p", _hoisted_5, toDisplayString(__props.name || "Unnamed Product"), 1),
+          createElementVNode("div", _hoisted_6, [
+            __props.title ? (openBlock(), createElementBlock("span", {
+              key: 0,
+              class: normalizeClass([__props.title_class, "t-second d-inline-block t-demi"])
+            }, toDisplayString(__props.title), 3)) : createCommentVNode("", true),
+            __props.subtitle ? (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(__props.subtitle), 1)) : createCommentVNode("", true)
+          ]),
+          renderSlot(_ctx.$slots, "default")
         ]),
-        __props.showPrice ? (openBlock(), createElementBlock("div", _hoisted_5, [
-          createVNode(Field, {
-            field: productPrice.value,
-            "onUpdate:field": _cache[2] || (_cache[2] = ($event) => productPrice.value = $event),
-            type: "number",
-            label: "Price",
-            symbol: _ctx.returnCurrency(),
-            class: "bg-white w-100 br-solid br-1px br-black-transp-5 pd-small radius-small"
-          }, null, 8, ["field", "symbol"]),
-          createVNode(Field, {
-            field: productQuantity.value,
-            "onUpdate:field": _cache[4] || (_cache[4] = ($event) => productQuantity.value = $event),
-            type: "number",
-            label: "Qty",
-            class: "bg-white w-100 br-solid br-1px br-black-transp-5 pd-small radius-small"
-          }, {
-            default: withCtx(() => [
-              createVNode(Select, {
-                select: productQuantityType.value,
-                "onUpdate:select": _cache[3] || (_cache[3] = ($event) => productQuantityType.value = $event),
-                options: [
-                  "pcs",
-                  "g",
-                  "ml"
-                ],
-                class: "bg-light pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin"
-              }, null, 8, ["select"])
-            ]),
-            _: 1
-          }, 8, ["field"])
-        ])) : createCommentVNode("", true)
+        createElementVNode("div", _hoisted_8, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.actions, (action, index) => {
+            return openBlock(), createElementBlock("div", {
+              key: index,
+              class: normalizeClass([action.class || "bg-light", "radius-small pd-small flex-center flex aspect-1x1 cursor-pointer hover-scale-1"]),
+              onClick: () => action.handler(_ctx.item, index)
+            }, [
+              (openBlock(), createBlock(resolveDynamicComponent(action.component), { class: "i-regular" }))
+            ], 10, _hoisted_9);
+          }), 128)),
+          renderSlot(_ctx.$slots, "actions")
+        ])
       ]);
     };
   }

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

@@ -1 +1 @@
-{"version":3,"file":"CardPosition.vue.js","sources":["../../../../../../../src/modules/products/components/blocks/CardPosition.vue"],"sourcesContent":["<template>\n\t<div class=\"gap-thin\">\n\t\t<div class=\"gap-thin mn-b-thin flex-nowrap flex\">\n\t\t\t<div\n\t\t\t\tclass=\"bg-white w-100 w-min-15r br-solid br-1px br-black-transp-5 pd-small radius-small\" \n\t\t\t>\n\t\t\t\t{{productSelected.name || productSelected._id.name}}\n\t\t\t</div>\n\t\t\t<!-- <SelectMulti\n\t\t\t\tv-model=\"productSelected\"\n\t\t\t\t:options=\"products\"\n\t\t\t\tlabel=\"name\"\n\t\t\t\t:multiple=\"false\"\n\t\t\t\t:taggable=\"false\"\n\t\t\t\tplaceholder=\"Select a product\"\n\t\t\t\tclass=\"bg-white w-100 w-min-15r br-solid br-1px br-black-transp-5 pd-small radius-small\" \n\t\t\t/> -->\n\t\t\t<Field \n\t\t\t\tv-if=\"!showPrice\"\n\t\t\t\tv-model:field=\"productQuantity\" \n\t\t\t\ttype=\"number\"  \n\t\t\t\tlabel=\"Qty\" \n\t\t\t\tclass=\"bg-white w-100 w-max-10r br-solid br-1px br-black-transp-5 pd-small radius-small\" \n\t\t\t>\n\t\t\t<Select \n\t\t\t\tv-model:select=\"productQuantityType\" \n\t\t\t\t:options=\"[\n\t\t\t\t\t'pcs',\n\t\t\t\t\t'g',\n\t\t\t\t\t'ml'\n\t\t\t\t]\"\n\t\t\t\tclass=\"bg-light pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin\"\n\t\t\t/>\n\n\t\t\t</Field>\n\t\t\t<button \n\t\t\t\tv-if=\"!product\"\n\t\t\t\t:disabled=\"!isProductValid\" \n\t\t\t\t@click=\"addProduct\" \n\t\t\t\tclass=\"bg-main aspect-1x1 radius-small pd-small\"\n\t\t\t>\n\t\t\t\t<IconAdd class=\"i-semi\"/>\n\t\t\t</button>\n\n\t\t\t<button \n\t\t\t\tv-if=\"product\"\n\t\t\t\t@click=\"deleteProduct\" \n\t\t\t\tclass=\"bg-red aspect-1x1 radius-small pd-small\"\n\t\t\t>\n\t\t\t\t<IconDelete class=\"i-semi\"/>\n\t\t\t</button>\n\t\t</div>\n\t\t<div v-if=\"showPrice\" class=\"gap-thin flex-nowrap flex\">\n\t\t\t<Field \n\t\t\t\tv-model:field=\"productPrice\"\n\t\t\t\ttype=\"number\"   \n\t\t\t\tlabel=\"Price\" \n\t\t\t\t:symbol=\"returnCurrency()\"\n\t\t\t\tclass=\"bg-white w-100 br-solid br-1px br-black-transp-5  pd-small radius-small\" \n\t\t\t/>\n\t\t\t<Field \n\t\t\t\tv-model:field=\"productQuantity\" \n\t\t\t\ttype=\"number\"  \n\t\t\t\tlabel=\"Qty\" \n\t\t\t\tclass=\"bg-white w-100 br-solid br-1px br-black-transp-5 pd-small radius-small\" \n\t\t\t>\n\t\t\t<Select \n\t\t\t\tv-model:select=\"productQuantityType\" \n\t\t\t\t:options=\"[\n\t\t\t\t\t'pcs',\n\t\t\t\t\t'g',\n\t\t\t\t\t'ml'\n\t\t\t\t]\"\n\t\t\t\tclass=\"bg-light pd-r-thin pd-l-thin pd-t-nano pd-b-nano radius-thin\"\n\t\t\t/>\n\n\t\t\t</Field>\n\t\t</div>\n\n\t\t\n\t\t\n\t</div>\n</template>\n\n<script setup>\n\timport { ref, computed, watch } from 'vue';\n\n\timport Field from '@martyrs/src/components/Field/Field.vue';\n  import Select from '@martyrs/src/components/Select/Select.vue';\n  import SelectMulti from '@martyrs/src/components/SelectMulti/SelectMulti.vue';\n\n  import { IconAdd, IconDelete} from '@martyrs/src/modules/icons/icons.client.js';\n\n\tconst props = defineProps({\n\t  product: Object,\n\t  products: Array,\n\t  array: Array,\n\t  showPrice: {\n\t  \ttype: Boolean,\n\t\t  default: true\n\t  }\n\t});\n\n\tconst emits = defineEmits([\n\t\t'add',\n\t\t'delete',\n\t\t'update'\n\t])\n\n\tconst productSelected = ref(null);\n\tconst productQuantity = ref(1);\n\tconst productQuantityType = ref('pcs');\n\tconst productPrice = ref(0);\n\n\tconst isProductValid = computed(() => \n    productSelected.value \n    && productQuantity.value > 0 \n    && productPrice.value >= 0\n\t);\n\n\twatch(props.array, () => {\n\t  productSelected.value = props.product\n\t\tproductQuantity.value = props.product.quantity || 1\n\t\tproductPrice.value = props.product.price\n\t\tproductQuantityType.value = props.product.type\n\t});\n\n\tif (props.product) {\n\t\tproductSelected.value = props.product\n\t\tproductQuantity.value = props.product.quantity || 1\n\t\tproductPrice.value = props.product.price\n\t\tproductQuantityType.value = props.product.type\n\t}\n\n\twatch([productSelected, productQuantity, productPrice, productQuantityType], () => {\n\t  emits('update', {\n\t    ...productSelected.value,\n\t    price: productPrice.value,\n\t    quantity: productQuantity.value || 1,\n\t    type: productQuantityType.value\n\t  });\n\t});\n\n\n\tfunction addProduct() {\n\t\temits('add', {\n\t\t\t...productSelected.value,\n\t\t\tprice: productPrice.value,\n\t\t\tquantity: productQuantity.value || 1,\n\t\t\ttype: productQuantityType.value\n\t  });\n\t}\n\n\tfunction deleteProduct() {\n\t  emits('delete', {\n\t\t\t...productSelected.value,\n\t\t\tprice: productPrice.value,\n\t\t\tquantity: productQuantity.value || 1,\n\t\t\ttype: productQuantityType.value\n\t  });\n\t}\n</script>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6FC,UAAM,QAAQ;AAUd,UAAM,QAAQ;AAMd,UAAM,kBAAkB,IAAI,IAAI;AAChC,UAAM,kBAAkB,IAAI,CAAC;AAC7B,UAAM,sBAAsB,IAAI,KAAK;AACrC,UAAM,eAAe,IAAI,CAAC;AAE1B,UAAM,iBAAiB;AAAA,MAAS,MAC7B,gBAAgB,SACb,gBAAgB,QAAQ,KACxB,aAAa,SAAS;AAAA,IAC3B;AAED,UAAM,MAAM,OAAO,MAAM;AACvB,sBAAgB,QAAQ,MAAM;AAC/B,sBAAgB,QAAQ,MAAM,QAAQ,YAAY;AAClD,mBAAa,QAAQ,MAAM,QAAQ;AACnC,0BAAoB,QAAQ,MAAM,QAAQ;AAAA,IAC5C,CAAE;AAED,QAAI,MAAM,SAAS;AAClB,sBAAgB,QAAQ,MAAM;AAC9B,sBAAgB,QAAQ,MAAM,QAAQ,YAAY;AAClD,mBAAa,QAAQ,MAAM,QAAQ;AACnC,0BAAoB,QAAQ,MAAM,QAAQ;AAAA,IAC5C;AAEC,UAAM,CAAC,iBAAiB,iBAAiB,cAAc,mBAAmB,GAAG,MAAM;AACjF,YAAM,UAAU;AAAA,QACd,GAAG,gBAAgB;AAAA,QACnB,OAAO,aAAa;AAAA,QACpB,UAAU,gBAAgB,SAAS;AAAA,QACnC,MAAM,oBAAoB;AAAA,MAC/B,CAAI;AAAA,IACJ,CAAE;AAGD,aAAS,aAAa;AACrB,YAAM,OAAO;AAAA,QACZ,GAAG,gBAAgB;AAAA,QACnB,OAAO,aAAa;AAAA,QACpB,UAAU,gBAAgB,SAAS;AAAA,QACnC,MAAM,oBAAoB;AAAA,MAC7B,CAAI;AAAA,IACJ;AAEC,aAAS,gBAAgB;AACvB,YAAM,UAAU;AAAA,QAChB,GAAG,gBAAgB;AAAA,QACnB,OAAO,aAAa;AAAA,QACpB,UAAU,gBAAgB,SAAS;AAAA,QACnC,MAAM,oBAAoB;AAAA,MAC7B,CAAI;AAAA,IACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"CardPosition.vue.js","sources":["../../../../../../../src/modules/products/components/blocks/CardPosition.vue"],"sourcesContent":["<template>\n  <div class=\"bg-white radius-small pd-small flex-nowrap flex-v-center flex gap-thin\">\n    <!-- Thumbnail image -->\n    <div v-if=\"showThumbnail\" class=\"aspect-1x1 h-3r flex-child-default radius-small o-hidden\">\n      <img\n        v-if=\"image && image.length > 0\"\n        :src=\"(FILE_SERVER_URL || '') + image\"\n        alt=\"Item image\"\n        class=\"w-100 h-100 object-fit-cover\"\n      />\n      <PlaceholderImage v-else class=\"w-100 h-100\" />\n    </div>\n    \n    <!-- Item details -->\n    <div class=\"mn-micro-negative flex flex-column w-100 o-hidden\">\n      <p class=\"w-100 pd-micro t-trim trimmed capitalize t-medium\">{{ name || 'Unnamed Product' }}</p>\n      \n      <div class=\"flex pd-micro flex-v-center gap-micro w-max \">\n      \t<span v-if=\"title\" :class=\"title_class\" class=\"t-second  d-inline-block t-demi\">{{title}}</span>\n      \t<span v-if=\"subtitle\" class=\"t-transp p-small d-inline-block t-medium\">{{ subtitle }}</span>\n      </div>\n    \t<slot></slot>\n    </div>\n    <!-- <p>\n     \n\n      <span class=\"p-small t-transp\">\n        <template v-if=\"product.quantity\">{{returnCurrency() }}{{product.price}} </template>\n        × \n        <template v-if=\"product.listing === 'rent' && rentDates.start && rentDates.end\">\n          {{ rentalDays }} days\n        </template>\n        \n        <template v-else>\n          {{ product.quantity || 0 }} {{ product.unit || 'pcs' }}\n        </template>\n      </span>\n    </p>  -->\n    \n    <!-- Actions -->\n    <div class=\"flex gap-thin\">\n      <template v-for=\"(action, index) in actions\" :key=\"index\">\n        <div \n          :class=\"action.class || 'bg-light'\"\n          class=\"radius-small pd-small flex-center flex aspect-1x1 cursor-pointer hover-scale-1\"\n          @click=\"() => action.handler(item, index)\"\n        >\n          <component\n            :is=\"action.component\"\n            class=\"i-regular\"\n          />\n        </div>\n      </template>\n      <slot name=\"actions\"></slot>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { defineProps } from 'vue';\nimport PlaceholderImage from '@martyrs/src/modules/icons/placeholders/PlaceholderImage.vue';\nimport { useGlobalMixins } from '@martyrs/src/modules/globals/views/mixins/mixins.js';\n\nconst { formatPrice } = useGlobalMixins();\n\nconst props = defineProps({\n\timage: {\n    type: String,\n  },\n  name: {\n    type: String,\n  },\n  title: {\n    type: String,\n  },\n  title_class: {\n  \ttype: Array\n  },\n  subtitle: {\n    type: String,\n  },\n  showThumbnail: {\n    type: Boolean,\n    default: true\n  },\n  actions: {\n    type: Array,\n    default: () => []\n    // Expected format:\n    // [\n    //   {\n    //     component: IconEdit,\n    //     handler: (item, index) => {},\n    //     class: 'bg-light' // optional custom class\n    //   }\n    // ]\n  }\n});\n</script>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DA,UAAM,EAAE,YAAa,IAAG,gBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -14,7 +14,7 @@ const _hoisted_3 = { class: "w-100 h-100 pos-relative" };
 const _hoisted_4 = ["src"];
 const _hoisted_5 = {
   key: 2,
-  class: "pos-absolute bg-white t-black pd-thin radius-big p-small t-medium pos-t-medium pos-l-medium"
+  class: "pos-absolute bg-white t-black pd-thin radius-medium p-small t-medium pos-t-medium pos-l-medium"
 };
 const _hoisted_6 = { class: "pd-small cols-1 t-left" };
 const _hoisted_7 = {
@@ -85,16 +85,16 @@ const _sfc_main = {
               class: "radius-medium h-100 w-100"
             })),
             __props.product.available <= 0 && __props.product.listing !== "rent" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5, "Out of Stock")) : vue.createCommentVNode("", true),
-            ((_a = __props.product.information) == null ? void 0 : _a.length) > 0 && ((_b = __props.product.information[1]) == null ? void 0 : _b.name) === "THC" ? (vue.openBlock(), vue.createBlock(THC.default, {
+            ((_a = __props.product.attributes) == null ? void 0 : _a.length) > 0 && ((_b = __props.product.attributes[1]) == null ? void 0 : _b.name) === "THC" ? (vue.openBlock(), vue.createBlock(THC.default, {
               key: 3,
               product: __props.product
             }, null, 8, ["product"])) : vue.createCommentVNode("", true)
           ])
         ]),
         vue.createElementVNode("div", _hoisted_6, [
-          __props.product.information.length > 0 ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_7, vue.toDisplayString(__props.product.information[0].value), 1)) : vue.createCommentVNode("", true),
+          __props.product.attributes.length > 0 ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_7, vue.toDisplayString(__props.product.attributes[0].value), 1)) : vue.createCommentVNode("", true),
           vue.createElementVNode("span", _hoisted_8, vue.toDisplayString(__props.product.name), 1),
-          __props.product.description && !__props.product.localization && __props.product.listing !== "rent" ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_9, vue.toDisplayString(__props.product.description.substring(0, 99)) + "... ", 1)) : vue.createCommentVNode("", true),
+          __props.product.description && !__props.product.translations && __props.product.listing !== "rent" ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_9, vue.toDisplayString(__props.product.description.substring(0, 99)) + "... ", 1)) : vue.createCommentVNode("", true),
           vue.createElementVNode("div", _hoisted_10, [
             vue.createVNode(Price.default, {
               product: __props.product,

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

@@ -1 +1 @@
-{"version":3,"file":"CardProduct.vue.cjs","sources":["../../../../../../../src/modules/products/components/blocks/CardProduct.vue"],"sourcesContent":["<template>\n\t<div \n\t\tclass=\"\n\t\t\tradius-medium \n\t\t\tcols-1\n\t\t\to-hidden\n\t\t\tpos-relative\n\t\t\"\n\t>\n\t\t<!-- Edit Button -->\n\t\t<router-link\n\t\t\tv-if=\"access\"\n      :to=\"organization ? { name: 'Organization_ProductEdit', params: { id: organization, product: product._id } } : { name: 'ProductEdit', params: { product: product._id } }\"\n      class=\"\n      \tz-index-2\n        cursor-pointer \n        pos-absolute pos-t-regular pos-r-regular\n        radius-extra pd-thin bg-second\n      \"\n    >\n      <IconEdit\n        class=\"i-regular\"\n        classes=\"fill-white\"\n      />\n    </router-link>\n\n\t\t<!-- Product Image Sqaure -->\n\t\t<div \n\t\t\tclass=\"o-hidden d-flex  pd-thin pd-b-zero radius-medium o-hidden w-100 pos-relative aspect-1x1\"\n\t\t>\n\t\t\t<div class=\"w-100  h-100 pos-relative\">\n\t\t\t\t<!-- Image Wrappers  -->\n\t\t\t\t<img loading=\"lazy\" \n\t\t\t\t\tv-if=\"product.images[0]\" \n\t\t\t\t\t:src=\"(FILE_SERVER_URL || '') + product.images[0].split('/').slice(0, -1).join('/') + '/thumbnail_' + product.images[0].split('/').pop()\"\n\t\t\t\t\tclass=\"pos-absolute object-fit-cover radius-small h-max-100 h-100  w-100\"\n\t\t\t\t>\n\n\t\t\t\t<PlaceholderImage\n\t\t\t\t\tv-else\n\t\t\t\t\tclass=\"radius-medium h-100 w-100\"\n\t\t\t\t/>\n\t\t\t\t<span v-if=\"product.available <= 0 && product.listing !== 'rent'\" class=\"pos-absolute bg-white t-black pd-thin radius-big p-small t-medium pos-t-medium pos-l-medium\">Out of Stock</span>\n\t\t\t\t<THC v-if=\"product.information?.length > 0 && product.information[1]?.name === 'THC'\" :product=\"product\" />\n\t\t\t</div>\n\t\t</div>\n\n\t\t<!-- Product Info Start -->\n\t\t<div  class=\"pd-small cols-1 t-left\">\n\t\t\t<!-- Detail -->\n\t\t\t<p \n\t\t\t\tv-if=\"product.information.length > 0\"  \n\t\t\t\tclass=\"t-semi t-transp p-small mn-b-micro\"\n\t\t\t>\n\t\t\t\t{{product.information[0].value}}\n\t\t\t</p>\n\t\t\t<!-- Name -->\n\t\t\t<span style=\" hyphens: auto;\" class=\"word-break t-truncate p-medium mn-b-thin w-100 w-max-100 \">\n\t\t\t\t{{product.name}}\n\t\t\t</span>\n\n\t\t\t<p \n\t\t\t\tv-if=\"product.description && !product.localization && product.listing !== 'rent'\" \n\t\t\t\tclass=\"mn-b-small t-transp p-small\"\n\t\t\t>\n\t\t\t\t{{product.description.substring(0, 99)}}...\n\t\t\t</p>\n\n\t\t\t<div class=\"flex-v-center flex-nowrap flex\">\n\t\t\t\t<Price \n\t\t\t\t\t:product=\"product\" \n\t\t\t\t\tsize=\"small\" \n\t\t\t\t\tclass=\"bg-white h-100 p-medium flex flex-center pd-r-small pd-l-small radius-small mn-r-auto\" \n\t\t\t\t/>\n\t\t\t\t\n\t\t\t\t<button\n\t\t\t\t\tv-if=\"user\"\n\t\t      class=\"\n\t\t        cursor-pointer \n\t\t        radius-extra pd-thin bg-main\n\t\t      \"\n\t\t    >\n\t\t      <IconShopcartAdd\n\t\t\t\t\t\tclass=\"icon-button-main i-medium\"\n\t\t\t\t\t/>\n\t\t    </button>\n\t\t  </div>\n\t\t</div>\n\n\t</div>\n\n</template>\n\n\n<script setup=\"props\">\n\timport {computed } from 'vue'\n\timport { useI18n }    from 'vue-i18n'\n\n\timport IconEdit from '@martyrs/src/modules/icons/navigation/IconEdit.vue'\n\timport IconShopcartAdd from '@martyrs/src/modules/icons/actions/IconShopcartAdd.vue'\n\n\timport THC from '@martyrs/src/modules/products/components/elements/THC.vue'\n\timport Price from '@martyrs/src/modules/products/components/elements/Price.vue'\n\n\timport PlaceholderImage from '@martyrs/src/modules/icons/placeholders/PlaceholderImage.vue'\n\n\tconst props = defineProps({\n\t\tproduct: {\n\t\t\ttype: Object\n\t\t},\n\t\taccess: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false\n\t\t},\n\t\torganization: {\n\t\t\ttype: String\n\t\t},\n\t\tuser: {\n\t\t\ttype: [Object, String] \n\t\t},\n\t\ttype: {\n\t\t\ttype: Object\n\t\t}\n\t})\n\n  const { t } = useI18n()\n</script>\n\n<style lang=\"scss\">\n.word-break {\n  width: 100%; \n  overflow: auto;\n  overflow-wrap: break-word;\n  word-break: break-all;\n  white-space: -moz-pre-wrap;\n  white-space: -hp-pre-wrap;\n  white-space: -o-pre-wrap;\n  white-space: -pre-wrap; \n  white-space: pre-wrap; \n  white-space: pre-line; \n  word-wrap: break-word;\n}\n</style>\n\n\n"],"names":["useI18n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6HE,UAAM,EAAE,EAAC,IAAKA,QAAO,QAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"CardProduct.vue.cjs","sources":["../../../../../../../src/modules/products/components/blocks/CardProduct.vue"],"sourcesContent":["<template>\n\t<div \n\t\tclass=\"\n\t\t\tradius-medium \n\t\t\tcols-1\n\t\t\to-hidden\n\t\t\tpos-relative\n\t\t\"\n\t>\n\t\t<!-- Edit Button -->\n\t\t<router-link\n\t\t\tv-if=\"access\"\n      :to=\"organization ? { name: 'Organization_ProductEdit', params: { id: organization, product: product._id } } : { name: 'ProductEdit', params: { product: product._id } }\"\n      class=\"\n      \tz-index-2\n        cursor-pointer \n        pos-absolute pos-t-regular pos-r-regular\n        radius-extra pd-thin bg-second\n      \"\n    >\n      <IconEdit\n        class=\"i-regular\"\n        classes=\"fill-white\"\n      />\n    </router-link>\n\n\t\t<!-- Product Image Sqaure -->\n\t\t<div \n\t\t\tclass=\"o-hidden d-flex  pd-thin pd-b-zero radius-medium o-hidden w-100 pos-relative aspect-1x1\"\n\t\t>\n\t\t\t<div class=\"w-100  h-100 pos-relative\">\n\t\t\t\t<!-- Image Wrappers  -->\n\t\t\t\t<img loading=\"lazy\" \n\t\t\t\t\tv-if=\"product.images[0]\" \n\t\t\t\t\t:src=\"(FILE_SERVER_URL || '') + product.images[0].split('/').slice(0, -1).join('/') + '/thumbnail_' + product.images[0].split('/').pop()\"\n\t\t\t\t\tclass=\"pos-absolute object-fit-cover radius-small h-max-100 h-100  w-100\"\n\t\t\t\t>\n\n\t\t\t\t<PlaceholderImage\n\t\t\t\t\tv-else\n\t\t\t\t\tclass=\"radius-medium h-100 w-100\"\n\t\t\t\t/>\n\t\t\t\t<span v-if=\"product.available <= 0 && product.listing !== 'rent'\" class=\"pos-absolute bg-white t-black pd-thin radius-medium p-small t-medium pos-t-medium pos-l-medium\">Out of Stock</span>\n\t\t\t\t<THC v-if=\"product.attributes?.length > 0 && product.attributes[1]?.name === 'THC'\" :product=\"product\" />\n\t\t\t</div>\n\t\t</div>\n\n\t\t<!-- Product Info Start -->\n\t\t<div  class=\"pd-small cols-1 t-left\">\n\t\t\t<!-- Detail -->\n\t\t\t<p \n\t\t\t\tv-if=\"product.attributes.length > 0\"  \n\t\t\t\tclass=\"t-semi t-transp p-small mn-b-micro\"\n\t\t\t>\n\t\t\t\t{{product.attributes[0].value}}\n\t\t\t</p>\n\t\t\t<!-- Name -->\n\t\t\t<span style=\" hyphens: auto;\" class=\"word-break t-truncate p-medium mn-b-thin w-100 w-max-100 \">\n\t\t\t\t{{product.name}}\n\t\t\t</span>\n\n\t\t\t<p \n\t\t\t\tv-if=\"product.description && !product.translations && product.listing !== 'rent'\" \n\t\t\t\tclass=\"mn-b-small t-transp p-small\"\n\t\t\t>\n\t\t\t\t{{product.description.substring(0, 99)}}...\n\t\t\t</p>\n\n\t\t\t<div class=\"flex-v-center flex-nowrap flex\">\n\t\t\t\t<Price \n\t\t\t\t\t:product=\"product\" \n\t\t\t\t\tsize=\"small\" \n\t\t\t\t\tclass=\"bg-white h-100 p-medium flex flex-center pd-r-small pd-l-small radius-small mn-r-auto\" \n\t\t\t\t/>\n\t\t\t\t\n\t\t\t\t<button\n\t\t\t\t\tv-if=\"user\"\n\t\t      class=\"\n\t\t        cursor-pointer \n\t\t        radius-extra pd-thin bg-main\n\t\t      \"\n\t\t    >\n\t\t      <IconShopcartAdd\n\t\t\t\t\t\tclass=\"icon-button-main i-medium\"\n\t\t\t\t\t/>\n\t\t    </button>\n\t\t  </div>\n\t\t</div>\n\n\t</div>\n\n</template>\n\n\n<script setup=\"props\">\n\timport {computed } from 'vue'\n\timport { useI18n }    from 'vue-i18n'\n\n\timport IconEdit from '@martyrs/src/modules/icons/navigation/IconEdit.vue'\n\timport IconShopcartAdd from '@martyrs/src/modules/icons/actions/IconShopcartAdd.vue'\n\n\timport THC from '@martyrs/src/modules/products/components/elements/THC.vue'\n\timport Price from '@martyrs/src/modules/products/components/elements/Price.vue'\n\n\timport PlaceholderImage from '@martyrs/src/modules/icons/placeholders/PlaceholderImage.vue'\n\n\tconst props = defineProps({\n\t\tproduct: {\n\t\t\ttype: Object\n\t\t},\n\t\taccess: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false\n\t\t},\n\t\torganization: {\n\t\t\ttype: String\n\t\t},\n\t\tuser: {\n\t\t\ttype: [Object, String] \n\t\t},\n\t\ttype: {\n\t\t\ttype: Object\n\t\t}\n\t})\n\n  const { t } = useI18n()\n</script>\n\n<style lang=\"scss\">\n.word-break {\n  width: 100%; \n  overflow: auto;\n  overflow-wrap: break-word;\n  word-break: break-all;\n  white-space: -moz-pre-wrap;\n  white-space: -hp-pre-wrap;\n  white-space: -o-pre-wrap;\n  white-space: -pre-wrap; \n  white-space: pre-wrap; \n  white-space: pre-line; \n  word-wrap: break-word;\n}\n</style>\n\n\n"],"names":["useI18n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6HE,UAAM,EAAE,EAAC,IAAKA,QAAO,QAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}