ep-lib-ts 1.0.59 → 1.0.60

package/dist/components/forms/EpTextarea.vue2.js

@@ -1,5 +1,9 @@
-import { defineComponent as a, toRefs as n, createElementBlock as d, openBlock as s, createElementVNode as e, unref as f, toDisplayString as b } from "vue";
-const p = { class: "w-96" }, u = { class: "relative w-full min-w-[200px]" }, i = ["disabled"], c = { class: "before:content[' '] after:content[' '] pointer-events-none absolute left-0 -top-1.5 flex h-full w-full select-none text-[11px] font-normal leading-tight text-blue-400 transition-all before:pointer-events-none before:mt-[6.5px] before:mr-1 before:box-border before:block before:h-1.5 before:w-2.5 before:rounded-tl-md before:border-t before:border-l before:border-neutral-300 before:transition-all after:pointer-events-none after:mt-[6.5px] after:ml-1 after:box-border after:block after:h-1.5 after:w-2.5 after:flex-grow after:rounded-tr-md after:border-t after:border-r after:border-neutral-300 after:transition-all peer-placeholder-shown:text-sm peer-placeholder-shown:leading-[3.75] peer-placeholder-shown:text-blue-500 peer-placeholder-shown:before:border-transparent peer-placeholder-shown:after:border-transparent peer-focus:text-[11px] peer-focus:leading-tight peer-focus:text-blue-500 peer-focus:before:border-t-2 peer-focus:before:border-l-2 peer-focus:before:border-blue-500 peer-focus:after:border-t-2 peer-focus:after:border-r-2 peer-focus:after:border-blue-500 peer-disabled:text-transparent peer-disabled:before:border-transparent peer-disabled:after:border-transparent peer-disabled:peer-placeholder-shown:text-blue-500" }, m = /* @__PURE__ */ a({
+import { defineComponent, toRefs, createElementBlock, openBlock, createElementVNode, unref, toDisplayString } from "vue";
+const _hoisted_1 = { class: "w-96" };
+const _hoisted_2 = { class: "relative w-full min-w-[200px]" };
+const _hoisted_3 = ["disabled"];
+const _hoisted_4 = { class: "before:content[' '] after:content[' '] pointer-events-none absolute left-0 -top-1.5 flex h-full w-full select-none text-[11px] font-normal leading-tight text-blue-400 transition-all before:pointer-events-none before:mt-[6.5px] before:mr-1 before:box-border before:block before:h-1.5 before:w-2.5 before:rounded-tl-md before:border-t before:border-l before:border-neutral-300 before:transition-all after:pointer-events-none after:mt-[6.5px] after:ml-1 after:box-border after:block after:h-1.5 after:w-2.5 after:flex-grow after:rounded-tr-md after:border-t after:border-r after:border-neutral-300 after:transition-all peer-placeholder-shown:text-sm peer-placeholder-shown:leading-[3.75] peer-placeholder-shown:text-blue-500 peer-placeholder-shown:before:border-transparent peer-placeholder-shown:after:border-transparent peer-focus:text-[11px] peer-focus:leading-tight peer-focus:text-blue-500 peer-focus:before:border-t-2 peer-focus:before:border-l-2 peer-focus:before:border-blue-500 peer-focus:after:border-t-2 peer-focus:after:border-r-2 peer-focus:after:border-blue-500 peer-disabled:text-transparent peer-disabled:before:border-transparent peer-disabled:after:border-transparent peer-disabled:peer-placeholder-shown:text-blue-500" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "EpTextarea",
   props: {
     id: { default: "0" },
@@ -9,27 +13,33 @@ const p = { class: "w-96" }, u = { class: "relative w-full min-w-[200px]" }, i =
     placeholder: { default: "" },
     iconPath: { default: "" },
     iconSize: { default: "" },
-    disabled: { type: Boolean, default: !1 },
-    readonly: { type: Boolean, default: !1 },
-    labels: { default: () => ({
-      message: "Message"
-    }) }
+    disabled: { type: Boolean, default: false },
+    readonly: { type: Boolean, default: false },
+    labels: { default: () => {
+      return {
+        message: "Message"
+      };
+    } }
   },
   emits: ["update:modelValue"],
-  setup(r) {
-    const t = r, { disabled: o } = n(t);
-    return (l, h) => (s(), d("div", p, [
-      e("div", u, [
-        e("textarea", {
-          disabled: f(o),
-          class: "peer h-full min-h-[100px] w-full resize-none rounded-[7px] border border-neutral-300 bg-transparent px-3 py-2.5 font-sans text-sm font-normal text-neutral-700 outline outline-0 transition-all placeholder-shown:border placeholder-shown:border-neutral-300 placeholder-shown:border-t-neutral-200 focus:border-2 focus:border-blue-500 focus:border-t-transparent focus:outline-0 disabled:resize-none disabled:border-0 disabled:cursor-not-allowed disabled:bg-neutral-200 focus:ring-0",
-          placeholder: " "
-        }, null, 8, i),
-        e("label", c, b(l.labels.message), 1)
-      ])
-    ]));
+  setup(__props) {
+    const props = __props;
+    const { disabled } = toRefs(props);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createElementVNode("textarea", {
+            disabled: unref(disabled),
+            class: "peer h-full min-h-[100px] w-full resize-none rounded-[7px] border border-neutral-300 bg-transparent px-3 py-2.5 font-sans text-sm font-normal text-neutral-700 outline outline-0 transition-all placeholder-shown:border placeholder-shown:border-neutral-300 placeholder-shown:border-t-neutral-200 focus:border-2 focus:border-blue-500 focus:border-t-transparent focus:outline-0 disabled:resize-none disabled:border-0 disabled:cursor-not-allowed disabled:bg-neutral-200 focus:ring-0",
+            placeholder: " "
+          }, null, 8, _hoisted_3),
+          createElementVNode("label", _hoisted_4, toDisplayString(_ctx.labels.message), 1)
+        ])
+      ]);
+    };
   }
 });
 export {
-  m as default
+  _sfc_main as default
 };
+//# sourceMappingURL=EpTextarea.vue2.js.map

package/dist/components/forms/EpTextarea.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EpTextarea.vue2.js","sources":["../../../src/components/forms/EpTextarea.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { toRefs } from \"vue\";\nimport { EpTextareaProps } from \"~/types/forms/EpTextarea\";\n\nconst props = withDefaults(defineProps<EpTextareaProps>(), {\n  id: \"0\",\n  label: \"label\",\n  modelValue: \"\",\n  type: \"text\",\n  placeholder: \"\",\n  iconPath: \"\",\n  iconSize: \"\",\n  disabled: false,\n  readonly: false,\n  labels: () => {\n    return {\n      message: \"Message\",\n    };\n  },\n});\n\ndefineEmits<{\n  (e: \"update:modelValue\", modelValue: string): void;\n}>();\n\nconst { disabled } = toRefs(props);\n</script>\n\n<template>\n  <div class=\"w-96\">\n    <div class=\"relative w-full min-w-[200px]\">\n      <textarea\n        :disabled=\"disabled\"\n        class=\"peer h-full min-h-[100px] w-full resize-none rounded-[7px] border border-neutral-300 bg-transparent px-3 py-2.5 font-sans text-sm font-normal text-neutral-700 outline outline-0 transition-all placeholder-shown:border placeholder-shown:border-neutral-300 placeholder-shown:border-t-neutral-200 focus:border-2 focus:border-blue-500 focus:border-t-transparent focus:outline-0 disabled:resize-none disabled:border-0 disabled:cursor-not-allowed disabled:bg-neutral-200 focus:ring-0\"\n        placeholder=\" \"\n      ></textarea>\n      <label\n        class=\"before:content[' '] after:content[' '] pointer-events-none absolute left-0 -top-1.5 flex h-full w-full select-none text-[11px] font-normal leading-tight text-blue-400 transition-all before:pointer-events-none before:mt-[6.5px] before:mr-1 before:box-border before:block before:h-1.5 before:w-2.5 before:rounded-tl-md before:border-t before:border-l before:border-neutral-300 before:transition-all after:pointer-events-none after:mt-[6.5px] after:ml-1 after:box-border after:block after:h-1.5 after:w-2.5 after:flex-grow after:rounded-tr-md after:border-t after:border-r after:border-neutral-300 after:transition-all peer-placeholder-shown:text-sm peer-placeholder-shown:leading-[3.75] peer-placeholder-shown:text-blue-500 peer-placeholder-shown:before:border-transparent peer-placeholder-shown:after:border-transparent peer-focus:text-[11px] peer-focus:leading-tight peer-focus:text-blue-500 peer-focus:before:border-t-2 peer-focus:before:border-l-2 peer-focus:before:border-blue-500 peer-focus:after:border-t-2 peer-focus:after:border-r-2 peer-focus:after:border-blue-500 peer-disabled:text-transparent peer-disabled:before:border-transparent peer-disabled:after:border-transparent peer-disabled:peer-placeholder-shown:text-blue-500\"\n      >\n        {{ labels.message }}\n      </label>\n    </div>\n  </div>\n</template>\n"],"names":["_openBlock","_createElementBlock","_createElementVNode","_unref","_toDisplayString","labels"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAIA,UAAM,QAAQ;AAqBd,UAAM,EAAE,SAAA,IAAa,OAAO,KAAK;;AAI/B,aAAAA,UAAA,GAAAC,mBAaM,OAbN,YAaM;AAAA,QAZJC,mBAWM,OAXN,YAWM;AAAA,UAVJA,mBAIY,YAAA;AAAA,YAHT,UAAUC,MAAA,QAAA;AAAA,YACX,OAAM;AAAA,YACN,aAAY;AAAA,UAAA;UAEdD,mBAIQ,SAJR,YAIQE,gBADHC,KAAAA,OAAO,OAAO,GAAA,CAAA;AAAA,QAAA;;;;;"}

package/dist/components/forms/EpToggle.vue.js

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

package/dist/components/forms/EpToggle.vue.js.map

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

package/dist/components/forms/EpToggle.vue2.js

@@ -1,5 +1,7 @@
-import { defineComponent as s, toRefs as n, createElementBlock as u, openBlock as b, createElementVNode as o, unref as e, toDisplayString as _ } from "vue";
-const p = ["id", "type", "checked", "disabled"], h = ["for"], x = /* @__PURE__ */ s({
+import { defineComponent, toRefs, createElementBlock, openBlock, createElementVNode, unref, toDisplayString } from "vue";
+const _hoisted_1 = ["id", "type", "checked", "disabled"];
+const _hoisted_2 = ["for"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "EpToggle",
   props: {
     id: { default: "toggle" },
@@ -7,32 +9,38 @@ const p = ["id", "type", "checked", "disabled"], h = ["for"], x = /* @__PURE__ *
     modelValue: { default: "" },
     type: { default: "checkbox" },
     placeholder: { default: "" },
-    disabled: { type: Boolean, default: !1 },
-    readonly: { type: Boolean, default: !1 },
-    checked: { type: Boolean, default: !1 },
-    labels: { default: () => ({
-      defaultSwitch: "Default switch checkbox input"
-    }) }
+    disabled: { type: Boolean, default: false },
+    readonly: { type: Boolean, default: false },
+    checked: { type: Boolean, default: false },
+    labels: { default: () => {
+      return {
+        defaultSwitch: "Default switch checkbox input"
+      };
+    } }
   },
   emits: ["update:modelValue"],
-  setup(t) {
-    const a = t, { id: r, type: c, disabled: f, checked: d } = n(a);
-    return (l, k) => (b(), u("div", null, [
-      o("input", {
-        id: e(r),
-        type: e(c),
-        checked: e(d),
-        class: "form-checkbox mr-2 mt-[0rem] h-4 w-8 appearance-none rounded-full bg-neutral-200 border-neutral-300 before:pointer-events-none before:absolute before:h-3.5 before:w-3.5 before:rounded-full before:bg-transparent before:content-[''] after:absolute after:z-[2] after:-mt-[0rem] after:h-3.5 after:w-3.5 after:rounded-full after:border-none after:bg-neutral-50 after:shadow-[0_0px_3px_0_rgb(0_0_0_/_7%),_0_2px_2px_0_rgb(0_0_0_/_4%)] after:transition-[background-color_0.2s,transform_0.2s] after:content-[''] checked:bg-none checked:bg-blue-600 checked:after:absolute checked:after:z-[2] checked:after:-mt-[0px] checked:after:ml-[1.0625rem] checked:after:h-3.5 checked:after:w-3.5 checked:after:rounded-full checked:after:border-none checked:after:bg-neutral-100 checked:after:shadow-[0_3px_1px_-2px_rgba(0,0,0,0.2),_0_2px_2px_0_rgba(0,0,0,0.14),_0_1px_5px_0_rgba(0,0,0,0.12)] checked:after:transition-[background-color_0.2s,transform_0.2s] checked:after:content-[''] hover:cursor-pointer focus:outline-none focus:ring-0 focus:before:scale-75 focus:before:opacity-[0.12] focus:before:mt-[0.1rem] focus:before:shadow-[3px_-1px_0px_13px_rgba(0,0,0,0.6)] focus:before:transition-[box-shadow_0.2s,transform_0.2s] focus:after:absolute focus:after:z-[1] focus:after:block focus:after:h-3.5 focus:after:w-3.5 focus:after:-mt-[0rem] focus:after:rounded-full focus:after:content-[''] checked:focus:border-neutral-200 checked:focus:bg-blue-600 checked:focus:before:ml-[1rem] checked:focus:before:mt-[0.1rem] checked:focus:before:scale-75 checked:focus:before:shadow-[3px_-1px_0px_13px_#3b71ca] checked:focus:before:transition-[box-shadow_0.2s,transform_0.2s] dark:bg-neutral-600 dark:after:bg-neutral-400 dark:checked:bg-blue-600 dark:checked:after:bg-blue-600 dark:focus:before:shadow-[3px_-1px_0px_13px_rgba(255,255,255,0.4)] dark:checked:focus:before:shadow-[3px_-1px_0px_13px_#3b71ca] disabled:opacity-40 disabled:cursor-not-allowed",
-        role: "switch",
-        disabled: e(f)
-      }, null, 8, p),
-      o("label", {
-        class: "inline-block pl-[0.15rem] hover:cursor-pointer",
-        for: e(r)
-      }, _(l.labels.defaultSwitch), 9, h)
-    ]));
+  setup(__props) {
+    const props = __props;
+    const { id, type, disabled, checked } = toRefs(props);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        createElementVNode("input", {
+          id: unref(id),
+          type: unref(type),
+          checked: unref(checked),
+          class: "form-checkbox mr-2 mt-[0rem] h-4 w-8 appearance-none rounded-full bg-neutral-200 border-neutral-300 before:pointer-events-none before:absolute before:h-3.5 before:w-3.5 before:rounded-full before:bg-transparent before:content-[''] after:absolute after:z-[2] after:-mt-[0rem] after:h-3.5 after:w-3.5 after:rounded-full after:border-none after:bg-neutral-50 after:shadow-[0_0px_3px_0_rgb(0_0_0_/_7%),_0_2px_2px_0_rgb(0_0_0_/_4%)] after:transition-[background-color_0.2s,transform_0.2s] after:content-[''] checked:bg-none checked:bg-blue-600 checked:after:absolute checked:after:z-[2] checked:after:-mt-[0px] checked:after:ml-[1.0625rem] checked:after:h-3.5 checked:after:w-3.5 checked:after:rounded-full checked:after:border-none checked:after:bg-neutral-100 checked:after:shadow-[0_3px_1px_-2px_rgba(0,0,0,0.2),_0_2px_2px_0_rgba(0,0,0,0.14),_0_1px_5px_0_rgba(0,0,0,0.12)] checked:after:transition-[background-color_0.2s,transform_0.2s] checked:after:content-[''] hover:cursor-pointer focus:outline-none focus:ring-0 focus:before:scale-75 focus:before:opacity-[0.12] focus:before:mt-[0.1rem] focus:before:shadow-[3px_-1px_0px_13px_rgba(0,0,0,0.6)] focus:before:transition-[box-shadow_0.2s,transform_0.2s] focus:after:absolute focus:after:z-[1] focus:after:block focus:after:h-3.5 focus:after:w-3.5 focus:after:-mt-[0rem] focus:after:rounded-full focus:after:content-[''] checked:focus:border-neutral-200 checked:focus:bg-blue-600 checked:focus:before:ml-[1rem] checked:focus:before:mt-[0.1rem] checked:focus:before:scale-75 checked:focus:before:shadow-[3px_-1px_0px_13px_#3b71ca] checked:focus:before:transition-[box-shadow_0.2s,transform_0.2s] dark:bg-neutral-600 dark:after:bg-neutral-400 dark:checked:bg-blue-600 dark:checked:after:bg-blue-600 dark:focus:before:shadow-[3px_-1px_0px_13px_rgba(255,255,255,0.4)] dark:checked:focus:before:shadow-[3px_-1px_0px_13px_#3b71ca] disabled:opacity-40 disabled:cursor-not-allowed",
+          role: "switch",
+          disabled: unref(disabled)
+        }, null, 8, _hoisted_1),
+        createElementVNode("label", {
+          class: "inline-block pl-[0.15rem] hover:cursor-pointer",
+          for: unref(id)
+        }, toDisplayString(_ctx.labels.defaultSwitch), 9, _hoisted_2)
+      ]);
+    };
   }
 });
 export {
-  x as default
+  _sfc_main as default
 };
+//# sourceMappingURL=EpToggle.vue2.js.map

package/dist/components/forms/EpToggle.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EpToggle.vue2.js","sources":["../../../src/components/forms/EpToggle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { toRefs } from \"vue\";\nimport { EpToggleProps } from \"~/types/forms/EpToggle\";\n\nconst props = withDefaults(defineProps<EpToggleProps>(), {\n  id: \"toggle\",\n  label: \"label\",\n  modelValue: \"\",\n  type: \"checkbox\",\n  placeholder: \"\",\n  disabled: false,\n  readonly: false,\n  checked: false,\n  labels: () => {\n    return {\n      defaultSwitch: \"Default switch checkbox input\",\n    };\n  },\n});\n\ndefineEmits<{\n  (e: \"update:modelValue\", modelValue: string): void;\n}>();\n\nconst { id, type, disabled, checked } = toRefs(props);\n</script>\n\n<template>\n  <div>\n    <input\n      :id=\"id\"\n      :type=\"type\"\n      :checked=\"checked\"\n      class=\"form-checkbox mr-2 mt-[0rem] h-4 w-8 appearance-none rounded-full bg-neutral-200 border-neutral-300 before:pointer-events-none before:absolute before:h-3.5 before:w-3.5 before:rounded-full before:bg-transparent before:content-[''] after:absolute after:z-[2] after:-mt-[0rem] after:h-3.5 after:w-3.5 after:rounded-full after:border-none after:bg-neutral-50 after:shadow-[0_0px_3px_0_rgb(0_0_0_/_7%),_0_2px_2px_0_rgb(0_0_0_/_4%)] after:transition-[background-color_0.2s,transform_0.2s] after:content-[''] checked:bg-none checked:bg-blue-600 checked:after:absolute checked:after:z-[2] checked:after:-mt-[0px] checked:after:ml-[1.0625rem] checked:after:h-3.5 checked:after:w-3.5 checked:after:rounded-full checked:after:border-none checked:after:bg-neutral-100 checked:after:shadow-[0_3px_1px_-2px_rgba(0,0,0,0.2),_0_2px_2px_0_rgba(0,0,0,0.14),_0_1px_5px_0_rgba(0,0,0,0.12)] checked:after:transition-[background-color_0.2s,transform_0.2s] checked:after:content-[''] hover:cursor-pointer focus:outline-none focus:ring-0 focus:before:scale-75 focus:before:opacity-[0.12] focus:before:mt-[0.1rem] focus:before:shadow-[3px_-1px_0px_13px_rgba(0,0,0,0.6)] focus:before:transition-[box-shadow_0.2s,transform_0.2s] focus:after:absolute focus:after:z-[1] focus:after:block focus:after:h-3.5 focus:after:w-3.5 focus:after:-mt-[0rem] focus:after:rounded-full focus:after:content-[''] checked:focus:border-neutral-200 checked:focus:bg-blue-600 checked:focus:before:ml-[1rem] checked:focus:before:mt-[0.1rem] checked:focus:before:scale-75 checked:focus:before:shadow-[3px_-1px_0px_13px_#3b71ca] checked:focus:before:transition-[box-shadow_0.2s,transform_0.2s] dark:bg-neutral-600 dark:after:bg-neutral-400 dark:checked:bg-blue-600 dark:checked:after:bg-blue-600 dark:focus:before:shadow-[3px_-1px_0px_13px_rgba(255,255,255,0.4)] dark:checked:focus:before:shadow-[3px_-1px_0px_13px_#3b71ca] disabled:opacity-40 disabled:cursor-not-allowed\"\n      role=\"switch\"\n      :disabled=\"disabled\"\n    />\n    <label class=\"inline-block pl-[0.15rem] hover:cursor-pointer\" :for=\"id\">{{\n      labels.defaultSwitch\n    }}</label>\n  </div>\n</template>\n"],"names":["_createElementBlock","_createElementVNode","_unref","labels"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAIA,UAAM,QAAQ;AAoBd,UAAM,EAAE,IAAI,MAAM,UAAU,QAAA,IAAY,OAAO,KAAK;;0BAIlDA,mBAYM,OAAA,MAAA;AAAA,QAXJC,mBAOE,SAAA;AAAA,UANC,IAAIC,MAAA,EAAA;AAAA,UACJ,MAAMA,MAAA,IAAA;AAAA,UACN,SAASA,MAAA,OAAA;AAAA,UACV,OAAM;AAAA,UACN,MAAK;AAAA,UACJ,UAAUA,MAAA,QAAA;AAAA,QAAA;QAEbD,mBAEU,SAAA;AAAA,UAFH,OAAM;AAAA,UAAkD,KAAKC,MAAA,EAAA;AAAA,QAAA,GAClEC,gBAAAA,KAAAA,OAAO,aAAa,GAAA,GAAA,UAAA;AAAA,MAAA;;;;"}

package/dist/components/interactions/Ep360Image.vue.js

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

package/dist/components/interactions/Ep360Image.vue.js.map

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

package/dist/components/interactions/Ep360Image.vue2.js

@@ -1,10 +1,13 @@
-import { defineComponent as e, createElementBlock as r, openBlock as t } from "vue";
-const m = /* @__PURE__ */ e({
+import { defineComponent, createElementBlock, openBlock } from "vue";
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Ep360Image",
-  setup(n) {
-    return (o, a) => (t(), r("div", null, "La lib aframe et three.js à revoir"));
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, "La lib aframe et three.js à revoir");
+    };
   }
 });
 export {
-  m as default
+  _sfc_main as default
 };
+//# sourceMappingURL=Ep360Image.vue2.js.map

package/dist/components/interactions/Ep360Image.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Ep360Image.vue2.js","sources":["../../../src/components/interactions/Ep360Image.vue"],"sourcesContent":["<script setup lang=\"ts\">\n// DO NOT DELETE. IMPORTANT FOR VIDEO NAVIGATION : this.el.object3D.getWorldPosition(position);\n/*import { ref, onMounted } from \"vue\";\nimport type { Pin, Scene } from \"~/types/image360\";\n\ninterface Props {\n  scenes: Scene[];\n  id?: string;\n}\n\nconst props = defineProps<Props>();\n\nconst currentSceneIndex = ref(0);\nconst hoveredPin = ref<Pin | null>(null);\nconst clickedPin = ref<Pin | null>(null);\n\nlet AFRAME: any;\nlet THREE: any;\n\nonMounted(async () => {\n  // Lazy load aframe and three.js\n  const aframeModule = await import('aframe');\n  AFRAME = window.AFRAME ?? aframeModule;\n  THREE = await import('three');\n\n  await checkAndDeleteComponent(\"rotation-reader\", 2000);\n  await registerRotationReaderComponent(2000);\n});\n\nfunction handleMarkerClick(pin: Pin, event: Event): void {\n  if (!pin) return;\n\n  if (pin?.event === \"onClick\" || !pin.event) {\n    if (pin.type === \"descriptive\") {\n      clickedPin.value = pin;\n      const target = event.target as HTMLElement;\n      target.setAttribute(\"material\", \"opacity: 0; transparent: true\");\n    } else if (pin.type === \"action\") {\n      const nextSceneIndex = props.scenes.findIndex(scene => scene.id === pin.scene);\n      if (nextSceneIndex !== -1) {\n        currentSceneIndex.value = nextSceneIndex;\n      }\n    }\n  }\n}\n\nfunction handleMouseEnter(pin: Pin | null, event: Event): void {\n  if (!pin) return;\n\n  if (pin?.event === \"onHover\" || !pin?.event) {\n    hoveredPin.value = pin;\n    const target = event.target as HTMLElement;\n    target.setAttribute(\"material\", \"opacity: 0; transparent: true\");\n  }\n}\n\nfunction handleMouseLeave(pin: Pin | null, event: Event): void {\n  if (!pin) return;\n\n  const relatedTarget = (event as MouseEvent).relatedTarget as HTMLElement;\n\n  if (pin?.event === \"onHover\" || !pin?.event) {\n    const target = event.target as HTMLElement;\n    if (clickedPin.value === pin) {\n      target.setAttribute(\"material\", \"opacity: 1; transparent: true\");\n    }\n    if (\n      !relatedTarget?.classList.contains(\"interactive-area\") &&\n      hoveredPin.value?.id === pin?.id\n    ) {\n      hoveredPin.value = null;\n    }\n  }\n}\n\nfunction convertToPosition(x: number, y: number): string {\n  return `${x / 10} ${y / 10} -5`;\n}\n\nasync function checkAndDeleteComponent(componentName: string, delayMs = 1000) {\n  if (AFRAME?.components[componentName]) {\n    await delay(delayMs);\n    delete AFRAME.components[componentName];\n  }\n}\n\nfunction delay(ms: number): Promise<void> {\n  return new Promise((resolve) => setTimeout(resolve, ms));\n}\n\nasync function registerRotationReaderComponent(delayMs = 1000) {\n  await delay(delayMs);\n  if (AFRAME.components[\"rotation-reader\"]) {\n    console.warn(\"Existing rotation-reader component found. Re-registering...\");\n    delete AFRAME.components[\"rotation-reader\"];\n  }\n\n  AFRAME.registerComponent(\"rotation-reader\", {\n    schema: {},\n    tick: createTickFunction(),\n  });\n}\n\nfunction createTickFunction() {\n  const quaternion = new THREE.Quaternion();\n  const cameraPosition = new THREE.Vector3();\n  const objectPosition = new THREE.Vector3();\n\n  const referenceDistance = 5;\n  const initialScale = 0.8;\n\n  return function (this: {\n    el: { object3D: InstanceType<typeof THREE.Object3D>; sceneEl: any };\n  }) {\n    updateCameraQuaternion(this.el.object3D, quaternion);\n\n    const sceneEl = this.el.sceneEl;\n    updatePinsRotation(quaternion, sceneEl);\n\n    this.el.object3D.getWorldPosition(cameraPosition);\n\n    sceneEl.querySelectorAll(\".pin-marker\").forEach((pinElement: any) => {\n      const pinObject = pinElement.object3D;\n      if (pinObject) {\n        pinObject.getWorldPosition(objectPosition);\n        const distance = cameraPosition.distanceTo(objectPosition);\n        const scale = (distance * initialScale) / referenceDistance;\n        pinObject.scale.set(scale, scale, scale);\n      }\n    });\n\n    sceneEl.querySelectorAll(\".frame\").forEach((frameElement: any) => {\n      const frameObject = frameElement.object3D;\n      if (frameObject) {\n        frameObject.getWorldPosition(objectPosition);\n        const distance = cameraPosition.distanceTo(objectPosition);\n        const scale = (distance * initialScale) / referenceDistance;\n        frameObject.scale.set(scale, scale, scale);\n      }\n    });\n  };\n}\n\nfunction updateCameraQuaternion(\n  object3D: InstanceType<typeof THREE.Object3D>,\n  quaternion: InstanceType<typeof THREE.Quaternion>\n) {\n  object3D.getWorldQuaternion(quaternion);\n}\n\nfunction updatePinsRotation(quaternion: InstanceType<typeof THREE.Quaternion>, sceneEl: any) {\n  sceneEl.querySelectorAll(\".pin-marker\").forEach((pinElement: any) => {\n    const pinObject = pinElement.object3D;\n    if (pinObject) {\n      pinObject.setRotationFromQuaternion(quaternion);\n    }\n  });\n  sceneEl.querySelectorAll(\".frame\").forEach((pinElement: any) => {\n    const pinObject = pinElement.object3D;\n    if (pinObject) {\n      pinObject.setRotationFromQuaternion(quaternion);\n    }\n  });\n}\n\nfunction removeFrame() {\n  clickedPin.value = null;\n}\n\nfunction getPinOpacity(pinId: number): number {\n  return (hoveredPin.value?.id === pinId || clickedPin.value?.id === pinId) ? 0 : 1;\n}\n\nfunction getPinColor(pin: Pin): string {\n  return pin.color || \"indigo\";\n}*/\n</script>\n\n<template>\n  <!--\n    <div\n        style=\"\n            width: 800px;\n            height: 600px;\n            overflow: hidden;\n            position: relative;\n            margin: auto;\n        \"\n    >\n        <a-scene :id=\"id\" embedded>\n            <a-assets>\n                <img\n                    v-for=\"scene in props.scenes\"\n                    :key=\"scene.id\"\n                    :id=\"`image${scene.id}`\"\n                    :src=\"scene.skyImage\"\n                    crossorigin=\"anonymous\"\n                />\n            </a-assets>\n            <a-entity camera look-controls id=\"rig\" rotation-reader>\n                <a-cursor\n                    id=\"cursor\"\n                    cursor=\"rayOrigin: mouse\"\n                    raycaster=\"objects: none\"\n                    geometry=\"primitive: ring; radiusInner: 0; radiusOuter: 0\"\n                    material=\"opacity: 0; transparent: true\"\n                ></a-cursor>\n            </a-entity>\n\n            <a-sky\n                :src=\"`#image${props.scenes[currentSceneIndex].id}`\"\n                radius=\"100\"\n            ></a-sky>\n\n            <a-entity\n                v-for=\"pin in props.scenes[currentSceneIndex].pins\"\n                :key=\"pin.id\"\n                :position=\"convertToPosition(pin.x, pin.y)\"\n                cursor=\"rayOrigin: mouse\"\n            >\n                <a-circle\n                    class=\"pin-marker\"\n                    :color=\"getPinColor(pin)\"\n                    radius=\"0.15\"\n                    shader=\"flat\"\n                    :material=\"`opacity: ${getPinOpacity(\n                        pin.id\n                    )}; transparent: true;`\"\n                    @click=\"(event: Event) => handleMarkerClick(pin, event)\"\n                    @mouseenter=\"(event: Event) => handleMouseEnter(pin, event)\"\n                >\n\n                 \n                    <a-circle\n                        position=\"0 0 0.01\"\n                        color=\"#FFF\" \n                        radius=\"0.05\" \n                        material=\"opacity: 0;\"\n                    ></a-circle>\n\n                </a-circle>\n            </a-entity>\n\n            <a-entity\n                v-if=\"hoveredPin\"\n                :position=\"convertToPosition(hoveredPin.x, hoveredPin.y)\"\n                class=\"frame interactive-area\"\n                cursor=\"rayOrigin: mouse\"\n                @mouseleave=\"(event: Event) => handleMouseLeave(hoveredPin, event)\"\n            >\n                <a-plane\n                    color=\"white\"\n                    :opacity=\"1\"\n                    width=\"4\"\n                    height=\"1.5\"\n                    material=\"shader: standard; side: double;\"\n                    position=\"0 0 0\"\n                    geometry=\"primitive: plane; height: 1.5; width: 4;\"\n                >\n                </a-plane>\n\n                <a-text\n                    :value=\"hoveredPin.title\"\n                    color=\"#2c3e50\"\n                    font=\"dejavu\"\n                    align=\"center\"\n                    width=\"3.8\"\n                    position=\"0 0.3 0.01\"\n                >\n                </a-text>\n\n                <a-text\n                    :value=\"hoveredPin.description\"\n                    color=\"#34495e\"\n                    font=\"dejavu\"\n                    align=\"center\"\n                    width=\"3.5\"\n                    position=\"0 -0.3 0.01\"\n                >\n                </a-text>\n            </a-entity>\n\n            <a-entity\n                v-if=\"clickedPin\"\n                :position=\"convertToPosition(clickedPin.x, clickedPin.y)\"\n                class=\"frame interactive-area\"\n                cursor=\"rayOrigin: mouse\"\n            >\n                <a-plane\n                    color=\"white\"\n                    :opacity=\"1\"\n                    width=\"4\"\n                    height=\"1.5\"\n                    material=\"shader: standard; side: double;\"\n                    position=\"0 0 0\"\n                    geometry=\"primitive: plane; height: 1.5; width: 4;\"\n                >\n                </a-plane>\n\n                <a-plane\n                    class=\"close-frame\"\n                    color=\"red\"\n                    width=\"0.4\"\n                    height=\"0.4\"\n                    position=\"1.8 0.55 0.01\"\n                    material=\"shader: flat; side: double; transparent: true;\"\n                    geometry=\"primitive: plane; height: 0.4; width: 0.4;\"\n                    @click=\"removeFrame\"\n                >\n                </a-plane>\n\n                <a-text\n                    :value=\"clickedPin.title\"\n                    color=\"#2c3e50\"\n                    font=\"dejavu\"\n                    align=\"center\"\n                    width=\"3.8\"\n                    position=\"0 0.3 0.01\"\n                >\n                </a-text>\n\n                <a-text\n                    :value=\"clickedPin.description\"\n                    color=\"#34495e\"\n                    font=\"dejavu\"\n                    align=\"center\"\n                    width=\"3.5\"\n                    position=\"0 -0.3 0.01\"\n                >\n                </a-text>\n            </a-entity>\n        </a-scene>\n    </div>-->\n  <div>La lib aframe et three.js à revoir</div>\n</template>\n"],"names":["_openBlock","_createElementBlock"],"mappings":";;;;;AA6UE,aAAAA,UAAA,GAAAC,mBAA6C,aAAxC,oCAAkC;AAAA;;;"}

package/dist/components/interactions/Ep360Video.vue.js

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

package/dist/components/interactions/Ep360Video.vue.js.map

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

package/dist/components/interactions/Ep360Video.vue2.js

@@ -1,10 +1,13 @@
-import { defineComponent as e, createElementBlock as r, openBlock as t } from "vue";
-const p = /* @__PURE__ */ e({
+import { defineComponent, createElementBlock, openBlock } from "vue";
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Ep360Video",
-  setup(o) {
-    return (n, a) => (t(), r("div", null, "La lib aframe et three.js à revoir"));
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, "La lib aframe et three.js à revoir");
+    };
   }
 });
 export {
-  p as default
+  _sfc_main as default
 };
+//# sourceMappingURL=Ep360Video.vue2.js.map

package/dist/components/interactions/Ep360Video.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Ep360Video.vue2.js","sources":["../../../src/components/interactions/Ep360Video.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\nimport { ref, onMounted } from \"vue\";\n// import * as AFRAME from \"aframe\";\n\nimport { Object3D, Quaternion, Vector3 } from \"three\";\nimport type { Pin, Scene } from \"~/types/video360\";\n\ninterface Props {\n    scenes:Scene[];\n}\n\nconst props = defineProps<Props>();\n\nconst currentSceneIndex = ref(0);\nconst hoveredPin = ref<Pin | null>(null);\nconst clickedPin = ref<Pin | null>(null);\nconst isPlaying = ref(false);\n\nconst AFRAME = window.AFRAME;\n\nif (!AFRAME.components[\"rotation-reader\"]) {\n    AFRAME.registerComponent(\"rotation-reader\", {\n        schema: {},\n        tick: createTickFunction(),\n    });\n}\n\nfunction handleMarkerClick(pin: Pin, event: Event): void {\n    if (!pin) return;\n\n    if (pin?.event === \"onClick\") {\n        if (pin.type === \"descriptive\") {\n            clickedPin.value = pin;\n            const target = event.target as HTMLElement;\n            target.setAttribute(\"material\", \"opacity: 0; transparent: true\");\n            console.log(\"Marker clicked:\", pin);\n        } else if (pin.type === \"action\") {\n            const nextSceneIndex = props.scenes.findIndex(\n                (scene) => scene.id === pin.scene\n            );\n            if (nextSceneIndex !== -1) {\n                currentSceneIndex.value = nextSceneIndex;\n            }\n            console.log(\n                \"Action Pin Clicked. Scene switched to:\",\n                currentSceneIndex.value\n            );\n        }\n    }\n}\n\nfunction handleMouseEnter(pin: Pin | null, event: Event): void {\n    if (!pin) return;\n    if (pin.event === \"onHover\" || !pin.event) {\n        hoveredPin.value = pin;\n        console.log(\"Marker hovered:\", pin);\n    }\n}\n\nfunction handleMouseLeave(pin: Pin | null, event: Event): void {\n    if (!pin) return;\n    const relatedTarget = (event as MouseEvent).relatedTarget as HTMLElement;\n    if (pin.event === \"onHover\" || !pin?.event) {\n        if (\n            !relatedTarget?.classList.contains(\"interactive-area\") &&\n            hoveredPin.value?.id === pin.id\n        ) {\n            hoveredPin.value = null;\n            console.log(\"Hover cleared:\", pin);\n        }\n    }\n}\n\nfunction convertToPosition(x: number, y: number): string {\n    return `${x / 10} ${y / 10} -5`;\n}\n\nfunction removeFrame() {\n    clickedPin.value = null;\n}\n\nfunction getPinColor(pin: Pin): string {\n    return pin.color || \"indigo\";\n}\n\nfunction getPinOpacity(pinId: number): number {\n    return (hoveredPin.value && hoveredPin.value.id === pinId) ||\n        (clickedPin.value && clickedPin.value.id === pinId)\n        ? 0\n        : 1;\n}\n\nfunction toggleVideo() {\n    isPlaying.value = !isPlaying.value;\n    const videoElements = document.querySelectorAll<HTMLVideoElement>(\".video\");\n    videoElements.forEach((video) => {\n        isPlaying.value ? video.play() : video.pause();\n    });\n}\n\nonMounted(() => {\n    (async () => {\n        await checkAndDeleteComponent(\"rotation-reader\", 2000);\n    })();\n    (async () => {\n        await registerRotationReaderComponent(2000);\n    })();\n});\n\nasync function checkAndDeleteComponent(\n    componentName: string,\n    delayMs: number = 1000\n) {\n    if (AFRAME.components[componentName]) {\n        await delay(delayMs);\n        delete AFRAME.components[componentName];\n    }\n}\n\nfunction delay(ms: number): Promise<void> {\n    return new Promise((resolve) => setTimeout(resolve, ms));\n}\n\nasync function registerRotationReaderComponent(delayMs: number = 1000) {\n    await delay(delayMs);\n    if (AFRAME.components[\"rotation-reader\"]) {\n        console.warn(\"Existing rotation-reader found. Re-registering...\");\n        delete AFRAME.components[\"rotation-reader\"];\n    }\n\n    AFRAME.registerComponent(\"rotation-reader\", {\n        schema: {},\n        tick: createTickFunction(),\n    });\n}\n\nfunction createTickFunction() {\n    const quaternion = new Quaternion();\n    const cameraPosition = new Vector3();\n    const objectPosition = new Vector3();\n\n    const referenceDistance = 5;\n    const initialScale = 0.8;\n\n    return function (this: {\n        el: { object3D: InstanceType<typeof Object3D>; sceneEl: any };\n    }) {\n        updateCameraQuaternion(this.el.object3D, quaternion);\n        updatePinsRotation(quaternion);\n\n        this.el.object3D.getWorldPosition(cameraPosition);\n\n        document.querySelectorAll(\".pin-marker\").forEach((pinElement) => {\n            const pinObject = (pinElement as any).object3D;\n            if (pinObject) {\n                pinObject.getWorldPosition(objectPosition);\n                const distance = cameraPosition.distanceTo(objectPosition);\n                const scale = (distance * initialScale) / referenceDistance;\n                pinObject.scale.set(scale, scale, scale);\n            }\n        });\n\n        document.querySelectorAll(\".frame\").forEach((frameElement) => {\n            const frameObject = (frameElement as any).object3D;\n            if (frameObject) {\n                frameObject.getWorldPosition(objectPosition);\n                const distance = cameraPosition.distanceTo(objectPosition);\n                const scale = (distance * initialScale) / referenceDistance;\n                frameObject.scale.set(scale, scale, scale);\n            }\n        });\n    };\n}\n\nfunction updateCameraQuaternion(\n    object3D: InstanceType<typeof Object3D>,\n    quaternion: InstanceType<typeof Quaternion>\n) {\n    object3D.getWorldQuaternion(quaternion);\n}\n\nfunction updatePinsRotation(quaternion: InstanceType<typeof Quaternion>) {\n    \n    document.querySelectorAll(\".pin-marker\").forEach((pinElement) => {\n        const pinObject = (pinElement as any).object3D;\n        if (pinObject) {\n            pinObject.setRotationFromQuaternion(quaternion);\n        }\n    });\n\n    document.querySelectorAll(\".frame\").forEach((frameElement) => {\n        const frameObject = (frameElement as any).object3D;\n        if (frameObject) {\n            frameObject.setRotationFromQuaternion(quaternion);\n        }\n    });\n}*/\n</script>\n\n<template>\n  <!--\n    <div style=\"width: 1200px; height: 800px; position: relative; margin: auto\">\n        <button @click=\"toggleVideo()\">\n            {{ isPlaying ? \"Pause\" : \"Play\" }}\n        </button>\n\n        <a-scene embedded>\n            <a-assets>\n                <video\n                    v-for=\"scene in props.scenes\"\n                    :id=\"`video${scene.id}`\"\n                    :src=\"scene.skyVideo\"\n                    muted\n                    class=\"video\"\n                    playsinline\n                    loop\n                    crossorigin=\"anonymous\"\n                ></video>\n            </a-assets>\n\n           \n            <a-entity camera look-controls id=\"rig\" rotation-reader>\n                <a-cursor\n                    id=\"cursor\"\n                    cursor=\"rayOrigin: mouse\"\n                    raycaster=\"objects: none\"\n                    geometry=\"primitive: ring; radiusInner: 0; radiusOuter: 0\"\n                    material=\"opacity: 0; transparent: true\"\n                ></a-cursor>\n            </a-entity>\n\n            \n            <a-videosphere\n                v-for=\"scene in props.scenes\"\n                :key=\"scene.id\"\n                :src=\"`#video${props.scenes[currentSceneIndex].id}`\"\n            ></a-videosphere>\n\n            \n            <a-entity\n                v-for=\"pin in props.scenes[currentSceneIndex].pins\"\n                :key=\"pin.id\"\n                :position=\"convertToPosition(pin.x, pin.y)\"\n                cursor=\"rayOrigin: mouse\"\n            >\n                <a-circle\n                    class=\"pin-marker\"\n                    :color=\"getPinColor(pin)\"\n                    radius=\"0.15\"\n                    shader=\"flat\"\n                    :material=\"`opacity: ${getPinOpacity(\n                        pin.id\n                    )}; transparent: true`\"\n                    @click=\"(event: Event) => handleMarkerClick(pin, event)\"\n                    @mouseenter=\"(event: Event) => handleMouseEnter(pin, event)\"\n                    @mouseleave=\"(event: Event) => handleMouseLeave(pin, event)\"\n                >\n                    \n                    <a-circle\n                        position=\"0 0 0.01\"\n                        color=\"#FFF\" \n                        radius=\"0.05\" \n                        material=\"opacity: 0;\"\n                    ></a-circle>\n                    \n                </a-circle>\n            </a-entity>\n\n            \n            <a-entity\n                v-if=\"hoveredPin\"\n                :position=\"convertToPosition(hoveredPin.x, hoveredPin.y)\"\n                class=\"frame interactive-area\"\n                cursor=\"rayOrigin: mouse\"\n                @mouseleave=\"(event: Event) => handleMouseLeave(hoveredPin, event)\"\n            >\n                <a-plane\n                    color=\"white\"\n                    :opacity=\"1\"\n                    width=\"4\"\n                    height=\"1.5\"\n                    material=\"shader: standard; side: double;\"\n                    position=\"0 0 0\"\n                    geometry=\"primitive: plane; height: 1.5; width: 4;\"\n                ></a-plane>\n\n                <a-text\n                    :value=\"hoveredPin.title\"\n                    color=\"#2c3e50\"\n                    font=\"dejavu\"\n                    align=\"center\"\n                    width=\"3.8\"\n                    position=\"0 0.3 0.01\"\n                ></a-text>\n                <a-text\n                    :value=\"hoveredPin.description\"\n                    color=\"#34495e\"\n                    font=\"dejavu\"\n                    align=\"center\"\n                    width=\"3.5\"\n                    position=\"0 -0.3 0.01\"\n                ></a-text>\n            </a-entity>\n\n           \n            <a-entity\n                v-if=\"clickedPin\"\n                :position=\"convertToPosition(clickedPin.x, clickedPin.y)\"\n                class=\"frame interactive-area\"\n                cursor=\"rayOrigin: mouse\"\n            >\n                <a-plane\n                    color=\"white\"\n                    :opacity=\"1\"\n                    width=\"4\"\n                    height=\"1.5\"\n                    material=\"shader: standard; side: double;\"\n                    position=\"0 0 0\"\n                    geometry=\"primitive: plane; height: 1.5; width: 4;\"\n                ></a-plane>\n\n                <a-plane\n                    class=\"close-frame\"\n                    color=\"red\"\n                    width=\"0.4\"\n                    height=\"0.4\"\n                    position=\"1.8 0.55 0.01\"\n                    material=\"shader: flat; side: double; transparent: true;\"\n                    geometry=\"primitive: plane; height: 0.4; width: 0.4;\"\n                    @click=\"removeFrame\"\n                ></a-plane>\n\n                <a-text\n                    :value=\"clickedPin.title\"\n                    color=\"#2c3e50\"\n                    font=\"dejavu\"\n                    align=\"center\"\n                    width=\"3.8\"\n                    position=\"0 0.3 0.01\"\n                ></a-text>\n                <a-text\n                    :value=\"clickedPin.description\"\n                    color=\"#34495e\"\n                    font=\"dejavu\"\n                    align=\"center\"\n                    width=\"3.5\"\n                    position=\"0 -0.3 0.01\"\n                ></a-text>\n            </a-entity>\n        </a-scene>\n    </div>-->\n  <div>La lib aframe et three.js à revoir</div>\n</template>\n"],"names":["_openBlock","_createElementBlock"],"mappings":";;;;;AAgWE,aAAAA,UAAA,GAAAC,mBAA6C,aAAxC,oCAAkC;AAAA;;;"}

package/dist/components/interactions/EpAccordeon.vue.js

@@ -1,7 +1,8 @@
-import o from "./EpAccordeon.vue2.js";
+import _sfc_main from "./EpAccordeon.vue2.js";
 /* empty css                 */
-import r from "../../_virtual/_plugin-vue_export-helper.js";
-const a = /* @__PURE__ */ r(o, [["__scopeId", "data-v-f7c467a7"]]);
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
+const Comp = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f7c467a7"]]);
 export {
-  a as default
+  Comp as default
 };
+//# sourceMappingURL=EpAccordeon.vue.js.map

package/dist/components/interactions/EpAccordeon.vue.js.map

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

package/dist/components/interactions/EpAccordeon.vue2.js

@@ -1,75 +1,103 @@
-import { defineComponent as $, ref as p, computed as a, onMounted as b, toRefs as w, createElementBlock as d, openBlock as i, createElementVNode as o, normalizeClass as n, unref as r, createBlock as H, createCommentVNode as _, createTextVNode as B, toDisplayString as C, renderSlot as E } from "vue";
-import V from "../basics/EpIcon.vue.js";
-import m from "../../composables/useColors.js";
-import { typeAccordeon as D } from "../../types/Accordeon.js";
-const N = { class: "py-3" }, M = /* @__PURE__ */ $({
+import { defineComponent, ref, computed, onMounted, toRefs, createElementBlock, openBlock, createElementVNode, normalizeClass, unref, createBlock, createCommentVNode, createTextVNode, toDisplayString, renderSlot } from "vue";
+import _sfc_main$1 from "../basics/EpIcon.vue.js";
+import useColors from "../../composables/useColors.js";
+import { typeAccordeon } from "../../types/Accordeon.js";
+const _hoisted_1 = { class: "py-3" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "EpAccordeon",
   props: {
     type: { default: "base" },
     icon: {},
-    open: { type: Boolean, default: !1 },
-    outlined: { type: Boolean, default: !1 },
+    open: { type: Boolean, default: false },
+    outlined: { type: Boolean, default: false },
     title: { default: "En savoir plus" },
     small: { type: Boolean }
   },
-  setup(f) {
-    const t = f, l = p(t.open), s = p(), y = a(() => t.outlined ? "outlined" : "default"), v = a(() => `flex justify-between items-center px-4 ${t.small ? "py-1" : "py-2"} cursor-pointer ${D[t.type]?.[y.value]}`), x = a(() => `px-4 ${m(
-      "bg",
-      t.type + "light"
-    )} dark:bg-dark dark:${m("border", t.type + "dark")} ${l.value ? "" : "dark:border-0"}`);
-    b(() => {
-      var e = s.value;
-      t.open && (e.style.maxHeight = e.scrollHeight + "px");
+  setup(__props) {
+    const props = __props;
+    const showDiv = ref(props.open);
+    const collapsible = ref();
+    const isOutlined = computed(() => {
+      if (props.outlined) {
+        return "outlined";
+      }
+      return "default";
     });
-    function g() {
-      l.value = !l.value;
-      var e = s.value;
-      e.style.maxHeight ? e.style.maxHeight = null : e.style.maxHeight = e.scrollHeight + "px", e.style.transition || (e.style.transition = "max-height 0.2s ease-out");
+    const stylesHeader = computed(() => {
+      var _a;
+      return `flex justify-between items-center px-4 ${props.small ? "py-1" : "py-2"} cursor-pointer ${(_a = typeAccordeon[props.type]) == null ? void 0 : _a[isOutlined.value]}`;
+    });
+    const contentStyles = computed(() => {
+      return `px-4 ${useColors(
+        "bg",
+        props.type + "light"
+      )} dark:bg-dark dark:${useColors("border", props.type + "dark")} ${showDiv.value ? "" : "dark:border-0"}`;
+    });
+    onMounted(() => {
+      var content = collapsible.value;
+      if (props.open) {
+        content.style.maxHeight = content.scrollHeight + "px";
+      }
+    });
+    function toggleDivVisibility() {
+      showDiv.value = !showDiv.value;
+      var content = collapsible.value;
+      if (content.style.maxHeight) {
+        content.style.maxHeight = null;
+      } else {
+        content.style.maxHeight = content.scrollHeight + "px";
+      }
+      if (!content.style.transition) {
+        content.style.transition = "max-height 0.2s ease-out";
+      }
     }
-    const { title: h, icon: c, small: k } = w(t);
-    return (e, u) => (i(), d("div", null, [
-      o("div", {
-        class: n(v.value),
-        onClick: g
-      }, [
-        o("h3", {
-          class: n(`${r(k) ? "text" : "text-lg"} flex items-center`)
+    const { title, icon, small } = toRefs(props);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        createElementVNode("div", {
+          class: normalizeClass(stylesHeader.value),
+          onClick: toggleDivVisibility
         }, [
-          r(c) ? (i(), H(V, {
-            key: 0,
-            "icon-path": r(c),
-            size: "28",
-            extraClass: "mr-2"
-          }, null, 8, ["icon-path"])) : _("", !0),
-          B(C(r(h)), 1)
+          createElementVNode("h3", {
+            class: normalizeClass(`${unref(small) ? "text" : "text-lg"} flex items-center`)
+          }, [
+            unref(icon) ? (openBlock(), createBlock(_sfc_main$1, {
+              key: 0,
+              "icon-path": unref(icon),
+              size: "28",
+              extraClass: "mr-2"
+            }, null, 8, ["icon-path"])) : createCommentVNode("", true),
+            createTextVNode(toDisplayString(unref(title)), 1)
+          ], 2),
+          (openBlock(), createElementBlock("svg", {
+            xmlns: "http://www.w3.org/2000/svg",
+            fill: "none",
+            viewBox: "0 0 24 24",
+            "stroke-width": "1.5",
+            stroke: "currentColor",
+            class: normalizeClass(`mx-4 my-3 h-6 w-6 transition-all duration-200 ${showDiv.value ? "rotate-45" : ""}`)
+          }, [..._cache[0] || (_cache[0] = [
+            createElementVNode("path", {
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round",
+              d: "M12 6v12m6-6H6"
+            }, null, -1)
+          ])], 2))
         ], 2),
-        (i(), d("svg", {
-          xmlns: "http://www.w3.org/2000/svg",
-          fill: "none",
-          viewBox: "0 0 24 24",
-          "stroke-width": "1.5",
-          stroke: "currentColor",
-          class: n(`mx-4 my-3 h-6 w-6 transition-all duration-200 ${l.value ? "rotate-45" : ""}`)
-        }, [...u[0] || (u[0] = [
-          o("path", {
-            "stroke-linecap": "round",
-            "stroke-linejoin": "round",
-            d: "M12 6v12m6-6H6"
-          }, null, -1)
-        ])], 2))
-      ], 2),
-      o("div", {
-        ref_key: "collapsible",
-        ref: s,
-        class: n(`${x.value} content`)
-      }, [
-        o("div", N, [
-          E(e.$slots, "default", {}, void 0, !0)
-        ])
-      ], 2)
-    ]));
+        createElementVNode("div", {
+          ref_key: "collapsible",
+          ref: collapsible,
+          class: normalizeClass(`${contentStyles.value} content`)
+        }, [
+          createElementVNode("div", _hoisted_1, [
+            renderSlot(_ctx.$slots, "default", {}, void 0, true)
+          ])
+        ], 2)
+      ]);
+    };
   }
 });
 export {
-  M as default
+  _sfc_main as default
 };
+//# sourceMappingURL=EpAccordeon.vue2.js.map

package/dist/components/interactions/EpAccordeon.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EpAccordeon.vue2.js","sources":["../../../src/components/interactions/EpAccordeon.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, toRefs, onMounted, computed } from \"vue\";\nimport EpIcon from \"~/components/basics/EpIcon.vue\";\nimport useColors from \"~/composables/useColors\";\nimport { typeAccordeon } from \"~/types/Accordeon\";\nimport { EpAccordeonProps } from \"~/types/interactions/EpAccordeon\";\n\nconst props = withDefaults(defineProps<EpAccordeonProps>(), {\n  open: false,\n  type: \"base\",\n  outlined: false,\n  title: \"En savoir plus\",\n});\n\nconst showDiv = ref(props.open);\nconst collapsible = ref();\n\nconst isOutlined = computed(() => {\n  if (props.outlined) {\n    return \"outlined\";\n  }\n  return \"default\";\n});\n\nconst stylesHeader = computed(() => {\n  return `flex justify-between items-center px-4 ${\n    props.small ? \"py-1\" : \"py-2\"\n  } cursor-pointer ${typeAccordeon[props.type]?.[isOutlined.value]}`;\n});\n\nconst contentStyles = computed(() => {\n  return `px-4 ${useColors(\n    \"bg\",\n    props.type + \"light\"\n  )} dark:bg-dark dark:${useColors(\"border\", props.type + \"dark\")} ${\n    showDiv.value ? \"\" : \"dark:border-0\"\n  }`;\n});\n\nonMounted(() => {\n  var content = collapsible.value;\n  if (props.open) {\n    content.style.maxHeight = content.scrollHeight + \"px\";\n  }\n});\n\nfunction toggleDivVisibility() {\n  showDiv.value = !showDiv.value;\n  var content = collapsible.value;\n  if (content.style.maxHeight) {\n    content.style.maxHeight = null;\n  } else {\n    content.style.maxHeight = content.scrollHeight + \"px\";\n  }\n  //add transition\n  if (!content.style.transition) {\n    content.style.transition = \"max-height 0.2s ease-out\";\n  }\n}\n\nconst { title, icon, small } = toRefs(props);\n</script>\n\n<template>\n  <div>\n    <div :class=\"stylesHeader\" @click=\"toggleDivVisibility\">\n      <h3 :class=\"`${small ? 'text' : 'text-lg'} flex items-center`\">\n        <EpIcon\n          v-if=\"icon\"\n          :icon-path=\"icon\"\n          size=\"28\"\n          extraClass=\"mr-2\"\n        ></EpIcon\n        >{{ title }}\n      </h3>\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        fill=\"none\"\n        viewBox=\"0 0 24 24\"\n        stroke-width=\"1.5\"\n        stroke=\"currentColor\"\n        :class=\"`mx-4 my-3 h-6 w-6 transition-all duration-200 ${\n          showDiv ? 'rotate-45' : ''\n        }`\"\n      >\n        <path\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          d=\"M12 6v12m6-6H6\"\n        />\n      </svg>\n    </div>\n    <div ref=\"collapsible\" :class=\"`${contentStyles} content`\">\n      <div class=\"py-3\">\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.content {\n  max-height: 0;\n  overflow: hidden;\n}\n</style>\n"],"names":["_createElementBlock","_createElementVNode","_unref","_createBlock","EpIcon","_normalizeClass","_renderSlot"],"mappings":";;;;;;;;;;;;;;;;AAOA,UAAM,QAAQ;AAOd,UAAM,UAAU,IAAI,MAAM,IAAI;AAC9B,UAAM,cAAc,IAAA;AAEpB,UAAM,aAAa,SAAS,MAAM;AAChC,UAAI,MAAM,UAAU;AAClB,eAAO;AAAA,MACT;AACA,aAAO;AAAA,IACT,CAAC;AAED,UAAM,eAAe,SAAS,MAAM;;AAClC,aAAO,0CACL,MAAM,QAAQ,SAAS,MACzB,oBAAmB,mBAAc,MAAM,IAAI,MAAxB,mBAA4B,WAAW,MAAM;AAAA,IAClE,CAAC;AAED,UAAM,gBAAgB,SAAS,MAAM;AACnC,aAAO,QAAQ;AAAA,QACb;AAAA,QACA,MAAM,OAAO;AAAA,MAAA,CACd,sBAAsB,UAAU,UAAU,MAAM,OAAO,MAAM,CAAC,IAC7D,QAAQ,QAAQ,KAAK,eACvB;AAAA,IACF,CAAC;AAED,cAAU,MAAM;AACd,UAAI,UAAU,YAAY;AAC1B,UAAI,MAAM,MAAM;AACd,gBAAQ,MAAM,YAAY,QAAQ,eAAe;AAAA,MACnD;AAAA,IACF,CAAC;AAED,aAAS,sBAAsB;AAC7B,cAAQ,QAAQ,CAAC,QAAQ;AACzB,UAAI,UAAU,YAAY;AAC1B,UAAI,QAAQ,MAAM,WAAW;AAC3B,gBAAQ,MAAM,YAAY;AAAA,MAC5B,OAAO;AACL,gBAAQ,MAAM,YAAY,QAAQ,eAAe;AAAA,MACnD;AAEA,UAAI,CAAC,QAAQ,MAAM,YAAY;AAC7B,gBAAQ,MAAM,aAAa;AAAA,MAC7B;AAAA,IACF;AAEA,UAAM,EAAE,OAAO,MAAM,MAAA,IAAU,OAAO,KAAK;;0BAIzCA,mBAiCM,OAAA,MAAA;AAAA,QAhCJC,mBA0BM,OAAA;AAAA,UA1BA,sBAAO,aAAA,KAAY;AAAA,UAAG,SAAO;AAAA,QAAA;UACjCA,mBAQK,MAAA;AAAA,YARA,yBAAUC,MAAA,KAAA,IAAK,SAAA,SAAA,oBAAA;AAAA,UAAA;YAEVA,MAAA,IAAA,kBADRC,YAMCC,aAAA;AAAA;cAJE,aAAWF,MAAA,IAAA;AAAA,cACZ,MAAK;AAAA,cACL,YAAW;AAAA,YAAA;4CAETA,MAAA,KAAA,CAAK,GAAA,CAAA;AAAA,UAAA;wBAEXF,mBAeM,OAAA;AAAA,YAdJ,OAAM;AAAA,YACN,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,gBAAa;AAAA,YACb,QAAO;AAAA,YACN,OAAKK,eAAA,iDAA8D,QAAA,QAAO,cAAA;;YAI3EJ,mBAIE,QAAA;AAAA,cAHA,kBAAe;AAAA,cACf,mBAAgB;AAAA,cAChB,GAAE;AAAA,YAAA;;;QAIRA,mBAIM,OAAA;AAAA,mBAJG;AAAA,UAAJ,KAAI;AAAA,UAAe,yBAAU,cAAA,KAAa,UAAA;AAAA,QAAA;UAC7CA,mBAEM,OAFN,YAEM;AAAA,YADJK,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA,UAAA;;;;;;"}