@simple-reporting/base 1.0.12 → 1.0.14

package/dev/package.json

@@ -16,12 +16,12 @@
     "type-check": "vue-tsc --build",
     "lint": "eslint . --fix",
     "format": "prettier --write src/",
-    "postinstall": "npx srl prepare"
+    "postinstall": "srl prepare"
   },
   "dependencies": {
-    "@simple-reporting/base": "^1.0.12",
-    "axios": "^1.9.0",
-    "chalk": "^5.4.1",
+    "@simple-reporting/base": "^1.0.14",
+    "axios": "^1.12.2",
+    "chalk": "^5.6.2",
     "exceljs": "^4.4.0",
     "file-saver": "^2.0.5",
     "highcharts": "^11.4.8",
@@ -32,33 +32,33 @@
     "standard-scss": "github:mms-neidhartschoen/nsfd_standard-scss",
     "vite-plugin-pwa": "^0.21.2",
     "vue": "^3.5.13",
-    "vue-i18n": "^11.1.5",
+    "vue-i18n": "^11.1.12",
     "vue-router": "^4.5.1",
     "vue3-runtime-template": "^1.0.2",
     "xlsx": "^0.18.5"
   },
   "devDependencies": {
     "@kne/color-palette": "^0.1.0",
-    "@rushstack/eslint-patch": "^1.11.0",
+    "@rushstack/eslint-patch": "^1.12.0",
     "@tsconfig/node22": "^22.0.2",
     "@types/jsdom": "^21.1.7",
-    "@types/node": "^22.15.29",
+    "@types/node": "^22.18.4",
     "@vitejs/plugin-vue": "^5.2.4",
     "@vitest/eslint-plugin": "1.1.20",
     "@vue/eslint-config-prettier": "^10.2.0",
-    "@vue/eslint-config-typescript": "^14.5.0",
+    "@vue/eslint-config-typescript": "^14.6.0",
     "@vue/test-utils": "^2.4.6",
     "@vue/tsconfig": "^0.7.0",
-    "eslint": "^9.28.0",
+    "eslint": "^9.35.0",
     "eslint-plugin-vue": "^9.33.0",
     "jsdom": "^25.0.1",
     "npm-run-all2": "^7.0.2",
-    "prettier": "^3.5.3",
-    "sass": "^1.89.1",
+    "prettier": "^3.6.2",
+    "sass": "^1.92.1",
     "typescript": "~5.6.3",
-    "vite": "^6.3.5",
-    "vite-plugin-vue-devtools": "^7.7.6",
-    "vitest": "^2.1.9",
-    "vue-tsc": "^2.2.10"
+    "vite": "^6.3.6",
+    "vite-plugin-vue-devtools": "^7.7.7",
+    "vitest": "^3.2.4",
+    "vue-tsc": "^2.2.12"
   }
 }

package/dev/src/assets/scss/app.scss

@@ -1,5 +1,6 @@
 @use 'srl';
 @use 'web';
+@use "./components/note/accordion";
 
 .fade-enter-from {
   opacity: 0;

package/dev/src/assets/scss/components/note/accordion.scss

@@ -0,0 +1,108 @@
+@use "srl";
+@use "assets/scss/placeholders";
+
+$transition-duration: .3s;
+
+.lc-accordion
+{
+  @extend %srl-grid-base;
+  @include srl.spacer-margin-top(400);
+
+  &__inner {
+    @extend %srl-regular-width;
+    border-top: 1px solid srl.colors-black-1000();
+    border-bottom: 1px solid srl.colors-black-1000();
+  }
+
+  & + & {
+    margin-block-start: 0;
+    > .lc-accordion__inner {
+      border-top: none;
+    }
+  }
+
+  &__head {
+    @include srl.typography-title-h3();
+    width: calc(100% + (var(--srl-container-padding) * 2));
+    border: 0;
+    text-align: left;
+    margin-inline: calc(var(--srl-container-padding) * -1);
+    background-color: transparent;
+    padding: srl.spacer-get(300) var(--srl-container-padding);
+    @include srl.spacer-gap(200);
+    cursor: pointer;
+    display: flex;
+    @extend %srl-regular-width;
+
+    .lc-title-h3__number {
+      width: srl.spacer-get(400);
+      color: srl.colors-black-1000();
+    }
+
+    .lc-accordion__icon {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 48px;
+      height: 48px;
+      margin-left: auto;
+      color: srl.colors-black-1000();
+      border: srl.system-size-unit(1) solid srl.colors-black-1000();
+      border-radius: 24px;
+      transition: all $transition-duration ease;
+
+      &:before {
+        content: "+";
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: srl.system-size-unit(20);
+        height: srl.system-size-unit(20);
+        transition: all $transition-duration ease;
+      }
+    }
+
+    &[aria-expanded="true"] {
+      .lc-accordion__icon {
+        background-color: srl.colors-black-1000();
+        color: srl.colors-white-1000();
+        border-color: srl.colors-black-1000();
+        &:before {
+          content: "-";
+        }
+      }
+    }
+  }
+
+  &__content {
+    display: grid;
+    grid-template-rows: 1fr;
+    transition: padding-bottom $transition-duration ease, grid-template-rows $transition-duration ease;
+    overflow: hidden;
+
+    &[hidden] {
+      grid-template-rows: 0fr;
+      padding-bottom: 0;
+    }
+
+    &:not([hidden]) {
+      padding-bottom: srl.spacer-get(300);
+    }
+
+    &-inner {
+      width: 100vw;
+      position: relative;
+      left: 50%;
+      right: 50%;
+      margin-left: -50vw;
+      margin-right: -50vw;
+      overflow: hidden;
+
+      .lc-accordion:last-child {
+        > .lc-accordion__inner {
+          border-bottom: none;
+        }
+      }
+    }
+  }
+}

package/dev/src/assets/scss/editor.scss

@@ -1,5 +1,6 @@
 @use 'srl';
 @use 'web';
+@use "placeholders";
 
 $editor-color-srl: srl.colors-shade-200();
 $editor-background-color-srl: srl.colors-primary-1000();
@@ -37,4 +38,48 @@ span.ns-key-figure {
 // Set width of placeholder image to 100%
 img[src^="data:image/svg+xml"] {
   width: 100%
+}
+
+.srl-editor-component {
+  @include srl.spacer-padding-block(200);
+  @extend %srl-grid-base;
+
+  &.srl-pdf-pagebreak,
+  &.srl-anchor {
+    border-top: 1px solid #{srl.colors-primary-1000()};
+    border-bottom: 1px solid #{srl.colors-primary-1000()};
+  }
+
+  &.srl-pdf-publication-title,
+  &.srl-pdf-chapter-title {
+    border-bottom: 1px solid #{srl.colors-primary-1000()};
+  }
+
+  .doc-editable.doc-no-placeholder:before {
+    display: none !important;
+  }
+}
+
+.srl-editor-component__text {
+  @extend %srl-regular-width;
+  display: flex;
+  flex-direction: column;
+
+  &:after {
+    order: -1;
+    display: block;
+    @include srl.typography-editor-label-text();
+
+    .srl-anchor & {
+      content: "Anchor:";
+    }
+
+    .srl-pdf-publication-title & {
+      content: "PDF publication title:"
+    }
+
+    .srl-pdf-chapter-title & {
+      content: "PDF chapter title:"
+    }
+  }
 }

package/dev/src/assets/scss/general.scss

@@ -13,6 +13,7 @@ body {
 */
 img {
   max-width: 100%;
+  width: 100%;
   height: auto;
   display: block;
 }

package/dev/src/components/BypassLinks.vue

@@ -11,10 +11,8 @@ const pointer = ref<NsWowNavigationItem[]>([
       id: 'srl-to-main-navigation'
     },
     callback: () => {
-      const elem: HTMLDivElement | null = document.querySelector('#srl-page-navigation')
-      if (elem) {
-        elem.querySelector('button')?.focus()
-      }
+      const elem: HTMLDivElement | null = document.querySelector('#srl-page-navigation > ul')
+      elem?.focus()
     }
   },
   {
@@ -57,7 +55,7 @@ const pointer = ref<NsWowNavigationItem[]>([
   overflow: hidden;
   height: 0;
 
-  &:has(button:focus) {
+  &:has(*:focus) {
     height: auto;
     @include srl.spacer-padding-block(200);
   }

package/dev/tsconfig.json

@@ -5,7 +5,7 @@
       "path": "./tsconfig.node.json"
     },
     {
-      "path": "./tsconfig.app.json"
+      "path": "./.srl/tsconfig.srl.json"
     },
     {
       "path": "./tsconfig.vitest.json"

package/dev/vite.config.ts

@@ -1,7 +1,7 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import VueDevTools from 'vite-plugin-vue-devtools'
-import viteSrlPlugin from './.srl/plugins/viteSrlPlugin.ts'
+import viteSrlPlugin from '@simple-reporting/base/plugins/viteSrlPlugin.js'
 import { fileURLToPath, URL } from 'node:url'
 
 // https://vitejs.dev/config/

package/livingdocs/040.Media/030.video/ld-conf.json

@@ -3,7 +3,7 @@
   "label": "Video",
   "properties": ["width-all", "pdf-spacer"],
   "directives": {
-    "background": {
+    "video-thumbnail": {
       "imageRatios": ["16:9"],
       "allowOriginalRatio": false
     },

package/livingdocs/100.Misc/010.anchor/anchor.html

@@ -1,11 +1,8 @@
-<p class="srl-anchor" data-is-anchor="true">
-  <span class="srl-anchor__editor-text" data-remove-from-pdf="complete">
-    Anchor:
-  </span>
-  <span class="srl-anchor__text" doc-editable="anchor-text">
+<p class="srl-anchor srl-editor-component" data-is-anchor="true">
+  <span class="srl-anchor__text srl-editor-component__text" doc-editable="anchor-text">
     Must start with a letter (A–Z or a–z); a number is not allowed. After the
     first letter, any combination of letters (a–z, A–Z), digits (0–9), hyphens
     (-), underscores (_), colons (:), and periods (.) is allowed. The ID must be
     unique and is case-sensitive.
   </span>
-</p>
+</p>

package/livingdocs/100.Misc/010.anchor/scss/editor.scss

@@ -2,18 +2,7 @@
 @use 'web';
 @use 'assets/scss/placeholders';
 
-.srl-anchor {
-  border-top: 1px solid #{srl.colors-secondary-1000()};
-  border-bottom: 1px solid #{srl.colors-secondary-1000()};
-  @include srl.spacer-padding-block(200);
-  @extend %srl-grid-base;
-}
-
-.srl-anchor__editor-text {
-  @extend %srl-regular-width;
-}
-
 .srl-anchor__text {
   @extend %srl-regular-width;
   @include srl.typography-pdf-header()
-}
+}

package/livingdocs/110.PDF/010.pdf-pagebreak/pdf-pagebreak.html

@@ -1,5 +1,5 @@
-<div class="srl-pdf-pagebreak" data-remove-from-web="complete">
-  <span class="srl-pdf-pagebreak__editor-text" data-remove-from-pdf="complete">
+<div class="srl-pdf-pagebreak srl-editor-component" data-remove-from-web="complete">
+  <span class="srl-pdf-pagebreak__editor-text srl-editor-component__text" data-remove-from-pdf="complete">
     PDF page break
   </span>
 </div>

package/livingdocs/110.PDF/010.pdf-pagebreak/scss/editor.scss

@@ -3,18 +3,10 @@
 @use 'assets/scss/placeholders';
 
 .srl-pdf-pagebreak {
-  border-top: 1px solid #{srl.colors-secondary-1000()};
-  border-bottom: 1px solid #{srl.colors-secondary-1000()};
   text-align: center;
-  @include srl.spacer-padding-block(200);
-  @extend %srl-grid-base;
 }
 
 .srl-pdf-pagebreak__editor-text {
   @include srl.typography-editor-label-text();
   @extend %srl-regular-width;
-}
-
-.srl-pdf-pagebreak__text {
-  @extend %srl-regular-width;
 }

package/livingdocs/110.PDF/030.pdf-publication-title/pdf-publication-title.html

@@ -1,11 +1,8 @@
 <p
-  class="srl-pdf-publication-title"
+  class="srl-pdf-publication-title srl-editor-component"
   data-remove-from-web="complete"
 >
-  <span class="srl-pdf-publication-title__editor-text" data-remove-from-pdf="complete">
-    PDF publication title:
-  </span>
-  <span class="srl-pdf-publication-title__text" doc-editable="pdf-publication-titletext">
+  <span class="srl-pdf-publication-title__text srl-editor-component__text" doc-editable="pdf-publication-titletext">
     Publication title
   </span>
 </p>

package/livingdocs/110.PDF/030.pdf-publication-title/scss/editor.scss

@@ -2,17 +2,6 @@
 @use 'web';
 @use 'assets/scss/placeholders';
 
-.srl-pdf-publication-title {
-  border-bottom: 1px solid #{srl.colors-primary-1000()};
-  @include srl.spacer-padding-block(200);
-  @extend %srl-grid-base;
-}
-
-.srl-pdf-publication-title__editor-text {
-  @include srl.typography-editor-label-text();
-  @extend %srl-regular-width;
-}
-
 .srl-pdf-publication-title__text {
   @extend %srl-regular-width;
 }

package/livingdocs/110.PDF/040.pdf-chapter-title/pdf-chapter-title.html

@@ -1,11 +1,8 @@
 <p
-  class="srl-pdf-chapter-title"
+  class="srl-pdf-chapter-title srl-editor-component"
   data-remove-from-web="complete"
 >
-  <span class="srl-pdf-chapter-title__editor-text" data-remove-from-pdf="complete">
-    PDF chapter title:
-  </span>
-  <span class="srl-pdf-chapter-title__text" doc-editable="pdf-chapter-title-text">
+  <span class="srl-pdf-chapter-title__text srl-editor-component__text" doc-editable="pdf-chapter-title-text">
     Chapter title
   </span>
 </p>

package/livingdocs/110.PDF/040.pdf-chapter-title/scss/editor.scss

@@ -8,11 +8,6 @@
   @extend %srl-grid-base;
 }
 
-.srl-pdf-chapter-title__editor-text {
-  @include srl.typography-editor-label-text();
-  @extend %srl-regular-width;
-}
-
 .srl-pdf-chapter-title__text {
   @extend %srl-regular-width;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simple-reporting/base",
-  "version": "1.0.12",
+  "version": "1.0.14",
   "description": "Manage srl templates, build and publish",
   "bin": {
     "srl": "cli.js"
@@ -19,16 +19,16 @@
   "dependencies": {
     "@kne/color-palette": "^0.1.0",
     "archiver": "^7.0.1",
-    "chalk": "^5.4.1",
+    "chalk": "^5.6.2",
     "colors": "^1.4.0",
     "commander": "^11.1.0",
     "enquirer": "^2.4.1",
     "fs": "^0.0.1-security",
-    "fs-extra": "^11.2.0",
+    "fs-extra": "^11.3.2",
     "glob": "^10.4.5",
     "modern-css-reset": "^1.4.0",
     "node-html-parser": "^7.0.1",
-    "vite": "^5.4.11",
+    "vite": "^6.3.6",
     "write-json": "^3.0.1"
   },
   "keywords": [
@@ -41,8 +41,8 @@
   "author": "Michael Dörer",
   "license": "ISC",
   "devDependencies": {
-    "jest": "^30.0.2",
-    "prettier": "^3.4.2",
-    "typescript": "^5.7.2"
+    "jest": "^30.1.3",
+    "prettier": "^3.6.2",
+    "typescript": "^5.9.2"
   }
 }