ep-lib-ts 1.1.22 → 1.1.23

package/dist/components/medias/EpHierarchy.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"EpHierarchy.vue2.js","sources":["../../../src/components/medias/EpHierarchy.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, onMounted, computed, defineAsyncComponent } from \"vue\";\nimport {\n  hierarchy,\n  tree,\n  cluster,\n  type HierarchyPointLink,\n  type HierarchyPointNode,\n} from \"d3-hierarchy\";\nimport * as d3 from \"d3-selection\";\nimport { linkVertical, linkHorizontal } from \"d3-shape\";\nimport * as d3Zoom from \"d3-zoom\";\nimport type { TreeNode } from \"~/types/Hierarchy\";\nimport type { NestedComponents } from \"~/types/Component\";\nimport { useComponent } from \"~/composables/useComponent\";\nimport EpModal from \"~/components/interactions/EpModal.vue\";\nimport EpBtn from \"~/components/basics/EpBtn.vue\";\nimport { useRenderText } from \"~/composables/useRenderText\";\nimport type { EpHierarchyProps } from \"~/types/medias/EpHierarchy\";\n\nconst props = withDefaults(defineProps<EpHierarchyProps>(), {\n  labelClose: \"fermer\",\n  maxWidth: 800,\n  maxHeight: 600,\n  isCluster: false,\n  colorRect: \"fill-red-400\",\n  colorPath: \"stroke-yellow-400\",\n});\n\nconst treeContainer = ref<HTMLDivElement | null>(null);\nconst treeWrapper = ref<HTMLDivElement | null>(null);\n\n/* control modal */\ntype ShowNode = {\n  title: string;\n  text?: string;\n  component?: NestedComponents;\n};\n\nconst currentNode = ref<ShowNode | null>(null);\nconst showModal = ref(false);\n\nconst handleNodeClick = (node: TreeNode) => {\n  currentNode.value = {\n    title: node.name,\n    text: node.text,\n    component: node.component,\n  };\n  showModal.value = true;\n};\n\nconst closeModal = () => {\n  showModal.value = false;\n  currentNode.value = null;\n};\n//nested component\n\nconst components = import.meta.glob([\n  \"./*.vue\", // all components in medias (same folder)\n  \"../basics/*.vue\", // components/charts/\n  \"../signages/*.vue\", // components/signages/\n]);\n\nconst currentRenderComponent = computed(() => {\n  if (!currentNode.value || !currentNode.value.component) {\n    return null;\n  }\n\n  const { path, name } = useComponent(currentNode.value.component.type);\n  //console.log(path, name)\n  let fullPath = \"\";\n  if (path === \"medias\") {\n    fullPath = `./${name}.vue`;\n  } else {\n    fullPath = `../${path}/${name}.vue`;\n  }\n  //console.log(fullPath)\n  const loader = components[fullPath] as\n    | (() => Promise<{ default: NestedComponents }>)\n    | undefined;\n\n  if (!loader) {\n    console.warn(`Component not found: ${fullPath}`);\n    return null; // or defineAsyncComponent(() => import('../fallbacks/EpNothing.vue'))\n  }\n\n  return defineAsyncComponent(loader);\n});\n\nonMounted(() => {\n  if (!treeContainer.value) return;\n\n  if (props.isCluster) {\n    clusterView();\n  } else {\n    treeView();\n  }\n});\n\nconst treeView = () => {\n  const rectW = 130;\n  const rectH = 40;\n  const margin = { top: 40, right: 40, bottom: 40, left: 40 };\n\n  const root = hierarchy<TreeNode>(props.nodes);\n  //const totalLeafCount = root.leaves().length\n  const width = Math.max(props.maxWidth);\n  const height = props.maxHeight;\n\n  const treeLayout = tree<TreeNode>().nodeSize([200, 100]); // [x spacing, y spacing]\n\n  const treeData = treeLayout(root);\n\n  const svg = d3\n    .select(treeContainer.value)\n    .append(\"svg\")\n    .attr(\"width\", width)\n    .attr(\"height\", height);\n\n  const g = svg\n    .append(\"g\")\n    .attr(\"transform\", `translate(${margin.left}, ${margin.top})`);\n\n  const zoom = d3Zoom\n    .zoom<SVGSVGElement, unknown>()\n    .scaleExtent([0.1, 2])\n    .on(\"zoom\", (event) => {\n      g.attr(\"transform\", event.transform);\n    });\n\n  svg.call(zoom);\n\n  const centerX = width / 2 - treeData.x;\n  const centerY = 30; //height / 2 - treeData.y\n  const identity = (d3Zoom as any).zoomIdentity;\n  svg.call(zoom.transform, identity.translate(centerX, centerY));\n\n  // Links\n  const linkPath = linkVertical<\n    HierarchyPointLink<TreeNode>,\n    HierarchyPointNode<TreeNode>\n  >()\n    .x((d) => d.x)\n    .y((d) => d.y);\n\n  g.selectAll(\"path.link\")\n    .data(treeData.links())\n    .enter()\n    .append(\"path\")\n    .attr(\"d\", (d) => linkPath(d))\n    .attr(\"class\", (d) => {\n      const link = d.target.data.active\n        ? `${props.colorPath} stroke-2`\n        : \"stroke-black dark:stroke-white\";\n      return `${link} link fill-none`;\n    });\n\n  // Nodes\n  const node = g\n    .selectAll(\"g.node\")\n    .data(treeData.descendants())\n    .enter()\n    .append(\"g\")\n    .attr(\"class\", \"node\")\n    .attr(\"transform\", (d) => `translate(${d.x}, ${d.y})`)\n    .style(\"cursor\", (d) =>\n      d.data.component || d.data.text ? \"pointer\" : \"default\"\n    )\n    .each(function (d) {\n      if (d.data.component || d.data.text) {\n        d3.select(this).on(\"click\", (_event) => handleNodeClick(d.data));\n      }\n    });\n  //.style('cursor', 'pointer')\n  //.on('click', (_event, d) => handleNodeClick(d.data))\n\n  node.each(function (d) {\n    const group = d3.select(this);\n\n    // Append text temporarily\n    const text = group\n      .append(\"text\")\n      .attr(\"class\", \"text-sm font-semibold fill-black dark:fill-white\")\n      .attr(\"text-anchor\", \"middle\")\n      .attr(\"x\", 0)\n      .attr(\"y\", 0)\n      .attr(\"dy\", \".35em\")\n      .text((d.data.label) ? d.data.label : d.data.name);\n\n    // Get bounding box to determine text size\n    const bbox = (text.node() as SVGTextElement).getBBox();\n    const paddingX = 10;\n    const paddingY = 10;\n\n    const width = bbox.width + paddingX * 2;\n    const height = bbox.height + paddingY * 2;\n\n    // Draw rect using text size\n    group\n      .insert(\"rect\", \"text\")\n      .attr(\"class\", props.colorRect)\n      .attr(\"x\", -width / 2)\n      .attr(\"y\", -height / 2)\n      .attr(\"width\", width)\n      .attr(\"height\", height)\n      .attr(\"rx\", 4)\n      .attr(\"ry\", 4);\n  });\n\n  node\n    .append(\"text\")\n    .attr(\"x\", 0)\n    .attr(\"y\", 0)\n    .attr(\"dy\", \".35em\")\n    .attr(\"class\", \"text-sm font-semibold fill-white dark:fill-black\")\n    .attr(\"text-anchor\", \"middle\")\n    .text((d) => {return (d.data.label) ? d.data.label : d.data.name})\n    .style(\"pointer-events\", \"none\");\n};\n\nconst clusterView = () => {\n  const rectW = 130;\n  const rectH = 40;\n  const margin = { top: 40, right: 40, bottom: 40, left: 40 };\n\n  const root = hierarchy<TreeNode>(props.nodes);\n  //const totalLeafCount = root.leaves().length\n  const width = Math.max(props.maxWidth);\n  const height = props.maxHeight;\n\n  const treeLayout = cluster<TreeNode>().nodeSize([130, 200]); // [x spacing, y spacing]\n\n  const treeData = treeLayout(root);\n\n  const svg = d3\n    .select(treeContainer.value)\n    .append(\"svg\")\n    .attr(\"width\", width)\n    .attr(\"height\", height);\n\n  const g = svg\n    .append(\"g\")\n    .attr(\"transform\", `translate(${margin.left}, ${margin.top})`);\n\n  const zoom = d3Zoom\n    .zoom<SVGSVGElement, unknown>()\n    .scaleExtent([0.1, 4])\n    .on(\"zoom\", (event) => {\n      g.attr(\"transform\", event.transform);\n    });\n\n  svg.call(zoom);\n\n  const centerX = 30;\n  const centerY = height / 2 - treeData.x;\n  const identity = (d3Zoom as any).zoomIdentity;\n  svg.call(zoom.transform, identity.translate(centerX, centerY));\n\n  // Links\n  const linkPath = linkHorizontal<\n    HierarchyPointLink<TreeNode>,\n    HierarchyPointNode<TreeNode>\n  >()\n    .x((d) => d.y)\n    .y((d) => d.x);\n\n  g.selectAll(\"path.link\")\n    .data(treeData.links())\n    .enter()\n    .append(\"path\")\n    .attr(\"d\", (d) => linkPath(d))\n    .attr(\"class\", (d) => {\n      const link = d.target.data.active\n        ? `${props.colorPath} stroke-2`\n        : \"stroke-black dark:stroke-white\";\n      return `${link} link fill-none`;\n    });\n\n  // Nodes\n  const node = g\n    .selectAll(\"g.node\")\n    .data(treeData.descendants())\n    .enter()\n    .append(\"g\")\n    .attr(\"class\", \"node\")\n    .attr(\"transform\", (d) => `translate(${d.y}, ${d.x})`)\n    .style(\"cursor\", (d) =>\n      d.data.component || d.data.text ? \"pointer\" : \"default\"\n    )\n    .each(function (d) {\n      if (d.data.component || d.data.text) {\n        d3.select(this).on(\"click\", (_event) => handleNodeClick(d.data));\n      }\n    });\n  //.style('cursor', 'pointer')\n  //.on('click', (_event, d) => handleNodeClick(d.data))\n\n  node.each(function (d) {\n    const group = d3.select(this);\n\n    // Append text temporarily\n    const text = group\n      .append(\"text\")\n      .attr(\"class\", \"text-sm font-semibold fill-black dark:fill-white\")\n      .attr(\"text-anchor\", \"middle\")\n      .attr(\"x\", 0)\n      .attr(\"y\", 0)\n      .attr(\"dy\", \".35em\")\n      .text((d.data.label) ? d.data.label : d.data.name);\n\n    // Get bounding box to determine text size\n    const bbox = (text.node() as SVGTextElement).getBBox();\n    const paddingX = 10;\n    const paddingY = 10;\n\n    const width = bbox.width + paddingX * 2;\n    const height = bbox.height + paddingY * 2;\n\n    // Draw rect using text size\n    group\n      .insert(\"rect\", \"text\")\n      .attr(\"class\", props.colorRect)\n      .attr(\"x\", -width / 2)\n      .attr(\"y\", -height / 2)\n      .attr(\"width\", width)\n      .attr(\"height\", height)\n      .attr(\"rx\", 4)\n      .attr(\"ry\", 4);\n  });\n\n  node\n    .append(\"text\")\n    .attr(\"x\", 0)\n    .attr(\"y\", 0)\n    .attr(\"dy\", \".35em\")\n    .attr(\"class\", \"text-sm font-semibold fill-white dark:fill-black\")\n    .attr(\"text-anchor\", \"middle\")\n    .text((d) => {return (d.data.label) ? d.data.label : d.data.name})\n    .style(\"pointer-events\", \"none\");\n};\n\nconst maxW = computed(() => {\n  return `${props.maxWidth.toString()}px`;\n});\n\nconst maxH = computed(() => {\n  return `${props.maxWidth.toString()}px`;\n});\n</script>\n\n<template>\n  <div>\n    <div\n      ref=\"treeWrapper\"\n      class=\"ep-tree-wrapper mx-auto\"\n      :style=\"{ maxHeight: maxH, maxWidth: maxW }\"\n    >\n      <div ref=\"treeContainer\" class=\"ep-tree-container\" />\n    </div>\n    <EpModal v-model=\"showModal\" :title=\"currentNode.title\" v-if=\"currentNode\">\n      <div v-if=\"currentNode.text\" v-html=\"useRenderText(currentNode.text)\" />\n      <template v-if=\"currentRenderComponent && currentNode.component\">\n        <component\n          :is=\"currentRenderComponent\"\n          v-bind=\"{ ...currentNode.component.data }\"\n        />\n      </template>\n      <div class=\"flex justify-end\">\n        <EpBtn @click=\"closeModal\" type=\"error\" outlined rounded>{{\n          labelClose\n        }}</EpBtn>\n      </div>\n    </EpModal>\n  </div>\n</template>\n\n<style scoped>\n.ep-tree-wrapper {\n  overflow: auto;\n  border: 1px solid #ddd;\n}\n\n.ep-tree-container {\n  width: 100%;\n  overflow-x: auto;\n}\n</style>\n"],"names":["width","height","_createElementBlock","_createElementVNode","_normalizeStyle","_createBlock","EpModal","_unref","_openBlock","_resolveDynamicComponent","_normalizeProps","_mergeProps","_createVNode","EpBtn","labelClose"],"mappings":"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"}
+{"version":3,"file":"EpHierarchy.vue2.js","sources":["../../../src/components/medias/EpHierarchy.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, onMounted, computed, defineAsyncComponent } from \"vue\";\nimport {\n  hierarchy,\n  tree,\n  cluster,\n  type HierarchyPointLink,\n  type HierarchyPointNode,\n} from \"d3-hierarchy\";\nimport * as d3 from \"d3-selection\";\nimport { linkVertical, linkHorizontal } from \"d3-shape\";\nimport * as d3Zoom from \"d3-zoom\";\nimport type { TreeNode } from \"~/types/Hierarchy\";\nimport type { NestedComponents } from \"~/types/Component\";\nimport { useComponent } from \"~/composables/useComponent\";\nimport EpModal from \"~/components/interactions/EpModal.vue\";\nimport EpBtn from \"~/components/basics/EpBtn.vue\";\nimport { useRenderText } from \"~/composables/useRenderText\";\nimport type { EpHierarchyProps } from \"~/types/medias/EpHierarchy\";\n\nconst props = withDefaults(defineProps<EpHierarchyProps>(), {\n  labelClose: \"fermer\",\n  maxWidth: 800,\n  maxHeight: 600,\n  isCluster: false,\n  colorRect: \"fill-red-400\",\n  colorPath: \"stroke-yellow-400\",\n});\n\nconst treeContainer = ref<HTMLDivElement | null>(null);\nconst treeWrapper = ref<HTMLDivElement | null>(null);\n\n/* control modal */\ntype ShowNode = {\n  title: string;\n  text?: string;\n  component?: NestedComponents;\n};\n\nconst currentNode = ref<ShowNode | null>(null);\nconst showModal = ref(false);\n\nconst handleNodeClick = (node: TreeNode) => {\n  currentNode.value = {\n    title: node.name,\n    text: node.text,\n    component: node.component,\n  };\n  showModal.value = true;\n};\n\nconst closeModal = () => {\n  showModal.value = false;\n  currentNode.value = null;\n};\n//nested component\n\nconst components = import.meta.glob([\n  \"./*.vue\", // all components in medias (same folder)\n  \"../basics/*.vue\", // components/charts/\n  \"../signages/*.vue\", // components/signages/\n]);\n\nconst currentRenderComponent = computed(() => {\n  if (!currentNode.value || !currentNode.value.component) {\n    return null;\n  }\n\n  const { path, name } = useComponent(currentNode.value.component.type);\n  //console.log(path, name)\n  let fullPath = \"\";\n  if (path === \"medias\") {\n    fullPath = `./${name}.vue`;\n  } else {\n    fullPath = `../${path}/${name}.vue`;\n  }\n  //console.log(fullPath)\n  const loader = components[fullPath] as\n    | (() => Promise<{ default: NestedComponents }>)\n    | undefined;\n\n  if (!loader) {\n    console.warn(`Component not found: ${fullPath}`);\n    return null; // or defineAsyncComponent(() => import('../fallbacks/EpNothing.vue'))\n  }\n\n  return defineAsyncComponent(loader);\n});\n\nonMounted(() => {\n  if (!treeContainer.value) return;\n\n  if (props.isCluster) {\n    clusterView();\n  } else {\n    treeView();\n  }\n});\n\nconst treeView = () => {\n  const rectW = 130;\n  const rectH = 40;\n  const margin = { top: 40, right: 40, bottom: 40, left: 40 };\n\n  const root = hierarchy<TreeNode>(props.nodes);\n  //const totalLeafCount = root.leaves().length\n  const width = Math.max(props.maxWidth);\n  const height = props.maxHeight;\n\n  const treeLayout = tree<TreeNode>().nodeSize([200, 100]); // [x spacing, y spacing]\n\n  const treeData = treeLayout(root);\n\n  const svg = d3\n    .select(treeContainer.value)\n    .append(\"svg\")\n    .attr(\"width\", width)\n    .attr(\"height\", height);\n\n  const g = svg\n    .append(\"g\")\n    .attr(\"transform\", `translate(${margin.left}, ${margin.top})`);\n\n  const zoom = d3Zoom\n    .zoom<SVGSVGElement, unknown>()\n    .scaleExtent([0.1, 2])\n    .on(\"zoom\", (event) => {\n      g.attr(\"transform\", event.transform);\n    });\n\n  svg.call(zoom);\n\n  const centerX = width / 2 - treeData.x;\n  const centerY = 30; //height / 2 - treeData.y\n  const identity = (d3Zoom as any).zoomIdentity;\n  svg.call(zoom.transform, identity.translate(centerX, centerY));\n\n  // Links\n  const linkPath = linkVertical<\n    HierarchyPointLink<TreeNode>,\n    HierarchyPointNode<TreeNode>\n  >()\n    .x((d) => d.x)\n    .y((d) => d.y);\n\n  g.selectAll(\"path.link\")\n    .data(treeData.links())\n    .enter()\n    .append(\"path\")\n    .attr(\"d\", (d) => linkPath(d))\n    .attr(\"class\", (d) => {\n      const link = d.target.data.active\n        ? `${props.colorPath} stroke-2`\n        : \"stroke-black dark:stroke-white\";\n      return `${link} link fill-none`;\n    });\n\n  // Nodes\n  const node = g\n    .selectAll(\"g.node\")\n    .data(treeData.descendants())\n    .enter()\n    .append(\"g\")\n    .attr(\"class\", \"node\")\n    .attr(\"transform\", (d) => `translate(${d.x}, ${d.y})`)\n    .style(\"cursor\", (d) =>\n      d.data.component || d.data.text ? \"pointer\" : \"default\"\n    )\n    .each(function (d) {\n      if (d.data.component || d.data.text) {\n        d3.select(this).on(\"click\", (_event) => handleNodeClick(d.data));\n      }\n    });\n  //.style('cursor', 'pointer')\n  //.on('click', (_event, d) => handleNodeClick(d.data))\n\n  node.each(function (d) {\n    const group = d3.select(this);\n\n    // Append text temporarily\n    const text = group\n      .append(\"text\")\n      .attr(\"class\", \"text-sm font-semibold fill-black dark:fill-white\")\n      .attr(\"text-anchor\", \"middle\")\n      .attr(\"x\", 0)\n      .attr(\"y\", 0)\n      .attr(\"dy\", \".35em\")\n      .text((d.data.label) ? d.data.label : d.data.name);\n\n    // Get bounding box to determine text size\n    const bbox = (text.node() as SVGTextElement).getBBox();\n    const paddingX = 10;\n    const paddingY = 10;\n\n    const width = bbox.width + paddingX * 2;\n    const height = bbox.height + paddingY * 2;\n\n    // Draw rect using text size\n    group\n      .insert(\"rect\", \"text\")\n      .attr(\"class\", props.colorRect)\n      .attr(\"x\", -width / 2)\n      .attr(\"y\", -height / 2)\n      .attr(\"width\", width)\n      .attr(\"height\", height)\n      .attr(\"rx\", 4)\n      .attr(\"ry\", 4);\n  });\n\n  node\n    .append(\"text\")\n    .attr(\"x\", 0)\n    .attr(\"y\", 0)\n    .attr(\"dy\", \".35em\")\n    .attr(\"class\", \"text-sm font-semibold fill-white dark:fill-black\")\n    .attr(\"text-anchor\", \"middle\")\n    .text((d) => {return (d.data.label) ? d.data.label : d.data.name})\n    .style(\"pointer-events\", \"none\");\n};\n\nconst clusterView = () => {\n  const rectW = 130;\n  const rectH = 40;\n  const margin = { top: 40, right: 40, bottom: 40, left: 40 };\n\n  const root = hierarchy<TreeNode>(props.nodes);\n  //const totalLeafCount = root.leaves().length\n  const width = Math.max(props.maxWidth);\n  const height = props.maxHeight;\n\n  const treeLayout = cluster<TreeNode>().nodeSize([130, 200]); // [x spacing, y spacing]\n\n  const treeData = treeLayout(root);\n\n  const svg = d3\n    .select(treeContainer.value)\n    .append(\"svg\")\n    .attr(\"width\", width)\n    .attr(\"height\", height);\n\n  const g = svg\n    .append(\"g\")\n    .attr(\"transform\", `translate(${margin.left}, ${margin.top})`);\n\n  const zoom = d3Zoom\n    .zoom<SVGSVGElement, unknown>()\n    .scaleExtent([0.1, 4])\n    .on(\"zoom\", (event) => {\n      g.attr(\"transform\", event.transform);\n    });\n\n  svg.call(zoom);\n\n  const centerX = 30;\n  const centerY = height / 2 - treeData.x;\n  const identity = (d3Zoom as any).zoomIdentity;\n  svg.call(zoom.transform, identity.translate(centerX, centerY));\n\n  // Links\n  const linkPath = linkHorizontal<\n    HierarchyPointLink<TreeNode>,\n    HierarchyPointNode<TreeNode>\n  >()\n    .x((d) => d.y)\n    .y((d) => d.x);\n\n  g.selectAll(\"path.link\")\n    .data(treeData.links())\n    .enter()\n    .append(\"path\")\n    .attr(\"d\", (d) => linkPath(d))\n    .attr(\"class\", (d) => {\n      const link = d.target.data.active\n        ? `${props.colorPath} stroke-2`\n        : \"stroke-black dark:stroke-white\";\n      return `${link} link fill-none`;\n    });\n\n  // Nodes\n  const node = g\n    .selectAll(\"g.node\")\n    .data(treeData.descendants())\n    .enter()\n    .append(\"g\")\n    .attr(\"class\", \"node\")\n    .attr(\"transform\", (d) => `translate(${d.y}, ${d.x})`)\n    .style(\"cursor\", (d) =>\n      d.data.component || d.data.text ? \"pointer\" : \"default\"\n    )\n    .each(function (d) {\n      if (d.data.component || d.data.text) {\n        d3.select(this).on(\"click\", (_event) => handleNodeClick(d.data));\n      }\n    });\n  //.style('cursor', 'pointer')\n  //.on('click', (_event, d) => handleNodeClick(d.data))\n\n  node.each(function (d) {\n    const group = d3.select(this);\n\n    // Append text temporarily\n    const text = group\n      .append(\"text\")\n      .attr(\"class\", \"text-sm font-semibold fill-black dark:fill-white\")\n      .attr(\"text-anchor\", \"middle\")\n      .attr(\"x\", 0)\n      .attr(\"y\", 0)\n      .attr(\"dy\", \".35em\")\n      .text((d.data.label) ? d.data.label : d.data.name);\n\n    // Get bounding box to determine text size\n    const bbox = (text.node() as SVGTextElement).getBBox();\n    const paddingX = 10;\n    const paddingY = 10;\n\n    const width = bbox.width + paddingX * 2;\n    const height = bbox.height + paddingY * 2;\n\n    // Draw rect using text size\n    group\n      .insert(\"rect\", \"text\")\n      .attr(\"class\", props.colorRect)\n      .attr(\"x\", -width / 2)\n      .attr(\"y\", -height / 2)\n      .attr(\"width\", width)\n      .attr(\"height\", height)\n      .attr(\"rx\", 4)\n      .attr(\"ry\", 4);\n  });\n\n  node\n    .append(\"text\")\n    .attr(\"x\", 0)\n    .attr(\"y\", 0)\n    .attr(\"dy\", \".35em\")\n    .attr(\"class\", \"text-sm font-semibold fill-white dark:fill-black\")\n    .attr(\"text-anchor\", \"middle\")\n    .text((d) => {return (d.data.label) ? d.data.label : d.data.name})\n    .style(\"pointer-events\", \"none\");\n};\n\nconst maxW = computed(() => {\n  return `${props.maxWidth.toString()}px`;\n});\n\nconst maxH = computed(() => {\n  return `${props.maxWidth.toString()}px`;\n});\n</script>\n\n<template>\n  <div>\n    <div\n      ref=\"treeWrapper\"\n      class=\"ep-tree-wrapper mx-auto\"\n      :style=\"{ maxHeight: maxH, maxWidth: maxW }\"\n    >\n      <div ref=\"treeContainer\" class=\"ep-tree-container\" />\n    </div>\n    <EpModal v-model=\"showModal\" :title=\"currentNode.title\" v-if=\"currentNode\">\n      <div v-if=\"currentNode.text\" v-html=\"useRenderText(currentNode.text)\" />\n      <template v-if=\"currentRenderComponent && currentNode.component\">\n        <component\n          :is=\"currentRenderComponent\"\n          v-bind=\"{ ...currentNode.component.data }\"\n        />\n      </template>\n      <div class=\"flex justify-end\">\n        <EpBtn @click=\"closeModal\" type=\"error\" outlined rounded>{{\n          labelClose\n        }}</EpBtn>\n      </div>\n    </EpModal>\n  </div>\n</template>\n\n<style scoped>\n.ep-tree-wrapper {\n  overflow: auto;\n  border: 1px solid #ddd;\n}\n\n.ep-tree-container {\n  width: 100%;\n  overflow-x: auto;\n}\n</style>\n"],"names":["width","height","_createElementBlock","_createElementVNode","_normalizeStyle","_createBlock","EpModal","_unref","_openBlock","_resolveDynamicComponent","_normalizeProps","_mergeProps","_createVNode","EpBtn","labelClose"],"mappings":"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"}

package/dist/components/medias/EpPlaylist.vue.js

@@ -1,7 +1,7 @@
 import { defineComponent, ref, createElementBlock, openBlock, normalizeClass, createElementVNode, createCommentVNode, toDisplayString, unref, createVNode, Fragment, renderList, createTextVNode } from "vue";
 import { useRenderText } from "../../composables/useRenderText.js";
 import _sfc_main$1 from "./EpVideo.vue.js";
-const _hoisted_1 = { class: "w-2/3 h-full overflow-y-auto" };
+const _hoisted_1 = { class: "md:w-2/3 h-full overflow-y-auto" };
 const _hoisted_2 = {
   key: 0,
   class: "my-3"
@@ -13,7 +13,7 @@ const _hoisted_6 = {
   key: 2,
   class: "p-6 flex justify-center items-center"
 };
-const _hoisted_7 = { class: "w-1/3 h-full px-2 overflow-y-auto" };
+const _hoisted_7 = { class: "md:w-1/3 h-full px-2 overflow-y-auto" };
 const _hoisted_8 = { class: "flex justify-between items-center my-5" };
 const _hoisted_9 = { class: "flex flex-col justify-start" };
 const _hoisted_10 = ["onClick"];
@@ -32,7 +32,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       var _a;
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(`relative flex gap-3 ${_ctx.videos.length != 0 ? "h-[500px]" : ""}`)
+        class: normalizeClass(`relative flex flex-col md:flex-row gap-3 ${_ctx.videos.length != 0 ? "h-[500px]" : ""}`)
       }, [
         createElementVNode("div", _hoisted_1, [
           _ctx.videos.length != 0 ? (openBlock(), createElementBlock("div", _hoisted_2, [

package/dist/components/medias/EpPlaylist.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"EpPlaylist.vue.js","sources":["../../../src/components/medias/EpPlaylist.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { useRenderText } from '~/composables/useRenderText';\nimport type { EpPlaylistProps } from '~/types/medias/EpPlaylist';\nimport EpVideo from './EpVideo.vue';\n\nconst props = withDefaults(defineProps<EpPlaylistProps>(), {\n});\n\nconst playingVideo = ref<number>(0);\n\n</script>\n\n<template>\n  <div :class=\"`relative flex gap-3 ${(videos.length != 0) ? 'h-[500px]' : ''}`\">\n    <div class=\"w-2/3 h-full overflow-y-auto\">\n        <div class=\"my-3\" v-if=\"videos.length != 0\">\n            <h2 class=\"text-2xl font-bold\">{{ videos[playingVideo].title }}</h2>\n            <p v-if=\"videos[playingVideo].description\" v-html=\"useRenderText(videos[playingVideo].description ?? '')\"></p>\n        </div>\n        <div v-if=\"videos.length != 0\">\n            <EpVideo\n                :src=\"videos[playingVideo].src\"\n            />\n        </div>\n        <div v-else class=\"p-6 flex justify-center items-center\">Aucune vidéo</div>\n    </div>\n    <div class=\"w-1/3 h-full px-2 overflow-y-auto\">\n        <div class=\"flex justify-between items-center my-5\">\n            <span class=\"font-bold\">Liste de vidéos</span>\n            <span>{{ videos.length }} vidéos</span>\n        </div>\n        <div class=\"flex flex-col justify-start\">\n            <p\n                v-if=\"videos.length != 0\"\n                :class=\"`p-4 rounded-lg cursor-pointer \n                            ${(index === playingVideo)? 'bg-surface-2-dark text-white dark:bg-neutral-200 dark:text-surface-2-dark' : 'hover:bg-neutral-200 dark:hover:bg-surface-2-dark'}`\"\n                v-for=\"video, index in videos\" :key=\"index\"\n                @click=\"() => {playingVideo = index}\"\n            >\n                <span class=\"mr-2 font-bold\">{{index + 1}}</span> <span>{{ video.title }}</span>\n            </p>\n            <p v-else class=\"m-4 text-center\">Aucune vidéo</p>\n        </div>\n    </div>\n  </div>\n</template>\n"],"names":["_createElementBlock","_normalizeClass","videos","_createElementVNode","_openBlock","_toDisplayString","_unref","_createVNode","EpVideo","_Fragment","_renderList"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,UAAM,eAAe,IAAY,CAAC;;;0BAKhCA,mBA+BM,OAAA;AAAA,QA/BA,OAAKC,eAAA,uBAA0BC,KAAAA,OAAO,UAAM,IAAA,cAAA,EAAA,EAAA;AAAA,MAAA;QAChDC,mBAWM,OAXN,YAWM;AAAA,UAVsBD,KAAAA,OAAO,UAAM,KAArCE,aAAAJ,mBAGM,OAHN,YAGM;AAAA,YAFFG,mBAAoE,MAApE,YAAoEE,gBAAlCH,YAAO,aAAA,KAAY,EAAE,KAAK,GAAA,CAAA;AAAA,YACnDA,KAAAA,OAAO,aAAA,KAAY,EAAE,4BAA9BF,mBAA8G,KAAA;AAAA;cAAnE,WAAQM,MAAA,aAAA,GAAcJ,iBAAO,aAAA,KAAY,EAAE,gBAArBA,YAAgC,EAAA;AAAA,YAAA;;UAE1FA,KAAAA,OAAO,UAAM,kBAAxBF,mBAIM,OAAA,YAAA;AAAA,YAHFO,YAEEC,aAAA;AAAA,cADG,KAAKN,KAAAA,OAAO,aAAA,KAAY,EAAE;AAAA,YAAA;8BAGnCF,mBAA2E,OAA3E,YAAyD,cAAY;AAAA,QAAA;QAEzEG,mBAiBM,OAjBN,YAiBM;AAAA,UAhBFA,mBAGM,OAHN,YAGM;AAAA,YAFF,OAAA,CAAA,MAAA,OAAA,CAAA,IAAAA,mBAA8C,QAAA,EAAxC,OAAM,YAAA,GAAY,mBAAe,EAAA;AAAA,YACvCA,mBAAuC,QAAA,MAAAE,gBAA9BH,KAAAA,OAAO,MAAM,IAAG,WAAO,CAAA;AAAA,UAAA;UAEpCC,mBAWM,OAXN,YAWM;AAAA,YATQD,KAAAA,OAAO,UAAM,KADvBE,UAAA,IAAA,GAAAJ,mBAQIS,UAAA,EAAA,KAAA,KAAAC,WAJuBR,KAAAA,QAAM,CAAtB,OAAO,UAAK;kCAJvBF,mBAQI,KAAA;AAAA,gBANC,OAAKC,eAAA;AAAA,8BAAiE,UAAU,aAAA,QAAY,8EAAA,mDAAA,EAAA;AAAA,gBAE7D,KAAK;AAAA,gBACpC,SAAK,MAAA;AAAS,+BAAA,QAAe;AAAA,gBAAK;AAAA,cAAA;gBAEnCE,mBAAiD,QAAjD,aAAiDE,gBAAlB,QAAK,CAAA,GAAA,CAAA;AAAA;gBAAcF,mBAA8B,QAAA,MAAAE,gBAArB,MAAM,KAAK,GAAA,CAAA;AAAA,cAAA;sCAE1EL,mBAAkD,KAAlD,aAAkC,cAAY;AAAA,UAAA;;;;;;"}
+{"version":3,"file":"EpPlaylist.vue.js","sources":["../../../src/components/medias/EpPlaylist.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { useRenderText } from '~/composables/useRenderText';\nimport type { EpPlaylistProps } from '~/types/medias/EpPlaylist';\nimport EpVideo from './EpVideo.vue';\n\nconst props = withDefaults(defineProps<EpPlaylistProps>(), {\n});\n\nconst playingVideo = ref<number>(0);\n\n</script>\n\n<template>\n  <div :class=\"`relative flex flex-col md:flex-row gap-3 ${(videos.length != 0) ? 'h-[500px]' : ''}`\">\n    <div class=\"md:w-2/3 h-full overflow-y-auto\">\n        <div class=\"my-3\" v-if=\"videos.length != 0\">\n            <h2 class=\"text-2xl font-bold\">{{ videos[playingVideo].title }}</h2>\n            <p v-if=\"videos[playingVideo].description\" v-html=\"useRenderText(videos[playingVideo].description ?? '')\"></p>\n        </div>\n        <div v-if=\"videos.length != 0\">\n            <EpVideo\n                :src=\"videos[playingVideo].src\"\n            />\n        </div>\n        <div v-else class=\"p-6 flex justify-center items-center\">Aucune vidéo</div>\n    </div>\n    <div class=\"md:w-1/3 h-full px-2 overflow-y-auto\">\n        <div class=\"flex justify-between items-center my-5\">\n            <span class=\"font-bold\">Liste de vidéos</span>\n            <span>{{ videos.length }} vidéos</span>\n        </div>\n        <div class=\"flex flex-col justify-start\">\n            <p\n                v-if=\"videos.length != 0\"\n                :class=\"`p-4 rounded-lg cursor-pointer \n                            ${(index === playingVideo)? 'bg-surface-2-dark text-white dark:bg-neutral-200 dark:text-surface-2-dark' : 'hover:bg-neutral-200 dark:hover:bg-surface-2-dark'}`\"\n                v-for=\"video, index in videos\" :key=\"index\"\n                @click=\"() => {playingVideo = index}\"\n            >\n                <span class=\"mr-2 font-bold\">{{index + 1}}</span> <span>{{ video.title }}</span>\n            </p>\n            <p v-else class=\"m-4 text-center\">Aucune vidéo</p>\n        </div>\n    </div>\n  </div>\n</template>\n"],"names":["_createElementBlock","_normalizeClass","videos","_createElementVNode","_openBlock","_toDisplayString","_unref","_createVNode","EpVideo","_Fragment","_renderList"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,UAAM,eAAe,IAAY,CAAC;;;0BAKhCA,mBA+BM,OAAA;AAAA,QA/BA,OAAKC,eAAA,4CAA+CC,KAAAA,OAAO,UAAM,IAAA,cAAA,EAAA,EAAA;AAAA,MAAA;QACrEC,mBAWM,OAXN,YAWM;AAAA,UAVsBD,KAAAA,OAAO,UAAM,KAArCE,aAAAJ,mBAGM,OAHN,YAGM;AAAA,YAFFG,mBAAoE,MAApE,YAAoEE,gBAAlCH,YAAO,aAAA,KAAY,EAAE,KAAK,GAAA,CAAA;AAAA,YACnDA,KAAAA,OAAO,aAAA,KAAY,EAAE,4BAA9BF,mBAA8G,KAAA;AAAA;cAAnE,WAAQM,MAAA,aAAA,GAAcJ,iBAAO,aAAA,KAAY,EAAE,gBAArBA,YAAgC,EAAA;AAAA,YAAA;;UAE1FA,KAAAA,OAAO,UAAM,kBAAxBF,mBAIM,OAAA,YAAA;AAAA,YAHFO,YAEEC,aAAA;AAAA,cADG,KAAKN,KAAAA,OAAO,aAAA,KAAY,EAAE;AAAA,YAAA;8BAGnCF,mBAA2E,OAA3E,YAAyD,cAAY;AAAA,QAAA;QAEzEG,mBAiBM,OAjBN,YAiBM;AAAA,UAhBFA,mBAGM,OAHN,YAGM;AAAA,YAFF,OAAA,CAAA,MAAA,OAAA,CAAA,IAAAA,mBAA8C,QAAA,EAAxC,OAAM,YAAA,GAAY,mBAAe,EAAA;AAAA,YACvCA,mBAAuC,QAAA,MAAAE,gBAA9BH,KAAAA,OAAO,MAAM,IAAG,WAAO,CAAA;AAAA,UAAA;UAEpCC,mBAWM,OAXN,YAWM;AAAA,YATQD,KAAAA,OAAO,UAAM,KADvBE,UAAA,IAAA,GAAAJ,mBAQIS,UAAA,EAAA,KAAA,KAAAC,WAJuBR,KAAAA,QAAM,CAAtB,OAAO,UAAK;kCAJvBF,mBAQI,KAAA;AAAA,gBANC,OAAKC,eAAA;AAAA,8BAAiE,UAAU,aAAA,QAAY,8EAAA,mDAAA,EAAA;AAAA,gBAE7D,KAAK;AAAA,gBACpC,SAAK,MAAA;AAAS,+BAAA,QAAe;AAAA,gBAAK;AAAA,cAAA;gBAEnCE,mBAAiD,QAAjD,aAAiDE,gBAAlB,QAAK,CAAA,GAAA,CAAA;AAAA;gBAAcF,mBAA8B,QAAA,MAAAE,gBAArB,MAAM,KAAK,GAAA,CAAA;AAAA,cAAA;sCAE1EL,mBAAkD,KAAlD,aAAkC,cAAY;AAAA,UAAA;;;;;;"}

package/dist/components/signages/EpAlert.vue2.js

@@ -3,7 +3,7 @@ import _sfc_main$1 from "../basics/EpIcon.vue.js";
 import Comp from "../interactions/EpAccordeon.vue.js";
 import { typeAlert, typeDivider } from "../../types/Alert.js";
 import { useIcons } from "../../composables/useIcons.js";
-import _sfc_main$2 from "../tools/RenderTextNode.vue.js";
+import _sfc_main$2 from "../tools/RenderTextNode.vue2.js";
 const _hoisted_1 = {
   key: 0,
   class: "flex items-center justify-center w-1/12"

package/dist/components/signages/EpQuote.vue.js

@@ -3,7 +3,7 @@ import _sfc_main$1 from "../basics/EpCard.vue.js";
 import _sfc_main$4 from "../basics/EpDivider.vue.js";
 import _sfc_main$2 from "../basics/EpIcon.vue.js";
 import { mdiFormatQuoteOpen } from "@mdi/js";
-import _sfc_main$3 from "../tools/RenderTextNode.vue.js";
+import _sfc_main$3 from "../tools/RenderTextNode.vue2.js";
 const _hoisted_1 = {
   class: /* @__PURE__ */ normalizeClass(`md:flex md:flex-wrap rounded-md`)
 };

package/dist/components/tools/AssociationNode.vue.js

@@ -1,85 +1,4 @@
-import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, createElementVNode, createVNode, unref, toDisplayString, normalizeStyle } from "vue";
-import { Handle, Position } from "@vue-flow/core";
-import _sfc_main$1 from "../basics/EpIcon.vue.js";
-import { useRenderText } from "../../composables/useRenderText.js";
-const _hoisted_1 = ["innerHTML"];
-const plug = "M17,16H21V14H17V10H21V8H17V8C17,7 16,6 15,6H9.5L6,9.5H3V14.5H6L9.5,18H15C16,18 17,17 17,16Z";
-const socket = "M7,16C7,17 8,18 9,18H14.5L18,14.5H21V9.5H18L14.5,6H9C8,6 7,7 7,8Z M7 19 L7 5";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "AssociationNode",
-  props: {
-    id: {},
-    type: {},
-    selected: { type: Boolean },
-    connectable: { type: [Boolean, Number, String, Function] },
-    position: {},
-    dimensions: {},
-    label: {},
-    isValidTargetPos: {},
-    isValidSourcePos: {},
-    parent: {},
-    parentNodeId: {},
-    dragging: { type: Boolean },
-    resizing: { type: Boolean },
-    zIndex: {},
-    targetPosition: {},
-    sourcePosition: {},
-    dragHandle: {},
-    data: {},
-    events: {}
-  },
-  setup(__props) {
-    const props = __props;
-    const colorStyle = computed(() => {
-      if (!props.data.mode || props.data.mode == "neutral") {
-        return "border-2 border-black dark:border-white";
-      }
-      if (props.data.mode == "correct") {
-        return "border-2 border-green-600";
-      } else if (props.data.mode == "wrong") {
-        return "border-2 border-red-600";
-      }
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(`shadow-lg rounded w-96 relative bg-surface-2 dark:bg-surface-2-dark ${colorStyle.value}`)
-      }, [
-        createElementVNode("div", {
-          class: "px-4 py-2 break-words",
-          innerHTML: unref(useRenderText)(_ctx.data.label)
-        }, null, 8, _hoisted_1),
-        createElementVNode("span", {
-          class: normalizeClass(`rounded-full w-6 h-6 flex justify-center bg-white dark:bg-neutral-800 items-center absolute bottom-1/3 ${_ctx.data.left ? "-left-3" : "-right-3"} ${colorStyle.value}`)
-        }, toDisplayString(_ctx.data.left ? String.fromCharCode(65 + _ctx.data.index) : _ctx.data.index), 3),
-        createVNode(unref(Handle), {
-          type: _ctx.data.left ? "source" : "target",
-          position: _ctx.data.left ? unref(Position).Right : unref(Position).Left,
-          style: normalizeStyle({
-            width: "20px",
-            // handle invisible, pas d’espace
-            height: "20px",
-            top: "50%",
-            zIndex: "100",
-            transform: "translateY(-50%)",
-            left: _ctx.data.left ? "96%" : "-10px",
-            opacity: 0
-          })
-        }, null, 8, ["type", "position", "style"]),
-        createVNode(_sfc_main$1, {
-          "icon-path": _ctx.data.left ? plug : socket,
-          style: normalizeStyle({
-            position: "absolute",
-            width: "30px",
-            height: "30px",
-            top: "50%",
-            transform: "translateY(-50%)",
-            left: _ctx.data.left ? "97%" : "-20px"
-          })
-        }, null, 8, ["icon-path", "style"])
-      ], 2);
-    };
-  }
-});
+import _sfc_main from "./AssociationNode.vue2.js";
 export {
   _sfc_main as default
 };

package/dist/components/tools/AssociationNode.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssociationNode.vue.js","sources":["../../../src/components/tools/AssociationNode.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { Position, Handle } from '@vue-flow/core'\nimport type { NodeProps } from '@vue-flow/core'\nimport EpIcon from '../basics/EpIcon.vue'\nimport { useRenderText } from '~/composables/useRenderText';\n\n\nconst plug = 'M17,16H21V14H17V10H21V8H17V8C17,7 16,6 15,6H9.5L6,9.5H3V14.5H6L9.5,18H15C16,18 17,17 17,16Z';\nconst socket = 'M7,16C7,17 8,18 9,18H14.5L18,14.5H21V9.5H18L14.5,6H9C8,6 7,7 7,8Z M7 19 L7 5';\n\ninterface AssociationData {\n    mode?: 'neutral' | 'correct' | 'wrong';\n    left: boolean;\n    index: number;\n    label: string;\n}\n\nconst props = withDefaults(defineProps<NodeProps<AssociationData>>(), {});\n\nconst colorStyle = computed(() => {\n    if(!props.data.mode || props.data.mode == 'neutral') {\n        return 'border-2 border-black dark:border-white'\n    }\n    if(props.data.mode == 'correct') {\n        return 'border-2 border-green-600'\n    } else if(props.data.mode == 'wrong') {\n        return 'border-2 border-red-600'\n    }\n});\n\n</script>\n\n<template>\n    <div :class=\"`shadow-lg rounded w-96 relative bg-surface-2 dark:bg-surface-2-dark ${colorStyle}`\">\n        <div class=\"px-4 py-2 break-words\" v-html=\"useRenderText(data.label)\"></div>\n        <span :class=\"`rounded-full w-6 h-6 flex justify-center bg-white dark:bg-neutral-800 items-center absolute bottom-1/3 ${(data.left)? '-left-3' : '-right-3'} ${colorStyle}`\">{{ (data.left)? String.fromCharCode(65 + data.index) : data.index }}</span>\n\n        <Handle\n            :type=\"data.left ? 'source' : 'target'\"\n            :position=\"data.left ? Position.Right : Position.Left\"\n            :style=\"{\n                width: '20px',   // handle invisible, pas d’espace\n                height: '20px',\n                top: '50%',\n                zIndex: '100',\n                transform: 'translateY(-50%)',\n                left: data.left ? '96%' : '-10px',\n                opacity: 0\n            }\"\n        />\n        <EpIcon \n            :icon-path=\"data.left ? plug : socket\"\n            :style=\"{\n                position: 'absolute',\n                width: '30px',\n                height: '30px',\n                top: '50%',\n                transform: 'translateY(-50%)',\n                left: data.left ? '97%' : '-20px'\n            }\" \n        />\n    </div>\n</template>\n"],"names":["_createElementBlock","_createElementVNode","_unref","data","_normalizeClass","_createVNode","_normalizeStyle","EpIcon"],"mappings":";;;;;AAQA,MAAM,OAAO;AACb,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;AASf,UAAM,QAAQ;AAEd,UAAM,aAAa,SAAS,MAAM;AAC9B,UAAG,CAAC,MAAM,KAAK,QAAQ,MAAM,KAAK,QAAQ,WAAW;AACjD,eAAO;AAAA,MACX;AACA,UAAG,MAAM,KAAK,QAAQ,WAAW;AAC7B,eAAO;AAAA,MACX,WAAU,MAAM,KAAK,QAAQ,SAAS;AAClC,eAAO;AAAA,MACX;AAAA,IACJ,CAAC;;0BAKGA,mBA4BM,OAAA;AAAA,QA5BA,6FAA8E,WAAA,KAAU,EAAA;AAAA,MAAA;QAC1FC,mBAA4E,OAAA;AAAA,UAAvE,OAAM;AAAA,UAAwB,WAAQC,MAAA,aAAA,EAAcC,KAAAA,KAAK,KAAK;AAAA,QAAA;QACnEF,mBAAwP,QAAA;AAAA,UAAjP,OAAKG,eAAA,0GAA6GD,KAAAA,KAAK,iCAAiC,WAAA,KAAU,EAAA;AAAA,QAAA,GAAQA,gBAAAA,KAAAA,KAAK,OAAO,OAAO,aAAY,KAAMA,KAAAA,KAAK,KAAK,IAAIA,KAAAA,KAAK,KAAK,GAAA,CAAA;AAAA,QAE9OE,YAYEH,MAAA,MAAA,GAAA;AAAA,UAXG,MAAMC,KAAAA,KAAK,OAAI,WAAA;AAAA,UACf,UAAUA,KAAAA,KAAK,OAAOD,MAAA,QAAA,EAAS,QAAQA,MAAA,QAAA,EAAS;AAAA,UAChD,OAAKI,eAAA;AAAA;;;;;;YAAuOH,MAAAA,KAAAA,KAAK,OAAI,QAAA;AAAA;;;QAU1PE,YAUEE,aAAA;AAAA,UATG,aAAWJ,KAAAA,KAAK,OAAO,OAAO;AAAA,UAC9B,OAAKG,eAAA;AAAA;;;;;YAA0MH,MAAAA,KAAAA,KAAK,OAAI,QAAA;AAAA,UAAA;;;;;;"}
+{"version":3,"file":"AssociationNode.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/tools/AssociationNode.vue2.js

@@ -1,4 +1,85 @@
-import _sfc_main from "./AssociationNode.vue.js";
+import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, createElementVNode, createVNode, unref, toDisplayString, normalizeStyle } from "vue";
+import { Handle, Position } from "@vue-flow/core";
+import _sfc_main$1 from "../basics/EpIcon.vue.js";
+import { useRenderText } from "../../composables/useRenderText.js";
+const _hoisted_1 = ["innerHTML"];
+const plug = "M17,16H21V14H17V10H21V8H17V8C17,7 16,6 15,6H9.5L6,9.5H3V14.5H6L9.5,18H15C16,18 17,17 17,16Z";
+const socket = "M7,16C7,17 8,18 9,18H14.5L18,14.5H21V9.5H18L14.5,6H9C8,6 7,7 7,8Z M7 19 L7 5";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "AssociationNode",
+  props: {
+    id: {},
+    type: {},
+    selected: { type: Boolean },
+    connectable: { type: [Boolean, Number, String, Function] },
+    position: {},
+    dimensions: {},
+    label: {},
+    isValidTargetPos: {},
+    isValidSourcePos: {},
+    parent: {},
+    parentNodeId: {},
+    dragging: { type: Boolean },
+    resizing: { type: Boolean },
+    zIndex: {},
+    targetPosition: {},
+    sourcePosition: {},
+    dragHandle: {},
+    data: {},
+    events: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const colorStyle = computed(() => {
+      if (!props.data.mode || props.data.mode == "neutral") {
+        return "border-2 border-black dark:border-white";
+      }
+      if (props.data.mode == "correct") {
+        return "border-2 border-green-600";
+      } else if (props.data.mode == "wrong") {
+        return "border-2 border-red-600";
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(`shadow-lg rounded w-96 relative bg-surface-2 dark:bg-surface-2-dark ${colorStyle.value}`)
+      }, [
+        createElementVNode("div", {
+          class: "px-4 py-2 break-words",
+          innerHTML: unref(useRenderText)(_ctx.data.label)
+        }, null, 8, _hoisted_1),
+        createElementVNode("span", {
+          class: normalizeClass(`rounded-full w-6 h-6 flex justify-center bg-white dark:bg-neutral-800 items-center absolute bottom-1/3 ${_ctx.data.left ? "-left-3" : "-right-3"} ${colorStyle.value}`)
+        }, toDisplayString(_ctx.data.left ? String.fromCharCode(65 + _ctx.data.index) : _ctx.data.index), 3),
+        createVNode(unref(Handle), {
+          type: _ctx.data.left ? "source" : "target",
+          position: _ctx.data.left ? unref(Position).Right : unref(Position).Left,
+          style: normalizeStyle({
+            width: "20px",
+            // handle invisible, pas d’espace
+            height: "20px",
+            top: "50%",
+            zIndex: "100",
+            transform: "translateY(-50%)",
+            left: _ctx.data.left ? "96%" : "-10px",
+            opacity: 0
+          })
+        }, null, 8, ["type", "position", "style"]),
+        createVNode(_sfc_main$1, {
+          "icon-path": _ctx.data.left ? plug : socket,
+          style: normalizeStyle({
+            position: "absolute",
+            width: "30px",
+            height: "30px",
+            top: "50%",
+            transform: "translateY(-50%)",
+            left: _ctx.data.left ? "97%" : "-20px"
+          })
+        }, null, 8, ["icon-path", "style"])
+      ], 2);
+    };
+  }
+});
 export {
   _sfc_main as default
 };

package/dist/components/tools/AssociationNode.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssociationNode.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"AssociationNode.vue2.js","sources":["../../../src/components/tools/AssociationNode.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { Position, Handle } from '@vue-flow/core'\nimport type { NodeProps } from '@vue-flow/core'\nimport EpIcon from '../basics/EpIcon.vue'\nimport { useRenderText } from '~/composables/useRenderText';\n\n\nconst plug = 'M17,16H21V14H17V10H21V8H17V8C17,7 16,6 15,6H9.5L6,9.5H3V14.5H6L9.5,18H15C16,18 17,17 17,16Z';\nconst socket = 'M7,16C7,17 8,18 9,18H14.5L18,14.5H21V9.5H18L14.5,6H9C8,6 7,7 7,8Z M7 19 L7 5';\n\ninterface AssociationData {\n    mode?: 'neutral' | 'correct' | 'wrong';\n    left: boolean;\n    index: number;\n    label: string;\n}\n\nconst props = withDefaults(defineProps<NodeProps<AssociationData>>(), {});\n\nconst colorStyle = computed(() => {\n    if(!props.data.mode || props.data.mode == 'neutral') {\n        return 'border-2 border-black dark:border-white'\n    }\n    if(props.data.mode == 'correct') {\n        return 'border-2 border-green-600'\n    } else if(props.data.mode == 'wrong') {\n        return 'border-2 border-red-600'\n    }\n});\n\n</script>\n\n<template>\n    <div :class=\"`shadow-lg rounded w-96 relative bg-surface-2 dark:bg-surface-2-dark ${colorStyle}`\">\n        <div class=\"px-4 py-2 break-words\" v-html=\"useRenderText(data.label)\"></div>\n        <span :class=\"`rounded-full w-6 h-6 flex justify-center bg-white dark:bg-neutral-800 items-center absolute bottom-1/3 ${(data.left)? '-left-3' : '-right-3'} ${colorStyle}`\">{{ (data.left)? String.fromCharCode(65 + data.index) : data.index }}</span>\n\n        <Handle\n            :type=\"data.left ? 'source' : 'target'\"\n            :position=\"data.left ? Position.Right : Position.Left\"\n            :style=\"{\n                width: '20px',   // handle invisible, pas d’espace\n                height: '20px',\n                top: '50%',\n                zIndex: '100',\n                transform: 'translateY(-50%)',\n                left: data.left ? '96%' : '-10px',\n                opacity: 0\n            }\"\n        />\n        <EpIcon \n            :icon-path=\"data.left ? plug : socket\"\n            :style=\"{\n                position: 'absolute',\n                width: '30px',\n                height: '30px',\n                top: '50%',\n                transform: 'translateY(-50%)',\n                left: data.left ? '97%' : '-20px'\n            }\" \n        />\n    </div>\n</template>\n"],"names":["_createElementBlock","_createElementVNode","_unref","data","_normalizeClass","_createVNode","_normalizeStyle","EpIcon"],"mappings":";;;;;AAQA,MAAM,OAAO;AACb,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;AASf,UAAM,QAAQ;AAEd,UAAM,aAAa,SAAS,MAAM;AAC9B,UAAG,CAAC,MAAM,KAAK,QAAQ,MAAM,KAAK,QAAQ,WAAW;AACjD,eAAO;AAAA,MACX;AACA,UAAG,MAAM,KAAK,QAAQ,WAAW;AAC7B,eAAO;AAAA,MACX,WAAU,MAAM,KAAK,QAAQ,SAAS;AAClC,eAAO;AAAA,MACX;AAAA,IACJ,CAAC;;0BAKGA,mBA4BM,OAAA;AAAA,QA5BA,6FAA8E,WAAA,KAAU,EAAA;AAAA,MAAA;QAC1FC,mBAA4E,OAAA;AAAA,UAAvE,OAAM;AAAA,UAAwB,WAAQC,MAAA,aAAA,EAAcC,KAAAA,KAAK,KAAK;AAAA,QAAA;QACnEF,mBAAwP,QAAA;AAAA,UAAjP,OAAKG,eAAA,0GAA6GD,KAAAA,KAAK,iCAAiC,WAAA,KAAU,EAAA;AAAA,QAAA,GAAQA,gBAAAA,KAAAA,KAAK,OAAO,OAAO,aAAY,KAAMA,KAAAA,KAAK,KAAK,IAAIA,KAAAA,KAAK,KAAK,GAAA,CAAA;AAAA,QAE9OE,YAYEH,MAAA,MAAA,GAAA;AAAA,UAXG,MAAMC,KAAAA,KAAK,OAAI,WAAA;AAAA,UACf,UAAUA,KAAAA,KAAK,OAAOD,MAAA,QAAA,EAAS,QAAQA,MAAA,QAAA,EAAS;AAAA,UAChD,OAAKI,eAAA;AAAA;;;;;;YAAuOH,MAAAA,KAAAA,KAAK,OAAI,QAAA;AAAA;;;QAU1PE,YAUEE,aAAA;AAAA,UATG,aAAWJ,KAAAA,KAAK,OAAO,OAAO;AAAA,UAC9B,OAAKG,eAAA;AAAA;;;;;YAA0MH,MAAAA,KAAAA,KAAK,OAAI,QAAA;AAAA,UAAA;;;;;;"}

package/dist/components/tools/RenderTextNode.vue.js

@@ -1,22 +1,4 @@
-import { defineComponent, createElementBlock, openBlock, Fragment, renderList, unref, createBlock, resolveDynamicComponent } from "vue";
-import { useTextParser } from "../../composables/useTextParser.js";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "RenderTextNode",
-  props: {
-    content: {}
-  },
-  setup(__props) {
-    const props = __props;
-    const { renderText } = useTextParser(props.content);
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", null, [
-        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(renderText), (node, i) => {
-          return openBlock(), createBlock(resolveDynamicComponent(node), { key: i });
-        }), 128))
-      ]);
-    };
-  }
-});
+import _sfc_main from "./RenderTextNode.vue2.js";
 export {
   _sfc_main as default
 };

package/dist/components/tools/RenderTextNode.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"RenderTextNode.vue.js","sources":["../../../src/components/tools/RenderTextNode.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useTextParser } from \"~/composables/useTextParser\";\ninterface Props {\n    content:string;\n}\nconst props = defineProps<Props>()\nconst { renderText } = useTextParser(props.content);\n</script>\n\n<template>\n    <div>\n        <component :is=\"node\" v-for=\"(node, i) in renderText\" :key=\"i\" />\n    </div>\n</template>"],"names":["_createElementBlock","_openBlock","_Fragment","_renderList","_unref","_createBlock","_resolveDynamicComponent"],"mappings":";;;;;;;;AAKA,UAAM,QAAQ;AACd,UAAM,EAAE,WAAA,IAAe,cAAc,MAAM,OAAO;;0BAI9CA,mBAEM,OAAA,MAAA;AAAA,SADFC,UAAA,IAAA,GAAAD,mBAAiEE,UAAA,MAAAC,WAAvBC,MAAA,UAAA,GAAU,CAAtB,MAAM,MAAC;AAArC,iBAAAH,UAAA,GAAAI,YAAiEC,wBAAjD,IAAI,GAAA,EAAmC,KAAK,GAAC;AAAA;;;;;"}
+{"version":3,"file":"RenderTextNode.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/tools/RenderTextNode.vue2.js

@@ -1,4 +1,22 @@
-import _sfc_main from "./RenderTextNode.vue.js";
+import { defineComponent, createElementBlock, openBlock, Fragment, renderList, unref, createBlock, resolveDynamicComponent } from "vue";
+import { useTextParser } from "../../composables/useTextParser.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "RenderTextNode",
+  props: {
+    content: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const { renderText } = useTextParser(props.content);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(renderText), (node, i) => {
+          return openBlock(), createBlock(resolveDynamicComponent(node), { key: i });
+        }), 128))
+      ]);
+    };
+  }
+});
 export {
   _sfc_main as default
 };

package/dist/components/tools/RenderTextNode.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"RenderTextNode.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"RenderTextNode.vue2.js","sources":["../../../src/components/tools/RenderTextNode.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useTextParser } from \"~/composables/useTextParser\";\ninterface Props {\n    content:string;\n}\nconst props = defineProps<Props>()\nconst { renderText } = useTextParser(props.content);\n</script>\n\n<template>\n    <div>\n        <component :is=\"node\" v-for=\"(node, i) in renderText\" :key=\"i\" />\n    </div>\n</template>"],"names":["_createElementBlock","_openBlock","_Fragment","_renderList","_unref","_createBlock","_resolveDynamicComponent"],"mappings":";;;;;;;;AAKA,UAAM,QAAQ;AACd,UAAM,EAAE,WAAA,IAAe,cAAc,MAAM,OAAO;;0BAI9CA,mBAEM,OAAA,MAAA;AAAA,SADFC,UAAA,IAAA,GAAAD,mBAAiEE,UAAA,MAAAC,WAAvBC,MAAA,UAAA,GAAU,CAAtB,MAAM,MAAC;AAArC,iBAAAH,UAAA,GAAAI,YAAiEC,wBAAjD,IAAI,GAAA,EAAmC,KAAK,GAAC;AAAA;;;;;"}

package/dist/components/tools/SegmentedBox.vue.js

@@ -1,5 +1,5 @@
 import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, createElementVNode, createVNode, toDisplayString } from "vue";
-import _sfc_main$1 from "./RenderTextNode.vue.js";
+import _sfc_main$1 from "./RenderTextNode.vue2.js";
 const _hoisted_1 = { class: "text-xl font-semibold mb-1" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "SegmentedBox",

package/dist/components/tools/TextMedia.vue2.js

@@ -22,7 +22,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (props.media) {
         const componentToLoad = useComponent(props.media.type);
         return defineAsyncComponent(
-          () => __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "../basics/EpAvatar.vue": () => import("../basics/EpAvatar.vue2.js"), "../basics/EpBadge.vue": () => import("../basics/EpBadge.vue.js"), "../basics/EpBtn.vue": () => import("../basics/EpBtn.vue2.js"), "../basics/EpCard.vue": () => import("../basics/EpCard.vue2.js"), "../basics/EpChip.vue": () => import("../basics/EpChip.vue2.js"), "../basics/EpDivider.vue": () => import("../basics/EpDivider.vue2.js"), "../basics/EpFlex.vue": () => import("../basics/EpFlex.vue2.js"), "../basics/EpHover.vue": () => import("../basics/EpHover.vue2.js"), "../basics/EpHoverCard.vue": () => import("../basics/EpHoverCard.vue2.js"), "../basics/EpIcon.vue": () => import("../basics/EpIcon.vue2.js"), "../basics/EpImg.vue": () => import("../basics/EpImg.vue2.js"), "../basics/EpImgCarousel.vue": () => import("../basics/EpImgCarousel.vue2.js"), "../basics/EpList.vue": () => import("../basics/EpList.vue.js"), "../basics/EpListItem.vue": () => import("../basics/EpListItem.vue2.js"), "../basics/EpSection.vue": () => import("../basics/EpSection.vue2.js"), "../basics/EpSectionCols.vue": () => import("../basics/EpSectionCols.vue2.js"), "../basics/EpSpinner.vue": () => import("../basics/EpSpinner.vue2.js"), "../basics/EpStackedList.vue": () => import("../basics/EpStackedList.vue2.js"), "../basics/EpTable.vue": () => import("../basics/EpTable.vue2.js"), "../basics/EpText.vue": () => import("../basics/EpText.vue2.js"), "../charts/EpBarChart.vue": () => import("../charts/EpBarChart.vue2.js"), "../charts/EpFunnelChart.vue": () => import("../charts/EpFunnelChart.vue2.js"), "../charts/EpLineChart.vue": () => import("../charts/EpLineChart.vue2.js"), "../charts/EpPieChart.vue": () => import("../charts/EpPieChart.vue2.js"), "../educationals/EpBranchingScenario.vue": () => import("../educationals/EpBranchingScenario.vue.js"), "../educationals/EpCodeblock.vue": () => import("../educationals/EpCodeblock.vue3.js"), "../educationals/EpConclusion.vue": () => import("../educationals/EpConclusion.vue2.js"), "../educationals/EpDescription.vue": () => import("../educationals/EpDescription.vue2.js"), "../educationals/EpDocument.vue": () => import("../educationals/EpDocument.vue2.js"), "../educationals/EpEdu.vue": () => import("../educationals/EpEdu.vue2.js"), "../educationals/EpFillBlanks.vue": () => import("../educationals/EpFillBlanks.vue2.js"), "../educationals/EpInstructions.vue": () => import("../educationals/EpInstructions.vue2.js"), "../educationals/EpIntroduction.vue": () => import("../educationals/EpIntroduction.vue2.js"), "../educationals/EpObjective.vue": () => import("../educationals/EpObjective.vue2.js"), "../educationals/EpReading.vue": () => import("../educationals/EpReading.vue2.js"), "../educationals/EpResource.vue": () => import("../educationals/EpResource.vue2.js"), "../educationals/EpScope.vue": () => import("../educationals/EpScope.vue2.js"), "../educationals/EpSegmentedBox.vue": () => import("../educationals/EpSegmentedBox.vue2.js"), "../educationals/EpSpecificObjective.vue": () => import("../educationals/EpSpecificObjective.vue2.js"), "../forms/EpCheckbox.vue": () => import("../forms/EpCheckbox.vue.js"), "../forms/EpInput.vue": () => import("../forms/EpInput.vue.js"), "../forms/EpRadio.vue": () => import("../forms/EpRadio.vue.js"), "../forms/EpRadioSummative.vue": () => import("../forms/EpRadioSummative.vue.js"), "../forms/EpSelect.vue": () => import("../forms/EpSelect.vue2.js"), "../forms/EpSwitch.vue": () => import("../forms/EpSwitch.vue.js"), "../forms/EpTextarea.vue": () => import("../forms/EpTextarea.vue.js"), "../forms/EpToggle.vue": () => import("../forms/EpToggle.vue.js"), "../interactions/Ep360Image.vue": () => import("../interactions/Ep360Image.vue.js"), "../interactions/Ep360Video.vue": () => import("../interactions/Ep360Video.vue.js"), "../interactions/EpAccordeon.vue": () => import("../interactions/EpAccordeon.vue.js"), "../interactions/EpAssociation.vue": () => import("../interactions/EpAssociation.vue2.js"), "../interactions/EpContentSlider.vue": () => import("../interactions/EpContentSlider.vue2.js"), "../interactions/EpDarkMode.vue": () => import("../interactions/EpDarkMode.vue2.js"), "../interactions/EpDraggable.vue": () => import("../interactions/EpDraggable.vue2.js"), "../interactions/EpFlipCard.vue": () => import("../interactions/EpFlipCard.vue.js"), "../interactions/EpHotSpot.vue": () => import("../interactions/EpHotSpot.vue2.js"), "../interactions/EpImageCompare.vue": () => import("../interactions/EpImageCompare.vue2.js"), "../interactions/EpModal.vue": () => import("../interactions/EpModal.vue3.js"), "../interactions/EpQuestion.vue": () => import("../interactions/EpQuestion.vue2.js"), "../interactions/EpSummativeTable.vue": () => import("../interactions/EpSummativeTable.vue2.js"), "../interactions/EpSvgShow.vue": () => import("../interactions/EpSvgShow.vue2.js"), "../interactions/EpTabs.vue": () => import("../interactions/EpTabs.vue.js"), "../interactions/EpTooltip.vue": () => import("../interactions/EpTooltip.vue2.js"), "../medias/EpAudio.vue": () => import("../medias/EpAudio.vue2.js"), "../medias/EpCardLink.vue": () => import("../medias/EpCardLink.vue2.js"), "../medias/EpCarousel.vue": () => import("../medias/EpCarousel.vue2.js"), "../medias/EpHierarchy.vue": () => import("../medias/EpHierarchy.vue.js"), "../medias/EpIframe.vue": () => import("../medias/EpIframe.vue2.js"), "../medias/EpKatex.vue": () => import("../medias/EpKatex.vue.js"), "../medias/EpLink.vue": () => import("../medias/EpLink.vue2.js"), "../medias/EpLinkVersion.vue": () => import("../medias/EpLinkVersion.vue2.js"), "../medias/EpLottieSvg.vue": () => import("../medias/EpLottieSvg.vue2.js"), "../medias/EpPlaylist.vue": () => import("../medias/EpPlaylist.vue2.js"), "../medias/EpSensibleImage.vue": () => import("../medias/EpSensibleImage.vue.js"), "../medias/EpSoftware.vue": () => import("../medias/EpSoftware.vue2.js"), "../medias/EpSvg.vue": () => import("../medias/EpSvg.vue2.js"), "../medias/EpTerm.vue": () => import("../medias/EpTerm.vue2.js"), "../medias/EpTimeLine.vue": () => import("../medias/EpTimeLine.vue.js"), "../medias/EpVideo.vue": () => import("../medias/EpVideo.vue2.js"), "../medias/EpVideoPanopto.vue": () => import("../medias/EpVideoPanopto.vue2.js"), "../medias/EpWordDef.vue": () => import("../medias/EpWordDef.vue2.js"), "../signages/EpAlert.vue": () => import("../signages/EpAlert.vue.js"), "../signages/EpBadge.vue": () => import("../signages/EpBadge.vue2.js"), "../signages/EpHeader.vue": () => import("../signages/EpHeader.vue2.js"), "../signages/EpNothing.vue": () => import("../signages/EpNothing.vue.js"), "../signages/EpQuote.vue": () => import("../signages/EpQuote.vue2.js"), "../signages/EpSkeleton.vue": () => import("../signages/EpSkeleton.vue.js"), "./AssociationNode.vue": () => import("./AssociationNode.vue2.js"), "./AsyncKatexRender.vue": () => import("./AsyncKatexRender.vue.js"), "./BgAudio.vue": () => import("./BgAudio.vue.js"), "./Details.vue": () => import("./Details.vue.js"), "./DisplayBox.vue": () => import("./DisplayBox.vue.js"), "./RenderTextNode.vue": () => import("./RenderTextNode.vue2.js"), "./SegmentedBox.vue": () => import("./SegmentedBox.vue2.js"), "./SvgFilter.vue": () => import("./SvgFilter.vue.js"), "./TextMedia.vue": () => import("./TextMedia.vue.js"), "./TimelineItem.vue": () => import("./TimelineItem.vue.js"), "./TwoColsMedia.vue": () => import("./TwoColsMedia.vue.js") }), `../${componentToLoad.path}/${componentToLoad.name}.vue`, 3)
+          () => __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "../basics/EpAvatar.vue": () => import("../basics/EpAvatar.vue.js"), "../basics/EpBadge.vue": () => import("../basics/EpBadge.vue.js"), "../basics/EpBtn.vue": () => import("../basics/EpBtn.vue2.js"), "../basics/EpCard.vue": () => import("../basics/EpCard.vue2.js"), "../basics/EpChip.vue": () => import("../basics/EpChip.vue2.js"), "../basics/EpDivider.vue": () => import("../basics/EpDivider.vue2.js"), "../basics/EpFlex.vue": () => import("../basics/EpFlex.vue2.js"), "../basics/EpHover.vue": () => import("../basics/EpHover.vue2.js"), "../basics/EpHoverCard.vue": () => import("../basics/EpHoverCard.vue2.js"), "../basics/EpIcon.vue": () => import("../basics/EpIcon.vue2.js"), "../basics/EpImg.vue": () => import("../basics/EpImg.vue2.js"), "../basics/EpImgCarousel.vue": () => import("../basics/EpImgCarousel.vue2.js"), "../basics/EpList.vue": () => import("../basics/EpList.vue.js"), "../basics/EpListItem.vue": () => import("../basics/EpListItem.vue2.js"), "../basics/EpSection.vue": () => import("../basics/EpSection.vue2.js"), "../basics/EpSectionCols.vue": () => import("../basics/EpSectionCols.vue2.js"), "../basics/EpSpinner.vue": () => import("../basics/EpSpinner.vue2.js"), "../basics/EpStackedList.vue": () => import("../basics/EpStackedList.vue2.js"), "../basics/EpTable.vue": () => import("../basics/EpTable.vue2.js"), "../basics/EpText.vue": () => import("../basics/EpText.vue2.js"), "../charts/EpBarChart.vue": () => import("../charts/EpBarChart.vue2.js"), "../charts/EpFunnelChart.vue": () => import("../charts/EpFunnelChart.vue2.js"), "../charts/EpLineChart.vue": () => import("../charts/EpLineChart.vue2.js"), "../charts/EpPieChart.vue": () => import("../charts/EpPieChart.vue2.js"), "../educationals/EpBranchingScenario.vue": () => import("../educationals/EpBranchingScenario.vue.js"), "../educationals/EpCodeblock.vue": () => import("../educationals/EpCodeblock.vue3.js"), "../educationals/EpConclusion.vue": () => import("../educationals/EpConclusion.vue2.js"), "../educationals/EpDescription.vue": () => import("../educationals/EpDescription.vue2.js"), "../educationals/EpDocument.vue": () => import("../educationals/EpDocument.vue2.js"), "../educationals/EpEdu.vue": () => import("../educationals/EpEdu.vue2.js"), "../educationals/EpFillBlanks.vue": () => import("../educationals/EpFillBlanks.vue2.js"), "../educationals/EpInstructions.vue": () => import("../educationals/EpInstructions.vue2.js"), "../educationals/EpIntroduction.vue": () => import("../educationals/EpIntroduction.vue2.js"), "../educationals/EpObjective.vue": () => import("../educationals/EpObjective.vue2.js"), "../educationals/EpReading.vue": () => import("../educationals/EpReading.vue2.js"), "../educationals/EpResource.vue": () => import("../educationals/EpResource.vue2.js"), "../educationals/EpScope.vue": () => import("../educationals/EpScope.vue2.js"), "../educationals/EpSegmentedBox.vue": () => import("../educationals/EpSegmentedBox.vue2.js"), "../educationals/EpSpecificObjective.vue": () => import("../educationals/EpSpecificObjective.vue2.js"), "../forms/EpCheckbox.vue": () => import("../forms/EpCheckbox.vue.js"), "../forms/EpInput.vue": () => import("../forms/EpInput.vue.js"), "../forms/EpRadio.vue": () => import("../forms/EpRadio.vue.js"), "../forms/EpRadioSummative.vue": () => import("../forms/EpRadioSummative.vue.js"), "../forms/EpSelect.vue": () => import("../forms/EpSelect.vue2.js"), "../forms/EpSwitch.vue": () => import("../forms/EpSwitch.vue.js"), "../forms/EpTextarea.vue": () => import("../forms/EpTextarea.vue.js"), "../forms/EpToggle.vue": () => import("../forms/EpToggle.vue.js"), "../interactions/Ep360Image.vue": () => import("../interactions/Ep360Image.vue.js"), "../interactions/Ep360Video.vue": () => import("../interactions/Ep360Video.vue.js"), "../interactions/EpAccordeon.vue": () => import("../interactions/EpAccordeon.vue.js"), "../interactions/EpAssociation.vue": () => import("../interactions/EpAssociation.vue2.js"), "../interactions/EpContentSlider.vue": () => import("../interactions/EpContentSlider.vue2.js"), "../interactions/EpDarkMode.vue": () => import("../interactions/EpDarkMode.vue2.js"), "../interactions/EpDraggable.vue": () => import("../interactions/EpDraggable.vue2.js"), "../interactions/EpFlipCard.vue": () => import("../interactions/EpFlipCard.vue.js"), "../interactions/EpHotSpot.vue": () => import("../interactions/EpHotSpot.vue2.js"), "../interactions/EpImageCompare.vue": () => import("../interactions/EpImageCompare.vue2.js"), "../interactions/EpModal.vue": () => import("../interactions/EpModal.vue3.js"), "../interactions/EpQuestion.vue": () => import("../interactions/EpQuestion.vue2.js"), "../interactions/EpSummativeTable.vue": () => import("../interactions/EpSummativeTable.vue2.js"), "../interactions/EpSvgShow.vue": () => import("../interactions/EpSvgShow.vue2.js"), "../interactions/EpTabs.vue": () => import("../interactions/EpTabs.vue.js"), "../interactions/EpTooltip.vue": () => import("../interactions/EpTooltip.vue2.js"), "../medias/EpAudio.vue": () => import("../medias/EpAudio.vue2.js"), "../medias/EpCardLink.vue": () => import("../medias/EpCardLink.vue2.js"), "../medias/EpCarousel.vue": () => import("../medias/EpCarousel.vue2.js"), "../medias/EpHierarchy.vue": () => import("../medias/EpHierarchy.vue.js"), "../medias/EpIframe.vue": () => import("../medias/EpIframe.vue2.js"), "../medias/EpKatex.vue": () => import("../medias/EpKatex.vue.js"), "../medias/EpLink.vue": () => import("../medias/EpLink.vue2.js"), "../medias/EpLinkVersion.vue": () => import("../medias/EpLinkVersion.vue2.js"), "../medias/EpLottieSvg.vue": () => import("../medias/EpLottieSvg.vue2.js"), "../medias/EpPlaylist.vue": () => import("../medias/EpPlaylist.vue2.js"), "../medias/EpSensibleImage.vue": () => import("../medias/EpSensibleImage.vue.js"), "../medias/EpSoftware.vue": () => import("../medias/EpSoftware.vue2.js"), "../medias/EpSvg.vue": () => import("../medias/EpSvg.vue2.js"), "../medias/EpTerm.vue": () => import("../medias/EpTerm.vue2.js"), "../medias/EpTimeLine.vue": () => import("../medias/EpTimeLine.vue.js"), "../medias/EpVideo.vue": () => import("../medias/EpVideo.vue2.js"), "../medias/EpVideoPanopto.vue": () => import("../medias/EpVideoPanopto.vue2.js"), "../medias/EpWordDef.vue": () => import("../medias/EpWordDef.vue2.js"), "../signages/EpAlert.vue": () => import("../signages/EpAlert.vue.js"), "../signages/EpBadge.vue": () => import("../signages/EpBadge.vue2.js"), "../signages/EpHeader.vue": () => import("../signages/EpHeader.vue2.js"), "../signages/EpNothing.vue": () => import("../signages/EpNothing.vue.js"), "../signages/EpQuote.vue": () => import("../signages/EpQuote.vue2.js"), "../signages/EpSkeleton.vue": () => import("../signages/EpSkeleton.vue.js"), "./AssociationNode.vue": () => import("./AssociationNode.vue.js"), "./AsyncKatexRender.vue": () => import("./AsyncKatexRender.vue.js"), "./BgAudio.vue": () => import("./BgAudio.vue.js"), "./Details.vue": () => import("./Details.vue.js"), "./DisplayBox.vue": () => import("./DisplayBox.vue.js"), "./RenderTextNode.vue": () => import("./RenderTextNode.vue.js"), "./SegmentedBox.vue": () => import("./SegmentedBox.vue2.js"), "./SvgFilter.vue": () => import("./SvgFilter.vue.js"), "./TextMedia.vue": () => import("./TextMedia.vue.js"), "./TimelineItem.vue": () => import("./TimelineItem.vue.js"), "./TwoColsMedia.vue": () => import("./TwoColsMedia.vue.js") }), `../${componentToLoad.path}/${componentToLoad.name}.vue`, 3)
         );
       }
       return null;

package/dist/components/tools/TextMedia.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextMedia.vue2.js","sources":["../../../src/components/tools/TextMedia.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { useRenderText } from \"~/composables/useRenderText\";\nimport { useComponent } from \"~/composables/useComponent\";\nimport type { NestedComponents } from \"~/types/Component\";\n\ninterface Props {\n  media?: NestedComponents;\n  flexCol?: boolean;\n  text: string;\n  cols?: boolean;\n  textLeft?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  flexCol: false\n});\n\nconst currentRenderComponent = computed(() => {\n  if (props.media) {\n    const componentToLoad = useComponent(props.media.type);\n    return defineAsyncComponent(\n      () => import(`../${componentToLoad.path}/${componentToLoad.name}.vue`)\n    );\n  }\n  return null;\n});\n\nconst colsStyle = computed(() => {\n  return props.cols ? \"flex items-center justify-center gap-1\" : \"\";\n});\n\nconst alignText = computed(() => {\n  return props.textLeft ? \"text-red-900\" : \"text-red-700\";\n});\n</script>\n\n<template>\n  <div :class=\"colsStyle\">\n    <div :class=\"`w-full ep-content ${(flexCol ? 'flex flex-col' : '')}`\" \n    v-html=\"useRenderText(text)\" />\n    <div class=\"w-full\" v-if=\"currentRenderComponent && media\">\n      <component :is=\"currentRenderComponent\" v-bind=\"{ ...media.data, card:true }\" />\n    </div>\n  </div>\n</template>\n"],"names":["_createElementBlock","_createElementVNode","flexCol","_unref","text","media","_openBlock","_createBlock","_resolveDynamicComponent","_normalizeProps","_guardReactiveProps"],"mappings":"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"}
+{"version":3,"file":"TextMedia.vue2.js","sources":["../../../src/components/tools/TextMedia.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, defineAsyncComponent } from \"vue\";\nimport { useRenderText } from \"~/composables/useRenderText\";\nimport { useComponent } from \"~/composables/useComponent\";\nimport type { NestedComponents } from \"~/types/Component\";\n\ninterface Props {\n  media?: NestedComponents;\n  flexCol?: boolean;\n  text: string;\n  cols?: boolean;\n  textLeft?: boolean;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  flexCol: false\n});\n\nconst currentRenderComponent = computed(() => {\n  if (props.media) {\n    const componentToLoad = useComponent(props.media.type);\n    return defineAsyncComponent(\n      () => import(`../${componentToLoad.path}/${componentToLoad.name}.vue`)\n    );\n  }\n  return null;\n});\n\nconst colsStyle = computed(() => {\n  return props.cols ? \"flex items-center justify-center gap-1\" : \"\";\n});\n\nconst alignText = computed(() => {\n  return props.textLeft ? \"text-red-900\" : \"text-red-700\";\n});\n</script>\n\n<template>\n  <div :class=\"colsStyle\">\n    <div :class=\"`w-full ep-content ${(flexCol ? 'flex flex-col' : '')}`\" \n    v-html=\"useRenderText(text)\" />\n    <div class=\"w-full\" v-if=\"currentRenderComponent && media\">\n      <component :is=\"currentRenderComponent\" v-bind=\"{ ...media.data, card:true }\" />\n    </div>\n  </div>\n</template>\n"],"names":["_createElementBlock","_createElementVNode","flexCol","_unref","text","media","_openBlock","_createBlock","_resolveDynamicComponent","_normalizeProps","_guardReactiveProps"],"mappings":"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"}

package/dist/components/tools/TimelineItem.vue.js

@@ -1,7 +1,7 @@
 import _sfc_main from "./TimelineItem.vue2.js";
 /* empty css                  */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
-const TimeLineItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-6a472392"]]);
+const TimeLineItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-fe4df73f"]]);
 export {
   TimeLineItem as default
 };

package/dist/components/tools/TimelineItem.vue2.js

@@ -1,6 +1,6 @@
 import { defineComponent, ref, toRefs, onMounted, watch, watchEffect, computed, createElementBlock, openBlock, normalizeClass, createElementVNode, unref, createVNode, createCommentVNode, toDisplayString, nextTick } from "vue";
 import _sfc_main$2 from "../basics/EpImg.vue.js";
-import _sfc_main$3 from "./RenderTextNode.vue.js";
+import _sfc_main$3 from "./RenderTextNode.vue2.js";
 import { colorsTimeLine } from "../../types/TimeLine.js";
 import _sfc_main$1 from "../basics/EpIcon.vue.js";
 import { mdiClose, mdiPlus } from "@mdi/js";
@@ -43,8 +43,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const ready = ref(false);
-    const first = ref(true);
-    const showDiv = ref(false);
+    ref(true);
+    const showDiv = ref(!props.event.collapsed);
     const collapsible = ref(null);
     const { event } = toRefs(props);
     const updateMaxHeight = async () => {
@@ -76,12 +76,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         });
       }
     });
-    watchEffect(() => {
-      if (!showDiv.value && !event.value.collapsed && first.value && ready.value) {
-        toggleDivVisibility();
-        first.value = false;
-      }
-    });
     const start_date = computed(() => {
       if (props.event.start_date) return parseTimeline(props.event.start_date);
       return null;