@simple-reporting/base 1.0.9 → 1.0.11

package/dev/package.json

@@ -16,10 +16,10 @@
     "type-check": "vue-tsc --build",
     "lint": "eslint . --fix",
     "format": "prettier --write src/",
-    "postinstall": "srl prepare"
+    "postinstall": "npx srl prepare"
   },
   "dependencies": {
-    "@simple-reporting/base": "^1.0.9",
+    "@simple-reporting/base": "^1.0.11",
     "axios": "^1.9.0",
     "chalk": "^5.4.1",
     "exceljs": "^4.4.0",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simple-reporting/base",
-  "version": "1.0.9",
+  "version": "1.0.11",
   "description": "Manage srl templates, build and publish",
   "bin": {
     "srl": "cli.js"

package/scripts/doPublish.js

@@ -3,6 +3,16 @@ import { preparePublish } from './preparePublish.js';
 import { packageName } from './config.js';
 import { getPackageVersion } from './utils.js';
 
+function isVersionGreater(v1, v2) {
+  const a = v1.split('.').map(Number);
+  const b = v2.split('.').map(Number);
+  for (let i = 0; i < 3; i++) {
+    if (a[i] > b[i]) return true;
+    if (a[i] < b[i]) return false;
+  }
+  return false;
+}
+
 export async function doPublish(version = null) {
   try {
     const publishVersion = await preparePublish(version);
@@ -13,7 +23,7 @@ export async function doPublish(version = null) {
 
     const latest = await getPackageVersion(packageName);
 
-    if (publishVersion > latest) {
+    if (isVersionGreater(publishVersion, latest)) {
       await execSync(
         `npm dist-tag add ${packageName}@${publishVersion} latest`,
         {

package/srl/components/Srl/Note/Accordion/Content.vue

@@ -0,0 +1,12 @@
+<script setup lang="ts">
+const props = defineProps<{
+  id: string
+  open: boolean
+}>()
+</script>
+
+<template>
+<div :id="props.id" :hidden="!props.open">
+  <slot/>
+</div>
+</template>

package/srl/components/Srl/Note/Accordion/Toggle.vue

@@ -0,0 +1,13 @@
+<script setup lang="ts">
+const props = defineProps<{
+  id: string
+  open: boolean
+  toggle: () => void
+}>()
+</script>
+
+<template>
+  <button @click="props.toggle()" :aria-expanded="props.open" :aria-controls="props.id">
+    <slot/>
+  </button>
+</template>

package/srl/components/Srl/Note/Accordion.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import { ref, useId } from 'vue'
+
+const id = ref(useId())
+const accordion = ref<HTMLDivElement>()
+const open = ref(false)
+
+function toggle() {
+  open.value = !open.value
+}
+</script>
+
+<template>
+  <div ref="accordion">
+    <slot :id="id" :open="open" :toggle="toggle"/>
+  </div>
+</template>

package/srl/plugins/vueSrlPlugin.ts

@@ -5,6 +5,10 @@ import SrlArticleRoot from '#components/Srl/Article/Root.vue';
 import SrlArticleDialogButton from '#components/Srl/Article/DialogButton.vue';
 import SrlMenu from '#components/Srl/Menu/List.vue';
 import SrlPageDialog from '#components/Srl/Page/Dialog.vue';
+import SrlNoteAccordion from '#components/Srl/Note/Accordion.vue';
+import SrlNoteAccordionToggle from '#components/Srl/Note/Accordion/Toggle.vue';
+import SrlNoteAccordionContent from '#components/Srl/Note/Accordion/Content.vue';
+
 import asyncLdComponent from './asyncLdComponent.ts';
 
 export default {
@@ -12,6 +16,9 @@ export default {
     app.component('SrlAriaTabChain', defineComponent(SrlAriaTabChain));
     app.component('SrlArticleAutoload', defineComponent(SrlArticleAutoload));
     app.component('SrlArticleRoot', defineComponent(SrlArticleRoot));
+    app.component('SrlNoteAccordion', defineComponent(SrlNoteAccordion));
+    app.component('SrlNoteAccordionToggle', defineComponent(SrlNoteAccordionToggle));
+    app.component('SrlNoteAccordionContent', defineComponent(SrlNoteAccordionContent));
     app.component(
       'SrlArticleDialogButton',
       defineComponent(SrlArticleDialogButton),

package/srl/utils/html.ts

@@ -1,13 +1,109 @@
 import { isRouterPath } from '#utils/uri.ts';
 import { useArticles, useLocale, addCssStyles } from '#composables';
 
+type AttrObj = { [key: string]: string | null };
 function attributesToString(attributes: Record<string, string | null>): string {
   return Object.entries(attributes)
     .map(([key, value]) => (value !== null ? `${key}="${value}"` : key))
     .join(' ');
 }
 
-type AttrObj = { [key: string]: string | null };
+function replaceAccordionContainer(text: string): string {
+  const openTagRegex = /<div([^>]*\bclass\s*=\s*["']lc-accordion\s[^"']*["'][^>]*)>/gi;
+  let result = '';
+  let lastIndex = 0;
+  let match;
+
+  while ((match = openTagRegex.exec(text)) !== null) {
+    const start = match.index;
+    const attrs = match[1];
+    let depth = 1;
+    let end = openTagRegex.lastIndex;
+
+    while (depth > 0) {
+      const nextOpen = text.indexOf('<div', end);
+      const nextClose = text.indexOf('</div>', end);
+      if (nextClose === -1) break;
+      if (nextOpen !== -1 && nextOpen < nextClose) {
+        depth++;
+        end = nextOpen + 4;
+      } else {
+        depth--;
+        end = nextClose + 6;
+      }
+    }
+
+    const innerContent = replaceAccordionContainer(text.slice(openTagRegex.lastIndex, end - 6));
+
+    result += text.slice(lastIndex, start);
+    result += `<srl-note-accordion${attrs}>${innerContent}</srl-note-accordion>`;
+    lastIndex = end;
+    openTagRegex.lastIndex = end;
+  }
+  result += text.slice(lastIndex);
+  return result;
+}
+
+function replaceAccordionToggle(text: string): string {
+  const openTagRegex = /<div([^>]*\bclass\s*=\s*["']lc-accordion__head\s[^"']*["'][^>]*)>/gi;
+  let result = '';
+  let lastIndex = 0;
+  let match;
+
+  while ((match = openTagRegex.exec(text)) !== null) {
+    const start = match.index;
+    const attrs = match[1];
+    const contentStart = openTagRegex.lastIndex;
+    const closeTag = '</div>';
+    const end = text.indexOf(closeTag, contentStart);
+    if (end === -1) break;
+
+    const innerContent = text.slice(contentStart, end);
+
+    result += text.slice(lastIndex, start);
+    result += `<srl-note-accordion-toggle${attrs}>${innerContent}</srl-note-accordion-toggle>`;
+    lastIndex = end + closeTag.length;
+    openTagRegex.lastIndex = lastIndex;
+  }
+  result += text.slice(lastIndex);
+  return result;
+}
+
+function replaceAccordionContent(text: string): string {
+  const openTagRegex = /<div([^>]*\bclass\s*=\s*["']lc-accordion__content(?:\s[^"']*)?["'][^>]*)>/gi;
+  let result = '';
+  let lastIndex = 0;
+  let match;
+
+  while ((match = openTagRegex.exec(text)) !== null) {
+    const start = match.index;
+    const attrs = match[1];
+    let depth = 1;
+    let end = openTagRegex.lastIndex;
+
+    while (depth > 0) {
+      const nextOpen = text.indexOf('<div', end);
+      const nextClose = text.indexOf('</div>', end);
+      if (nextClose === -1) break;
+      if (nextOpen !== -1 && nextOpen < nextClose) {
+        depth++;
+        end = nextOpen + 4;
+      } else {
+        depth--;
+        end = nextClose + 6;
+      }
+    }
+
+    const innerContent = replaceAccordionContent(text.slice(openTagRegex.lastIndex, end - 6));
+
+    result += text.slice(lastIndex, start);
+    result += `<srl-note-accordion-content${attrs}>${innerContent}</srl-note-accordion-content>`;
+    lastIndex = end;
+    openTagRegex.lastIndex = end;
+  }
+  result += text.slice(lastIndex);
+  return result;
+}
 
 export function prepareHtmlContent(text: string): string {
   const articles = useArticles();
@@ -73,6 +169,10 @@ export function prepareHtmlContent(text: string): string {
     (_match, name, content) => `<template #${name}>${content}</template>`
   );
 
+  text = replaceAccordionContainer(text)
+  text = replaceAccordionToggle(text)
+  text = replaceAccordionContent(text)
+
   text = text.replaceAll('../', `./`);
 
   text = text.replace(/<style[^>]*>([\s\S]*?)<\/style>/gi, (match, p1) => {