ep-lib-ts 1.0.59 → 1.0.60

package/dist/components/basics/EpHoverCard.vue.js

@@ -1,18 +1,24 @@
-import { defineComponent as B, computed as r, toRefs as S, useSlots as T, createElementBlock as s, openBlock as a, normalizeClass as n, createBlock as z, createCommentVNode as d, unref as t, withCtx as E, createElementVNode as l, renderSlot as i, toDisplayString as p, createVNode as N } from "vue";
-import V from "./EpHover.vue.js";
-import A from "./EpIcon.vue.js";
-import v from "../../composables/useColors.js";
-import { density_style as W } from "../../types/Card.js";
-const j = ["src"], D = {
+import { defineComponent, computed, toRefs, useSlots, createElementBlock, openBlock, normalizeClass, createBlock, createCommentVNode, unref, withCtx, createElementVNode, renderSlot, toDisplayString, createVNode } from "vue";
+import _sfc_main$1 from "./EpHover.vue.js";
+import _sfc_main$2 from "./EpIcon.vue.js";
+import useColors from "../../composables/useColors.js";
+import { density_style } from "../../types/Card.js";
+const _hoisted_1 = ["src"];
+const _hoisted_2 = {
   key: 0,
   class: "mb-2 flex items-center justify-between dark:text-white"
-}, H = { class: "text-2xl dark:text-white font-bold" }, R = { key: 0 }, Y = { class: "dark:text-white" }, q = { class: "dark:text-white max-w-4xl" }, M = /* @__PURE__ */ B({
+};
+const _hoisted_3 = { class: "text-2xl dark:text-white font-bold" };
+const _hoisted_4 = { key: 0 };
+const _hoisted_5 = { class: "dark:text-white" };
+const _hoisted_6 = { class: "dark:text-white max-w-4xl" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "EpHoverCard",
   props: {
     title: { default: null },
     subtitle: { default: null },
-    outlined: { type: Boolean, default: !1 },
-    flat: { type: Boolean, default: !1 },
+    outlined: { type: Boolean, default: false },
+    flat: { type: Boolean, default: false },
     icon: { default: null },
     color: { default: null },
     src: { default: null },
@@ -25,62 +31,100 @@ const j = ["src"], D = {
     textSize: {},
     hoverColor: {}
   },
-  setup(b) {
-    const e = b, k = r(() => e.flat ? "" : "shadow-lg"), y = r(() => e.outlined && e.color ? `border solid ${v("border", e.color)}` : e.outlined ? "border solid border-primary dark:border-primary" : "dark:border dark:solid dark:border-primary"), C = r(() => e.color && !e.outlined ? `${v("bg", e.color)}` : "bg-white text-black"), _ = r(() => e.color && !e.outlined ? "text-white" : "text-gray-600"), g = r(() => W[e.density]), w = r(() => `
-    ${k.value} 
-    ${y.value} 
-    ${C.value} 
-    ${e.maxWidth} 
+  setup(__props) {
+    const props = __props;
+    const shadowCard = computed(() => {
+      return !props.flat ? "shadow-lg" : "";
+    });
+    const borderColor = computed(() => {
+      if (props.outlined && props.color) {
+        return `border solid ${useColors("border", props.color)}`;
+      }
+      if (props.outlined) {
+        return "border solid border-primary dark:border-primary";
+      }
+      return "dark:border dark:solid dark:border-primary";
+    });
+    const bgColor = computed(() => {
+      if (props.color && !props.outlined) {
+        return `${useColors("bg", props.color)}`;
+      }
+      return `bg-white text-black`;
+    });
+    const subTitleText = computed(() => {
+      if (props.color && !props.outlined) {
+        return "text-white";
+      }
+      return "text-gray-600";
+    });
+    const density_class = computed(() => {
+      return density_style[props.density];
+    });
+    const stylesCard = computed(() => {
+      return `
+    ${shadowCard.value} 
+    ${borderColor.value} 
+    ${bgColor.value} 
+    ${props.maxWidth} 
     rounded-md 
     dark:bg-dark
-    dark:text-white`), { title: u, subtitle: c, icon: h, src: f, hoverContent: m } = S(e), $ = T(), x = r(() => !!$.default || !!e.title || !!e.subtitle);
-    return (o, F) => (a(), s("div", {
-      class: n(`${w.value} mx-auto`)
-    }, [
-      t(f) && t(m) ? (a(), z(V, {
-        key: 0,
-        textColor: o.hoverColor,
-        textSize: o.textSize,
-        seeThrough: o.seeThrough,
-        bgColor: o.hoverBg,
-        animation: o.hoverAnimation,
-        text: t(m)
-      }, {
-        default: E(() => [
-          l("img", {
-            src: t(f),
-            class: n(`w-full ${x.value ? "rounded-t-md" : "rounded-md"}`),
-            alt: "header card"
-          }, null, 10, j)
-        ]),
-        _: 1
-      }, 8, ["textColor", "textSize", "seeThrough", "bgColor", "animation", "text"])) : d("", !0),
-      x.value ? (a(), s("div", {
-        key: 1,
-        class: n(g.value)
+    dark:text-white`;
+    });
+    const { title, subtitle, icon, src, hoverContent } = toRefs(props);
+    const slots = useSlots();
+    const hasContent = computed(() => {
+      return !!slots.default || !!props.title || !!props.subtitle;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(`${stylesCard.value} mx-auto`)
       }, [
-        t(u) || t(c) ? (a(), s("div", D, [
-          l("div", null, [
-            l("h3", H, p(t(u)), 1),
-            l("h4", {
-              class: n(`text-xs dark:text-white ${_.value}`)
-            }, p(t(c)), 3)
+        unref(src) && unref(hoverContent) ? (openBlock(), createBlock(_sfc_main$1, {
+          key: 0,
+          textColor: _ctx.hoverColor,
+          textSize: _ctx.textSize,
+          seeThrough: _ctx.seeThrough,
+          bgColor: _ctx.hoverBg,
+          animation: _ctx.hoverAnimation,
+          text: unref(hoverContent)
+        }, {
+          default: withCtx(() => [
+            createElementVNode("img", {
+              src: unref(src),
+              class: normalizeClass(`w-full ${hasContent.value ? "rounded-t-md" : "rounded-md"}`),
+              alt: "header card"
+            }, null, 10, _hoisted_1)
+          ]),
+          _: 1
+        }, 8, ["textColor", "textSize", "seeThrough", "bgColor", "animation", "text"])) : createCommentVNode("", true),
+        hasContent.value ? (openBlock(), createElementBlock("div", {
+          key: 1,
+          class: normalizeClass(density_class.value)
+        }, [
+          unref(title) || unref(subtitle) ? (openBlock(), createElementBlock("div", _hoisted_2, [
+            createElementVNode("div", null, [
+              createElementVNode("h3", _hoisted_3, toDisplayString(unref(title)), 1),
+              createElementVNode("h4", {
+                class: normalizeClass(`text-xs dark:text-white ${subTitleText.value}`)
+              }, toDisplayString(unref(subtitle)), 3)
+            ]),
+            unref(icon) ? (openBlock(), createElementBlock("div", _hoisted_4, [
+              createVNode(_sfc_main$2, { "icon-path": unref(icon) }, null, 8, ["icon-path"])
+            ])) : createCommentVNode("", true)
+          ])) : createCommentVNode("", true),
+          renderSlot(_ctx.$slots, "card-header"),
+          createElementVNode("div", _hoisted_5, [
+            renderSlot(_ctx.$slots, "default")
           ]),
-          t(h) ? (a(), s("div", R, [
-            N(A, { "icon-path": t(h) }, null, 8, ["icon-path"])
-          ])) : d("", !0)
-        ])) : d("", !0),
-        i(o.$slots, "card-header"),
-        l("div", Y, [
-          i(o.$slots, "default")
-        ]),
-        l("div", q, [
-          i(o.$slots, "card-actions")
-        ])
-      ], 2)) : d("", !0)
-    ], 2));
+          createElementVNode("div", _hoisted_6, [
+            renderSlot(_ctx.$slots, "card-actions")
+          ])
+        ], 2)) : createCommentVNode("", true)
+      ], 2);
+    };
   }
 });
 export {
-  M as default
+  _sfc_main as default
 };
+//# sourceMappingURL=EpHoverCard.vue.js.map

package/dist/components/basics/EpHoverCard.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EpHoverCard.vue.js","sources":["../../../src/components/basics/EpHoverCard.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, toRefs, useSlots, type Slots } from \"vue\";\nimport EpHover from \"~/components/basics/EpHover.vue\";\nimport EpIcon from \"~/components/basics//EpIcon.vue\";\nimport useColors from \"~/composables/useColors\";\nimport { density_style } from \"~/types/Card\";\nimport { EpHoverCardProps } from \"~/types/basics/EpHoverCard\";\n\nconst props = withDefaults(defineProps<EpHoverCardProps>(), {\n  title: null,\n  subtitle: null,\n  outlined: false,\n  flat: false,\n  icon: null,\n  color: null,\n  src: null,\n  density: \"default\",\n  maxWidth: \"max-w-xl\",\n  hoverBg: \"\",\n  hoverAnimation: \"translateY\",\n});\n\n//styles card\nconst shadowCard = computed(() => {\n  return !props.flat ? \"shadow-lg\" : \"\";\n});\n\nconst borderColor = computed(() => {\n  if (props.outlined && props.color) {\n    return `border solid ${useColors(\"border\", props.color)}`;\n  }\n  if (props.outlined) {\n    return \"border solid border-primary dark:border-primary\";\n  }\n  return \"dark:border dark:solid dark:border-primary\";\n});\n\nconst bgColor = computed(() => {\n  if (props.color && !props.outlined) {\n    return `${useColors(\"bg\", props.color)}`;\n  }\n  return `bg-white text-black`;\n});\n\nconst subTitleText = computed(() => {\n  if (props.color && !props.outlined) {\n    return \"text-white\";\n  }\n  return \"text-gray-600\";\n});\n\nconst density_class = computed(() => {\n  return density_style[props.density];\n});\n\nconst stylesCard = computed(() => {\n  return `\n    ${shadowCard.value} \n    ${borderColor.value} \n    ${bgColor.value} \n    ${props.maxWidth} \n    rounded-md \n    dark:bg-dark\n    dark:text-white`;\n});\n\nconst { title, subtitle, icon, src, hoverContent } = toRefs(props);\n\nconst slots: Slots = useSlots();\n\nconst hasContent = computed(() => {\n  return !!slots.default || !!props.title || !!props.subtitle;\n});\n</script>\n\n<template>\n  <div :class=\"`${stylesCard} mx-auto`\">\n    <EpHover\n      :textColor=\"hoverColor\"\n      :textSize=\"textSize\"\n      :seeThrough=\"seeThrough\"\n      :bgColor=\"hoverBg\"\n      :animation=\"hoverAnimation\"\n      :text=\"hoverContent\"\n      v-if=\"src && hoverContent\"\n    >\n      <img\n        :src=\"src\"\n        :class=\"`w-full ${hasContent ? 'rounded-t-md' : 'rounded-md'}`\"\n        alt=\"header card\"\n      />\n    </EpHover>\n    <div :class=\"density_class\" v-if=\"hasContent\">\n      <div\n        v-if=\"title || subtitle\"\n        class=\"mb-2 flex items-center justify-between dark:text-white\"\n      >\n        <div>\n          <h3 class=\"text-2xl dark:text-white font-bold\">{{ title }}</h3>\n          <h4 :class=\"`text-xs dark:text-white ${subTitleText}`\">\n            {{ subtitle }}\n          </h4>\n        </div>\n        <div v-if=\"icon\">\n          <EpIcon :icon-path=\"icon\" />\n        </div>\n      </div>\n      <slot name=\"card-header\" />\n      <div class=\"dark:text-white\">\n        <slot />\n      </div>\n      <div class=\"dark:text-white max-w-4xl\">\n        <slot name=\"card-actions\" />\n      </div>\n    </div>\n  </div>\n</template>\n"],"names":["_createElementBlock","_unref","_createBlock","EpHover","hoverColor","textSize","seeThrough","hoverBg","hoverAnimation","_createElementVNode","_openBlock","_toDisplayString","_createVNode","EpIcon","_renderSlot"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,UAAM,QAAQ;AAed,UAAM,aAAa,SAAS,MAAM;AAChC,aAAO,CAAC,MAAM,OAAO,cAAc;AAAA,IACrC,CAAC;AAED,UAAM,cAAc,SAAS,MAAM;AACjC,UAAI,MAAM,YAAY,MAAM,OAAO;AACjC,eAAO,gBAAgB,UAAU,UAAU,MAAM,KAAK,CAAC;AAAA,MACzD;AACA,UAAI,MAAM,UAAU;AAClB,eAAO;AAAA,MACT;AACA,aAAO;AAAA,IACT,CAAC;AAED,UAAM,UAAU,SAAS,MAAM;AAC7B,UAAI,MAAM,SAAS,CAAC,MAAM,UAAU;AAClC,eAAO,GAAG,UAAU,MAAM,MAAM,KAAK,CAAC;AAAA,MACxC;AACA,aAAO;AAAA,IACT,CAAC;AAED,UAAM,eAAe,SAAS,MAAM;AAClC,UAAI,MAAM,SAAS,CAAC,MAAM,UAAU;AAClC,eAAO;AAAA,MACT;AACA,aAAO;AAAA,IACT,CAAC;AAED,UAAM,gBAAgB,SAAS,MAAM;AACnC,aAAO,cAAc,MAAM,OAAO;AAAA,IACpC,CAAC;AAED,UAAM,aAAa,SAAS,MAAM;AAChC,aAAO;AAAA,MACH,WAAW,KAAK;AAAA,MAChB,YAAY,KAAK;AAAA,MACjB,QAAQ,KAAK;AAAA,MACb,MAAM,QAAQ;AAAA;AAAA;AAAA;AAAA,IAIpB,CAAC;AAED,UAAM,EAAE,OAAO,UAAU,MAAM,KAAK,aAAA,IAAiB,OAAO,KAAK;AAEjE,UAAM,QAAe,SAAA;AAErB,UAAM,aAAa,SAAS,MAAM;AAChC,aAAO,CAAC,CAAC,MAAM,WAAW,CAAC,CAAC,MAAM,SAAS,CAAC,CAAC,MAAM;AAAA,IACrD,CAAC;;0BAICA,mBAuCM,OAAA;AAAA,QAvCA,yBAAU,WAAA,KAAU,UAAA;AAAA,MAAA;QAQhBC,MAAA,GAAA,KAAOA,MAAA,YAAA,kBAPfC,YAcUC,aAAA;AAAA;UAbP,WAAWC,KAAAA;AAAAA,UACX,UAAUC,KAAAA;AAAAA,UACV,YAAYC,KAAAA;AAAAA,UACZ,SAASC,KAAAA;AAAAA,UACT,WAAWC,KAAAA;AAAAA,UACX,MAAMP,MAAA,YAAA;AAAA,QAAA;2BAGP,MAIE;AAAA,YAJFQ,mBAIE,OAAA;AAAA,cAHC,KAAKR,MAAA,GAAA;AAAA,cACL,gCAAiB,WAAA,QAAU,iBAAA,YAAA,EAAA;AAAA,cAC5B,KAAI;AAAA,YAAA;;;;QAG0B,WAAA,sBAAlCD,mBAsBM,OAAA;AAAA;UAtBA,sBAAO,cAAA,KAAa;AAAA,QAAA;UAEhBC,MAAA,KAAA,KAASA,MAAA,QAAA,KADjBS,aAAAV,mBAaM,OAbN,YAaM;AAAA,YATJS,mBAKM,OAAA,MAAA;AAAA,cAJJA,mBAA+D,MAA/D,YAA+DE,gBAAbV,MAAA,KAAA,CAAK,GAAA,CAAA;AAAA,cACvDQ,mBAEK,MAAA;AAAA,gBAFA,iDAAkC,aAAA,KAAY,EAAA;AAAA,cAAA,mBAC9CR,MAAA,QAAA,CAAQ,GAAA,CAAA;AAAA,YAAA;YAGJA,MAAA,IAAA,kBAAXD,mBAEM,OAAA,YAAA;AAAA,cADJY,YAA4BC,aAAA,EAAnB,aAAWZ,MAAA,IAAA,EAAA,GAAI,MAAA,GAAA,CAAA,WAAA,CAAA;AAAA,YAAA;;UAG5Ba,WAA2B,KAAA,QAAA,aAAA;AAAA,UAC3BL,mBAEM,OAFN,YAEM;AAAA,YADJK,WAAQ,KAAA,QAAA,SAAA;AAAA,UAAA;UAEVL,mBAEM,OAFN,YAEM;AAAA,YADJK,WAA4B,KAAA,QAAA,cAAA;AAAA,UAAA;;;;;;"}

package/dist/components/basics/EpHoverCard.vue2.js

@@ -1,4 +1,5 @@
-import f from "./EpHoverCard.vue.js";
+import _sfc_main from "./EpHoverCard.vue.js";
 export {
-  f as default
+  _sfc_main as default
 };
+//# sourceMappingURL=EpHoverCard.vue2.js.map

package/dist/components/basics/EpHoverCard.vue2.js.map

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

package/dist/components/basics/EpIcon.vue.js

@@ -1,5 +1,7 @@
-import { defineComponent as c, toRefs as l, createElementBlock as a, openBlock as h, normalizeClass as d, unref as e, createElementVNode as p } from "vue";
-const u = ["width", "height", "viewBox"], _ = ["d"], w = /* @__PURE__ */ c({
+import { defineComponent, toRefs, createElementBlock, openBlock, normalizeClass, unref, createElementVNode } from "vue";
+const _hoisted_1 = ["width", "height", "viewBox"];
+const _hoisted_2 = ["d"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "EpIcon",
   props: {
     size: { default: 32 },
@@ -7,20 +9,24 @@ const u = ["width", "height", "viewBox"], _ = ["d"], w = /* @__PURE__ */ c({
     iconPath: {},
     extraClass: {}
   },
-  setup(t) {
-    const n = t, { size: o, viewBox: s, iconPath: r, extraClass: i } = l(n);
-    return (f, m) => (h(), a("svg", {
-      width: e(o),
-      height: e(o),
-      viewBox: e(s),
-      color: "currentColor",
-      fill: "currentColor",
-      class: d(`inline ${e(i)}`)
-    }, [
-      p("path", { d: e(r) }, null, 8, _)
-    ], 10, u));
+  setup(__props) {
+    const props = __props;
+    const { size, viewBox, iconPath, extraClass } = toRefs(props);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("svg", {
+        width: unref(size),
+        height: unref(size),
+        viewBox: unref(viewBox),
+        color: "currentColor",
+        fill: "currentColor",
+        class: normalizeClass(`inline ${unref(extraClass)}`)
+      }, [
+        createElementVNode("path", { d: unref(iconPath) }, null, 8, _hoisted_2)
+      ], 10, _hoisted_1);
+    };
   }
 });
 export {
-  w as default
+  _sfc_main as default
 };
+//# sourceMappingURL=EpIcon.vue.js.map

package/dist/components/basics/EpIcon.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EpIcon.vue.js","sources":["../../../src/components/basics/EpIcon.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { toRefs } from \"vue\";\nimport { EpIconProps } from \"~/types/basics/EpIcon\";\n\nconst props = withDefaults(defineProps<EpIconProps>(), {\n  size: 32,\n  viewBox: \"0 0 24 24\",\n});\n\nconst { size, viewBox, iconPath, extraClass } = toRefs(props);\n</script>\n\n<template>\n  <svg\n    :width=\"size\"\n    :height=\"size\"\n    :viewBox=\"viewBox\"\n    color=\"currentColor\"\n    fill=\"currentColor\"\n    :class=\"`inline ${extraClass}`\"\n  >\n    <path :d=\"iconPath\"></path>\n  </svg>\n</template>\n"],"names":["_createElementBlock","_unref","_createElementVNode"],"mappings":";;;;;;;;;;;;AAIA,UAAM,QAAQ;AAKd,UAAM,EAAE,MAAM,SAAS,UAAU,WAAA,IAAe,OAAO,KAAK;;0BAI1DA,mBASM,OAAA;AAAA,QARH,OAAOC,MAAA,IAAA;AAAA,QACP,QAAQA,MAAA,IAAA;AAAA,QACR,SAASA,MAAA,OAAA;AAAA,QACV,OAAM;AAAA,QACN,MAAK;AAAA,QACJ,gCAAiBA,MAAA,UAAA,CAAU,EAAA;AAAA,MAAA;QAE5BC,mBAA2B,QAAA,EAApB,GAAGD,MAAA,QAAA,EAAA,GAAQ,MAAA,GAAA,UAAA;AAAA,MAAA;;;;"}

package/dist/components/basics/EpIcon.vue2.js

@@ -1,4 +1,5 @@
-import f from "./EpIcon.vue.js";
+import _sfc_main from "./EpIcon.vue.js";
 export {
-  f as default
+  _sfc_main as default
 };
+//# sourceMappingURL=EpIcon.vue2.js.map

package/dist/components/basics/EpIcon.vue2.js.map

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

package/dist/components/basics/EpImg.vue.js

@@ -1,184 +1,227 @@
-import { defineComponent as S, ref as C, computed as z, toRefs as A, createElementBlock as o, openBlock as l, normalizeClass as c, unref as e, createCommentVNode as i, createVNode as a, createElementVNode as t, toDisplayString as r, withCtx as h, createTextVNode as V } from "vue";
-import { cols_img as U, sizeThumbnailStyle as q } from "../../types/Image.js";
-import { useImage as D } from "@vueuse/core";
-import R from "../interactions/EpModal.vue.js";
+import { defineComponent, ref, computed, toRefs, createElementBlock, openBlock, normalizeClass, unref, createCommentVNode, createVNode, createElementVNode, toDisplayString, withCtx, createTextVNode } from "vue";
+import { cols_img, sizeThumbnailStyle } from "../../types/Image.js";
+import { useImage } from "@vueuse/core";
+import _sfc_main$3 from "../interactions/EpModal.vue.js";
 /* empty css                           */
-import f from "./EpIcon.vue.js";
-import j from "./EpBtn.vue.js";
-import { mdiImage as F, mdiImageRemove as G, mdiArrowExpandAll as B } from "@mdi/js";
-import { useRenderText as J } from "../../composables/useRenderText.js";
-const K = {
+import _sfc_main$1 from "./EpIcon.vue.js";
+import _sfc_main$2 from "./EpBtn.vue.js";
+import { mdiImage, mdiImageRemove, mdiArrowExpandAll } from "@mdi/js";
+import { useRenderText } from "../../composables/useRenderText.js";
+const _hoisted_1 = {
   key: 0,
   class: "flex m-2"
-}, O = {
+};
+const _hoisted_2 = {
   key: 0,
   class: "text-gray-200"
-}, P = {
+};
+const _hoisted_3 = {
   key: 1,
   class: "text-red-200"
-}, Q = ["src", "alt"], W = {
+};
+const _hoisted_4 = ["src", "alt"];
+const _hoisted_5 = {
   key: 0,
   class: "absolute bottom-2 right-2 text-white text-center bg-black rounded opacity-0 transition-opacity duration-300 group-hover:opacity-50 cursor-pointer"
-}, X = {
+};
+const _hoisted_6 = {
   key: 3,
   class: "px-4 py-2 dark:bg-black dark:border-white dark:rounded-b-md"
-}, Y = { class: "text-2xl dark:text-white font-bold" }, Z = { class: "text-gray-500 dark:text-white text-sm mt-4" }, ee = {
+};
+const _hoisted_7 = { class: "text-2xl dark:text-white font-bold" };
+const _hoisted_8 = { class: "text-gray-500 dark:text-white text-sm mt-4" };
+const _hoisted_9 = {
   key: 0,
   class: "text-right"
-}, te = {
+};
+const _hoisted_10 = {
   key: 1,
   class: "relative group inline-block m-2"
-}, oe = ["src", "alt"], le = { class: "absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 text-white text-center" }, ae = ["src", "alt"], se = {
+};
+const _hoisted_11 = ["src", "alt"];
+const _hoisted_12 = { class: "absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 text-white text-center" };
+const _hoisted_13 = ["src", "alt"];
+const _hoisted_14 = {
   key: 0,
   class: "px-4 py-2"
-}, ie = { class: "text-2xl dark:text-white font-bold" }, re = { class: "text-gray-500 dark:text-white text-sm mt-4" }, ne = ["innerHTML"], ce = ["innerHTML"], de = { class: "flex justify-end" }, ye = /* @__PURE__ */ S({
+};
+const _hoisted_15 = { class: "text-2xl dark:text-white font-bold" };
+const _hoisted_16 = { class: "text-gray-500 dark:text-white text-sm mt-4" };
+const _hoisted_17 = ["innerHTML"];
+const _hoisted_18 = ["innerHTML"];
+const _hoisted_19 = { class: "flex justify-end" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "EpImg",
   props: {
     src: {},
     alt: { default: "Image snfas" },
     height: {},
     width: {},
-    thumbnail: { type: Boolean, default: !1 },
+    thumbnail: { type: Boolean, default: false },
     sizeThumbnail: { default: "medium" },
     caption: {},
     bib: {},
     title: {},
-    noModal: { type: Boolean, default: !1 },
+    noModal: { type: Boolean, default: false },
     cols: { default: "6" },
     labelClose: { default: "Fermer" },
     labelRef: { default: "Référence" },
     labelRefLib: { default: "Référence bibliographique" }
   },
-  setup(E, { expose: L }) {
-    const s = E, b = C(null);
-    L({ imgEl: b });
-    const $ = z(() => U[+s.cols]), _ = z(() => s.bib ? J(s.bib) : ""), d = C(!1), g = () => {
-      s.noModal || (d.value = !d.value);
-    }, u = C(!1), T = () => {
-      u.value = !u.value;
-    }, M = z(() => q[s.sizeThumbnail]), { isLoading: I, error: H } = D({ src: s.src }), { src: v, alt: k, title: y, caption: x, thumbnail: m, bib: N, sizeThumbnail: ue } = A(s);
-    return (n, p) => (l(), o("div", {
-      class: c(e(m) ? "inline-block" : "")
-    }, [
-      e(m) ? i("", !0) : (l(), o("div", K, [
-        t("div", {
-          class: c(`mx-auto bg-white dark:bg-dark rounded-md overflow-hidden shadow-md ${$.value}`)
-        }, [
-          e(I) ? (l(), o("span", O, [
-            a(f, {
-              "icon-path": e(F),
-              size: "250"
-            }, null, 8, ["icon-path"])
-          ])) : e(H) ? (l(), o("span", P, [
-            a(f, {
-              "icon-path": e(G),
-              size: "150"
-            }, null, 8, ["icon-path"])
-          ])) : (l(), o("div", {
-            key: 2,
-            class: c(`${n.noModal ? "" : "cursor-pointer"} dark:bg-white group relative`)
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const imgEl = ref(null);
+    __expose({ imgEl });
+    const renderCols = computed(() => {
+      return cols_img[+props.cols];
+    });
+    const renderBib = computed(() => {
+      if (props.bib) {
+        return useRenderText(props.bib);
+      }
+      return "";
+    });
+    const showModal = ref(false);
+    const toggleModal = () => {
+      if (props.noModal) {
+        return;
+      }
+      showModal.value = !showModal.value;
+    };
+    const showBib = ref(false);
+    const toggleBib = () => {
+      showBib.value = !showBib.value;
+    };
+    const styleSizeThumbnail = computed(() => {
+      return sizeThumbnailStyle[props.sizeThumbnail];
+    });
+    const { isLoading, error } = useImage({ src: props.src });
+    const { src, alt, title, caption, thumbnail, bib } = toRefs(props);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref(thumbnail) ? "inline-block" : "")
+      }, [
+        !unref(thumbnail) ? (openBlock(), createElementBlock("div", _hoisted_1, [
+          createElementVNode("div", {
+            class: normalizeClass(`mx-auto bg-white dark:bg-dark rounded-md overflow-hidden shadow-md ${renderCols.value}`)
           }, [
-            t("img", {
-              class: "object-cover object-center w-full",
-              src: e(v),
-              alt: e(k),
-              onClick: g,
-              ref_key: "imgEl",
-              ref: b
-            }, null, 8, Q),
-            n.noModal ? i("", !0) : (l(), o("div", W, [
-              a(f, {
-                size: "28",
-                "icon-path": e(B)
+            unref(isLoading) ? (openBlock(), createElementBlock("span", _hoisted_2, [
+              createVNode(_sfc_main$1, {
+                "icon-path": unref(mdiImage),
+                size: "250"
+              }, null, 8, ["icon-path"])
+            ])) : unref(error) ? (openBlock(), createElementBlock("span", _hoisted_3, [
+              createVNode(_sfc_main$1, {
+                "icon-path": unref(mdiImageRemove),
+                size: "150"
               }, null, 8, ["icon-path"])
-            ]))
-          ], 2)),
-          e(y) || e(x) || e(N) ? (l(), o("div", X, [
-            t("h2", Y, r(e(y)), 1),
-            t("p", Z, r(e(x)), 1),
-            _.value ? (l(), o("div", ee, [
-              a(j, {
-                onClick: T,
+            ])) : (openBlock(), createElementBlock("div", {
+              key: 2,
+              class: normalizeClass(`${!_ctx.noModal ? "cursor-pointer" : ""} dark:bg-white group relative`)
+            }, [
+              createElementVNode("img", {
+                class: "object-cover object-center w-full",
+                src: unref(src),
+                alt: unref(alt),
+                onClick: toggleModal,
+                ref_key: "imgEl",
+                ref: imgEl
+              }, null, 8, _hoisted_4),
+              !_ctx.noModal ? (openBlock(), createElementBlock("div", _hoisted_5, [
+                createVNode(_sfc_main$1, {
+                  size: "28",
+                  "icon-path": unref(mdiArrowExpandAll)
+                }, null, 8, ["icon-path"])
+              ])) : createCommentVNode("", true)
+            ], 2)),
+            unref(title) || unref(caption) || unref(bib) ? (openBlock(), createElementBlock("div", _hoisted_6, [
+              createElementVNode("h2", _hoisted_7, toDisplayString(unref(title)), 1),
+              createElementVNode("p", _hoisted_8, toDisplayString(unref(caption)), 1),
+              renderBib.value ? (openBlock(), createElementBlock("div", _hoisted_9, [
+                createVNode(_sfc_main$2, {
+                  onClick: toggleBib,
+                  size: "small",
+                  type: "primary"
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(_ctx.labelRef), 1)
+                  ]),
+                  _: 1
+                })
+              ])) : createCommentVNode("", true)
+            ])) : createCommentVNode("", true)
+          ], 2)
+        ])) : createCommentVNode("", true),
+        unref(thumbnail) ? (openBlock(), createElementBlock("div", _hoisted_10, [
+          createElementVNode("img", {
+            class: normalizeClass(`${styleSizeThumbnail.value} object-cover object-center group-hover:opacity-30 `),
+            src: unref(src),
+            alt: unref(alt),
+            ref_key: "imgEl",
+            ref: imgEl
+          }, null, 10, _hoisted_11),
+          createElementVNode("div", {
+            class: normalizeClass(`absolute top-0 left-0 ${styleSizeThumbnail.value} bg-black opacity-0 transition-opacity duration-300 group-hover:opacity-30 cursor-pointer`),
+            onClick: toggleModal
+          }, [
+            createElementVNode("div", _hoisted_12, [
+              createVNode(_sfc_main$1, { "icon-path": unref(mdiArrowExpandAll) }, null, 8, ["icon-path"])
+            ])
+          ], 2)
+        ])) : createCommentVNode("", true),
+        createVNode(_sfc_main$3, {
+          modelValue: showModal.value,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => showModal.value = $event)
+        }, {
+          default: withCtx(() => [
+            createElementVNode("img", {
+              class: "object-cover object-center h-5/6 w-5/6 mx-auto dark:bg-white",
+              src: unref(src),
+              alt: unref(alt),
+              onClick: toggleModal
+            }, null, 8, _hoisted_13),
+            unref(thumbnail) ? (openBlock(), createElementBlock("div", _hoisted_14, [
+              createElementVNode("h2", _hoisted_15, toDisplayString(unref(title)), 1),
+              createElementVNode("p", _hoisted_16, toDisplayString(unref(caption)), 1),
+              createElementVNode("div", {
+                class: "text-gray-700 dark:text-white mt-4",
+                innerHTML: renderBib.value
+              }, null, 8, _hoisted_17)
+            ])) : createCommentVNode("", true)
+          ]),
+          _: 1
+        }, 8, ["modelValue"]),
+        createVNode(_sfc_main$3, {
+          modelValue: showBib.value,
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => showBib.value = $event),
+          title: _ctx.labelRefLib
+        }, {
+          default: withCtx(() => [
+            createElementVNode("div", {
+              class: "text-gray-700 dark:text-white mt-4",
+              innerHTML: renderBib.value
+            }, null, 8, _hoisted_18),
+            createElementVNode("div", _hoisted_19, [
+              createVNode(_sfc_main$2, {
+                onClick: toggleBib,
                 size: "small",
-                type: "primary"
+                type: "error",
+                outlined: ""
               }, {
-                default: h(() => [
-                  V(r(n.labelRef), 1)
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(_ctx.labelClose), 1)
                 ]),
                 _: 1
               })
-            ])) : i("", !0)
-          ])) : i("", !0)
-        ], 2)
-      ])),
-      e(m) ? (l(), o("div", te, [
-        t("img", {
-          class: c(`${M.value} object-cover object-center group-hover:opacity-30 `),
-          src: e(v),
-          alt: e(k),
-          ref_key: "imgEl",
-          ref: b
-        }, null, 10, oe),
-        t("div", {
-          class: c(`absolute top-0 left-0 ${M.value} bg-black opacity-0 transition-opacity duration-300 group-hover:opacity-30 cursor-pointer`),
-          onClick: g
-        }, [
-          t("div", le, [
-            a(f, { "icon-path": e(B) }, null, 8, ["icon-path"])
-          ])
-        ], 2)
-      ])) : i("", !0),
-      a(R, {
-        modelValue: d.value,
-        "onUpdate:modelValue": p[0] || (p[0] = (w) => d.value = w)
-      }, {
-        default: h(() => [
-          t("img", {
-            class: "object-cover object-center h-5/6 w-5/6 mx-auto dark:bg-white",
-            src: e(v),
-            alt: e(k),
-            onClick: g
-          }, null, 8, ae),
-          e(m) ? (l(), o("div", se, [
-            t("h2", ie, r(e(y)), 1),
-            t("p", re, r(e(x)), 1),
-            t("div", {
-              class: "text-gray-700 dark:text-white mt-4",
-              innerHTML: _.value
-            }, null, 8, ne)
-          ])) : i("", !0)
-        ]),
-        _: 1
-      }, 8, ["modelValue"]),
-      a(R, {
-        modelValue: u.value,
-        "onUpdate:modelValue": p[1] || (p[1] = (w) => u.value = w),
-        title: n.labelRefLib
-      }, {
-        default: h(() => [
-          t("div", {
-            class: "text-gray-700 dark:text-white mt-4",
-            innerHTML: _.value
-          }, null, 8, ce),
-          t("div", de, [
-            a(j, {
-              onClick: T,
-              size: "small",
-              type: "error",
-              outlined: ""
-            }, {
-              default: h(() => [
-                V(r(n.labelClose), 1)
-              ]),
-              _: 1
-            })
-          ])
-        ]),
-        _: 1
-      }, 8, ["modelValue", "title"])
-    ], 2));
+            ])
+          ]),
+          _: 1
+        }, 8, ["modelValue", "title"])
+      ], 2);
+    };
   }
 });
 export {
-  ye as default
+  _sfc_main as default
 };
+//# sourceMappingURL=EpImg.vue.js.map