@ozdao/martyrs 0.2.480 → 0.2.482

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

@@ -2,7 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
 const Loader = require("../Loader/Loader.vue2.cjs");
-;/* empty css              */
+;/* empty css             */
 const _hoisted_1 = ["disabled"];
 const _hoisted_2 = {
   key: 2,
@@ -128,4 +128,4 @@ const _sfc_main = {
   }
 };
 exports.default = _sfc_main;
-//# sourceMappingURL=Button.vue.cjs.map
+//# sourceMappingURL=Button.vue2.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.vue2.cjs","sources":["../../../../../src/components/Button/Button.vue"],"sourcesContent":["<script setup>\n\timport { ref } from 'vue'\n\n\timport Loader from '@martyrs/src/components/Loader/Loader.vue'\n\n\tconst props = defineProps({\n\t\tsubmit: {\n\t\t\ttype: Function,\n\t\t\tdefault: async () => { console.log('Button click.') }\n\t\t},\n\t\ttext: {\n\t\t\ttype: Object,\n\t\t\tdefault: (textComponent) => {\n\t\t\t\treturn textComponent = {\n\t\t\t\t\t...textComponent.text,\n\t\t\t\t\tsuccess: '✔',\n\t\t\t\t\terror: '✖'\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\tcounter: {\n\t    type: Object\n\t  },\n\t\tcallback: {\n\t\t\ttype: Function,\n\t\t\tdefault: async () => { console.log('Button callback.') }\n\t\t},\n\t\tcallbackDelay: {\n\t\t\ttype: Number,\n\t\t\tdefault: 750\n\t\t},\n\t\tshowSucces: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true\n\t\t},\n\t\tshowLoader: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true\n\t\t},\n\t\tvalidation: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false\n\t\t},\n\t})\t\n\n\tconst emits = defineEmits(['error'])\n\n\tconst button = ref(null);\n\tconst error = ref(null);\n\tconst loading = ref(false);\n\tconst finished = ref(false);\n\n\tasync function Submit() {\n\t\t\tconsole.log('click')\n\t\t\t\n\t    button.value.style['pointer-events'] = 'none';\n\t    error.value = null;\n\t    loading.value = true;\n\n\t    // Функция для сброса состояния кнопки.\n\t    const resetButton = () => {\n        if (button.value) {\n          // button.value.classList.replace('bg-second', 'bg-main');\n          button.value.style.pointerEvents = 'auto';\n          loading.value = false;\n          finished.value = false;\n          error.value = null;\n        }\n\t    };\n\n\t    try {\n        await props.submit();\n\n        button.value.classList.replace('bg-main', 'bg-second');\n\n        loading.value = false;\n\n        // Используем функцию сброса состояния кнопки здесь.\n        if (props.showSucces) { \n\t\t\t\t\tfinished.value = true;\n          setTimeout(resetButton, 500);\n        } else {\n          resetButton();\n        }\n\n        // Если есть callback, мы также установим таймер для его вызова.\n        if (props.callback) setTimeout(() => props.callback(), props.callbackDelay);\n\n\t    } catch (err) {\n    \t\temits('error',err)\n        // Если возникла ошибка, мы изменяем стили и устанавливаем сообщение об ошибке.\n        button.value.classList.replace('bg-main', 'bg-fourth-nano');\n        error.value = props.error;\n        \n        // После задержки снова сбрасываем состояние кнопки.\n        setTimeout(() => {\n          resetButton();\n          // Так как класс кнопки был изменен, вернем его в исходное состояние.\n          button.value.classList.replace('bg-fourth-nano', 'bg-main');\n        }, 1330);\n\t    }\n\t}\n\n</script>\n\n<template>\n\t<button @click.stop=\"Submit\" :disabled=\"validation\" ref=\"button\" class=\"button\">\n\t\t<transition name=\"FromTop\" >\n\t\t\t<!-- Slot -->\n\t\t\t<template v-if=\"!loading && !error && !finished || !showLoader\"><slot></slot></template>\n\t\t\t<!-- Loading Circle Animation -->\n\t\t\t<template v-else-if=\"loading && !error && showLoader\"><Loader  class=\"pos-relative pos-t-0 pos-l-0 loading\"/></template>\n\t\t\t<!-- <Loader v-else-if=\"loading && !error && showLoader\"/> -->\n\t\t\t<!-- Success -->\n\t\t\t<span v-else-if=\"finished && showSucces\" class=\"t-semi t-center w-100  loading t-black\">{{text.success}}</span>\n\t\t\t<!-- Error if not finished -->\n\t\t\t<span v-else-if=\"error\" class=\"t-center w-100 error\">{{ error }}</span>\n\t\t</transition>\n\t\t<!-- Counter -->\n\t\t<div v-if=\"counter\" class=\"button-counter flex-center\"><span>{{counter}}</span></div> \n\n\t</button> \n</template>\n\n\n<style lang=\"scss\">\n\t.FromTop-enter-active,\n\t.FromTop-leave-active {\n\t\ttransform: translateY(0);\n\t\topacity: 1;\n\t\ttransition: all 0.5s ease; \n\t\t\n\t}\n\t.FromTop-enter-from,\n\t.FromTop-leave-to {\n\t\tposition: absolute;\n\t\ttransform: translateY(-1rem);\n\t\topacity: 0;\n\t\ttransition: all 0.5s ease;\n\t}\n\n\tbutton[disabled] {\n\t\topacity: 0.75  !important;\n\t \tpointer-events: none  !important;\n\t \tcursor: default  !important;\n\t \tcolor: rgba(var(--dark), 0.33)  !important;\n\t\tbackground: rgba(var(--light), 1) !important; \n\t}\n\n\ta.button {\n\t\t\ttext-box: trim-both cap alphabetic;\n\t}\n\n\t.button {\n\t\tdisplay: flex;\n\n\t\tpadding: 0.5rem;\n\t\tborder-radius: 3rem;\n\t\ttext-box: trim-both cap alphabetic;\n\n\t\ttransform: scale(1);\n\t\topacity: 1;\n\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\t\n\t\tcolor: black;\n\t\ttext-align: center;\n\t\ttext-transform: uppercase;\n\t\tfont-size: 1rem;\n\t\tletter-spacing: 5%;\n\n\t\ttransition: all 0.33s ease;\n\t \n\t\t&:hover {\n\t\t\tcursor: pointer;\n\t\t\topacity: 0.9;\n\t\t}\n\n\t\t&:active {\n\t\t\ttransform: scale(0.95);\n\t\t}\n\n\t\t&-small {\n\t\t\tpadding: 0.75rem;\n\t\t\tborder-radius: 0.5rem;\n\t\t\theight: fit-content;\n\t\t}\n\n\t\t.button-counter {\n\t\t\tposition: absolute;\n\t\t\tright: -8px;\n\t    bottom: -8px;\n\t    background: yellow;\n\t    height: 16px;\n\t    border-radius: 16px;\n\t    width: 16px;\n\t    font-weight: 500;\n\t    text-align: center;\n\t    line-height: 16px;\n\t    font-size: 10px;\n\t\t}\n\t}\n</style>"],"names":["ref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKC,UAAM,QAAQ;AAwCd,UAAM,QAAQ;AAEd,UAAM,SAASA,IAAG,IAAC,IAAI;AACvB,UAAM,QAAQA,IAAG,IAAC,IAAI;AACtB,UAAM,UAAUA,IAAG,IAAC,KAAK;AACzB,UAAM,WAAWA,IAAG,IAAC,KAAK;AAE1B,mBAAe,SAAS;AACtB,cAAQ,IAAI,OAAO;AAEjB,aAAO,MAAM,MAAM,gBAAgB,IAAI;AACvC,YAAM,QAAQ;AACd,cAAQ,QAAQ;AAGhB,YAAM,cAAc,MAAM;AACvB,YAAI,OAAO,OAAO;AAEhB,iBAAO,MAAM,MAAM,gBAAgB;AACnC,kBAAQ,QAAQ;AAChB,mBAAS,QAAQ;AACjB,gBAAM,QAAQ;AAAA,QACxB;AAAA,MACM;AAED,UAAI;AACD,cAAM,MAAM,OAAQ;AAEpB,eAAO,MAAM,UAAU,QAAQ,WAAW,WAAW;AAErD,gBAAQ,QAAQ;AAGhB,YAAI,MAAM,YAAY;AACzB,mBAAS,QAAQ;AACZ,qBAAW,aAAa,GAAG;AAAA,QACrC,OAAe;AACL,sBAAa;AAAA,QACvB;AAGQ,YAAI,MAAM,SAAU,YAAW,MAAM,MAAM,SAAU,GAAE,MAAM,aAAa;AAAA,MAE5E,SAAQ,KAAK;AACb,cAAM,SAAQ,GAAG;AAEf,eAAO,MAAM,UAAU,QAAQ,WAAW,gBAAgB;AAC1D,cAAM,QAAQ,MAAM;AAGpB,mBAAW,MAAM;AACf,sBAAa;AAEb,iBAAO,MAAM,UAAU,QAAQ,kBAAkB,SAAS;AAAA,QAC3D,GAAE,IAAI;AAAA,MACf;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -1,6 +1,6 @@
 import { ref, createElementBlock, openBlock, withModifiers, createVNode, createCommentVNode, Transition, withCtx, renderSlot, createBlock, toDisplayString, createElementVNode } from "vue";
 import Loader from "../Loader/Loader.vue2.js";
-/* empty css            */
+/* empty css           */
 const _hoisted_1 = ["disabled"];
 const _hoisted_2 = {
   key: 2,
@@ -128,4 +128,4 @@ const _sfc_main = {
 export {
   _sfc_main as default
 };
-//# sourceMappingURL=Button.vue.js.map
+//# sourceMappingURL=Button.vue2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Button.vue.cjs","sources":["../../../../../src/components/Button/Button.vue"],"sourcesContent":["<script setup>\n\timport { ref } from 'vue'\n\n\timport Loader from '@martyrs/src/components/Loader/Loader.vue'\n\n\tconst props = defineProps({\n\t\tsubmit: {\n\t\t\ttype: Function,\n\t\t\tdefault: async () => { console.log('Button click.') }\n\t\t},\n\t\ttext: {\n\t\t\ttype: Object,\n\t\t\tdefault: (textComponent) => {\n\t\t\t\treturn textComponent = {\n\t\t\t\t\t...textComponent.text,\n\t\t\t\t\tsuccess: '✔',\n\t\t\t\t\terror: '✖'\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\tcounter: {\n\t    type: Object\n\t  },\n\t\tcallback: {\n\t\t\ttype: Function,\n\t\t\tdefault: async () => { console.log('Button callback.') }\n\t\t},\n\t\tcallbackDelay: {\n\t\t\ttype: Number,\n\t\t\tdefault: 750\n\t\t},\n\t\tshowSucces: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true\n\t\t},\n\t\tshowLoader: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true\n\t\t},\n\t\tvalidation: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false\n\t\t},\n\t})\t\n\n\tconst emits = defineEmits(['error'])\n\n\tconst button = ref(null);\n\tconst error = ref(null);\n\tconst loading = ref(false);\n\tconst finished = ref(false);\n\n\tasync function Submit() {\n\t\t\tconsole.log('click')\n\t\t\t\n\t    button.value.style['pointer-events'] = 'none';\n\t    error.value = null;\n\t    loading.value = true;\n\n\t    // Функция для сброса состояния кнопки.\n\t    const resetButton = () => {\n        if (button.value) {\n          // button.value.classList.replace('bg-second', 'bg-main');\n          button.value.style.pointerEvents = 'auto';\n          loading.value = false;\n          finished.value = false;\n          error.value = null;\n        }\n\t    };\n\n\t    try {\n        await props.submit();\n\n        button.value.classList.replace('bg-main', 'bg-second');\n\n        loading.value = false;\n\n        // Используем функцию сброса состояния кнопки здесь.\n        if (props.showSucces) { \n\t\t\t\t\tfinished.value = true;\n          setTimeout(resetButton, 500);\n        } else {\n          resetButton();\n        }\n\n        // Если есть callback, мы также установим таймер для его вызова.\n        if (props.callback) setTimeout(() => props.callback(), props.callbackDelay);\n\n\t    } catch (err) {\n    \t\temits('error',err)\n        // Если возникла ошибка, мы изменяем стили и устанавливаем сообщение об ошибке.\n        button.value.classList.replace('bg-main', 'bg-fourth-nano');\n        error.value = props.error;\n        \n        // После задержки снова сбрасываем состояние кнопки.\n        setTimeout(() => {\n          resetButton();\n          // Так как класс кнопки был изменен, вернем его в исходное состояние.\n          button.value.classList.replace('bg-fourth-nano', 'bg-main');\n        }, 1330);\n\t    }\n\t}\n\n</script>\n\n<template>\n\t<button @click.stop=\"Submit\" :disabled=\"validation\" ref=\"button\" class=\"button\">\n\t\t<transition name=\"FromTop\" >\n\t\t\t<!-- Slot -->\n\t\t\t<template v-if=\"!loading && !error && !finished || !showLoader\"><slot></slot></template>\n\t\t\t<!-- Loading Circle Animation -->\n\t\t\t<template v-else-if=\"loading && !error && showLoader\"><Loader  class=\"pos-relative pos-t-0 pos-l-0 loading\"/></template>\n\t\t\t<!-- <Loader v-else-if=\"loading && !error && showLoader\"/> -->\n\t\t\t<!-- Success -->\n\t\t\t<span v-else-if=\"finished && showSucces\" class=\"t-semi t-center w-100  loading t-black\">{{text.success}}</span>\n\t\t\t<!-- Error if not finished -->\n\t\t\t<span v-else-if=\"error\" class=\"t-center w-100 error\">{{ error }}</span>\n\t\t</transition>\n\t\t<!-- Counter -->\n\t\t<div v-if=\"counter\" class=\"button-counter flex-center\"><span>{{counter}}</span></div> \n\n\t</button> \n</template>\n\n\n<style lang=\"scss\">\n\t.FromTop-enter-active,\n\t.FromTop-leave-active {\n\t\ttransform: translateY(0);\n\t\topacity: 1;\n\t\ttransition: all 0.5s ease; \n\t\t\n\t}\n\t.FromTop-enter-from,\n\t.FromTop-leave-to {\n\t\tposition: absolute;\n\t\ttransform: translateY(-1rem);\n\t\topacity: 0;\n\t\ttransition: all 0.5s ease;\n\t}\n\n\tbutton[disabled] {\n\t\topacity: 0.75  !important;\n\t \tpointer-events: none  !important;\n\t \tcursor: default  !important;\n\t \tcolor: rgba(var(--black), 0.5)  !important;\n\t\tbackground: rgba(var(--grey), 1) !important; \n\t}\n\n\ta.button {\n\t\t\ttext-box: trim-both cap alphabetic;\n\t}\n\n\t.button {\n\t\tdisplay: flex;\n\n\t\tpadding: 0.5rem;\n\t\tborder-radius: 3rem;\n\t\ttext-box: trim-both cap alphabetic;\n\n\t\ttransform: scale(1);\n\t\topacity: 1;\n\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\t\n\t\tcolor: black;\n\t\ttext-align: center;\n\t\ttext-transform: uppercase;\n\t\tfont-size: 1rem;\n\t\tletter-spacing: 5%;\n\n\t\ttransition: all 0.33s ease;\n\t \n\t\t&:hover {\n\t\t\tcursor: pointer;\n\t\t\topacity: 0.9;\n\t\t}\n\n\t\t&:active {\n\t\t\ttransform: scale(0.95);\n\t\t}\n\n\t\t&-small {\n\t\t\tpadding: 0.75rem;\n\t\t\tborder-radius: 0.5rem;\n\t\t\theight: fit-content;\n\t\t}\n\n\t\t.button-counter {\n\t\t\tposition: absolute;\n\t\t\tright: -8px;\n\t    bottom: -8px;\n\t    background: yellow;\n\t    height: 16px;\n\t    border-radius: 16px;\n\t    width: 16px;\n\t    font-weight: 500;\n\t    text-align: center;\n\t    line-height: 16px;\n\t    font-size: 10px;\n\t\t}\n\t}\n</style>"],"names":["ref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKC,UAAM,QAAQ;AAwCd,UAAM,QAAQ;AAEd,UAAM,SAASA,IAAG,IAAC,IAAI;AACvB,UAAM,QAAQA,IAAG,IAAC,IAAI;AACtB,UAAM,UAAUA,IAAG,IAAC,KAAK;AACzB,UAAM,WAAWA,IAAG,IAAC,KAAK;AAE1B,mBAAe,SAAS;AACtB,cAAQ,IAAI,OAAO;AAEjB,aAAO,MAAM,MAAM,gBAAgB,IAAI;AACvC,YAAM,QAAQ;AACd,cAAQ,QAAQ;AAGhB,YAAM,cAAc,MAAM;AACvB,YAAI,OAAO,OAAO;AAEhB,iBAAO,MAAM,MAAM,gBAAgB;AACnC,kBAAQ,QAAQ;AAChB,mBAAS,QAAQ;AACjB,gBAAM,QAAQ;AAAA,QACxB;AAAA,MACM;AAED,UAAI;AACD,cAAM,MAAM,OAAQ;AAEpB,eAAO,MAAM,UAAU,QAAQ,WAAW,WAAW;AAErD,gBAAQ,QAAQ;AAGhB,YAAI,MAAM,YAAY;AACzB,mBAAS,QAAQ;AACZ,qBAAW,aAAa,GAAG;AAAA,QACrC,OAAe;AACL,sBAAa;AAAA,QACvB;AAGQ,YAAI,MAAM,SAAU,YAAW,MAAM,MAAM,SAAU,GAAE,MAAM,aAAa;AAAA,MAE5E,SAAQ,KAAK;AACb,cAAM,SAAQ,GAAG;AAEf,eAAO,MAAM,UAAU,QAAQ,WAAW,gBAAgB;AAC1D,cAAM,QAAQ,MAAM;AAGpB,mBAAW,MAAM;AACf,sBAAa;AAEb,iBAAO,MAAM,UAAU,QAAQ,kBAAkB,SAAS;AAAA,QAC3D,GAAE,IAAI;AAAA,MACf;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Button.vue2.js","sources":["../../../../../src/components/Button/Button.vue"],"sourcesContent":["<script setup>\n\timport { ref } from 'vue'\n\n\timport Loader from '@martyrs/src/components/Loader/Loader.vue'\n\n\tconst props = defineProps({\n\t\tsubmit: {\n\t\t\ttype: Function,\n\t\t\tdefault: async () => { console.log('Button click.') }\n\t\t},\n\t\ttext: {\n\t\t\ttype: Object,\n\t\t\tdefault: (textComponent) => {\n\t\t\t\treturn textComponent = {\n\t\t\t\t\t...textComponent.text,\n\t\t\t\t\tsuccess: '✔',\n\t\t\t\t\terror: '✖'\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\tcounter: {\n\t    type: Object\n\t  },\n\t\tcallback: {\n\t\t\ttype: Function,\n\t\t\tdefault: async () => { console.log('Button callback.') }\n\t\t},\n\t\tcallbackDelay: {\n\t\t\ttype: Number,\n\t\t\tdefault: 750\n\t\t},\n\t\tshowSucces: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true\n\t\t},\n\t\tshowLoader: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true\n\t\t},\n\t\tvalidation: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false\n\t\t},\n\t})\t\n\n\tconst emits = defineEmits(['error'])\n\n\tconst button = ref(null);\n\tconst error = ref(null);\n\tconst loading = ref(false);\n\tconst finished = ref(false);\n\n\tasync function Submit() {\n\t\t\tconsole.log('click')\n\t\t\t\n\t    button.value.style['pointer-events'] = 'none';\n\t    error.value = null;\n\t    loading.value = true;\n\n\t    // Функция для сброса состояния кнопки.\n\t    const resetButton = () => {\n        if (button.value) {\n          // button.value.classList.replace('bg-second', 'bg-main');\n          button.value.style.pointerEvents = 'auto';\n          loading.value = false;\n          finished.value = false;\n          error.value = null;\n        }\n\t    };\n\n\t    try {\n        await props.submit();\n\n        button.value.classList.replace('bg-main', 'bg-second');\n\n        loading.value = false;\n\n        // Используем функцию сброса состояния кнопки здесь.\n        if (props.showSucces) { \n\t\t\t\t\tfinished.value = true;\n          setTimeout(resetButton, 500);\n        } else {\n          resetButton();\n        }\n\n        // Если есть callback, мы также установим таймер для его вызова.\n        if (props.callback) setTimeout(() => props.callback(), props.callbackDelay);\n\n\t    } catch (err) {\n    \t\temits('error',err)\n        // Если возникла ошибка, мы изменяем стили и устанавливаем сообщение об ошибке.\n        button.value.classList.replace('bg-main', 'bg-fourth-nano');\n        error.value = props.error;\n        \n        // После задержки снова сбрасываем состояние кнопки.\n        setTimeout(() => {\n          resetButton();\n          // Так как класс кнопки был изменен, вернем его в исходное состояние.\n          button.value.classList.replace('bg-fourth-nano', 'bg-main');\n        }, 1330);\n\t    }\n\t}\n\n</script>\n\n<template>\n\t<button @click.stop=\"Submit\" :disabled=\"validation\" ref=\"button\" class=\"button\">\n\t\t<transition name=\"FromTop\" >\n\t\t\t<!-- Slot -->\n\t\t\t<template v-if=\"!loading && !error && !finished || !showLoader\"><slot></slot></template>\n\t\t\t<!-- Loading Circle Animation -->\n\t\t\t<template v-else-if=\"loading && !error && showLoader\"><Loader  class=\"pos-relative pos-t-0 pos-l-0 loading\"/></template>\n\t\t\t<!-- <Loader v-else-if=\"loading && !error && showLoader\"/> -->\n\t\t\t<!-- Success -->\n\t\t\t<span v-else-if=\"finished && showSucces\" class=\"t-semi t-center w-100  loading t-black\">{{text.success}}</span>\n\t\t\t<!-- Error if not finished -->\n\t\t\t<span v-else-if=\"error\" class=\"t-center w-100 error\">{{ error }}</span>\n\t\t</transition>\n\t\t<!-- Counter -->\n\t\t<div v-if=\"counter\" class=\"button-counter flex-center\"><span>{{counter}}</span></div> \n\n\t</button> \n</template>\n\n\n<style lang=\"scss\">\n\t.FromTop-enter-active,\n\t.FromTop-leave-active {\n\t\ttransform: translateY(0);\n\t\topacity: 1;\n\t\ttransition: all 0.5s ease; \n\t\t\n\t}\n\t.FromTop-enter-from,\n\t.FromTop-leave-to {\n\t\tposition: absolute;\n\t\ttransform: translateY(-1rem);\n\t\topacity: 0;\n\t\ttransition: all 0.5s ease;\n\t}\n\n\tbutton[disabled] {\n\t\topacity: 0.75  !important;\n\t \tpointer-events: none  !important;\n\t \tcursor: default  !important;\n\t \tcolor: rgba(var(--dark), 0.33)  !important;\n\t\tbackground: rgba(var(--light), 1) !important; \n\t}\n\n\ta.button {\n\t\t\ttext-box: trim-both cap alphabetic;\n\t}\n\n\t.button {\n\t\tdisplay: flex;\n\n\t\tpadding: 0.5rem;\n\t\tborder-radius: 3rem;\n\t\ttext-box: trim-both cap alphabetic;\n\n\t\ttransform: scale(1);\n\t\topacity: 1;\n\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\t\n\t\tcolor: black;\n\t\ttext-align: center;\n\t\ttext-transform: uppercase;\n\t\tfont-size: 1rem;\n\t\tletter-spacing: 5%;\n\n\t\ttransition: all 0.33s ease;\n\t \n\t\t&:hover {\n\t\t\tcursor: pointer;\n\t\t\topacity: 0.9;\n\t\t}\n\n\t\t&:active {\n\t\t\ttransform: scale(0.95);\n\t\t}\n\n\t\t&-small {\n\t\t\tpadding: 0.75rem;\n\t\t\tborder-radius: 0.5rem;\n\t\t\theight: fit-content;\n\t\t}\n\n\t\t.button-counter {\n\t\t\tposition: absolute;\n\t\t\tright: -8px;\n\t    bottom: -8px;\n\t    background: yellow;\n\t    height: 16px;\n\t    border-radius: 16px;\n\t    width: 16px;\n\t    font-weight: 500;\n\t    text-align: center;\n\t    line-height: 16px;\n\t    font-size: 10px;\n\t\t}\n\t}\n</style>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKC,UAAM,QAAQ;AAwCd,UAAM,QAAQ;AAEd,UAAM,SAAS,IAAI,IAAI;AACvB,UAAM,QAAQ,IAAI,IAAI;AACtB,UAAM,UAAU,IAAI,KAAK;AACzB,UAAM,WAAW,IAAI,KAAK;AAE1B,mBAAe,SAAS;AACtB,cAAQ,IAAI,OAAO;AAEjB,aAAO,MAAM,MAAM,gBAAgB,IAAI;AACvC,YAAM,QAAQ;AACd,cAAQ,QAAQ;AAGhB,YAAM,cAAc,MAAM;AACvB,YAAI,OAAO,OAAO;AAEhB,iBAAO,MAAM,MAAM,gBAAgB;AACnC,kBAAQ,QAAQ;AAChB,mBAAS,QAAQ;AACjB,gBAAM,QAAQ;AAAA,QACxB;AAAA,MACM;AAED,UAAI;AACD,cAAM,MAAM,OAAQ;AAEpB,eAAO,MAAM,UAAU,QAAQ,WAAW,WAAW;AAErD,gBAAQ,QAAQ;AAGhB,YAAI,MAAM,YAAY;AACzB,mBAAS,QAAQ;AACZ,qBAAW,aAAa,GAAG;AAAA,QACrC,OAAe;AACL,sBAAa;AAAA,QACvB;AAGQ,YAAI,MAAM,SAAU,YAAW,MAAM,MAAM,SAAU,GAAE,MAAM,aAAa;AAAA,MAE5E,SAAQ,KAAK;AACb,cAAM,SAAQ,GAAG;AAEf,eAAO,MAAM,UAAU,QAAQ,WAAW,gBAAgB;AAC1D,cAAM,QAAQ,MAAM;AAGpB,mBAAW,MAAM;AACf,sBAAa;AAEb,iBAAO,MAAM,UAAU,QAAQ,kBAAkB,SAAS;AAAA,QAC3D,GAAE,IAAI;AAAA,MACf;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Checkbox/Checkbox.vue.cjs

@@ -1,12 +1,17 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
+const IconCheckmark = require("../../modules/icons/navigation/IconCheckmark.vue.cjs");
 const _hoisted_1 = { class: "flex-v-center flex-nowrap flex" };
 const _hoisted_2 = {
   key: 0,
   class: "mn-r-auto t-transp mn-r-small"
 };
 const _hoisted_3 = ["name", "value", "checked"];
+const _hoisted_4 = {
+  key: 1,
+  class: "t-white w-100 h-100 flex flex-center"
+};
 const _sfc_main = {
   __name: "Checkbox",
   props: {
@@ -20,6 +25,11 @@ const _sfc_main = {
     theme: {
       type: String,
       default: "light"
+    },
+    mode: {
+      type: String,
+      default: "switch",
+      validator: (v) => ["switch", "checkbox"].includes(v)
     }
   },
   emits: ["update:radio"],
@@ -56,18 +66,29 @@ const _sfc_main = {
           checked: Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio
         }, null, 40, _hoisted_3),
         vue.createElementVNode("div", {
-          class: vue.normalizeClass(["transition-elastic cursor-pointer mn-l-thin pd-thin h-2r w-4r radius-extra", {
-            "bg-dark": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.theme === "dark",
-            "bg-light": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.theme === "light",
-            "bg-main": Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio
+          class: vue.normalizeClass(["cursor-pointer mn-l-thin flex-center", {
+            "transition-elastic pd-thin h-2r w-4r radius-extra": __props.mode === "switch",
+            "w-2r h-2r radius-small br-solid br-1px": __props.mode === "checkbox",
+            "bg-dark": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.theme === "dark" && __props.mode === "switch",
+            "bg-light": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.theme === "light" && __props.mode === "switch",
+            "br-dark": __props.theme === "dark" && __props.mode === "checkbox",
+            "br-light": __props.theme === "light" && __props.mode === "checkbox",
+            "bg-main": (Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.mode === "switch",
+            "bg-main br-main": (Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.mode === "checkbox"
           }])
         }, [
-          vue.createElementVNode("div", {
-            class: vue.normalizeClass(["transition-linear w-1r h-1r radius-extra h-100 bg-white", {
+          __props.mode === "switch" ? (vue.openBlock(), vue.createElementBlock("div", {
+            key: 0,
+            class: vue.normalizeClass(["transition-linear w-1r h-1r radius-extra bg-white", {
               "mn-r-auto": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio),
               "mn-l-auto": Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio
             }])
-          }, null, 2)
+          }, null, 2)) : __props.mode === "checkbox" && (Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, [
+            vue.createVNode(IconCheckmark.default, {
+              class: "i-medium",
+              fill: "rgb(var(--white))"
+            })
+          ])) : vue.createCommentVNode("", true)
         ], 2)
       ]);
     };

package/dist/martyrs/src/components/Checkbox/Checkbox.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.vue.cjs","sources":["../../../../../src/components/Checkbox/Checkbox.vue"],"sourcesContent":["<script setup>\n  import { ref, watch, computed } from 'vue'\n\n  const props = defineProps({\n    label: String,\n    name: String,\n    value: String,\n    radio: {\n      type: [Array, Boolean, Object],\n      default: () => []\n    },\n    theme: {\n      type: String,\n      default: \"light\"\n    }\n  })\n\n  const emit = defineEmits(['update:radio'])\n\n  const updateInputText = (event) => {\n    if (Array.isArray(props.radio)) {\n      let newRadio = [...props.radio];  // создаем копию массива для иммутабельности\n      if (event.target.checked) {\n        newRadio.push(props.value);\n      } else {\n        const index = newRadio.indexOf(props.value);\n        if (index !== -1) {\n          newRadio.splice(index, 1);\n        }\n      }\n      emit('update:radio', newRadio);\n    } else if (typeof props.radio === 'boolean') {\n      emit('update:radio', event.target.checked);\n    }\n  }\n</script>\n\n<template>\n\n  <label class=\"flex-v-center flex-nowrap flex\">\n    <div v-if=\"label\" class=\"mn-r-auto t-transp mn-r-small\">\n      <span>{{label}}</span>\n    </div>\n\n    <input \n      @change=\"updateInputText\"\n      class=\"round radiobutton\" \n      type=\"checkbox\" \n      :name=\"name\" \n      :value=\"value\"\n      :checked=\"Array.isArray(radio) ? radio.includes(value) : radio\"\n    > \n\n    <div \n      class=\"transition-elastic cursor-pointer mn-l-thin pd-thin h-2r w-4r radius-extra\"\n      :class=\"{\n        'bg-dark':!(Array.isArray(radio) ? radio.includes(value) : radio) && theme === 'dark',\n        'bg-light':!(Array.isArray(radio) ? radio.includes(value) : radio) && theme === 'light',\n        'bg-main':Array.isArray(radio) ? radio.includes(value) : radio,\n      }\"\n\n    >\n      <div \n        class=\"transition-linear w-1r h-1r radius-extra h-100 bg-white\"\n        :class=\"{\n          'mn-r-auto':!(Array.isArray(radio) ? radio.includes(value) : radio),\n          'mn-l-auto':Array.isArray(radio) ? radio.includes(value) : radio,\n        }\"\n      >\n      </div>\n    </div>\n  </label>\n\n</template>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAGE,UAAM,QAAQ;AAcd,UAAM,OAAO;AAEb,UAAM,kBAAkB,CAAC,UAAU;AACjC,UAAI,MAAM,QAAQ,MAAM,KAAK,GAAG;AAC9B,YAAI,WAAW,CAAC,GAAG,MAAM,KAAK;AAC9B,YAAI,MAAM,OAAO,SAAS;AACxB,mBAAS,KAAK,MAAM,KAAK;AAAA,QACjC,OAAa;AACL,gBAAM,QAAQ,SAAS,QAAQ,MAAM,KAAK;AAC1C,cAAI,UAAU,IAAI;AAChB,qBAAS,OAAO,OAAO,CAAC;AAAA,UAClC;AAAA,QACA;AACM,aAAK,gBAAgB,QAAQ;AAAA,MAC9B,WAAU,OAAO,MAAM,UAAU,WAAW;AAC3C,aAAK,gBAAgB,MAAM,OAAO,OAAO;AAAA,MAC/C;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Checkbox.vue.cjs","sources":["../../../../../src/components/Checkbox/Checkbox.vue"],"sourcesContent":["<script setup>\n  import { ref, watch, computed } from 'vue'\n\n  import IconCheckmark from '@martyrs/src/modules/icons/navigation/IconCheckmark.vue';\n\n  const props = defineProps({\n    label: String,\n    name: String,\n    value: String,\n    radio: {\n      type: [Array, Boolean, Object],\n      default: () => []\n    },\n    theme: {\n      type: String,\n      default: \"light\"\n    },\n    mode: {\n      type: String,\n      default: \"switch\",\n      validator: (v) => [\"switch\", \"checkbox\"].includes(v)\n    }\n  })\n  const emit = defineEmits(['update:radio'])\n  const updateInputText = (event) => {\n    if (Array.isArray(props.radio)) {\n      let newRadio = [...props.radio];  // создаем копию массива для иммутабельности\n      if (event.target.checked) {\n        newRadio.push(props.value);\n      } else {\n        const index = newRadio.indexOf(props.value);\n        if (index !== -1) {\n          newRadio.splice(index, 1);\n        }\n      }\n      emit('update:radio', newRadio);\n    } else if (typeof props.radio === 'boolean') {\n      emit('update:radio', event.target.checked);\n    }\n  }\n</script>\n<template>\n  <label class=\"flex-v-center flex-nowrap flex\">\n    <div v-if=\"label\" class=\"mn-r-auto t-transp mn-r-small\">\n      <span>{{label}}</span>\n    </div>\n    <input \n      @change=\"updateInputText\"\n      class=\"round radiobutton\" \n      type=\"checkbox\" \n      :name=\"name\" \n      :value=\"value\"\n      :checked=\"Array.isArray(radio) ? radio.includes(value) : radio\"\n    > \n    <div \n      class=\"cursor-pointer mn-l-thin flex-center\"\n      :class=\"{\n        'transition-elastic pd-thin h-2r w-4r radius-extra': mode === 'switch',\n        'w-2r h-2r radius-small br-solid br-1px': mode === 'checkbox',\n        'bg-dark': !(Array.isArray(radio) ? radio.includes(value) : radio) && theme === 'dark' && mode === 'switch',\n        'bg-light': !(Array.isArray(radio) ? radio.includes(value) : radio) && theme === 'light' && mode === 'switch',\n        'br-dark': theme === 'dark' && mode === 'checkbox',\n        'br-light': theme === 'light' && mode === 'checkbox',\n        'bg-main': (Array.isArray(radio) ? radio.includes(value) : radio) && mode === 'switch',\n        'bg-main br-main': (Array.isArray(radio) ? radio.includes(value) : radio) && mode === 'checkbox',\n      }\"\n    >\n      <!-- Switch toggle circle -->\n      <div \n        v-if=\"mode === 'switch'\"\n        class=\"transition-linear w-1r h-1r radius-extra bg-white\"\n        :class=\"{\n          'mn-r-auto': !(Array.isArray(radio) ? radio.includes(value) : radio),\n          'mn-l-auto': Array.isArray(radio) ? radio.includes(value) : radio,\n        }\"\n      />\n      <!-- Checkbox checkmark -->\n      <span \n        v-else-if=\"mode === 'checkbox' && (Array.isArray(radio) ? radio.includes(value) : radio)\"\n        class=\"t-white w-100 h-100 flex flex-center\"\n      >\n        <IconCheckmark class=\"i-medium\" fill=\"rgb(var(--white))\" />\n      </span>\n    </div>\n  </label>\n</template>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKE,UAAM,QAAQ;AAkBd,UAAM,OAAO;AACb,UAAM,kBAAkB,CAAC,UAAU;AACjC,UAAI,MAAM,QAAQ,MAAM,KAAK,GAAG;AAC9B,YAAI,WAAW,CAAC,GAAG,MAAM,KAAK;AAC9B,YAAI,MAAM,OAAO,SAAS;AACxB,mBAAS,KAAK,MAAM,KAAK;AAAA,QACjC,OAAa;AACL,gBAAM,QAAQ,SAAS,QAAQ,MAAM,KAAK;AAC1C,cAAI,UAAU,IAAI;AAChB,qBAAS,OAAO,OAAO,CAAC;AAAA,UAClC;AAAA,QACA;AACM,aAAK,gBAAgB,QAAQ;AAAA,MAC9B,WAAU,OAAO,MAAM,UAAU,WAAW;AAC3C,aAAK,gBAAgB,MAAM,OAAO,OAAO;AAAA,MAC/C;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Checkbox/Checkbox.vue.js

@@ -1,10 +1,15 @@
-import { createElementBlock, openBlock, createCommentVNode, createElementVNode, toDisplayString, normalizeClass } from "vue";
+import { createElementBlock, openBlock, createCommentVNode, createElementVNode, toDisplayString, normalizeClass, createVNode } from "vue";
+import _sfc_main$1 from "../../modules/icons/navigation/IconCheckmark.vue.js";
 const _hoisted_1 = { class: "flex-v-center flex-nowrap flex" };
 const _hoisted_2 = {
   key: 0,
   class: "mn-r-auto t-transp mn-r-small"
 };
 const _hoisted_3 = ["name", "value", "checked"];
+const _hoisted_4 = {
+  key: 1,
+  class: "t-white w-100 h-100 flex flex-center"
+};
 const _sfc_main = {
   __name: "Checkbox",
   props: {
@@ -18,6 +23,11 @@ const _sfc_main = {
     theme: {
       type: String,
       default: "light"
+    },
+    mode: {
+      type: String,
+      default: "switch",
+      validator: (v) => ["switch", "checkbox"].includes(v)
     }
   },
   emits: ["update:radio"],
@@ -54,18 +64,29 @@ const _sfc_main = {
           checked: Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio
         }, null, 40, _hoisted_3),
         createElementVNode("div", {
-          class: normalizeClass(["transition-elastic cursor-pointer mn-l-thin pd-thin h-2r w-4r radius-extra", {
-            "bg-dark": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.theme === "dark",
-            "bg-light": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.theme === "light",
-            "bg-main": Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio
+          class: normalizeClass(["cursor-pointer mn-l-thin flex-center", {
+            "transition-elastic pd-thin h-2r w-4r radius-extra": __props.mode === "switch",
+            "w-2r h-2r radius-small br-solid br-1px": __props.mode === "checkbox",
+            "bg-dark": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.theme === "dark" && __props.mode === "switch",
+            "bg-light": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.theme === "light" && __props.mode === "switch",
+            "br-dark": __props.theme === "dark" && __props.mode === "checkbox",
+            "br-light": __props.theme === "light" && __props.mode === "checkbox",
+            "bg-main": (Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.mode === "switch",
+            "bg-main br-main": (Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) && __props.mode === "checkbox"
           }])
         }, [
-          createElementVNode("div", {
-            class: normalizeClass(["transition-linear w-1r h-1r radius-extra h-100 bg-white", {
+          __props.mode === "switch" ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass(["transition-linear w-1r h-1r radius-extra bg-white", {
               "mn-r-auto": !(Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio),
               "mn-l-auto": Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio
             }])
-          }, null, 2)
+          }, null, 2)) : __props.mode === "checkbox" && (Array.isArray(__props.radio) ? __props.radio.includes(__props.value) : __props.radio) ? (openBlock(), createElementBlock("span", _hoisted_4, [
+            createVNode(_sfc_main$1, {
+              class: "i-medium",
+              fill: "rgb(var(--white))"
+            })
+          ])) : createCommentVNode("", true)
         ], 2)
       ]);
     };

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.vue.js","sources":["../../../../../src/components/Checkbox/Checkbox.vue"],"sourcesContent":["<script setup>\n  import { ref, watch, computed } from 'vue'\n\n  const props = defineProps({\n    label: String,\n    name: String,\n    value: String,\n    radio: {\n      type: [Array, Boolean, Object],\n      default: () => []\n    },\n    theme: {\n      type: String,\n      default: \"light\"\n    }\n  })\n\n  const emit = defineEmits(['update:radio'])\n\n  const updateInputText = (event) => {\n    if (Array.isArray(props.radio)) {\n      let newRadio = [...props.radio];  // создаем копию массива для иммутабельности\n      if (event.target.checked) {\n        newRadio.push(props.value);\n      } else {\n        const index = newRadio.indexOf(props.value);\n        if (index !== -1) {\n          newRadio.splice(index, 1);\n        }\n      }\n      emit('update:radio', newRadio);\n    } else if (typeof props.radio === 'boolean') {\n      emit('update:radio', event.target.checked);\n    }\n  }\n</script>\n\n<template>\n\n  <label class=\"flex-v-center flex-nowrap flex\">\n    <div v-if=\"label\" class=\"mn-r-auto t-transp mn-r-small\">\n      <span>{{label}}</span>\n    </div>\n\n    <input \n      @change=\"updateInputText\"\n      class=\"round radiobutton\" \n      type=\"checkbox\" \n      :name=\"name\" \n      :value=\"value\"\n      :checked=\"Array.isArray(radio) ? radio.includes(value) : radio\"\n    > \n\n    <div \n      class=\"transition-elastic cursor-pointer mn-l-thin pd-thin h-2r w-4r radius-extra\"\n      :class=\"{\n        'bg-dark':!(Array.isArray(radio) ? radio.includes(value) : radio) && theme === 'dark',\n        'bg-light':!(Array.isArray(radio) ? radio.includes(value) : radio) && theme === 'light',\n        'bg-main':Array.isArray(radio) ? radio.includes(value) : radio,\n      }\"\n\n    >\n      <div \n        class=\"transition-linear w-1r h-1r radius-extra h-100 bg-white\"\n        :class=\"{\n          'mn-r-auto':!(Array.isArray(radio) ? radio.includes(value) : radio),\n          'mn-l-auto':Array.isArray(radio) ? radio.includes(value) : radio,\n        }\"\n      >\n      </div>\n    </div>\n  </label>\n\n</template>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAGE,UAAM,QAAQ;AAcd,UAAM,OAAO;AAEb,UAAM,kBAAkB,CAAC,UAAU;AACjC,UAAI,MAAM,QAAQ,MAAM,KAAK,GAAG;AAC9B,YAAI,WAAW,CAAC,GAAG,MAAM,KAAK;AAC9B,YAAI,MAAM,OAAO,SAAS;AACxB,mBAAS,KAAK,MAAM,KAAK;AAAA,QACjC,OAAa;AACL,gBAAM,QAAQ,SAAS,QAAQ,MAAM,KAAK;AAC1C,cAAI,UAAU,IAAI;AAChB,qBAAS,OAAO,OAAO,CAAC;AAAA,UAClC;AAAA,QACA;AACM,aAAK,gBAAgB,QAAQ;AAAA,MAC9B,WAAU,OAAO,MAAM,UAAU,WAAW;AAC3C,aAAK,gBAAgB,MAAM,OAAO,OAAO;AAAA,MAC/C;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Checkbox.vue.js","sources":["../../../../../src/components/Checkbox/Checkbox.vue"],"sourcesContent":["<script setup>\n  import { ref, watch, computed } from 'vue'\n\n  import IconCheckmark from '@martyrs/src/modules/icons/navigation/IconCheckmark.vue';\n\n  const props = defineProps({\n    label: String,\n    name: String,\n    value: String,\n    radio: {\n      type: [Array, Boolean, Object],\n      default: () => []\n    },\n    theme: {\n      type: String,\n      default: \"light\"\n    },\n    mode: {\n      type: String,\n      default: \"switch\",\n      validator: (v) => [\"switch\", \"checkbox\"].includes(v)\n    }\n  })\n  const emit = defineEmits(['update:radio'])\n  const updateInputText = (event) => {\n    if (Array.isArray(props.radio)) {\n      let newRadio = [...props.radio];  // создаем копию массива для иммутабельности\n      if (event.target.checked) {\n        newRadio.push(props.value);\n      } else {\n        const index = newRadio.indexOf(props.value);\n        if (index !== -1) {\n          newRadio.splice(index, 1);\n        }\n      }\n      emit('update:radio', newRadio);\n    } else if (typeof props.radio === 'boolean') {\n      emit('update:radio', event.target.checked);\n    }\n  }\n</script>\n<template>\n  <label class=\"flex-v-center flex-nowrap flex\">\n    <div v-if=\"label\" class=\"mn-r-auto t-transp mn-r-small\">\n      <span>{{label}}</span>\n    </div>\n    <input \n      @change=\"updateInputText\"\n      class=\"round radiobutton\" \n      type=\"checkbox\" \n      :name=\"name\" \n      :value=\"value\"\n      :checked=\"Array.isArray(radio) ? radio.includes(value) : radio\"\n    > \n    <div \n      class=\"cursor-pointer mn-l-thin flex-center\"\n      :class=\"{\n        'transition-elastic pd-thin h-2r w-4r radius-extra': mode === 'switch',\n        'w-2r h-2r radius-small br-solid br-1px': mode === 'checkbox',\n        'bg-dark': !(Array.isArray(radio) ? radio.includes(value) : radio) && theme === 'dark' && mode === 'switch',\n        'bg-light': !(Array.isArray(radio) ? radio.includes(value) : radio) && theme === 'light' && mode === 'switch',\n        'br-dark': theme === 'dark' && mode === 'checkbox',\n        'br-light': theme === 'light' && mode === 'checkbox',\n        'bg-main': (Array.isArray(radio) ? radio.includes(value) : radio) && mode === 'switch',\n        'bg-main br-main': (Array.isArray(radio) ? radio.includes(value) : radio) && mode === 'checkbox',\n      }\"\n    >\n      <!-- Switch toggle circle -->\n      <div \n        v-if=\"mode === 'switch'\"\n        class=\"transition-linear w-1r h-1r radius-extra bg-white\"\n        :class=\"{\n          'mn-r-auto': !(Array.isArray(radio) ? radio.includes(value) : radio),\n          'mn-l-auto': Array.isArray(radio) ? radio.includes(value) : radio,\n        }\"\n      />\n      <!-- Checkbox checkmark -->\n      <span \n        v-else-if=\"mode === 'checkbox' && (Array.isArray(radio) ? radio.includes(value) : radio)\"\n        class=\"t-white w-100 h-100 flex flex-center\"\n      >\n        <IconCheckmark class=\"i-medium\" fill=\"rgb(var(--white))\" />\n      </span>\n    </div>\n  </label>\n</template>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKE,UAAM,QAAQ;AAkBd,UAAM,OAAO;AACb,UAAM,kBAAkB,CAAC,UAAU;AACjC,UAAI,MAAM,QAAQ,MAAM,KAAK,GAAG;AAC9B,YAAI,WAAW,CAAC,GAAG,MAAM,KAAK;AAC9B,YAAI,MAAM,OAAO,SAAS;AACxB,mBAAS,KAAK,MAAM,KAAK;AAAA,QACjC,OAAa;AACL,gBAAM,QAAQ,SAAS,QAAQ,MAAM,KAAK;AAC1C,cAAI,UAAU,IAAI;AAChB,qBAAS,OAAO,OAAO,CAAC;AAAA,UAClC;AAAA,QACA;AACM,aAAK,gBAAgB,QAAQ;AAAA,MAC9B,WAAU,OAAO,MAAM,UAAU,WAAW;AAC3C,aAAK,gBAAgB,MAAM,OAAO,OAAO;AAAA,MAC/C;AAAA,IACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Chips/Chips.vue2.cjs

@@ -3,8 +3,7 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
 const vue = require("vue");
 ;/* empty css            */
 const _hoisted_1 = { class: "font-main" };
-const _hoisted_2 = { class: "text-box-trim-none t-truncate" };
-const _hoisted_3 = {
+const _hoisted_2 = {
   key: 1,
   class: "pd-b-micro pd-t-micro pd-r-thin pd-l-thin radius-small t-semi bg-white"
 };
@@ -17,12 +16,10 @@ const _sfc_main = {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
         vue.renderSlot(_ctx.$slots, "default"),
         ((_a = __props.chips) == null ? void 0 : _a.length) ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(__props.chips, (chip, index) => {
-          return vue.openBlock(), vue.createElementBlock("span", {
-            class: vue.normalizeClass([_ctx.$attrs.class || "p-medium font-main", "mn-r-nano d-inline-block w-max pd-b-micro pd-t-micro pd-r-thin pd-l-thin radius-small t-medium bg-main"])
-          }, [
-            vue.createElementVNode("span", _hoisted_2, vue.toDisplayString(chip.text ? chip.text : chip), 1)
-          ], 2);
-        }), 256)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
+          return vue.openBlock(), vue.createElementBlock("p", {
+            class: vue.normalizeClass([_ctx.$attrs.class || "p-medium font-main", "mn-r-nano d-inline-block w-max pd-thin radius-thin t-medium bg-main"])
+          }, vue.toDisplayString(chip.text ? chip.text : chip), 3);
+        }), 256)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
           vue.renderSlot(_ctx.$slots, "default")
         ]))
       ]);

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

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

package/dist/martyrs/src/components/Chips/Chips.vue2.js

@@ -1,8 +1,7 @@
-import { createElementBlock, openBlock, renderSlot, Fragment, renderList, normalizeClass, createElementVNode, toDisplayString } from "vue";
+import { createElementBlock, openBlock, renderSlot, Fragment, renderList, normalizeClass, toDisplayString } from "vue";
 /* empty css          */
 const _hoisted_1 = { class: "font-main" };
-const _hoisted_2 = { class: "text-box-trim-none t-truncate" };
-const _hoisted_3 = {
+const _hoisted_2 = {
   key: 1,
   class: "pd-b-micro pd-t-micro pd-r-thin pd-l-thin radius-small t-semi bg-white"
 };
@@ -15,12 +14,10 @@ const _sfc_main = {
       return openBlock(), createElementBlock("div", _hoisted_1, [
         renderSlot(_ctx.$slots, "default"),
         ((_a = __props.chips) == null ? void 0 : _a.length) ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(__props.chips, (chip, index) => {
-          return openBlock(), createElementBlock("span", {
-            class: normalizeClass([_ctx.$attrs.class || "p-medium font-main", "mn-r-nano d-inline-block w-max pd-b-micro pd-t-micro pd-r-thin pd-l-thin radius-small t-medium bg-main"])
-          }, [
-            createElementVNode("span", _hoisted_2, toDisplayString(chip.text ? chip.text : chip), 1)
-          ], 2);
-        }), 256)) : (openBlock(), createElementBlock("div", _hoisted_3, [
+          return openBlock(), createElementBlock("p", {
+            class: normalizeClass([_ctx.$attrs.class || "p-medium font-main", "mn-r-nano d-inline-block w-max pd-thin radius-thin t-medium bg-main"])
+          }, toDisplayString(chip.text ? chip.text : chip), 3);
+        }), 256)) : (openBlock(), createElementBlock("div", _hoisted_2, [
           renderSlot(_ctx.$slots, "default")
         ]))
       ]);

package/dist/martyrs/src/components/Chips/Chips.vue2.js.map

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

package/dist/martyrs/src/components/Feed/Carousel.vue.cjs

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const vueI18n = require("vue-i18n");
+const Loader = require("../Loader/Loader.vue2.cjs");
+const Slider = require("../Slider/Slider.vue.cjs");
+const _pluginVue_exportHelper = require("../../../../_virtual/_plugin-vue_export-helper.cjs");
+const _hoisted_1 = { class: "pos-relative" };
+const _hoisted_2 = {
+  key: 0,
+  class: "h-20r radius-semi pos-relative w-100 bg-light"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "bg-light radius-semi flex flex-center w-100 h-20r"
+};
+const _hoisted_4 = { class: "text-gray-500" };
+const _sfc_main = {
+  __name: "Carousel",
+  props: {
+    showDots: Boolean,
+    store: Object,
+    options: Object,
+    text: Object,
+    user: Object
+  },
+  setup(__props) {
+    const props = __props;
+    const entities = vue.ref([]);
+    const isLoading = vue.ref(true);
+    const { t } = vueI18n.useI18n({
+      messages: props.text
+    });
+    vue.onMounted(async () => {
+      try {
+        entities.value = await props.store.read(props.options);
+      } catch (error) {
+        console.error("Error loading entities:", error);
+        entities.value = [];
+      } finally {
+        isLoading.value = false;
+      }
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        isLoading.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+          vue.createVNode(Loader.default)
+        ])) : !entities.value.length ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
+          vue.createElementVNode("p", _hoisted_4, vue.toDisplayString(vue.unref(t)("title")), 1)
+        ])) : (vue.openBlock(), vue.createBlock(Slider.default, {
+          key: 2,
+          showDots: __props.showDots
+        }, {
+          default: vue.withCtx(() => [
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(entities.value, (entity, key) => {
+              return vue.openBlock(), vue.createElementBlock("div", {
+                key,
+                class: "carousel__slide pd-nano"
+              }, [
+                vue.createVNode(vue.Transition, {
+                  name: "fade",
+                  mode: "out-in",
+                  appear: ""
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "default", {
+                      item: entity,
+                      user: __props.user
+                    }, void 0, true)
+                  ]),
+                  _: 2
+                }, 1024)
+              ]);
+            }), 128))
+          ]),
+          _: 3
+        }, 8, ["showDots"]))
+      ]);
+    };
+  }
+};
+const Carousel = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-54d1a394"]]);
+exports.default = Carousel;
+//# sourceMappingURL=Carousel.vue.cjs.map

package/dist/martyrs/src/components/Feed/Carousel.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Carousel.vue.cjs","sources":["../../../../../src/components/Feed/Carousel.vue"],"sourcesContent":["<template>\n  <div class=\"pos-relative\">\n    <!-- Loading State -->\n    <div v-if=\"isLoading\" class=\"h-20r radius-semi pos-relative w-100 bg-light\">\n      <Loader />\n    </div>\n    <!-- Empty State -->\n    <div v-else-if=\"!entities.length\" class=\"bg-light radius-semi flex flex-center w-100 h-20r\">\n      <p class=\"text-gray-500\">{{t('title')}}</p>\n    </div>\n    <!-- Slider with loaded entities -->\n    <Slider v-else :showDots=\"showDots\">\n      <div \n        v-for=\"(entity, key) in entities\" \n        :key=\"key\"\n        class=\"carousel__slide pd-nano\"\n      >\n        <transition name=\"fade\" mode=\"out-in\" appear>\n          <slot\n            :item=\"entity\"\n            :user=\"user\"\n          ></slot>\n        </transition>\n      </div>\n    </Slider>\n  </div>\n</template>\n\n<script setup>\nimport { ref, onMounted } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport Loader from '@martyrs/src/components/Loader/Loader.vue'\nimport Slider from '@martyrs/src/components/Slider/Slider.vue'\n\nconst props = defineProps({\n  showDots: Boolean,\n  store: Object,\n  options: Object,\n  text: Object,\n  user: Object\n})\n\nconst entities = ref([])\nconst isLoading = ref(true)\n\nconst { t } = useI18n({\n  messages: props.text\n})\n\nonMounted(async() => {\n  try {\n    entities.value = await props.store.read(props.options)\n  } catch (error) {\n    console.error('Error loading entities:', error)\n    entities.value = []\n  } finally {\n    isLoading.value = false\n  }\n})\n</script>\n\n<style scoped>\n.fade-enter-active,\n.fade-leave-active {\n  transition: opacity 0.3s ease;\n}\n\n.fade-enter-from,\n.fade-leave-to {\n  opacity: 0;\n}\n</style>"],"names":["ref","useI18n","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCA,UAAM,QAAQ;AAQd,UAAM,WAAWA,IAAG,IAAC,CAAE,CAAA;AACvB,UAAM,YAAYA,IAAG,IAAC,IAAI;AAE1B,UAAM,EAAE,EAAG,IAAGC,gBAAQ;AAAA,MACpB,UAAU,MAAM;AAAA,IAClB,CAAC;AAEDC,QAAAA,UAAU,YAAW;AACnB,UAAI;AACF,iBAAS,QAAQ,MAAM,MAAM,MAAM,KAAK,MAAM,OAAO;AAAA,MACtD,SAAQ,OAAO;AACd,gBAAQ,MAAM,2BAA2B,KAAK;AAC9C,iBAAS,QAAQ,CAAA;AAAA,MACrB,UAAY;AACR,kBAAU,QAAQ;AAAA,MACtB;AAAA,IACA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Feed/Carousel.vue.js

@@ -0,0 +1,84 @@
+import { ref, onMounted, createElementBlock, openBlock, createBlock, createVNode, createElementVNode, toDisplayString, unref, withCtx, Fragment, renderList, Transition, renderSlot } from "vue";
+import { useI18n } from "vue-i18n";
+import Loader from "../Loader/Loader.vue2.js";
+import _sfc_main$1 from "../Slider/Slider.vue.js";
+import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "pos-relative" };
+const _hoisted_2 = {
+  key: 0,
+  class: "h-20r radius-semi pos-relative w-100 bg-light"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "bg-light radius-semi flex flex-center w-100 h-20r"
+};
+const _hoisted_4 = { class: "text-gray-500" };
+const _sfc_main = {
+  __name: "Carousel",
+  props: {
+    showDots: Boolean,
+    store: Object,
+    options: Object,
+    text: Object,
+    user: Object
+  },
+  setup(__props) {
+    const props = __props;
+    const entities = ref([]);
+    const isLoading = ref(true);
+    const { t } = useI18n({
+      messages: props.text
+    });
+    onMounted(async () => {
+      try {
+        entities.value = await props.store.read(props.options);
+      } catch (error) {
+        console.error("Error loading entities:", error);
+        entities.value = [];
+      } finally {
+        isLoading.value = false;
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        isLoading.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          createVNode(Loader)
+        ])) : !entities.value.length ? (openBlock(), createElementBlock("div", _hoisted_3, [
+          createElementVNode("p", _hoisted_4, toDisplayString(unref(t)("title")), 1)
+        ])) : (openBlock(), createBlock(_sfc_main$1, {
+          key: 2,
+          showDots: __props.showDots
+        }, {
+          default: withCtx(() => [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(entities.value, (entity, key) => {
+              return openBlock(), createElementBlock("div", {
+                key,
+                class: "carousel__slide pd-nano"
+              }, [
+                createVNode(Transition, {
+                  name: "fade",
+                  mode: "out-in",
+                  appear: ""
+                }, {
+                  default: withCtx(() => [
+                    renderSlot(_ctx.$slots, "default", {
+                      item: entity,
+                      user: __props.user
+                    }, void 0, true)
+                  ]),
+                  _: 2
+                }, 1024)
+              ]);
+            }), 128))
+          ]),
+          _: 3
+        }, 8, ["showDots"]))
+      ]);
+    };
+  }
+};
+const Carousel = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-54d1a394"]]);
+export {
+  Carousel as default
+};
+//# sourceMappingURL=Carousel.vue.js.map

package/dist/martyrs/src/components/Feed/Carousel.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Carousel.vue.js","sources":["../../../../../src/components/Feed/Carousel.vue"],"sourcesContent":["<template>\n  <div class=\"pos-relative\">\n    <!-- Loading State -->\n    <div v-if=\"isLoading\" class=\"h-20r radius-semi pos-relative w-100 bg-light\">\n      <Loader />\n    </div>\n    <!-- Empty State -->\n    <div v-else-if=\"!entities.length\" class=\"bg-light radius-semi flex flex-center w-100 h-20r\">\n      <p class=\"text-gray-500\">{{t('title')}}</p>\n    </div>\n    <!-- Slider with loaded entities -->\n    <Slider v-else :showDots=\"showDots\">\n      <div \n        v-for=\"(entity, key) in entities\" \n        :key=\"key\"\n        class=\"carousel__slide pd-nano\"\n      >\n        <transition name=\"fade\" mode=\"out-in\" appear>\n          <slot\n            :item=\"entity\"\n            :user=\"user\"\n          ></slot>\n        </transition>\n      </div>\n    </Slider>\n  </div>\n</template>\n\n<script setup>\nimport { ref, onMounted } from 'vue'\nimport { useI18n } from 'vue-i18n'\nimport Loader from '@martyrs/src/components/Loader/Loader.vue'\nimport Slider from '@martyrs/src/components/Slider/Slider.vue'\n\nconst props = defineProps({\n  showDots: Boolean,\n  store: Object,\n  options: Object,\n  text: Object,\n  user: Object\n})\n\nconst entities = ref([])\nconst isLoading = ref(true)\n\nconst { t } = useI18n({\n  messages: props.text\n})\n\nonMounted(async() => {\n  try {\n    entities.value = await props.store.read(props.options)\n  } catch (error) {\n    console.error('Error loading entities:', error)\n    entities.value = []\n  } finally {\n    isLoading.value = false\n  }\n})\n</script>\n\n<style scoped>\n.fade-enter-active,\n.fade-leave-active {\n  transition: opacity 0.3s ease;\n}\n\n.fade-enter-from,\n.fade-leave-to {\n  opacity: 0;\n}\n</style>"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkCA,UAAM,QAAQ;AAQd,UAAM,WAAW,IAAI,CAAE,CAAA;AACvB,UAAM,YAAY,IAAI,IAAI;AAE1B,UAAM,EAAE,EAAG,IAAG,QAAQ;AAAA,MACpB,UAAU,MAAM;AAAA,IAClB,CAAC;AAED,cAAU,YAAW;AACnB,UAAI;AACF,iBAAS,QAAQ,MAAM,MAAM,MAAM,KAAK,MAAM,OAAO;AAAA,MACtD,SAAQ,OAAO;AACd,gBAAQ,MAAM,2BAA2B,KAAK;AAC9C,iBAAS,QAAQ,CAAA;AAAA,MACrB,UAAY;AACR,kBAAU,QAAQ;AAAA,MACtB;AAAA,IACA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/components/Feed/Feed.vue.cjs

@@ -360,8 +360,8 @@ const _sfc_main = {
                   horizontal: __props.skeleton.horizontal,
                   loading: __props.skeleton.apply_to_slot,
                   key: "skeleton-" + i,
-                  class: "radius-medium flex-child-default o-hidden d-block"
-                }, null, 8, ["structure", "horizontal", "loading"]);
+                  class: vue.normalizeClass(_ctx.replaceClasses("radius-medium bg-light pd-thin flex-child-default o-hidden d-block", __props.skeleton.class))
+                }, null, 8, ["structure", "horizontal", "loading", "class"]);
               }), 128)) : vue.createCommentVNode("", true),
               vue.unref(isLoading) && ((_b = __props.skeleton) == null ? void 0 : _b.hide) ? (vue.openBlock(), vue.createBlock(Loader.default, { key: 1 })) : vue.createCommentVNode("", true)
             ];
@@ -379,8 +379,8 @@ const _sfc_main = {
               description: __props.states.empty.description,
               action: __props.states.empty.action,
               callback: __props.states.empty.callback,
-              class: "pd-medium mn-b-thin bg-light radius-medium"
-            }, null, 8, ["title", "description", "action", "callback"])) : vue.createCommentVNode("", true)
+              class: vue.normalizeClass(_ctx.replaceClasses("pd-medium bg-light radius-medium", __props.states.empty.class))
+            }, null, 8, ["title", "description", "action", "callback", "class"])) : vue.createCommentVNode("", true)
           ]),
           _: 1
         })) : (vue.openBlock(), vue.createBlock(vue.TransitionGroup, {