ep-lib-ts 0.1.20 → 0.1.21

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ep-lib-ts",
   "private": false,
-  "version": "0.1.20",
+  "version": "0.1.21",
   "files": [
     "dist",
     "src/components/"

package/src/components/basics/EpText.vue

@@ -1,121 +1,103 @@
 <script setup lang="ts">
-import { computed, defineComponent, defineAsyncComponent, toRefs,ref, h, createApp, defineCustomElement  } from 'vue';
-import { isHtml } from '../../composables/isHtml';
-import {useMarkdown} from '../../composables/useMarkdown'
-import EpAccordeon from '../interactions/EpAccordeon.vue';
-
-
+import { computed, toRefs, h } from "vue";
+import { isHtml } from "../../composables/isHtml";
+import { useMarkdown } from "../../composables/useMarkdown";
+import EpAccordeon from "../interactions/EpAccordeon.vue";
+import EpTerm from "../medias/EpTerm.vue";
 
 interface Props {
-   glossary?:any[];
-   content:string;
-   title?:string|null;
-   compact?:boolean;
+  glossary?: any[];
+  content: string;
+  title?: string | null;
+  compact?: boolean;
 }
 
-const props = withDefaults(defineProps<Props>(),{
-  compact:false,
-})
+const props = withDefaults(defineProps<Props>(), {
+  compact: false,
+});
 
-const renderTitle = computed(()=>{
-  if(!props.title){
-    return "En savoir plus"
+const renderTitle = computed(() => {
+  if (!props.title) {
+    return "En savoir plus";
   }
-  return props.title
-})
+  return props.title;
+});
 
-const renderText = computed(()=>{
-     if(!props.content){
-      return `<div></div>`
-     }
-     if(!isHtml(props.content)){
-        return useMarkdown(props.content)
-     }
-     //return props.content
-      //create a div
-      const div = document.createElement('DIV')
-      ///add the html input to the div
-      div.innerHTML = props.content.trim()
-      ///get strign of html 
-      let newStr = div.outerHTML
-      //find all span.ep_glossary_item to know the glossary terms in the text
-      const glossaryTerms = div.querySelectorAll('.ep_glossary_item')
-    //  console.log(glossaryTerms)
-      //if find glossary terms
-      if(glossaryTerms.length > 0){
-        ///check every term and replace it         
-        glossaryTerms.forEach((item)=>{
-          //get id 
-          const id = item.getAttribute("data-id")
-          //get content text
-          const render_word = item.innerHTML
-          //find in the glossary their equivalent
-          let _glossary = []
-          if(props.glossary){
-            _glossary = props.glossary
-          }
-          const term = _glossary.find(word => word.id === id)
-          //if was found 
-          if(term){
-            ///add the new values to the array
-            const word = item.outerHTML
-            //check if the term has relations
-            const foundedRelations = _glossary.filter((x) =>
-                x.relation.some((item:string) => {
-                  return item == id;
-                })
-              );
-            //get relations id and term
-            const idsRelation = foundedRelations.map((x) => x.id);
-            const termsRelation = foundedRelations.map((x) => x.term);
-            const variation = term.variation
-            const hasImge = term.src ? term.src : ''
-            //const replaceWord = `<EpBtn :pts-data="{term:'${term.term}', definition:'${term.definition}', renderword:'${render_word}', graminfo:'${term.graminfo}', domain:'${term.domain}',variation:'${variation}', relations_names:'${termsRelation}', relations_ids:'${idsRelation}'}"></EpBtn>`
-            const replaceWord = ` <EpTerm term="${term.term}" word="${render_word}" variations="${variation}" graminfo="${term.graminfo}" src='${hasImge}' domain="${term.domain}" relations="${termsRelation}" idrelation="${idsRelation}"> ${term.definition} </EpTerm> `
-            //replace output string
-            newStr = newStr.replace(word, replaceWord)
-          }
-        })
+const renderText = computed(() => {
+  if (!props.content) {
+    return `<div></div>`;
+  }
+  if (!isHtml(props.content)) {
+    return useMarkdown(props.content);
+  }
+  //return props.content
+  //create a div
+  const div = document.createElement("DIV");
+  ///add the html input to the div
+  div.innerHTML = props.content.trim();
+  ///get strign of html
+  let newStr = div.outerHTML;
+  //find all span.ep_glossary_item to know the glossary terms in the text
+  const glossaryTerms = div.querySelectorAll(".ep_glossary_item");
+  //  console.log(glossaryTerms)
+  //if find glossary terms
+  if (glossaryTerms.length > 0) {
+    ///check every term and replace it
+    glossaryTerms.forEach((item) => {
+      //get id
+      const id = item.getAttribute("data-id");
+      //get content text
+      const render_word = item.innerHTML;
+      //find in the glossary their equivalent
+      let _glossary = [];
+      if (props.glossary) {
+        _glossary = props.glossary;
       }
-      div.innerHTML = newStr
-     // console.log(div.innerHTML)
-      return div.innerHTML;
-})
-
-
-const EpTerm = defineAsyncComponent(()=>import('../medias/EpTerm.vue'))
-
-const customRenderStringComponents = defineComponent({
-    components:{
-      'epterm':EpTerm
+      const term = _glossary.find((word) => word.id === id);
+      //if was found
+      if (term) {
+        ///add the new values to the array
+        const word = item.outerHTML;
+        //check if the term has relations
+        const foundedRelations = _glossary.filter((x) =>
+          x.relation.some((item: string) => {
+            return item == id;
+          })
+        );
+        //get relations id and term
+        const idsRelation = foundedRelations.map((x) => x.id);
+        const termsRelation = foundedRelations.map((x) => x.term);
+        const variation = term.variation;
+        const hasImge = term.src ? term.src : "";
+        //const replaceWord = `<EpBtn :pts-data="{term:'${term.term}', definition:'${term.definition}', renderword:'${render_word}', graminfo:'${term.graminfo}', domain:'${term.domain}',variation:'${variation}', relations_names:'${termsRelation}', relations_ids:'${idsRelation}'}"></EpBtn>`
+        const replaceWord = ` <EpTerm term="${term.term}" word="${render_word}" variations="${variation}" graminfo="${term.graminfo}" src='${hasImge}' domain="${term.domain}" relations="${termsRelation}" idrelation="${idsRelation}"> ${term.definition} </EpTerm> `;
+        //replace output string
+        newStr = newStr.replace(word, replaceWord);
+      }
+    });
+  }
+  div.innerHTML = newStr;
+  // console.log(div.innerHTML)
+  return div.innerHTML;
+});
+
+const render = () => {
+  const r = {
+    components: {
+      epterm: EpTerm,
     },
-     template:`<div>${renderText.value}</div>`
-})
-// const customRenderStringComponents = defineComponent({
-//     components:{
-//       'epterm':EpTerm
-//     },
-//      template:`<div>${renderText.value}</div>`
-// })
-
-// const TextApp = createApp({
-//   setup(){
-//     return () => h(TextBlock, `<template>${renderText.value}</template>`)
-//   }
-// })
-
+    template: `<div>${renderText.value}</div>`,
+  };
 
+  return h(r);
+};
 
-
-const {compact} = toRefs(props)
-
+const { compact } = toRefs(props);
 </script>
 
 <template>
-
-  <component v-if="!compact" :is="customRenderStringComponents"></component>
+  <render v-if="!compact"></render>
   <EpAccordeon outlined :title="renderTitle" v-else>
-    <component :is="customRenderStringComponents"></component>
-  </EpAccordeon> 
-   <!-- <component v-else :is="renderText"></component> -->
-</template>
+    <render></render>
+  </EpAccordeon>
+</template>

package/dist/BgAudio-d9308f99.js

@@ -1,5 +0,0 @@
-import { L as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/DisplayBox-f17b28bc.js

@@ -1,5 +0,0 @@
-import { M as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpAlert-c5ccf377.js

@@ -1,5 +0,0 @@
-import { I as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpAudio-ee4175aa.js

@@ -1,5 +0,0 @@
-import { z as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpBadge-6fc0f5fc.js

@@ -1,5 +0,0 @@
-import { c as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpBarChart-d1bdc878.js

@@ -1,5 +0,0 @@
-import { o as a } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  a as default
-};

package/dist/EpBtn-010839a7.js

@@ -1,5 +0,0 @@
-import { d as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpCard-d67b77b2.js

@@ -1,5 +0,0 @@
-import { e as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpContentSlider-b1f27a7d.js

@@ -1,5 +0,0 @@
-import { w as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpDivider-ea7f1d1a.js

@@ -1,5 +0,0 @@
-import { g as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpEdu-74aed121.js

@@ -1,5 +0,0 @@
-import { r as a } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  a as default
-};

package/dist/EpFlex-232d7513.js

@@ -1,5 +0,0 @@
-import { h as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpHeader-1f6cca20.js

@@ -1,5 +0,0 @@
-import { J as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpIframe-a4082deb.js

@@ -1,5 +0,0 @@
-import { A as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpImg-7f4c35bd.js

@@ -1,5 +0,0 @@
-import { j as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpLineChart-822ceecf.js

@@ -1,5 +0,0 @@
-import { p as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpLink-c2a1a872.js

@@ -1,5 +0,0 @@
-import { B as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpLinkVersion-2bac33d5.js

@@ -1,5 +0,0 @@
-import { C as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpModal-1b4d1ff9.js

@@ -1,5 +0,0 @@
-import { x as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpPieChart-ad8576ca.js

@@ -1,5 +0,0 @@
-import { q as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpQuestion-94aa29de.js

@@ -1,5 +0,0 @@
-import { y as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpQuote-adfe2a2b.js

@@ -1,5 +0,0 @@
-import { K as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpRadio-53f60b1a.js

@@ -1,5 +0,0 @@
-import { v as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpReading-747f0ce9.js

@@ -1,5 +0,0 @@
-import { b as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpResource-c6662e5a.js

@@ -1,5 +0,0 @@
-import { s as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpScope-494ffdec.js

@@ -1,5 +0,0 @@
-import { t as a } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  a as default
-};

package/dist/EpSection-bdad41e4.js

@@ -1,5 +0,0 @@
-import { k as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpSoftware-2730a943.js

@@ -1,5 +0,0 @@
-import { D as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpSpinner-da2475b0.js

@@ -1,5 +0,0 @@
-import { l as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpSvg-a2ebcc93.js

@@ -1,5 +0,0 @@
-import { E as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpTable-0555285d.js

@@ -1,5 +0,0 @@
-import { m as a } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  a as default
-};

package/dist/EpTerm-87ed74e7.js

@@ -1,5 +0,0 @@
-import { _ as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpText-7c29711c.js

@@ -1,5 +0,0 @@
-import { n as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpTimeLine-c85d470a.js

@@ -1,5 +0,0 @@
-import { F as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpVideo-fe865980.js

@@ -1,5 +0,0 @@
-import { G as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/EpVideoPanopto-f31cdb1e.js

@@ -1,5 +0,0 @@
-import { H as m } from "./index-5bd6e63c.js";
-import "vue";
-export {
-  m as default
-};

package/dist/TextBloc-d81840e6.js

@@ -1,13 +0,0 @@
-import { defineComponent as t, openBlock as o, createElementBlock as n, createTextVNode as r, renderSlot as l } from "vue";
-const s = /* @__PURE__ */ t({
-  __name: "TextBloc",
-  setup(c) {
-    return (e, a) => (o(), n("div", null, [
-      r(" block "),
-      l(e.$slots, "default")
-    ]));
-  }
-});
-export {
-  s as default
-};

package/dist/components/tools/TextBloc.vue.d.ts

@@ -1,9 +0,0 @@
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>, {
-    default?(_: {}): any;
-}>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/src/components/tools/TextBloc.vue

@@ -1,10 +0,0 @@
-<script setup lang="ts">
-import EpTerm from "../medias/EpTerm.vue";
-</script>
-
-<template>
-  <div>
-    block
-    <slot> </slot>
-  </div>
-</template>