@ozdao/martyrs 0.2.487 → 0.2.489

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

@@ -6,13 +6,14 @@ const globals = require("../../../globals/views/store/globals.cjs");
 const auth = require("../../../auth/views/store/auth.cjs");
 const categories = require("../../store/categories.cjs");
 ;/* empty css                                         */
-;/* empty css                                          */
+;/* empty css                                         */
 const Block = require("../../../../components/Block/Block.vue.cjs");
 const Feed = require("../../../../components/Feed/Feed.vue.cjs");
 const Tree = require("../../../../components/Tree/Tree.vue.cjs");
 const CardCategory = require("../blocks/CardCategory.vue.cjs");
 const IconPlus = require("../../../icons/navigation/IconPlus.vue.cjs");
 const _hoisted_1 = { class: "pd-thin bg-white" };
+const _hoisted_2 = { class: "rows-1" };
 const _sfc_main = {
   __name: "Categories",
   setup(__props) {
@@ -104,50 +105,52 @@ const _sfc_main = {
           ]),
           _: 1
         })) : vue.createCommentVNode("", true),
-        vue.createVNode(Feed.default, {
-          search: true,
-          showLoadMore: false,
-          states: {
-            empty: {
-              title: "No Products Found",
-              description: "Currently, there are no products available."
-            }
-          },
-          store: {
-            read: (options) => categories.actions.read(options),
-            state: categories.state
-          },
-          options: {
-            user: auth.state.user._id,
-            rootOnly: true,
-            excludeChildren: false
-          },
-          sort: vue.unref(sort),
-          "onUpdate:sort": _cache[0] || (_cache[0] = ($event) => vue.isRef(sort) ? sort.value = $event : sort = $event),
-          items: categories.state.all,
-          "onUpdate:items": _cache[1] || (_cache[1] = ($event) => categories.state.all = $event),
-          class: "cols-1 pos-relative w-100 rows-1 gap-thin"
-        }, {
-          default: vue.withCtx(({
-            items
-          }) => [
-            items ? (vue.openBlock(), vue.createBlock(Tree.default, {
-              key: 0,
-              items: categories.state.all,
-              state: categories.state.all,
-              onUpdate: updateCategoriesOrder
-            }, {
-              default: vue.withCtx(({ item }) => [
-                vue.createVNode(CardCategory.default, {
-                  category: item,
-                  onDelete: deleteCategory
-                }, null, 8, ["category"])
-              ]),
-              _: 1
-            }, 8, ["items", "state"])) : vue.createCommentVNode("", true)
-          ]),
-          _: 1
-        }, 8, ["store", "options", "sort", "items"])
+        vue.createElementVNode("div", _hoisted_2, [
+          vue.createVNode(Feed.default, {
+            search: true,
+            showLoadMore: false,
+            states: {
+              empty: {
+                title: "No Products Found",
+                description: "Currently, there are no products available."
+              }
+            },
+            store: {
+              read: (options) => categories.actions.read(options),
+              state: categories.state
+            },
+            options: {
+              user: auth.state.user._id,
+              rootOnly: true,
+              excludeChildren: false
+            },
+            sort: vue.unref(sort),
+            "onUpdate:sort": _cache[0] || (_cache[0] = ($event) => vue.isRef(sort) ? sort.value = $event : sort = $event),
+            items: categories.state.all,
+            "onUpdate:items": _cache[1] || (_cache[1] = ($event) => categories.state.all = $event),
+            class: "rows-1 gap-thin"
+          }, {
+            default: vue.withCtx(({
+              items
+            }) => [
+              items ? (vue.openBlock(), vue.createBlock(Tree.default, {
+                key: 0,
+                items: categories.state.all,
+                state: categories.state.all,
+                onUpdate: updateCategoriesOrder
+              }, {
+                default: vue.withCtx(({ item }) => [
+                  vue.createVNode(CardCategory.default, {
+                    category: item,
+                    onDelete: deleteCategory
+                  }, null, 8, ["category"])
+                ]),
+                _: 1
+              }, 8, ["items", "state"])) : vue.createCommentVNode("", true)
+            ]),
+            _: 1
+          }, 8, ["store", "options", "sort", "items"])
+        ])
       ]);
     };
   }

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

@@ -1 +1 @@
-{"version":3,"file":"Categories.vue.cjs","sources":["../../../../../../../src/modules/products/components/pages/Categories.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin bg-white\">\n    <Block v-if=\"!MOBILE_APP\" \n      class=\"radius-medium mn-b-thin mobile:flex-wrap flex-nowrap flex-v-center flex\"\n    >\n      <h2 class=\"mn-r-auto\">\n        Categories\n      </h2>\n\n      <router-link \n        :to=\"{\n          name: 'Category Add', \n          params: { \n            _id: $route.params._id\n          } \n        }\"\n        class=\"uppercase t-medium pd-small radius-medium bg-white nav-link\"\n      >\n        Add New\n      </router-link>\n    </Block>\n\n     <Feed\n        :search=\"true\"\n        :showLoadMore=\"false\"\n        :states=\"{\n          empty: {\n            title: 'No Products Found',\n            description: 'Currently, there are no products available.'\n          }\n        }\"\n        :store=\"{\n          read: (options) => categories.actions.read(options),\n          state: categories.state\n        }\"\n        :options=\"{\n          user: auth.state.user._id,\n          rootOnly: true,\n          excludeChildren: false\n        }\"\n        v-model:sort=\"sort\"\n        v-model:items=\"categories.state.all\"\n        v-slot=\"{ \n          items \n        }\"\n        class=\"cols-1 pos-relative w-100 rows-1 gap-thin\"\n      >\n        <Tree \n          v-if=\"items\" \n          :items=\"categories.state.all\" \n          :state=\"categories.state.all\" \n          @update=\"updateCategoriesOrder\" \n          v-slot=\"{ item }\"\n        >\n          <CardCategory \n            :category=\"item\" \n            @delete=\"deleteCategory\" \n          />\n        </Tree>\n      </Feed>\n  </div>\n</template>\n\n<script setup>\n  import { onMounted, onUnmounted, computed, ref,reactive } from 'vue';\n  import { useRoute, useRouter } from 'vue-router';\n\n  import * as globals from '@martyrs/src/modules/globals/views/store/globals.js';\n  import * as auth from '@martyrs/src/modules/auth/views/store/auth.js'; \n  import * as categories from '@martyrs/src/modules/products/store/categories.js'; \n\n  const route = useRoute();\n  const router = useRouter();\n\n  import Button from \"@martyrs/src/components/Button/Button.vue\";\n  import Block from '@martyrs/src/components/Block/Block.vue';\n  import Feed from '@martyrs/src/components/Feed/Feed.vue'\n  import Tree from \"@martyrs/src/components/Tree/Tree.vue\";\n  \n  import CardCategory from '@martyrs/src/modules/products/components/blocks/CardCategory.vue';\n\n  import IconPlus from '@martyrs/src/modules/icons/navigation/IconPlus.vue'\n\n  let search = ref(null)\n\n  let sort = reactive({\n    param: 'order',\n    order: 'asc',\n    options: [{\n      label: 'Order',\n      value: 'order'\n    },{\n      label: 'Name',\n      value: 'name'\n    },{\n      label: 'Date',\n      value: 'createdAt'\n    }]\n  })\n\n  globals.state.navigation_bar.actions = [{\n    component: IconPlus,\n    props: {\n      fill: \"rgb(var(--main))\" \n    },\n    condition: () => auth.state.user && auth.state.user._id,\n    action: () => route.params._id ? router.push({ name: 'Category Add', params: { _id: route.params._id} }) : router.push({ name: 'Category Add' })\n  }],\n\n  onUnmounted(() => {\n    globals.state.navigation_bar.actions = [];\n  });\n\n  onMounted(async () => {\n    \n  });\n\n  // Функция для преобразования иерархического дерева категорий в плоский массив\n  function flattenCategoryTree(categories) {\n    let flatCategories = [];\n    \n    function flatten(category) {\n      const { children, ...categoryWithoutChildren } = category;\n      flatCategories.push(categoryWithoutChildren);\n      \n      if (children && Array.isArray(children)) {\n        children.forEach(child => flatten(child));\n      }\n    }\n    \n    categories.forEach(category => flatten(category));\n    return flatCategories;\n  }\n\n\n  // Функция для обновления порядка категорий\n  async function updateCategoriesOrder(updatedCategories) {\n    alert('helo')\n    try {\n      // Преобразуем категории в плоский массив\n      const flattenedCategories = flattenCategoryTree(categories.state.all);\n      \n      console.log(flattenedCategories)\n      console.log( categories.state.all)\n      await categories.actions.updateOrder(flattenedCategories);\n        \n      console.log('Categories order updated successfully');\n    } catch (error) {\n      console.error('Error updating categories order:', error);\n      throw error;\n    }\n  }\n\n  async function deleteCategory(category) {\n    // Запрашиваем подтверждение у пользователя\n    const isConfirmed = confirm(`Are you sure you want to delete the category \"${category.name}\"?`);\n    \n    // Если пользователь подтвердил удаление, продолжаем процесс\n    if (isConfirmed) {\n      await categories.actions.delete(category.url);\n    } else {\n      alert('Category deletion cancelled'); \n    }\n  }\n</script>\n\n<style lang=\"scss\">\n</style>"],"names":["useRoute","useRouter","ref","reactive","globals.state","IconPlus","auth.state","onUnmounted","onMounted","categories","categories.state","categories.actions"],"mappings":";;;;;;;;;;;;;;;;;;AAuEE,UAAM,QAAQA,UAAAA,SAAU;AACxB,UAAM,SAASC,UAAAA,UAAW;AAWbC,QAAAA,IAAI,IAAI;AAErB,QAAI,OAAOC,IAAAA,SAAS;AAAA,MAClB,OAAO;AAAA,MACP,OAAO;AAAA,MACP,SAAS,CAAC;AAAA,QACR,OAAO;AAAA,QACP,OAAO;AAAA,MACb,GAAM;AAAA,QACA,OAAO;AAAA,QACP,OAAO;AAAA,MACb,GAAM;AAAA,QACA,OAAO;AAAA,QACP,OAAO;AAAA,MACR,CAAA;AAAA,IACF,CAAA;AAEDC,kBAAc,eAAe,UAAU,CAAC;AAAA,MACtC,WAAWC,SAAQ;AAAA,MACnB,OAAO;AAAA,QACL,MAAM;AAAA,MACP;AAAA,MACD,WAAW,MAAMC,KAAU,MAAC,QAAQA,KAAU,MAAC,KAAK;AAAA,MACpD,QAAQ,MAAM,MAAM,OAAO,MAAM,OAAO,KAAK,EAAE,MAAM,gBAAgB,QAAQ,EAAE,KAAK,MAAM,OAAO,IAAG,EAAG,CAAA,IAAI,OAAO,KAAK,EAAE,MAAM,eAAgB,CAAA;AAAA,IACnJ,CAAG,GAEDC,IAAAA,YAAY,MAAM;AAChBH,oBAAc,eAAe,UAAU,CAAE;AAAA,IAC7C,CAAG;AAEDI,QAAAA,UAAU,YAAY;AAAA,IAExB,CAAG;AAGD,aAAS,oBAAoBC,aAAY;AACvC,UAAI,iBAAiB,CAAE;AAEvB,eAAS,QAAQ,UAAU;AACzB,cAAM,EAAE,UAAU,GAAG,wBAAuB,IAAK;AACjD,uBAAe,KAAK,uBAAuB;AAE3C,YAAI,YAAY,MAAM,QAAQ,QAAQ,GAAG;AACvC,mBAAS,QAAQ,WAAS,QAAQ,KAAK,CAAC;AAAA,QAChD;AAAA,MACA;AAEI,MAAAA,YAAW,QAAQ,cAAY,QAAQ,QAAQ,CAAC;AAChD,aAAO;AAAA,IACX;AAIE,mBAAe,sBAAsB,mBAAmB;AACtD,YAAM,MAAM;AACZ,UAAI;AAEF,cAAM,sBAAsB,oBAAoBC,WAAgB,MAAC,GAAG;AAEpE,gBAAQ,IAAI,mBAAmB;AAC/B,gBAAQ,IAAKA,WAAAA,MAAiB,GAAG;AACjC,cAAMC,WAAkB,QAAC,YAAY,mBAAmB;AAExD,gBAAQ,IAAI,uCAAuC;AAAA,MACpD,SAAQ,OAAO;AACd,gBAAQ,MAAM,oCAAoC,KAAK;AACvD,cAAM;AAAA,MACZ;AAAA,IACA;AAEE,mBAAe,eAAe,UAAU;AAEtC,YAAM,cAAc,QAAQ,iDAAiD,SAAS,IAAI,IAAI;AAG9F,UAAI,aAAa;AACf,cAAMA,mBAAmB,OAAO,SAAS,GAAG;AAAA,MAClD,OAAW;AACL,cAAM,6BAA6B;AAAA,MACzC;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Categories.vue.cjs","sources":["../../../../../../../src/modules/products/components/pages/Categories.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin bg-white\">\n    <Block v-if=\"!MOBILE_APP\" \n      class=\"radius-medium mn-b-thin mobile:flex-wrap flex-nowrap flex-v-center flex\"\n    >\n      <h2 class=\"mn-r-auto\">\n        Categories\n      </h2>\n\n      <router-link \n        :to=\"{\n          name: 'Category Add', \n          params: { \n            _id: $route.params._id\n          } \n        }\"\n        class=\"uppercase t-medium pd-small radius-medium bg-white nav-link\"\n      >\n        Add New\n      </router-link>\n    </Block>\n\n    <div class=\"rows-1\">\n      <Feed\n        :search=\"true\"\n        :showLoadMore=\"false\"\n        :states=\"{\n          empty: {\n            title: 'No Products Found',\n            description: 'Currently, there are no products available.'\n          }\n        }\"\n        :store=\"{\n          read: (options) => categories.actions.read(options),\n          state: categories.state\n        }\"\n        :options=\"{\n          user: auth.state.user._id,\n          rootOnly: true,\n          excludeChildren: false\n        }\"\n        v-model:sort=\"sort\"\n        v-model:items=\"categories.state.all\"\n        v-slot=\"{ \n          items \n        }\"\n        class=\"rows-1 gap-thin\"\n      >\n        <Tree \n          v-if=\"items\" \n          :items=\"categories.state.all\" \n          :state=\"categories.state.all\" \n          @update=\"updateCategoriesOrder\" \n          v-slot=\"{ item }\"\n        >\n          <CardCategory \n            :category=\"item\" \n            @delete=\"deleteCategory\" \n          />\n        </Tree>\n      </Feed>\n    </div>\n  </div>\n</template>\n\n<script setup>\n  import { onMounted, onUnmounted, computed, ref,reactive } from 'vue';\n  import { useRoute, useRouter } from 'vue-router';\n\n  import * as globals from '@martyrs/src/modules/globals/views/store/globals.js';\n  import * as auth from '@martyrs/src/modules/auth/views/store/auth.js'; \n  import * as categories from '@martyrs/src/modules/products/store/categories.js'; \n\n  const route = useRoute();\n  const router = useRouter();\n\n  import Button from \"@martyrs/src/components/Button/Button.vue\";\n  import Block from '@martyrs/src/components/Block/Block.vue';\n  import Feed from '@martyrs/src/components/Feed/Feed.vue'\n  import Tree from \"@martyrs/src/components/Tree/Tree.vue\";\n  \n  import CardCategory from '@martyrs/src/modules/products/components/blocks/CardCategory.vue';\n\n  import IconPlus from '@martyrs/src/modules/icons/navigation/IconPlus.vue'\n\n  let search = ref(null)\n\n  let sort = reactive({\n    param: 'order',\n    order: 'asc',\n    options: [{\n      label: 'Order',\n      value: 'order'\n    },{\n      label: 'Name',\n      value: 'name'\n    },{\n      label: 'Date',\n      value: 'createdAt'\n    }]\n  })\n\n  globals.state.navigation_bar.actions = [{\n    component: IconPlus,\n    props: {\n      fill: \"rgb(var(--main))\" \n    },\n    condition: () => auth.state.user && auth.state.user._id,\n    action: () => route.params._id ? router.push({ name: 'Category Add', params: { _id: route.params._id} }) : router.push({ name: 'Category Add' })\n  }],\n\n  onUnmounted(() => {\n    globals.state.navigation_bar.actions = [];\n  });\n\n  onMounted(async () => {\n    \n  });\n\n  // Функция для преобразования иерархического дерева категорий в плоский массив\n  function flattenCategoryTree(categories) {\n    let flatCategories = [];\n    \n    function flatten(category) {\n      const { children, ...categoryWithoutChildren } = category;\n      flatCategories.push(categoryWithoutChildren);\n      \n      if (children && Array.isArray(children)) {\n        children.forEach(child => flatten(child));\n      }\n    }\n    \n    categories.forEach(category => flatten(category));\n    return flatCategories;\n  }\n\n\n  // Функция для обновления порядка категорий\n  async function updateCategoriesOrder(updatedCategories) {\n    alert('helo')\n    try {\n      // Преобразуем категории в плоский массив\n      const flattenedCategories = flattenCategoryTree(categories.state.all);\n      \n      console.log(flattenedCategories)\n      console.log( categories.state.all)\n      await categories.actions.updateOrder(flattenedCategories);\n        \n      console.log('Categories order updated successfully');\n    } catch (error) {\n      console.error('Error updating categories order:', error);\n      throw error;\n    }\n  }\n\n  async function deleteCategory(category) {\n    // Запрашиваем подтверждение у пользователя\n    const isConfirmed = confirm(`Are you sure you want to delete the category \"${category.name}\"?`);\n    \n    // Если пользователь подтвердил удаление, продолжаем процесс\n    if (isConfirmed) {\n      await categories.actions.delete(category.url);\n    } else {\n      alert('Category deletion cancelled'); \n    }\n  }\n</script>\n\n<style lang=\"scss\">\n</style>"],"names":["useRoute","useRouter","ref","reactive","globals.state","IconPlus","auth.state","onUnmounted","onMounted","categories","categories.state","categories.actions"],"mappings":";;;;;;;;;;;;;;;;;;;AAyEE,UAAM,QAAQA,UAAAA,SAAU;AACxB,UAAM,SAASC,UAAAA,UAAW;AAWbC,QAAAA,IAAI,IAAI;AAErB,QAAI,OAAOC,IAAAA,SAAS;AAAA,MAClB,OAAO;AAAA,MACP,OAAO;AAAA,MACP,SAAS,CAAC;AAAA,QACR,OAAO;AAAA,QACP,OAAO;AAAA,MACb,GAAM;AAAA,QACA,OAAO;AAAA,QACP,OAAO;AAAA,MACb,GAAM;AAAA,QACA,OAAO;AAAA,QACP,OAAO;AAAA,MACR,CAAA;AAAA,IACF,CAAA;AAEDC,kBAAc,eAAe,UAAU,CAAC;AAAA,MACtC,WAAWC,SAAQ;AAAA,MACnB,OAAO;AAAA,QACL,MAAM;AAAA,MACP;AAAA,MACD,WAAW,MAAMC,KAAU,MAAC,QAAQA,KAAU,MAAC,KAAK;AAAA,MACpD,QAAQ,MAAM,MAAM,OAAO,MAAM,OAAO,KAAK,EAAE,MAAM,gBAAgB,QAAQ,EAAE,KAAK,MAAM,OAAO,IAAG,EAAG,CAAA,IAAI,OAAO,KAAK,EAAE,MAAM,eAAgB,CAAA;AAAA,IACnJ,CAAG,GAEDC,IAAAA,YAAY,MAAM;AAChBH,oBAAc,eAAe,UAAU,CAAE;AAAA,IAC7C,CAAG;AAEDI,QAAAA,UAAU,YAAY;AAAA,IAExB,CAAG;AAGD,aAAS,oBAAoBC,aAAY;AACvC,UAAI,iBAAiB,CAAE;AAEvB,eAAS,QAAQ,UAAU;AACzB,cAAM,EAAE,UAAU,GAAG,wBAAuB,IAAK;AACjD,uBAAe,KAAK,uBAAuB;AAE3C,YAAI,YAAY,MAAM,QAAQ,QAAQ,GAAG;AACvC,mBAAS,QAAQ,WAAS,QAAQ,KAAK,CAAC;AAAA,QAChD;AAAA,MACA;AAEI,MAAAA,YAAW,QAAQ,cAAY,QAAQ,QAAQ,CAAC;AAChD,aAAO;AAAA,IACX;AAIE,mBAAe,sBAAsB,mBAAmB;AACtD,YAAM,MAAM;AACZ,UAAI;AAEF,cAAM,sBAAsB,oBAAoBC,WAAgB,MAAC,GAAG;AAEpE,gBAAQ,IAAI,mBAAmB;AAC/B,gBAAQ,IAAKA,WAAAA,MAAiB,GAAG;AACjC,cAAMC,WAAkB,QAAC,YAAY,mBAAmB;AAExD,gBAAQ,IAAI,uCAAuC;AAAA,MACpD,SAAQ,OAAO;AACd,gBAAQ,MAAM,oCAAoC,KAAK;AACvD,cAAM;AAAA,MACZ;AAAA,IACA;AAEE,mBAAe,eAAe,UAAU;AAEtC,YAAM,cAAc,QAAQ,iDAAiD,SAAS,IAAI,IAAI;AAG9F,UAAI,aAAa;AACf,cAAMA,mBAAmB,OAAO,SAAS,GAAG;AAAA,MAClD,OAAW;AACL,cAAM,6BAA6B;AAAA,MACzC;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -1,16 +1,17 @@
-import { ref, reactive, onUnmounted, onMounted, resolveComponent, createElementBlock, openBlock, createBlock, createCommentVNode, createVNode, withCtx, createElementVNode, createTextVNode, unref, isRef } from "vue";
+import { ref, reactive, onUnmounted, onMounted, resolveComponent, createElementBlock, openBlock, createBlock, createCommentVNode, createElementVNode, withCtx, createVNode, createTextVNode, unref, isRef } from "vue";
 import { useRoute, useRouter } from "vue-router";
 import { state as state$1 } from "../../../globals/views/store/globals.js";
 import { state } from "../../../auth/views/store/auth.js";
 import { state as state$2, actions } from "../../store/categories.js";
 /* empty css                                       */
-/* empty css                                        */
+/* empty css                                       */
 import _sfc_main$2 from "../../../../components/Block/Block.vue.js";
 import _sfc_main$3 from "../../../../components/Feed/Feed.vue.js";
 import _sfc_main$4 from "../../../../components/Tree/Tree.vue.js";
 import _sfc_main$5 from "../blocks/CardCategory.vue.js";
 import _sfc_main$1 from "../../../icons/navigation/IconPlus.vue.js";
 const _hoisted_1 = { class: "pd-thin bg-white" };
+const _hoisted_2 = { class: "rows-1" };
 const _sfc_main = {
   __name: "Categories",
   setup(__props) {
@@ -102,50 +103,52 @@ const _sfc_main = {
           ]),
           _: 1
         })) : createCommentVNode("", true),
-        createVNode(_sfc_main$3, {
-          search: true,
-          showLoadMore: false,
-          states: {
-            empty: {
-              title: "No Products Found",
-              description: "Currently, there are no products available."
-            }
-          },
-          store: {
-            read: (options) => actions.read(options),
-            state: state$2
-          },
-          options: {
-            user: state.user._id,
-            rootOnly: true,
-            excludeChildren: false
-          },
-          sort: unref(sort),
-          "onUpdate:sort": _cache[0] || (_cache[0] = ($event) => isRef(sort) ? sort.value = $event : sort = $event),
-          items: state$2.all,
-          "onUpdate:items": _cache[1] || (_cache[1] = ($event) => state$2.all = $event),
-          class: "cols-1 pos-relative w-100 rows-1 gap-thin"
-        }, {
-          default: withCtx(({
-            items
-          }) => [
-            items ? (openBlock(), createBlock(_sfc_main$4, {
-              key: 0,
-              items: state$2.all,
-              state: state$2.all,
-              onUpdate: updateCategoriesOrder
-            }, {
-              default: withCtx(({ item }) => [
-                createVNode(_sfc_main$5, {
-                  category: item,
-                  onDelete: deleteCategory
-                }, null, 8, ["category"])
-              ]),
-              _: 1
-            }, 8, ["items", "state"])) : createCommentVNode("", true)
-          ]),
-          _: 1
-        }, 8, ["store", "options", "sort", "items"])
+        createElementVNode("div", _hoisted_2, [
+          createVNode(_sfc_main$3, {
+            search: true,
+            showLoadMore: false,
+            states: {
+              empty: {
+                title: "No Products Found",
+                description: "Currently, there are no products available."
+              }
+            },
+            store: {
+              read: (options) => actions.read(options),
+              state: state$2
+            },
+            options: {
+              user: state.user._id,
+              rootOnly: true,
+              excludeChildren: false
+            },
+            sort: unref(sort),
+            "onUpdate:sort": _cache[0] || (_cache[0] = ($event) => isRef(sort) ? sort.value = $event : sort = $event),
+            items: state$2.all,
+            "onUpdate:items": _cache[1] || (_cache[1] = ($event) => state$2.all = $event),
+            class: "rows-1 gap-thin"
+          }, {
+            default: withCtx(({
+              items
+            }) => [
+              items ? (openBlock(), createBlock(_sfc_main$4, {
+                key: 0,
+                items: state$2.all,
+                state: state$2.all,
+                onUpdate: updateCategoriesOrder
+              }, {
+                default: withCtx(({ item }) => [
+                  createVNode(_sfc_main$5, {
+                    category: item,
+                    onDelete: deleteCategory
+                  }, null, 8, ["category"])
+                ]),
+                _: 1
+              }, 8, ["items", "state"])) : createCommentVNode("", true)
+            ]),
+            _: 1
+          }, 8, ["store", "options", "sort", "items"])
+        ])
       ]);
     };
   }

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

@@ -1 +1 @@
-{"version":3,"file":"Categories.vue.js","sources":["../../../../../../../src/modules/products/components/pages/Categories.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin bg-white\">\n    <Block v-if=\"!MOBILE_APP\" \n      class=\"radius-medium mn-b-thin mobile:flex-wrap flex-nowrap flex-v-center flex\"\n    >\n      <h2 class=\"mn-r-auto\">\n        Categories\n      </h2>\n\n      <router-link \n        :to=\"{\n          name: 'Category Add', \n          params: { \n            _id: $route.params._id\n          } \n        }\"\n        class=\"uppercase t-medium pd-small radius-medium bg-white nav-link\"\n      >\n        Add New\n      </router-link>\n    </Block>\n\n     <Feed\n        :search=\"true\"\n        :showLoadMore=\"false\"\n        :states=\"{\n          empty: {\n            title: 'No Products Found',\n            description: 'Currently, there are no products available.'\n          }\n        }\"\n        :store=\"{\n          read: (options) => categories.actions.read(options),\n          state: categories.state\n        }\"\n        :options=\"{\n          user: auth.state.user._id,\n          rootOnly: true,\n          excludeChildren: false\n        }\"\n        v-model:sort=\"sort\"\n        v-model:items=\"categories.state.all\"\n        v-slot=\"{ \n          items \n        }\"\n        class=\"cols-1 pos-relative w-100 rows-1 gap-thin\"\n      >\n        <Tree \n          v-if=\"items\" \n          :items=\"categories.state.all\" \n          :state=\"categories.state.all\" \n          @update=\"updateCategoriesOrder\" \n          v-slot=\"{ item }\"\n        >\n          <CardCategory \n            :category=\"item\" \n            @delete=\"deleteCategory\" \n          />\n        </Tree>\n      </Feed>\n  </div>\n</template>\n\n<script setup>\n  import { onMounted, onUnmounted, computed, ref,reactive } from 'vue';\n  import { useRoute, useRouter } from 'vue-router';\n\n  import * as globals from '@martyrs/src/modules/globals/views/store/globals.js';\n  import * as auth from '@martyrs/src/modules/auth/views/store/auth.js'; \n  import * as categories from '@martyrs/src/modules/products/store/categories.js'; \n\n  const route = useRoute();\n  const router = useRouter();\n\n  import Button from \"@martyrs/src/components/Button/Button.vue\";\n  import Block from '@martyrs/src/components/Block/Block.vue';\n  import Feed from '@martyrs/src/components/Feed/Feed.vue'\n  import Tree from \"@martyrs/src/components/Tree/Tree.vue\";\n  \n  import CardCategory from '@martyrs/src/modules/products/components/blocks/CardCategory.vue';\n\n  import IconPlus from '@martyrs/src/modules/icons/navigation/IconPlus.vue'\n\n  let search = ref(null)\n\n  let sort = reactive({\n    param: 'order',\n    order: 'asc',\n    options: [{\n      label: 'Order',\n      value: 'order'\n    },{\n      label: 'Name',\n      value: 'name'\n    },{\n      label: 'Date',\n      value: 'createdAt'\n    }]\n  })\n\n  globals.state.navigation_bar.actions = [{\n    component: IconPlus,\n    props: {\n      fill: \"rgb(var(--main))\" \n    },\n    condition: () => auth.state.user && auth.state.user._id,\n    action: () => route.params._id ? router.push({ name: 'Category Add', params: { _id: route.params._id} }) : router.push({ name: 'Category Add' })\n  }],\n\n  onUnmounted(() => {\n    globals.state.navigation_bar.actions = [];\n  });\n\n  onMounted(async () => {\n    \n  });\n\n  // Функция для преобразования иерархического дерева категорий в плоский массив\n  function flattenCategoryTree(categories) {\n    let flatCategories = [];\n    \n    function flatten(category) {\n      const { children, ...categoryWithoutChildren } = category;\n      flatCategories.push(categoryWithoutChildren);\n      \n      if (children && Array.isArray(children)) {\n        children.forEach(child => flatten(child));\n      }\n    }\n    \n    categories.forEach(category => flatten(category));\n    return flatCategories;\n  }\n\n\n  // Функция для обновления порядка категорий\n  async function updateCategoriesOrder(updatedCategories) {\n    alert('helo')\n    try {\n      // Преобразуем категории в плоский массив\n      const flattenedCategories = flattenCategoryTree(categories.state.all);\n      \n      console.log(flattenedCategories)\n      console.log( categories.state.all)\n      await categories.actions.updateOrder(flattenedCategories);\n        \n      console.log('Categories order updated successfully');\n    } catch (error) {\n      console.error('Error updating categories order:', error);\n      throw error;\n    }\n  }\n\n  async function deleteCategory(category) {\n    // Запрашиваем подтверждение у пользователя\n    const isConfirmed = confirm(`Are you sure you want to delete the category \"${category.name}\"?`);\n    \n    // Если пользователь подтвердил удаление, продолжаем процесс\n    if (isConfirmed) {\n      await categories.actions.delete(category.url);\n    } else {\n      alert('Category deletion cancelled'); \n    }\n  }\n</script>\n\n<style lang=\"scss\">\n</style>"],"names":["globals.state","IconPlus","auth.state","categories.state","categories.actions"],"mappings":";;;;;;;;;;;;;;;;AAuEE,UAAM,QAAQ,SAAU;AACxB,UAAM,SAAS,UAAW;AAWb,QAAI,IAAI;AAErB,QAAI,OAAO,SAAS;AAAA,MAClB,OAAO;AAAA,MACP,OAAO;AAAA,MACP,SAAS,CAAC;AAAA,QACR,OAAO;AAAA,QACP,OAAO;AAAA,MACb,GAAM;AAAA,QACA,OAAO;AAAA,QACP,OAAO;AAAA,MACb,GAAM;AAAA,QACA,OAAO;AAAA,QACP,OAAO;AAAA,MACR,CAAA;AAAA,IACF,CAAA;AAEDA,YAAc,eAAe,UAAU,CAAC;AAAA,MACtC,WAAWC;AAAAA,MACX,OAAO;AAAA,QACL,MAAM;AAAA,MACP;AAAA,MACD,WAAW,MAAMC,MAAW,QAAQA,MAAW,KAAK;AAAA,MACpD,QAAQ,MAAM,MAAM,OAAO,MAAM,OAAO,KAAK,EAAE,MAAM,gBAAgB,QAAQ,EAAE,KAAK,MAAM,OAAO,IAAG,EAAG,CAAA,IAAI,OAAO,KAAK,EAAE,MAAM,eAAgB,CAAA;AAAA,IACnJ,CAAG,GAED,YAAY,MAAM;AAChBF,cAAc,eAAe,UAAU,CAAE;AAAA,IAC7C,CAAG;AAED,cAAU,YAAY;AAAA,IAExB,CAAG;AAGD,aAAS,oBAAoB,YAAY;AACvC,UAAI,iBAAiB,CAAE;AAEvB,eAAS,QAAQ,UAAU;AACzB,cAAM,EAAE,UAAU,GAAG,wBAAuB,IAAK;AACjD,uBAAe,KAAK,uBAAuB;AAE3C,YAAI,YAAY,MAAM,QAAQ,QAAQ,GAAG;AACvC,mBAAS,QAAQ,WAAS,QAAQ,KAAK,CAAC;AAAA,QAChD;AAAA,MACA;AAEI,iBAAW,QAAQ,cAAY,QAAQ,QAAQ,CAAC;AAChD,aAAO;AAAA,IACX;AAIE,mBAAe,sBAAsB,mBAAmB;AACtD,YAAM,MAAM;AACZ,UAAI;AAEF,cAAM,sBAAsB,oBAAoBG,QAAiB,GAAG;AAEpE,gBAAQ,IAAI,mBAAmB;AAC/B,gBAAQ,IAAKA,QAAiB,GAAG;AACjC,cAAMC,QAAmB,YAAY,mBAAmB;AAExD,gBAAQ,IAAI,uCAAuC;AAAA,MACpD,SAAQ,OAAO;AACd,gBAAQ,MAAM,oCAAoC,KAAK;AACvD,cAAM;AAAA,MACZ;AAAA,IACA;AAEE,mBAAe,eAAe,UAAU;AAEtC,YAAM,cAAc,QAAQ,iDAAiD,SAAS,IAAI,IAAI;AAG9F,UAAI,aAAa;AACf,cAAMA,QAAmB,OAAO,SAAS,GAAG;AAAA,MAClD,OAAW;AACL,cAAM,6BAA6B;AAAA,MACzC;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Categories.vue.js","sources":["../../../../../../../src/modules/products/components/pages/Categories.vue"],"sourcesContent":["<template>\n  <div class=\"pd-thin bg-white\">\n    <Block v-if=\"!MOBILE_APP\" \n      class=\"radius-medium mn-b-thin mobile:flex-wrap flex-nowrap flex-v-center flex\"\n    >\n      <h2 class=\"mn-r-auto\">\n        Categories\n      </h2>\n\n      <router-link \n        :to=\"{\n          name: 'Category Add', \n          params: { \n            _id: $route.params._id\n          } \n        }\"\n        class=\"uppercase t-medium pd-small radius-medium bg-white nav-link\"\n      >\n        Add New\n      </router-link>\n    </Block>\n\n    <div class=\"rows-1\">\n      <Feed\n        :search=\"true\"\n        :showLoadMore=\"false\"\n        :states=\"{\n          empty: {\n            title: 'No Products Found',\n            description: 'Currently, there are no products available.'\n          }\n        }\"\n        :store=\"{\n          read: (options) => categories.actions.read(options),\n          state: categories.state\n        }\"\n        :options=\"{\n          user: auth.state.user._id,\n          rootOnly: true,\n          excludeChildren: false\n        }\"\n        v-model:sort=\"sort\"\n        v-model:items=\"categories.state.all\"\n        v-slot=\"{ \n          items \n        }\"\n        class=\"rows-1 gap-thin\"\n      >\n        <Tree \n          v-if=\"items\" \n          :items=\"categories.state.all\" \n          :state=\"categories.state.all\" \n          @update=\"updateCategoriesOrder\" \n          v-slot=\"{ item }\"\n        >\n          <CardCategory \n            :category=\"item\" \n            @delete=\"deleteCategory\" \n          />\n        </Tree>\n      </Feed>\n    </div>\n  </div>\n</template>\n\n<script setup>\n  import { onMounted, onUnmounted, computed, ref,reactive } from 'vue';\n  import { useRoute, useRouter } from 'vue-router';\n\n  import * as globals from '@martyrs/src/modules/globals/views/store/globals.js';\n  import * as auth from '@martyrs/src/modules/auth/views/store/auth.js'; \n  import * as categories from '@martyrs/src/modules/products/store/categories.js'; \n\n  const route = useRoute();\n  const router = useRouter();\n\n  import Button from \"@martyrs/src/components/Button/Button.vue\";\n  import Block from '@martyrs/src/components/Block/Block.vue';\n  import Feed from '@martyrs/src/components/Feed/Feed.vue'\n  import Tree from \"@martyrs/src/components/Tree/Tree.vue\";\n  \n  import CardCategory from '@martyrs/src/modules/products/components/blocks/CardCategory.vue';\n\n  import IconPlus from '@martyrs/src/modules/icons/navigation/IconPlus.vue'\n\n  let search = ref(null)\n\n  let sort = reactive({\n    param: 'order',\n    order: 'asc',\n    options: [{\n      label: 'Order',\n      value: 'order'\n    },{\n      label: 'Name',\n      value: 'name'\n    },{\n      label: 'Date',\n      value: 'createdAt'\n    }]\n  })\n\n  globals.state.navigation_bar.actions = [{\n    component: IconPlus,\n    props: {\n      fill: \"rgb(var(--main))\" \n    },\n    condition: () => auth.state.user && auth.state.user._id,\n    action: () => route.params._id ? router.push({ name: 'Category Add', params: { _id: route.params._id} }) : router.push({ name: 'Category Add' })\n  }],\n\n  onUnmounted(() => {\n    globals.state.navigation_bar.actions = [];\n  });\n\n  onMounted(async () => {\n    \n  });\n\n  // Функция для преобразования иерархического дерева категорий в плоский массив\n  function flattenCategoryTree(categories) {\n    let flatCategories = [];\n    \n    function flatten(category) {\n      const { children, ...categoryWithoutChildren } = category;\n      flatCategories.push(categoryWithoutChildren);\n      \n      if (children && Array.isArray(children)) {\n        children.forEach(child => flatten(child));\n      }\n    }\n    \n    categories.forEach(category => flatten(category));\n    return flatCategories;\n  }\n\n\n  // Функция для обновления порядка категорий\n  async function updateCategoriesOrder(updatedCategories) {\n    alert('helo')\n    try {\n      // Преобразуем категории в плоский массив\n      const flattenedCategories = flattenCategoryTree(categories.state.all);\n      \n      console.log(flattenedCategories)\n      console.log( categories.state.all)\n      await categories.actions.updateOrder(flattenedCategories);\n        \n      console.log('Categories order updated successfully');\n    } catch (error) {\n      console.error('Error updating categories order:', error);\n      throw error;\n    }\n  }\n\n  async function deleteCategory(category) {\n    // Запрашиваем подтверждение у пользователя\n    const isConfirmed = confirm(`Are you sure you want to delete the category \"${category.name}\"?`);\n    \n    // Если пользователь подтвердил удаление, продолжаем процесс\n    if (isConfirmed) {\n      await categories.actions.delete(category.url);\n    } else {\n      alert('Category deletion cancelled'); \n    }\n  }\n</script>\n\n<style lang=\"scss\">\n</style>"],"names":["globals.state","IconPlus","auth.state","categories.state","categories.actions"],"mappings":";;;;;;;;;;;;;;;;;AAyEE,UAAM,QAAQ,SAAU;AACxB,UAAM,SAAS,UAAW;AAWb,QAAI,IAAI;AAErB,QAAI,OAAO,SAAS;AAAA,MAClB,OAAO;AAAA,MACP,OAAO;AAAA,MACP,SAAS,CAAC;AAAA,QACR,OAAO;AAAA,QACP,OAAO;AAAA,MACb,GAAM;AAAA,QACA,OAAO;AAAA,QACP,OAAO;AAAA,MACb,GAAM;AAAA,QACA,OAAO;AAAA,QACP,OAAO;AAAA,MACR,CAAA;AAAA,IACF,CAAA;AAEDA,YAAc,eAAe,UAAU,CAAC;AAAA,MACtC,WAAWC;AAAAA,MACX,OAAO;AAAA,QACL,MAAM;AAAA,MACP;AAAA,MACD,WAAW,MAAMC,MAAW,QAAQA,MAAW,KAAK;AAAA,MACpD,QAAQ,MAAM,MAAM,OAAO,MAAM,OAAO,KAAK,EAAE,MAAM,gBAAgB,QAAQ,EAAE,KAAK,MAAM,OAAO,IAAG,EAAG,CAAA,IAAI,OAAO,KAAK,EAAE,MAAM,eAAgB,CAAA;AAAA,IACnJ,CAAG,GAED,YAAY,MAAM;AAChBF,cAAc,eAAe,UAAU,CAAE;AAAA,IAC7C,CAAG;AAED,cAAU,YAAY;AAAA,IAExB,CAAG;AAGD,aAAS,oBAAoB,YAAY;AACvC,UAAI,iBAAiB,CAAE;AAEvB,eAAS,QAAQ,UAAU;AACzB,cAAM,EAAE,UAAU,GAAG,wBAAuB,IAAK;AACjD,uBAAe,KAAK,uBAAuB;AAE3C,YAAI,YAAY,MAAM,QAAQ,QAAQ,GAAG;AACvC,mBAAS,QAAQ,WAAS,QAAQ,KAAK,CAAC;AAAA,QAChD;AAAA,MACA;AAEI,iBAAW,QAAQ,cAAY,QAAQ,QAAQ,CAAC;AAChD,aAAO;AAAA,IACX;AAIE,mBAAe,sBAAsB,mBAAmB;AACtD,YAAM,MAAM;AACZ,UAAI;AAEF,cAAM,sBAAsB,oBAAoBG,QAAiB,GAAG;AAEpE,gBAAQ,IAAI,mBAAmB;AAC/B,gBAAQ,IAAKA,QAAiB,GAAG;AACjC,cAAMC,QAAmB,YAAY,mBAAmB;AAExD,gBAAQ,IAAI,uCAAuC;AAAA,MACpD,SAAQ,OAAO;AACd,gBAAQ,MAAM,oCAAoC,KAAK;AACvD,cAAM;AAAA,MACZ;AAAA,IACA;AAEE,mBAAe,eAAe,UAAU;AAEtC,YAAM,cAAc,QAAQ,iDAAiD,SAAS,IAAI,IAAI;AAG9F,UAAI,aAAa;AACf,cAAMA,QAAmB,OAAO,SAAS,GAAG;AAAA,MAClD,OAAW;AACL,cAAM,6BAA6B;AAAA,MACzC;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -3,10 +3,10 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
 const vue = require("vue");
 const vueRouter = require("vue-router");
 const IconDelete = require("../../../icons/navigation/IconDelete.vue.cjs");
-const Button = require("../../../../components/Button/Button.vue.cjs");
+const Button = require("../../../../components/Button/Button.vue2.cjs");
 const Select = require("../../../../components/Select/Select.vue.cjs");
 const UploadImage = require("../../../../components/UploadImage/UploadImage.vue.cjs");
-const Field = require("../../../../components/Field/Field.vue2.cjs");
+const Field = require("../../../../components/Field/Field.vue.cjs");
 ;/* empty css                                         */
 ;/* empty css                                              */
 const IconCheckmark = require("../../../icons/navigation/IconCheckmark.vue.cjs");
@@ -22,14 +22,13 @@ const categories = require("../../store/categories.cjs");
 ;/* empty css                    */
 const _hoisted_1 = {
   key: 0,
-  class: "pd-thin bg-white for-transition w-100"
+  class: "rows-auto pd-thin bg-white for-transition w-100"
 };
 const _hoisted_2 = { class: "mn-r-auto" };
-const _hoisted_3 = { class: "mn-b-medium w-100 flex-nowrap gap-thin flex" };
-const _hoisted_4 = { class: "mn-b-medium w-100 flex-nowrap gap-thin flex" };
-const _hoisted_5 = { class: "flex-v-center flex-nowrap flex" };
+const _hoisted_3 = { class: "cols-auto-1fr mn-b-thin w-100" };
+const _hoisted_4 = { class: "mn-b-thin w-100 flex-nowrap gap-thin flex" };
+const _hoisted_5 = ["onClick"];
 const _hoisted_6 = ["onClick"];
-const _hoisted_7 = ["onClick"];
 const _sfc_main = {
   __name: "CategoryEdit",
   emits: ["page-loading", "page-loaded"],
@@ -108,7 +107,7 @@ const _sfc_main = {
               submit: onSubmit,
               class: "pd-small radius-medium bg-main t-black uppercase t-medium"
             }, {
-              default: vue.withCtx(() => _cache[6] || (_cache[6] = [
+              default: vue.withCtx(() => _cache[5] || (_cache[5] = [
                 vue.createTextVNode(" Save Category ")
               ])),
               _: 1
@@ -126,14 +125,14 @@ const _sfc_main = {
                 photo: categories.state.current.photo,
                 "onUpdate:photo": _cache[0] || (_cache[0] = ($event) => categories.state.current.photo = $event),
                 uploadPath: "categories",
-                class: "w-8r aspect-1x1 o-hidden mn-r-small radius-extra"
+                class: "aspect-1x1 h-100 o-hidden mn-r-small radius-extra"
               }, null, 8, ["photo"]),
               vue.createVNode(Field.default, {
                 field: categories.state.current.name,
                 "onUpdate:field": _cache[1] || (_cache[1] = ($event) => categories.state.current.name = $event),
                 label: "Name",
                 placeholder: "Enter category name",
-                class: "w-100 mn-b-small bg-white radius-small pd-medium"
+                class: "w-100 bg-white radius-small pd-medium"
               }, null, 8, ["field"])
             ]),
             vue.createElementVNode("div", _hoisted_4, [
@@ -162,16 +161,9 @@ const _sfc_main = {
                 "published",
                 "removed"
               ],
-              placeholder: "Display product",
-              class: "pos-relative w-100 mn-b-small bg-white radius-small pd-medium"
+              placeholder: "Select category",
+              class: "pos-relative w-100 bg-white radius-small pd-medium"
             }, null, 8, ["select"]),
-            vue.createElementVNode("div", _hoisted_5, [
-              _cache[7] || (_cache[7] = vue.createElementVNode("h4", { class: "mn-r-thin t-medium" }, "Localization", -1)),
-              vue.createElementVNode("button", {
-                onClick: _cache[5] || (_cache[5] = () => categories.state.current.translations.push({ locale: "", text: "" })),
-                class: "i-small pd-thin button-delete button"
-              }, " + ")
-            ]),
             (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(categories.state.current.translations, (item, index) => {
               return vue.openBlock(), vue.createElementBlock("div", {
                 class: "gap-thin mn-b-thin flex-nowrap flex",
@@ -194,7 +186,7 @@ const _sfc_main = {
                   class: "radius-small pd-small flex-center flex aspect-1x1 bg-red"
                 }, [
                   vue.createVNode(IconDelete.default, { class: "i-medium" })
-                ], 8, _hoisted_6)
+                ], 8, _hoisted_5)
               ]);
             }), 128))
           ]),
@@ -231,7 +223,7 @@ const _sfc_main = {
                   class: "radius-small pd-small flex-center flex aspect-1x1 bg-red"
                 }, [
                   vue.createVNode(IconDelete.default, { class: "i-medium" })
-                ], 8, _hoisted_7)
+                ], 8, _hoisted_6)
               ]);
             }), 128))
           ]),

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

@@ -1 +1 @@
-{"version":3,"file":"CategoryEdit.vue.cjs","sources":["../../../../../../../src/modules/products/components/pages/CategoryEdit.vue"],"sourcesContent":["<template>\n  <div v-if=\"!isLoading\"  class=\"pd-thin bg-white for-transition w-100\">\n    <Block v-if=\"!MOBILE_APP\" class=\"radius-medium mn-b-thin flex-nowrap flex-v-center flex\">\n      <h1   class=\"mn-r-auto\">\n        {{route.params.category ? 'Edit Category' : 'Add Category'}}\n      </h1>\n\n      <Button \n        :submit=\"onSubmit\"\n        class=\"pd-small radius-medium bg-main t-black uppercase t-medium\"\n      >\n        Save Category \n      </Button>\n    </Block>\n    \n    <Block \n      title=\"Profile\"\n      class=\"mn-b-thin\"\n    >\n      <div class=\"mn-b-medium w-100 flex-nowrap gap-thin flex\">\n        <UploadImage \n           v-model:photo=\"categories.state.current.photo\"\n          :uploadPath=\"'categories'\"\n          class=\"w-8r aspect-1x1 o-hidden mn-r-small radius-extra\" \n        />\n       <Field\n            v-model:field=\"categories.state.current.name\"\n            label=\"Name\"\n            placeholder=\"Enter category name\"\n            class=\"w-100 mn-b-small bg-white radius-small pd-medium\"\n          />  \n      </div>\n\n        <div class=\"mn-b-medium w-100 flex-nowrap gap-thin flex\">\n\n\n         <Field\n            v-model:field=\"categories.state.current.order\"\n            label=\"Order\"\n            :disabled=\"true\"\n            class=\"w-40 bg-white radius-small pd-medium\"\n          />  \n         <Field\n            v-model:field=\"categories.state.current.url\"\n            label=\"URL\"\n            placeholder=\"Enter category URL\"\n            class=\"w-100 bg-white radius-small pd-medium\"\n          />  \n         \n      </div>\n\n      <Select \n        v-model:select=\"categories.state.current.status\"\n        label=\"Status\"\n        :options=\"[\n          'draft', \n          'internal',\n          'published',\n          'removed'\n        ]\"\n        placeholder=\"Display product\"\n        class=\"pos-relative w-100 mn-b-small bg-white radius-small pd-medium\"\n      />\n\n      <div class=\"flex-v-center flex-nowrap flex\">\n        <h4  class=\"mn-r-thin t-medium\">Localization</h4>\n          \n        <button \n          @click=\"() => categories.state.current.translations.push({locale: '', text: ''})\" \n          class=\"i-small pd-thin button-delete button\"\n        >\n          +\n        </button>\n      </div>\n      <div \n        class=\"gap-thin mn-b-thin flex-nowrap flex\" \n        v-for=\"(item, index) in categories.state.current.translations\" \n        :key=\"index\"\n      > \n        <Field\n          v-model:field=\"item.locale\"\n          placeholder=\"Locale\"\n          class=\"w-100 bg-white radius-small pd-medium\"\n        />  \n        <Field\n          v-model:field=\"item.text\"\n          placeholder=\"Text\"\n          class=\"w-100 bg-white radius-small pd-medium\"\n        />\n        <div\n          @click=\"() => categories.state.current.translations.splice(index, 1)\"  \n          class=\"radius-small pd-small flex-center flex aspect-1x1 bg-red\"\n        >\n          <IconDelete \n            class=\"i-medium\"\n          />\n        </div>\n      </div>\n\n      \n    </Block>\n     <!-- Filters -->\n    <Block\n      title=\"Filters\"\n      placeholder=\"No filters added yet\"\n      :actions=\"[{\n        label: '+',\n        function: () => categories.state.current.filters.push({name: '', url: ''})\n      }]\"\n    >\n      <div \n        class=\"gap-thin mn-b-thin flex-nowrap flex\" \n        v-for=\"(item, index) in categories.state.current.filters\" \n        :key=\"index\"\n      > \n        <Field\n          v-model:field=\"item.name\"\n          placeholder=\"Filter name\"\n          class=\"w-100 bg-white radius-small pd-medium\"\n        />  \n        <Field\n          v-model:field=\"item.options\"\n          placeholder=\"Filter options divided by ,\"\n          class=\"w-100 bg-white radius-small pd-medium\"\n        />\n        <div\n          @click=\"() => categories.state.current.filters.splice(index, 1)\"  \n          class=\"radius-small pd-small flex-center flex aspect-1x1 bg-red\"\n        >\n          <IconDelete \n            class=\"i-medium\"\n          />\n        </div>\n      </div> \n    </Block>\n  </div>\n \n</template>\n\n<script setup>\n  // Import libs\n  import { computed, onUnmounted, onMounted, ref } from 'vue'\n  import { useRoute,useRouter } from 'vue-router'\n  \n  import IconDelete from '@martyrs/src/modules/icons/navigation/IconDelete.vue';\n\n  import Button from \"@martyrs/src/components/Button/Button.vue\";\n  import Select from \"@martyrs/src/components/Select/Select.vue\";\n  import UploadImage from '@martyrs/src/components/UploadImage/UploadImage.vue';\n  import Field from \"@martyrs/src/components/Field/Field.vue\";\n  import Feed from '@martyrs/src/components/Feed/Feed.vue'\n\n\n  import Block from '@martyrs/src/components/Block/Block.vue';\n\n  import IconCheckmark from '@martyrs/src/modules/icons/navigation/IconCheckmark.vue'\n\n  // Import the new store structure\n  import * as globals from '@martyrs/src/modules/globals/views/store/globals.js';\n  import * as auth from '@martyrs/src/modules/auth/views/store/auth.js'; \n  import * as categories from '@martyrs/src/modules/products/store/categories.js';\n\n  const route = useRoute()\n  const router = useRouter()\n\n  const emits = defineEmits(['page-loading', 'page-loaded']);\n\n  // Data prefetching\n  const isLoading = ref(true)\n  onMounted(async () => {\n    emits('page-loading');\n    if (route.params.category) {\n      await categories.actions.read({url: route.params.category})\n    } else {\n      categories.actions.clean() // Adjusted based on the new store's method to reset the category state\n    }\n\n    emits('page-loaded');\n    isLoading.value = false\n  })\n\n  // Accessing state\n  const category = computed(() => categories.state.current)\n  const routePath = computed(() => route.name)\n\n  // Navigation Bar\n  globals.state.navigation_bar.actions = [{\n    component: IconCheckmark,\n    props: {\n      fill: \"rgb(var(--main))\" \n    },\n    condition: () => auth.state.user && auth.state.user._id,\n    action: () => onSubmit()\n  }],\n\n onUnmounted(() => {\n    globals.state.navigation_bar.actions = [];\n  });\n\n\n\n  // Functions\n  async function onSubmit() {\n    if (route.params.category) {\n\n      categories.state.current.creator = {\n        type: categories.state.current.creator.type,\n        hidden: categories.state.current.creator.hidden,\n        target: categories.state.current.creator.target._id\n      }\n\n      categories.state.current.owner = {\n        type: categories.state.current.owner.type,\n        target: categories.state.current.owner.target._id\n      }\n\n      await categories.actions.update(categories.state.current)\n\n      redirectTo()\n    } else {\n\n      categories.state.current.creator = {\n        type: 'user',\n        hidden: false,\n        target: auth.state.user._id\n      }\n\n      categories.state.current.owner = {\n        type: route.params._id ? 'organization' : 'platform',\n        hidden: false,\n        target: route.params._id ? route.params._id : null\n      }\n\n      await categories.actions.create(categories.state.current)\n      redirectTo()\n    }\n  }\n\n  function redirectTo () {\n    router.push({\n      name: 'Categories', \n      params: { \n        _id: route.params._id\n      } \n    })\n  }\n</script>\n\n<style lang=\"scss\">\n  /* Your styles here */\n</style>\n"],"names":["useRoute","useRouter","ref","onMounted","categories.actions","computed","categories.state","globals.state","IconCheckmark","auth.state","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkKE,UAAM,QAAQA,UAAQ,SAAA;AACtB,UAAM,SAASC,UAAS,UAAA;AAExB,UAAM,QAAQ;AAGd,UAAM,YAAYC,IAAAA,IAAI,IAAI;AAC1BC,QAAAA,UAAU,YAAY;AACpB,YAAM,cAAc;AACpB,UAAI,MAAM,OAAO,UAAU;AACzB,cAAMC,WAAAA,QAAmB,KAAK,EAAC,KAAK,MAAM,OAAO,SAAQ,CAAC;AAAA,MAChE,OAAW;AACLA,mBAAAA,QAAmB,MAAO;AAAA,MAChC;AAEI,YAAM,aAAa;AACnB,gBAAU,QAAQ;AAAA,IACnB,CAAA;AAGgBC,QAAQ,SAAC,MAAMC,WAAAA,MAAiB,OAAO;AACtCD,QAAQ,SAAC,MAAM,MAAM,IAAI;AAG3CE,kBAAc,eAAe,UAAU,CAAC;AAAA,MACtC,WAAWC,cAAa;AAAA,MACxB,OAAO;AAAA,QACL,MAAM;AAAA,MACP;AAAA,MACD,WAAW,MAAMC,KAAU,MAAC,QAAQA,KAAU,MAAC,KAAK;AAAA,MACpD,QAAQ,MAAM,SAAQ;AAAA,IAC1B,CAAG,GAEFC,IAAAA,YAAY,MAAM;AACfH,oBAAc,eAAe,UAAU,CAAE;AAAA,IAC7C,CAAG;AAKD,mBAAe,WAAW;AACxB,UAAI,MAAM,OAAO,UAAU;AAEzBD,mBAAgB,MAAC,QAAQ,UAAU;AAAA,UACjC,MAAMA,WAAgB,MAAC,QAAQ,QAAQ;AAAA,UACvC,QAAQA,WAAgB,MAAC,QAAQ,QAAQ;AAAA,UACzC,QAAQA,WAAgB,MAAC,QAAQ,QAAQ,OAAO;AAAA,QACxD;AAEMA,mBAAgB,MAAC,QAAQ,QAAQ;AAAA,UAC/B,MAAMA,WAAgB,MAAC,QAAQ,MAAM;AAAA,UACrC,QAAQA,WAAgB,MAAC,QAAQ,MAAM,OAAO;AAAA,QACtD;AAEM,cAAMF,WAAkB,QAAC,OAAOE,WAAAA,MAAiB,OAAO;AAExD,mBAAU;AAAA,MAChB,OAAW;AAELA,mBAAgB,MAAC,QAAQ,UAAU;AAAA,UACjC,MAAM;AAAA,UACN,QAAQ;AAAA,UACR,QAAQG,KAAU,MAAC,KAAK;AAAA,QAChC;AAEMH,mBAAgB,MAAC,QAAQ,QAAQ;AAAA,UAC/B,MAAM,MAAM,OAAO,MAAM,iBAAiB;AAAA,UAC1C,QAAQ;AAAA,UACR,QAAQ,MAAM,OAAO,MAAM,MAAM,OAAO,MAAM;AAAA,QACtD;AAEM,cAAMF,WAAkB,QAAC,OAAOE,WAAAA,MAAiB,OAAO;AACxD,mBAAU;AAAA,MAChB;AAAA,IACA;AAEE,aAAS,aAAc;AACrB,aAAO,KAAK;AAAA,QACV,MAAM;AAAA,QACN,QAAQ;AAAA,UACN,KAAK,MAAM,OAAO;AAAA,QACnB;AAAA,MACF,CAAA;AAAA,IACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"CategoryEdit.vue.cjs","sources":["../../../../../../../src/modules/products/components/pages/CategoryEdit.vue"],"sourcesContent":["<template>\n  <div v-if=\"!isLoading\"  class=\"rows-auto pd-thin bg-white for-transition w-100\">\n    <Block v-if=\"!MOBILE_APP\" class=\"radius-medium mn-b-thin flex-nowrap flex-v-center flex\">\n      <h1   class=\"mn-r-auto\">\n        {{route.params.category ? 'Edit Category' : 'Add Category'}}\n      </h1>\n\n      <Button \n        :submit=\"onSubmit\"\n        class=\"pd-small radius-medium bg-main t-black uppercase t-medium\"\n      >\n        Save Category \n      </Button>\n    </Block>\n    \n    <Block \n      title=\"Profile\"\n      class=\"mn-b-thin\"\n    >\n      <div  class=\"cols-auto-1fr mn-b-thin w-100 \">\n        <UploadImage \n           v-model:photo=\"categories.state.current.photo\"\n          :uploadPath=\"'categories'\"\n          class=\"aspect-1x1 h-100 o-hidden mn-r-small radius-extra\" \n        />\n       <Field\n            v-model:field=\"categories.state.current.name\"\n            label=\"Name\"\n            placeholder=\"Enter category name\"\n            class=\"w-100 bg-white radius-small pd-medium\"\n          />  \n      </div>\n\n        <div class=\"mn-b-thin w-100 flex-nowrap gap-thin flex\">\n\n\n         <Field\n            v-model:field=\"categories.state.current.order\"\n            label=\"Order\"\n            :disabled=\"true\"\n            class=\"w-40 bg-white radius-small pd-medium\"\n          />  \n         <Field\n            v-model:field=\"categories.state.current.url\"\n            label=\"URL\"\n            placeholder=\"Enter category URL\"\n            class=\"w-100 bg-white radius-small pd-medium\"\n          />  \n         \n      </div>\n\n      <Select \n        v-model:select=\"categories.state.current.status\"\n        label=\"Status\"\n        :options=\"[\n          'draft', \n          'internal',\n          'published',\n          'removed'\n        ]\"\n        placeholder=\"Select category\"\n        class=\"pos-relative w-100 bg-white radius-small pd-medium\"\n      />\n\n      <!-- <div class=\"flex-v-center flex-nowrap flex\">\n        <h4  class=\"mn-r-thin t-medium\">Localization</h4>\n          \n        <button \n          @click=\"() => categories.state.current.translations.push({locale: '', text: ''})\" \n          class=\"i-small pd-thin button-delete button\"\n        >\n          +\n        </button>\n      </div> -->\n      <div \n        class=\"gap-thin mn-b-thin flex-nowrap flex\" \n        v-for=\"(item, index) in categories.state.current.translations\" \n        :key=\"index\"\n      > \n        <Field\n          v-model:field=\"item.locale\"\n          placeholder=\"Locale\"\n          class=\"w-100 bg-white radius-small pd-medium\"\n        />  \n        <Field\n          v-model:field=\"item.text\"\n          placeholder=\"Text\"\n          class=\"w-100 bg-white radius-small pd-medium\"\n        />\n        <div\n          @click=\"() => categories.state.current.translations.splice(index, 1)\"  \n          class=\"radius-small pd-small flex-center flex aspect-1x1 bg-red\"\n        >\n          <IconDelete \n            class=\"i-medium\"\n          />\n        </div>\n      </div>\n\n      \n    </Block>\n     <!-- Filters -->\n    <Block\n      title=\"Filters\"\n      placeholder=\"No filters added yet\"\n      :actions=\"[{\n        label: '+',\n        function: () => categories.state.current.filters.push({name: '', url: ''})\n      }]\"\n    >\n      <div \n        class=\"gap-thin mn-b-thin flex-nowrap flex\" \n        v-for=\"(item, index) in categories.state.current.filters\" \n        :key=\"index\"\n      > \n        <Field\n          v-model:field=\"item.name\"\n          placeholder=\"Filter name\"\n          class=\"w-100 bg-white radius-small pd-medium\"\n        />  \n        <Field\n          v-model:field=\"item.options\"\n          placeholder=\"Filter options divided by ,\"\n          class=\"w-100 bg-white radius-small pd-medium\"\n        />\n        <div\n          @click=\"() => categories.state.current.filters.splice(index, 1)\"  \n          class=\"radius-small pd-small flex-center flex aspect-1x1 bg-red\"\n        >\n          <IconDelete \n            class=\"i-medium\"\n          />\n        </div>\n      </div> \n    </Block>\n  </div>\n \n</template>\n\n<script setup>\n  // Import libs\n  import { computed, onUnmounted, onMounted, ref } from 'vue'\n  import { useRoute,useRouter } from 'vue-router'\n  \n  import IconDelete from '@martyrs/src/modules/icons/navigation/IconDelete.vue';\n\n  import Button from \"@martyrs/src/components/Button/Button.vue\";\n  import Select from \"@martyrs/src/components/Select/Select.vue\";\n  import UploadImage from '@martyrs/src/components/UploadImage/UploadImage.vue';\n  import Field from \"@martyrs/src/components/Field/Field.vue\";\n  import Feed from '@martyrs/src/components/Feed/Feed.vue'\n\n\n  import Block from '@martyrs/src/components/Block/Block.vue';\n\n  import IconCheckmark from '@martyrs/src/modules/icons/navigation/IconCheckmark.vue'\n\n  // Import the new store structure\n  import * as globals from '@martyrs/src/modules/globals/views/store/globals.js';\n  import * as auth from '@martyrs/src/modules/auth/views/store/auth.js'; \n  import * as categories from '@martyrs/src/modules/products/store/categories.js';\n\n  const route = useRoute()\n  const router = useRouter()\n\n  const emits = defineEmits(['page-loading', 'page-loaded']);\n\n  // Data prefetching\n  const isLoading = ref(true)\n  onMounted(async () => {\n    emits('page-loading');\n    if (route.params.category) {\n      await categories.actions.read({url: route.params.category})\n    } else {\n      categories.actions.clean() // Adjusted based on the new store's method to reset the category state\n    }\n\n    emits('page-loaded');\n    isLoading.value = false\n  })\n\n  // Accessing state\n  const category = computed(() => categories.state.current)\n  const routePath = computed(() => route.name)\n\n  // Navigation Bar\n  globals.state.navigation_bar.actions = [{\n    component: IconCheckmark,\n    props: {\n      fill: \"rgb(var(--main))\" \n    },\n    condition: () => auth.state.user && auth.state.user._id,\n    action: () => onSubmit()\n  }],\n\n onUnmounted(() => {\n    globals.state.navigation_bar.actions = [];\n  });\n\n\n\n  // Functions\n  async function onSubmit() {\n    if (route.params.category) {\n\n      categories.state.current.creator = {\n        type: categories.state.current.creator.type,\n        hidden: categories.state.current.creator.hidden,\n        target: categories.state.current.creator.target._id\n      }\n\n      categories.state.current.owner = {\n        type: categories.state.current.owner.type,\n        target: categories.state.current.owner.target._id\n      }\n\n      await categories.actions.update(categories.state.current)\n\n      redirectTo()\n    } else {\n\n      categories.state.current.creator = {\n        type: 'user',\n        hidden: false,\n        target: auth.state.user._id\n      }\n\n      categories.state.current.owner = {\n        type: route.params._id ? 'organization' : 'platform',\n        hidden: false,\n        target: route.params._id ? route.params._id : null\n      }\n\n      await categories.actions.create(categories.state.current)\n      redirectTo()\n    }\n  }\n\n  function redirectTo () {\n    router.push({\n      name: 'Categories', \n      params: { \n        _id: route.params._id\n      } \n    })\n  }\n</script>\n\n<style lang=\"scss\">\n.container {\n  max-width: 100%;\n  margin: auto;\n}\n\n.grid {\n \n}\n\n.square {\n  aspect-ratio: 1 / 1;\n  height: 100%;\n  background: #ccc;\n}\n</style>\n"],"names":["useRoute","useRouter","ref","onMounted","categories.actions","computed","categories.state","globals.state","IconCheckmark","auth.state","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkKE,UAAM,QAAQA,UAAQ,SAAA;AACtB,UAAM,SAASC,UAAS,UAAA;AAExB,UAAM,QAAQ;AAGd,UAAM,YAAYC,IAAAA,IAAI,IAAI;AAC1BC,QAAAA,UAAU,YAAY;AACpB,YAAM,cAAc;AACpB,UAAI,MAAM,OAAO,UAAU;AACzB,cAAMC,WAAAA,QAAmB,KAAK,EAAC,KAAK,MAAM,OAAO,SAAQ,CAAC;AAAA,MAChE,OAAW;AACLA,mBAAAA,QAAmB,MAAO;AAAA,MAChC;AAEI,YAAM,aAAa;AACnB,gBAAU,QAAQ;AAAA,IACnB,CAAA;AAGgBC,QAAQ,SAAC,MAAMC,WAAAA,MAAiB,OAAO;AACtCD,QAAQ,SAAC,MAAM,MAAM,IAAI;AAG3CE,kBAAc,eAAe,UAAU,CAAC;AAAA,MACtC,WAAWC,cAAa;AAAA,MACxB,OAAO;AAAA,QACL,MAAM;AAAA,MACP;AAAA,MACD,WAAW,MAAMC,KAAU,MAAC,QAAQA,KAAU,MAAC,KAAK;AAAA,MACpD,QAAQ,MAAM,SAAQ;AAAA,IAC1B,CAAG,GAEFC,IAAAA,YAAY,MAAM;AACfH,oBAAc,eAAe,UAAU,CAAE;AAAA,IAC7C,CAAG;AAKD,mBAAe,WAAW;AACxB,UAAI,MAAM,OAAO,UAAU;AAEzBD,mBAAgB,MAAC,QAAQ,UAAU;AAAA,UACjC,MAAMA,WAAgB,MAAC,QAAQ,QAAQ;AAAA,UACvC,QAAQA,WAAgB,MAAC,QAAQ,QAAQ;AAAA,UACzC,QAAQA,WAAgB,MAAC,QAAQ,QAAQ,OAAO;AAAA,QACxD;AAEMA,mBAAgB,MAAC,QAAQ,QAAQ;AAAA,UAC/B,MAAMA,WAAgB,MAAC,QAAQ,MAAM;AAAA,UACrC,QAAQA,WAAgB,MAAC,QAAQ,MAAM,OAAO;AAAA,QACtD;AAEM,cAAMF,WAAkB,QAAC,OAAOE,WAAAA,MAAiB,OAAO;AAExD,mBAAU;AAAA,MAChB,OAAW;AAELA,mBAAgB,MAAC,QAAQ,UAAU;AAAA,UACjC,MAAM;AAAA,UACN,QAAQ;AAAA,UACR,QAAQG,KAAU,MAAC,KAAK;AAAA,QAChC;AAEMH,mBAAgB,MAAC,QAAQ,QAAQ;AAAA,UAC/B,MAAM,MAAM,OAAO,MAAM,iBAAiB;AAAA,UAC1C,QAAQ;AAAA,UACR,QAAQ,MAAM,OAAO,MAAM,MAAM,OAAO,MAAM;AAAA,QACtD;AAEM,cAAMF,WAAkB,QAAC,OAAOE,WAAAA,MAAiB,OAAO;AACxD,mBAAU;AAAA,MAChB;AAAA,IACA;AAEE,aAAS,aAAc;AACrB,aAAO,KAAK;AAAA,QACV,MAAM;AAAA,QACN,QAAQ;AAAA,UACN,KAAK,MAAM,OAAO;AAAA,QACnB;AAAA,MACF,CAAA;AAAA,IACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -1,10 +1,10 @@
 import { ref, onMounted, computed, onUnmounted, createElementBlock, createCommentVNode, openBlock, createBlock, createVNode, withCtx, createElementVNode, toDisplayString, unref, createTextVNode, Fragment, renderList } from "vue";
 import { useRoute, useRouter } from "vue-router";
-import _sfc_main$6 from "../../../icons/navigation/IconDelete.vue.js";
-import _sfc_main$3 from "../../../../components/Button/Button.vue.js";
+import _sfc_main$5 from "../../../icons/navigation/IconDelete.vue.js";
+import _sfc_main$3 from "../../../../components/Button/Button.vue2.js";
 import Select from "../../../../components/Select/Select.vue.js";
 import _sfc_main$4 from "../../../../components/UploadImage/UploadImage.vue.js";
-import _sfc_main$5 from "../../../../components/Field/Field.vue2.js";
+import Field from "../../../../components/Field/Field.vue.js";
 /* empty css                                       */
 /* empty css                                            */
 import _sfc_main$1 from "../../../icons/navigation/IconCheckmark.vue.js";
@@ -20,14 +20,13 @@ import { actions, state } from "../../store/categories.js";
 /* empty css                  */
 const _hoisted_1 = {
   key: 0,
-  class: "pd-thin bg-white for-transition w-100"
+  class: "rows-auto pd-thin bg-white for-transition w-100"
 };
 const _hoisted_2 = { class: "mn-r-auto" };
-const _hoisted_3 = { class: "mn-b-medium w-100 flex-nowrap gap-thin flex" };
-const _hoisted_4 = { class: "mn-b-medium w-100 flex-nowrap gap-thin flex" };
-const _hoisted_5 = { class: "flex-v-center flex-nowrap flex" };
+const _hoisted_3 = { class: "cols-auto-1fr mn-b-thin w-100" };
+const _hoisted_4 = { class: "mn-b-thin w-100 flex-nowrap gap-thin flex" };
+const _hoisted_5 = ["onClick"];
 const _hoisted_6 = ["onClick"];
-const _hoisted_7 = ["onClick"];
 const _sfc_main = {
   __name: "CategoryEdit",
   emits: ["page-loading", "page-loaded"],
@@ -106,7 +105,7 @@ const _sfc_main = {
               submit: onSubmit,
               class: "pd-small radius-medium bg-main t-black uppercase t-medium"
             }, {
-              default: withCtx(() => _cache[6] || (_cache[6] = [
+              default: withCtx(() => _cache[5] || (_cache[5] = [
                 createTextVNode(" Save Category ")
               ])),
               _: 1
@@ -124,25 +123,25 @@ const _sfc_main = {
                 photo: state.current.photo,
                 "onUpdate:photo": _cache[0] || (_cache[0] = ($event) => state.current.photo = $event),
                 uploadPath: "categories",
-                class: "w-8r aspect-1x1 o-hidden mn-r-small radius-extra"
+                class: "aspect-1x1 h-100 o-hidden mn-r-small radius-extra"
               }, null, 8, ["photo"]),
-              createVNode(_sfc_main$5, {
+              createVNode(Field, {
                 field: state.current.name,
                 "onUpdate:field": _cache[1] || (_cache[1] = ($event) => state.current.name = $event),
                 label: "Name",
                 placeholder: "Enter category name",
-                class: "w-100 mn-b-small bg-white radius-small pd-medium"
+                class: "w-100 bg-white radius-small pd-medium"
               }, null, 8, ["field"])
             ]),
             createElementVNode("div", _hoisted_4, [
-              createVNode(_sfc_main$5, {
+              createVNode(Field, {
                 field: state.current.order,
                 "onUpdate:field": _cache[2] || (_cache[2] = ($event) => state.current.order = $event),
                 label: "Order",
                 disabled: true,
                 class: "w-40 bg-white radius-small pd-medium"
               }, null, 8, ["field"]),
-              createVNode(_sfc_main$5, {
+              createVNode(Field, {
                 field: state.current.url,
                 "onUpdate:field": _cache[3] || (_cache[3] = ($event) => state.current.url = $event),
                 label: "URL",
@@ -160,28 +159,21 @@ const _sfc_main = {
                 "published",
                 "removed"
               ],
-              placeholder: "Display product",
-              class: "pos-relative w-100 mn-b-small bg-white radius-small pd-medium"
+              placeholder: "Select category",
+              class: "pos-relative w-100 bg-white radius-small pd-medium"
             }, null, 8, ["select"]),
-            createElementVNode("div", _hoisted_5, [
-              _cache[7] || (_cache[7] = createElementVNode("h4", { class: "mn-r-thin t-medium" }, "Localization", -1)),
-              createElementVNode("button", {
-                onClick: _cache[5] || (_cache[5] = () => state.current.translations.push({ locale: "", text: "" })),
-                class: "i-small pd-thin button-delete button"
-              }, " + ")
-            ]),
             (openBlock(true), createElementBlock(Fragment, null, renderList(state.current.translations, (item, index) => {
               return openBlock(), createElementBlock("div", {
                 class: "gap-thin mn-b-thin flex-nowrap flex",
                 key: index
               }, [
-                createVNode(_sfc_main$5, {
+                createVNode(Field, {
                   field: item.locale,
                   "onUpdate:field": ($event) => item.locale = $event,
                   placeholder: "Locale",
                   class: "w-100 bg-white radius-small pd-medium"
                 }, null, 8, ["field", "onUpdate:field"]),
-                createVNode(_sfc_main$5, {
+                createVNode(Field, {
                   field: item.text,
                   "onUpdate:field": ($event) => item.text = $event,
                   placeholder: "Text",
@@ -191,8 +183,8 @@ const _sfc_main = {
                   onClick: () => state.current.translations.splice(index, 1),
                   class: "radius-small pd-small flex-center flex aspect-1x1 bg-red"
                 }, [
-                  createVNode(_sfc_main$6, { class: "i-medium" })
-                ], 8, _hoisted_6)
+                  createVNode(_sfc_main$5, { class: "i-medium" })
+                ], 8, _hoisted_5)
               ]);
             }), 128))
           ]),
@@ -212,13 +204,13 @@ const _sfc_main = {
                 class: "gap-thin mn-b-thin flex-nowrap flex",
                 key: index
               }, [
-                createVNode(_sfc_main$5, {
+                createVNode(Field, {
                   field: item.name,
                   "onUpdate:field": ($event) => item.name = $event,
                   placeholder: "Filter name",
                   class: "w-100 bg-white radius-small pd-medium"
                 }, null, 8, ["field", "onUpdate:field"]),
-                createVNode(_sfc_main$5, {
+                createVNode(Field, {
                   field: item.options,
                   "onUpdate:field": ($event) => item.options = $event,
                   placeholder: "Filter options divided by ,",
@@ -228,8 +220,8 @@ const _sfc_main = {
                   onClick: () => state.current.filters.splice(index, 1),
                   class: "radius-small pd-small flex-center flex aspect-1x1 bg-red"
                 }, [
-                  createVNode(_sfc_main$6, { class: "i-medium" })
-                ], 8, _hoisted_7)
+                  createVNode(_sfc_main$5, { class: "i-medium" })
+                ], 8, _hoisted_6)
               ]);
             }), 128))
           ]),