hr-design-system-handlebars 1.52.11 → 1.52.13

package/.storybook/preview.js

@@ -1,6 +1,9 @@
 import '!style-loader!css-loader!postcss-loader!tailwind'
 import 'tailwind'
 import { withThemeByDataAttribute } from '@storybook/addon-styling'
+import '@storybook/addon-console'
+import { setConsoleOptions } from '@storybook/addon-console';
+import { configureActions } from '@storybook/addon-actions';
 
 import hrDesignsystemDark from './HRDesignsystemDark'
 import hrDesignsystemLight from './HRDesignsystemLight'
@@ -11,6 +14,38 @@ import loadFeature from '../build/webpack/feature-loader/initializer/loader'
 import '../src/assets/js/alpine.js'
 import '../src/assets/tailwind.css'
 
+import { CheckCSS } from 'checkcss';
+
+configureActions({
+    clearOnStoryChange: true, 
+  });
+  
+// Create CheckCSS instance
+const checkcss = new CheckCSS();
+
+checkcss.onClassnameDetected = function (classname, element) {
+    // Return `false` to disable checks for `classname`.
+    // For example, to ignore classnames starting with
+    // "license-" or "maintainer-"...
+    var storybookRoot = document.getElementById('storybook-root');
+    var prefixes = /^js-|^cy-|^sb-/.test(classname) ? false : true
+    return storybookRoot.contains(element) && prefixes
+}
+checkcss.onUndefinedClassname = function (classname) {
+    console.log(
+        `checkcss: No CSS rule for .${classname}`,
+      );
+  };
+
+checkcss.scan().watch();
+
+const panelInclude = setConsoleOptions({}).panelInclude;
+
+setConsoleOptions({
+    panelInclude: [...panelInclude, /checkcss/],
+}); 
+
+
 function loadDelayedImages() {
     setTimeout(function () {
         var t,
@@ -173,11 +208,12 @@ export const parameters = {
                 [
                     'Entwicklung',
                     [
-                        'Installation und Update von Dependencies im Entwicklungs Projekt',
-                        'Installation der Design-System Komponenten im Delivery Projekt',
+                        'Installation und Update von Dependencies',
+                        'Design System im Delivery Projekt installieren',
+                        'Konventionen und Datenstrukturen',
+                        'Testdatenbereitstellung',
+                        'Konsolenausgaben'
                     ],
-                    'Konventionen und Datenstrukturen',
-                    'Testdatenbereitstellung',
                     '*',
                 ],
                 'Komponenten',

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+# v1.52.13 (Wed Jan 24 2024)
+
+#### 🐛 Bug Fix
+
+- refactoring of copytext-json [#815](https://github.com/mumprod/hr-design-system-handlebars/pull/815) ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+#### Authors: 1
+
+- Geraldo ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+---
+
+# v1.52.12 (Wed Jan 24 2024)
+
+#### 🐛 Bug Fix
+
+- Add console to storybook [#811](https://github.com/mumprod/hr-design-system-handlebars/pull/811) ([@vascoeduardo](https://github.com/vascoeduardo))
+
+#### Authors: 1
+
+- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
+
+---
+
 # v1.52.11 (Wed Jan 24 2024)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -1002,6 +1002,18 @@ article.indexText ul {
   list-style-type: disc;
   padding-left: 1rem;
 }
+/* -------------------------COPYTEXT ------------------------------- */
+a.link {
+  color: #006eb7;
+  color: var(--color-link);
+  -webkit-text-decoration-line: underline;
+          text-decoration-line: underline;
+  text-decoration-thickness: 1px;
+}
+[class~='tw-dark'] a.link {
+  color: #006eb7;
+  color: var(--color-link-dark);
+}
 .sr-only {
   position: absolute;
   width: 1px;
@@ -3249,7 +3261,7 @@ article.indexText ul {
   border-bottom-color: var(--color-secondary-ds);
 }
 .counter-reset {
-  counter-reset: cnt1706086838048;
+  counter-reset: cnt1706103702650;
 }
 .hyphens-auto {
   -webkit-hyphens: auto;
@@ -3551,7 +3563,7 @@ article.indexText ul {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1706086838048 1;
+  counter-increment: cnt1706103702650 1;
 }
 .-ordered::before {
   position: absolute;
@@ -3567,7 +3579,7 @@ article.indexText ul {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1706086838048);
+  content: counter(cnt1706103702650);
 }
 /*! ****************************/
 /*! DataPolicy stuff           */

package/package.json

@@ -6,7 +6,7 @@
     "license": "MIT",
     "main": "dist/index.js",
     "repository": "https://github.com/szuelch/hr-design-system-handlebars",
-    "version": "1.52.11",
+    "version": "1.52.13",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",
         "storybook": "storybook dev -p 6006 public",
@@ -43,8 +43,9 @@
         "@babel/core": "^7.12.10",
         "@babel/preset-env": "^7.21.4",
         "@storybook/addon-a11y": "^7.2.1",
-        "@storybook/addon-actions": "^7.2.1",
-        "@storybook/addon-essentials": "^7.2.1",
+        "@storybook/addon-actions": "7.5.3",
+        "@storybook/addon-console": "^2.0.0",
+        "@storybook/addon-essentials": "7.5.3",
         "@storybook/addon-links": "^7.2.1",
         "@storybook/addon-styling": "^1.3.5",
         "@storybook/addons": "^7.2.1",
@@ -112,6 +113,7 @@
         "a11y-dialog": "^8.0.4",
         "alpinejs": "^3.8.1",
         "async-alpine": "^1.0.0",
+        "checkcss": "^2.0.9",
         "dialog-polyfill": "^0.5.6",
         "tailwindcss-counter": "^1.1.3"
     },

package/src/assets/css/custom-components.css

@@ -294,4 +294,9 @@
 /* -------------------------INDEXTEXT-TEASER ------------------------ */
 article.indexText ul {
     @apply pl-4 list-disc;
+}
+
+/* -------------------------COPYTEXT ------------------------------- */
+a.link {
+    @apply underline decoration-1 text-link dark:text-link-dark;
 }

package/src/assets/fixtures/content/copytext/copytext.json

@@ -1,4 +1,39 @@
 {
-    "@->jsoninclude": "content/copytext/copytext.inc.json",
-    "@->contentpath": "copytext_1"
+    "copytextParagraph": [
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isHeadline": true,
+            "text": "Copytext"
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isParagraph": true,
+            "text": {
+                "split": [
+                    {
+                        "isUl": true,
+                        "text": "<li>Lorem ipsum dolor sit amet</li><li>At vero eos et accusam et justo</li><li>Stet clita kasd gubergren</li>"
+                    },
+                    {
+                        "isOl": true,
+                        "text": "<li>Lorem ipsum dolor sit amet</li><li>At vero eos et accusam et justo</li><li>Stet clita kasd gubergren</li>"
+                    }
+                ]   
+            }
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isHeadline": true,
+            "text": "Zwischenüberschrift"
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        }
+    ]
 }

package/src/assets/fixtures/content/copytext/copytext_additionalInfo.json

@@ -1,4 +1,40 @@
 {
-    "@->jsoninclude": "content/copytext/copytext.inc.json",
-    "@->contentpath": "copytext_additionalInfo"
+    "copytextParagraph": [
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isHeadline": true,
+            "text": "Copytext mit Zusatzinfo"
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isAdditionalInfo": true,
+            "text": {
+                "split": [
+                    {
+                        "isText": true,
+                        "text": "Sendung: hr-fernsehen, hessenschau, 13.12.2022, 19.30 Uhr"
+                    },
+                    {
+                        "isOl": true,
+                        "text": "<li>eins</li><li>zwei</li><li>drei</li>"
+                    },
+                    {
+                        "isUl": true,
+                        "text": "<li>eins</li><li>zwei</li><li>drei</li>"
+                    },
+                    {
+                        "isText": true,
+                        "text": "Quelle: hessenschau.de/Jörn Perske"
+                    }
+                ]   
+            }     
+        }
+
+    ]
 }

package/src/assets/fixtures/content/copytext/copytext_cite.json

@@ -1,4 +1,40 @@
 {
-    "@->jsoninclude": "content/copytext/copytext.inc.json",
-    "@->contentpath": "copytext_cite"
+    "copytextParagraph": [
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isHeadline": true,
+            "text": "Copytext mit Zitat"
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isCite": true,
+            "text":"Wenn ich mein Leben noch einmal leben könnte, würde ich die gleichen Fehler machen. Aber ein bisschen früher damit ich mehr davon habe.",
+            "paragraphProperties": [
+                {
+                    "showFullSize":true,
+                    "citeAuthor":"Marlene Dietrich"
+                }
+            ]
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isCite": true,
+            "text":"Wenn ich mein Leben noch einmal leben könnte, würde ich die gleichen Fehler machen. Aber ein bisschen früher damit ich mehr davon habe.",
+            "paragraphProperties": [
+                {
+                    "showFullSize":false,
+                    "citeAuthor":"Marlene Dietrich"
+                }
+            ]
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        }
+    ]
 }

package/src/assets/fixtures/content/copytext/copytext_faq.json

@@ -1,4 +1,71 @@
 {
-    "@->jsoninclude": "content/copytext/copytext.inc.json",
-    "@->contentpath": "copytext_faq"
+    "copytextParagraph": [
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isHeadline": true,
+            "text": "Copytext mit FAQs"
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isFAQ": true,
+            "text": "Wo brauche ich noch Corona-Test?",
+            "paragraphProperties": [
+                {
+                    "faqAnswer": {
+                        "split": [
+                            {
+                                "isText": true,
+                                "text": "Es besteht keine Testpflicht mehr. Auch in Krankenhäusern, Alten- und Pflegeheimen sowie Sammelunterkünften muss sich seit dem 1. März niemand mehr testen lassen."
+                            },
+                            {
+                                "isUl": true,
+                                "text": "<li>Es besteht keine Testpflicht mehr</li><li>Auch in Krankenhäusern, Alten- und Pflegeheimen</li>"
+                            },
+                            {
+                                "isOl": true,
+                                "text": "<li>Es besteht keine Testpflicht mehr</li><li>Auch in Krankenhäusern, Alten- und Pflegeheimen</li>"
+                            }
+                        ]           
+                    }
+                }
+            ]
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isFAQ": true,
+            "text": "Gibt es noch Bürgertests?",
+            "paragraphProperties": [
+                {
+                    "faqAnswer": {
+                        "split": [
+                            {
+                                "isText": true,
+                                "text": "Seit dem 1. März 2023 besteht keine Möglichkeit mehr zur kostenlosen Bürgertestung. Alle Testangebote sind kostenpflichtig."
+                            }
+                        ]           
+                    }
+                }
+            ]   
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isFAQ": true,
+            "text": "Wo muss ich Maske tragen?",
+            "paragraphProperties": [
+                {
+                    "faqAnswer": {
+                        "split": [
+                            {
+                                "isText": true,
+                                "text": "Ab dem 8. April 2023 ist die Maskenpflicht in Hessen in allen Bereichen aufgehoben."
+                            }
+                        ]           
+                    }
+                }
+            ]
+        }
+    ]
 }

package/src/assets/fixtures/content/copytext/copytext_image.json

@@ -1,4 +1,42 @@
 {
-    "@->jsoninclude": "content/copytext/copytext.inc.json",
-    "@->contentpath": "copytext_image"
+    "copytextParagraph": [
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isHeadline": true,
+            "text": "Copytext mit Image"
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "paragraphBoxItem": {
+                "@->jsoninclude": "teaser/teaser_images.inc.json",
+                "@->contentpath": "copytext_image_100",
+                "@->replaceToken": [
+                    {
+                        "@->token": "image",
+                        "@->value": "buchmesse-fahnen-102"
+                    }
+                ]
+            }
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "paragraphBoxItem": {
+                "@->jsoninclude": "teaser/teaser_images.inc.json",
+                "@->contentpath": "copytext_image_50",
+                "@->replaceToken": [
+                    {
+                        "@->token": "image",
+                        "@->value": "buchmesse-fahnen-102"
+                    }
+                ]
+            }
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        }
+    ]
 }

package/src/assets/fixtures/content/copytext/copytext_jobposting.json

@@ -1,4 +1,51 @@
 {
-    "@->jsoninclude": "content/copytext/copytext.inc.json",
-    "@->contentpath": "copytext_jobposting"
+    "copytextParagraph": [
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isHeadline": true,
+            "text": "Copytext mit Jobposting"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isParagraph": true,
+            "text": {
+                "split": [
+                    {
+                        "isText": true,
+                        "text": "Digitale Produkte, Fernsehen, Radio– wir sind Hessens größtes Medienunternehmen. Als Mitglied der ARD sind wir stolz darauf, mit unseren vielfältigen und qualitativ hochwertigen Programmangeboten wesentlich zur Meinungs- und Medienvielfalt in Deutschland beizutragen. Zur Verstärkung unseres Teams suchen wir befristet für zunächst 3 Jahre eine*n innovative*n"
+                    }
+                ]   
+            }                  
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isHeadline": true,
+            "text": "Java-Entwickler*in"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isJobposting": true,
+            "text": "Wo brauche ich noch Corona-Test?",
+            "paragraphProperties": [
+                {
+                    "jobDescription": {
+                        "split": [
+                            {
+                                "isText": true,
+                                "text": "Du hast Spaß an neuen Technologien und bist ein*e Experte*in in der Java-Entwicklung? Du suchst spannende und vielfältige Projekte in einem dynamischen Medienumfeld? Dann vernetze gemeinsam mit uns die Mediensysteme der ARD."
+                            },
+                            {
+                                "isUl": true,
+                                "text": "<li>Du hast Spaß daran selbstorganisiert in einem agilen Umfeld und interdisziplinären Projektteams zu arbeiten.</li><li>Du bringst ein abgeschlossenes informatikorientiertes Studium bzw. eine vergleichbare Qualifikation mit und verfügst über Berufserfahrung im Bereich Softwareentwicklung.</li><li>Sehr gute Java-Kenntnisse, Kenntnisse in modernen Schnittstellentechnologien und Datenbanksystemen setzen wir voraus.</li>"
+                            },
+                            {
+                                "isOl": true,
+                                "text": "<li>Du implementierst als Full-Stack-Entwickler*in Features vertikal durch alle Softwareschichten.</li><li>Im Team entwickelst du die Applikation in enger Zusammenarbeit mit Anwender*innen fachlich weiter.</li>"
+                            }
+                        ]           
+                    }
+                }
+            ]
+        }
+    ]
 }

package/src/assets/fixtures/content/copytext/copytext_paragraph.inc.json

@@ -0,0 +1,12 @@
+{
+    "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+    "isParagraph": true,
+    "text": {
+        "split": [
+            {
+                "isText": true,
+                "text": "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua."
+            }
+        ]   
+    }
+}

package/src/assets/fixtures/content/copytext/copytext_podcastepisode.json

@@ -1,4 +1,66 @@
 {
-    "@->jsoninclude": "content/copytext/copytext.inc.json",
-    "@->contentpath": "copytext_podcast_episode"
+    "copytextParagraph": [
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isHeadline": true,
+            "text": "Copytext mit Podcastepisode"
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isParagraph": true,
+            "paragraphBoxItem": {
+                "@->jsoninclude": "teaser/teasers.inc.json",
+                "@->contentpath": "teaser_podcast_episode.logicItem.includeModel",
+                "@->extends": {
+                    "isPodcastEpisode": true,
+                    "showFullSize": {
+                        "isTrue": true
+                    }
+                },
+                "@->overrides": [
+                    {
+                        "@->contentpath": "teaserSize",
+                        "@->value": "100"
+                    },
+                    {
+                        "@->contentpath": "realTeaserSize",
+                        "@->value": "100"
+                    } 
+                ]                    
+            }                 
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        },
+        {
+            "structuredDataSsi": "<!--#include virtual='structuredDataSsiPath' -->",
+            "isParagraph": true,
+            "paragraphBoxItem": {
+                "@->jsoninclude": "teaser/teasers.inc.json",
+                "@->contentpath": "teaser_podcast_episode.logicItem.includeModel",
+                "@->extends": {
+                    "isPodcastEpisode": true,
+                    "showFullSize": {
+                        "isTrue": false
+                    }
+                },
+                "@->overrides": [
+                    {
+                        "@->contentpath": "teaserSize",
+                        "@->value": "50"
+                    },
+                    {
+                        "@->contentpath": "realTeaserSize",
+                        "@->value": "50"
+                    } 
+                ]                    
+            }                 
+        },
+        {
+            "@->jsoninclude": "content/copytext/copytext_paragraph.inc.json"
+        }
+    ]
 }